@charset "UTF-8";
/*----------reset css-----------*/
html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }

body { margin: 0; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }

a { background-color: transparent; }

a:active, a:hover { outline: 0; }

img { border: 0; max-width: 100%; vertical-align: middle; height: auto; }

iframe { max-width: 100%; }

button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; }

button { overflow: visible; }

button, select { text-transform: none; }

button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; }

button[disabled], html input[disabled] { cursor: default; }

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

input { line-height: normal; }

input[type="text"]:focus { outline: none; }

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; }

input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; }

input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }

input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

textarea { overflow: auto; }

textarea:focus { outline: none; }

table { border-collapse: collapse; border-spacing: 0; }

td, th { padding: 0; }

ul, ol, dl, h1, h2, h3, h4, h5, h6, p, figure { padding: 0; margin: 0; }

textarea { resize: none; }

*:focus { outline: none; }

/*元素垂直置中*/
/*會由後台上稿的圖片*/
.redcolor { color: #ff0023; }

.orangecolor { color: #fb612b; }

.orange_e4531a { color: #e4531a; }

.deepcolor { color: #389074; }

.lightgreencolor { color: #a1c242; }

.greencolor { color: #029354; }

.green_067243 { color: #067243; }

.green_279e3c { color: #279e3c; }

.c999999 { color: #999999; }

.c777777 { color: #777777; }

.ca1c242 { color: #a1c242; }

.notextunderline { text-decoration: none; }

.bgeeeeee { background-color: #eeeeee; }

.bgfff1cf { background-color: #fff1cf; }

.bgf9cebe { background-color: #f9cebe; }

.bg96cfa0 { background-color: #96cfa0; }

.bgd0e0a0 { background-color: #d0e0a0; }

.bgdbdbdb { background-color: #dbdbdb; }

.textaligncenter { text-align: center; }

.displayinlineblock { display: inline-block; }

.displayflex { display: flex; }

.inlineblockmarr5 { display: inline-block; margin-right: 5px; }

.f12 { font-size: 12px; }

.f13 { font-size: 13px; }

.f14 { font-size: 14px; }

.f15 { font-size: 15px; }

.f16 { font-size: 16px; }

.f17 { font-size: 17px; }

.f18 { font-size: 18px; }

.f19 { font-size: 19px; }

.f20 { font-size: 20px; }

.f21 { font-size: 21px; }

.f22 { font-size: 22px; }

.f23 { font-size: 23px; }

.f24 { font-size: 24px; }

.f25 { font-size: 25px; }

.f26 { font-size: 26px; }

.f27 { font-size: 27px; }

.f28 { font-size: 28px; }

.f29 { font-size: 29px; }

.f30 { font-size: 30px; }

.f31 { font-size: 31px; }

.f32 { font-size: 32px; }

.f33 { font-size: 33px; }

.f34 { font-size: 34px; }

.f35 { font-size: 35px; }

.f36 { font-size: 36px; }

.f37 { font-size: 37px; }

.f38 { font-size: 38px; }

.f39 { font-size: 39px; }

.f40 { font-size: 40px; }

.f41 { font-size: 41px; }

.f42 { font-size: 42px; }

.f43 { font-size: 43px; }

.f44 { font-size: 44px; }

.f45 { font-size: 45px; }

.f46 { font-size: 46px; }

.f47 { font-size: 47px; }

.f48 { font-size: 48px; }

.f49 { font-size: 49px; }

.f50 { font-size: 50px; }

.f51 { font-size: 51px; }

.f52 { font-size: 52px; }

.f53 { font-size: 53px; }

.f54 { font-size: 54px; }

.f55 { font-size: 55px; }

.f56 { font-size: 56px; }

.f57 { font-size: 57px; }

.f58 { font-size: 58px; }

.f59 { font-size: 59px; }

.f60 { font-size: 60px; }

.padtop10 { padding-top: 10px; }

.padbot10 { padding-bottom: 10px; }

.padtop20 { padding-top: 20px; }

.padbot20 { padding-bottom: 20px; }

.padtop30 { padding-top: 30px; }

.padbot30 { padding-bottom: 30px; }

.padtop40 { padding-top: 40px; }

.padbot40 { padding-bottom: 40px; }

.padtop50 { padding-top: 50px; }

.padbot50 { padding-bottom: 50px; }

.padtop60 { padding-top: 60px; }

.padbot60 { padding-bottom: 60px; }

.padtop70 { padding-top: 70px; }

.padbot70 { padding-bottom: 70px; }

.padtop80 { padding-top: 80px; }

.padbot80 { padding-bottom: 80px; }

.padtop90 { padding-top: 90px; }

.padbot90 { padding-bottom: 90px; }

.padtop100 { padding-top: 100px; }

.padbot100 { padding-bottom: 100px; }

.padtop110 { padding-top: 110px; }

.padbot110 { padding-bottom: 110px; }

.padtop120 { padding-top: 120px; }

.padbot120 { padding-bottom: 120px; }

.padtop130 { padding-top: 130px; }

.padbot130 { padding-bottom: 130px; }

@media (max-width: 1280px) { .padtop130, .padtop100 { padding-top: 60px; }
  .padbot110 { padding-bottom: 80px; } }
@media (max-width: 480px) { .padtop130, .padtop100, .padtop50 { padding-top: 30px; }
  .padbot110 { padding-bottom: 60px; } }
.marginleftright10 { margin: 0 10px; }

.marginbottom5 { margin-bottom: 5px; }

@media (max-width: 480px) { .mobiledisplaybr br { display: none; } }

.btnstyle { background-color: #029354; border-radius: 50px; color: #fff; font-size: 22px; text-transform: uppercase; padding: 15px 60px; display: inline-block; }
.btnstyle:hover { opacity: 1; -webkit-transform: scale(1.05); transform: scale(1.05); }

@media (max-width: 480px) { .btnstyle { font-size: 16px; font-weight: 600; padding: 10px 20px; } }
.smallgraybtnstyle { font-size: 15px; background: #e1e1e1; border-radius: 30px; padding: 8px 20px; display: inline-block; border: none; margin-top: 3px; margin-bottom: 3px; }
.smallgraybtnstyle.style2 { background: #029354; color: #fff; font-size: 17px; padding: 6px 25px; min-width: 130px; }
@media (max-width: 640px) { .smallgraybtnstyle.style2 { padding: 5px 15px; } }
.smallgraybtnstyle.style2.graybg { color: #333; background: #e1e1e1; }
.smallgraybtnstyle.style2.graybg:hover { background: #029354; color: #fff; }
.smallgraybtnstyle.style2:hover { background: #eb5d28; }
.smallgraybtnstyle:hover { background: #029354; color: #fff; }
.smallgraybtnstyle:hover img { filter: brightness(0) saturate(100%) invert(100%) sepia(96%) saturate(0%) hue-rotate(21deg) brightness(114%) contrast(101%); }
@media (max-width: 640px) { .smallgraybtnstyle { padding: 5px 15px; } }

.smallborderbtnstyle { font-size: 12px; border-radius: 20px; border: 1px solid #ccc; display: inline-block; padding: 3px 7px; margin: 3px; background: none; }
.smallborderbtnstyle.f14 { font-size: 14px; }
.smallborderbtnstyle:hover { background-color: #029354; border: 1px solid #029354; color: #fff; }

.squarebtnstyle { background: #e1e1e1; padding: 5px 15px; border-radius: 3px; text-align: center; border: none; display: inline-block; }
.squarebtnstyle.greenbg { background-color: #a1c242; color: #fff; }
.squarebtnstyle.samll { font-size: 14px; padding: 3px 10px; }
.squarebtnstyle:hover { background: #029354; color: #fff; }

.squarebtnstyle2 { background: #e1e1e1; padding: 2px 5px; border-radius: 3px; text-align: center; border: none; display: inline-block; font-size: 13px; margin: 3px; }
.squarebtnstyle2:hover { background: #029354; color: #fff; }

.squarebtnstyle3 { background: #fb612c; color: #fff; padding: 2px 5px; border-radius: 3px; text-align: center; border: none; display: inline-block; font-size: 13px; margin: 3px; }
.squarebtnstyle3:hover { background: #029354; color: #fff; }

.iconborderbtn { border: none; background-color: #dbdbdb; display: flex; align-items: center; justify-content: center; padding: 8px 15px 8px 10px; border-radius: 50px 50px 50px 0; -webkit-box-shadow: 4px 3px 0px 0px #a6a6a6; -moz-box-shadow: 4px 3px 0px 0px #a6a6a6; box-shadow: 4px 3px 0px 0px #a6a6a6; margin: 10px; }
.iconborderbtn:hover { background-color: #eb5d28; color: #fff; }
.iconborderbtn .icon .iconcircle { border-radius: 50px 50px 50px 0; background-color: #fff; text-align: center; width: 35px; height: 35px; line-height: 35px; }
.iconborderbtn .txt { padding-left: 5px; }

@media (max-width: 480px) { .iconborderbtn .icon .iconcircle { width: 25px; height: 25px; line-height: 25px; }
  .iconborderbtn .icon .iconcircle img { max-width: 14px; max-height: 16px; } }
.nobtnstyle { border: none; background: none; }

.flexcenter { display: flex; flex-wrap: wrap; justify-content: center; }

.flexaligncenter { display: flex; flex-wrap: wrap; align-items: center; }

.flexbetween { align-items: center; display: flex; flex-wrap: wrap; justify-content: space-between; }

.alignitems { align-items: center; }

.btncenter { text-align: center; margin: 20px 0px; }

.circlebtn { width: 100px; height: 100px; border-radius: 100%; display: flex; text-align: center; align-items: center; justify-content: center; font-weight: bold; font-size: 15px; background-color: #ccc; }
.circlebtn:hover { -webkit-transform: scale(1.1); transform: scale(1.1); }

.linkstyle { text-decoration: underline; color: #fff; margin-left: 5px; border-radius: 3px; background-color: #999; font-size: 14px; padding: 3px 5px; }

.hoverunderline:hover { text-decoration: underline; }

.slick-dots li.slick-active button, .slick-dots li button:focus { background: #ffffff; border: 3px solid #000; }
.slick-dots li.slick-active button:hover, .slick-dots li button:focus:hover { background: #fff; }

.slick-dots li button:hover { outline: none; background: #8c8c8c; }

.backpre { text-align: center; }

.vefify { display: flex; flex-wrap: wrap; justify-content: center; }

.inputstyle { padding: 8px 10px; font-size: 16px; border: 1px solid #dddddd; width: 100%; margin: 3px 0; background-color: #fff; }
.inputstyle.f17 { font-size: 17px; }
.inputstyle[disabled="disabled"] { border: none; background: none; }
.inputstyle.w75 { width: 75px; }
.inputstyle.w100 { width: 100px; }
.inputstyle.w150 { width: 150px; }
.inputstyle.w200 { width: 200px; }
@media (max-width: 767px) { .inputstyle.w200.mobilew135 { width: 135px; } }
.inputstyle.w310 { width: 310px; }
@media (max-width: 767px) { .inputstyle.w310 { width: 100%; } }
.inputstyle.textareastyle { height: 145px; }
.inputstyle[disabled="disabled"] { background-color: #eee; border: none; }
.inputstyle.bordergraybg { background: #f2f2f2; border: 1px solid #dbdbdb; border-radius: 20px; padding: 8px 15px; }
.inputstyle.bordergraybgshadow { background: #f2f2f2; border-radius: 20px; padding: 10px 15px; border: none; -webkit-box-shadow: inset 5px 5px 0px 0px #e0e0e0; -moz-box-shadow: inset 5px 5px 0px 0px #e0e0e0; box-shadow: inset 5px 5px 0px 0px #e0e0e0; }

select.inputstyle { -moz-appearance: none; -webkit-appearance: none; appearance: none; background: transparent; background-image: url(data:image/svg+xml;base64,PHN2ZyBmaWxsPSdibGFjaycgaGVpZ2h0PScyNCcgdmlld0JveD0nMCAwIDI0IDI0JyB3aWR0aD0nMjQnIHhtbG5zPSdodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Zyc+PHBhdGggZD0nTTcgMTBsNSA1IDUtNXonLz48cGF0aCBkPSdNMCAwaDI0djI0SDB6JyBmaWxsPSdub25lJy8+PC9zdmc+); background-repeat: no-repeat; background-position-x: 100%; background-position-y: 8px; padding: 7px 10px; padding-right: 20px; border-radius: 0px; margin: 0; }

.twzipcodeinput { margin-right: 5px; }

@media (max-width: 480px) { .inputstyle.w100.twzipcodeinput, .inputstyle.w150.twzipcodeinput, .inputstyle.w150.mobile100, .inputstyle.w200.mobile100 { width: 100%; margin: 5px 0; } }
.labelblock { display: inline-block; padding: 3px 15px 3px 0px; }
.labelblock label { cursor: pointer; }

input.radiostyle[type=radio] { visibility: hidden; position: absolute; }

input.radiostyle[type=radio] + .radiobefore { cursor: pointer; display: inline-block; }

input.radiostyle[type=radio] + .radiobefore:before { height: 21px; width: 21px; margin-right: 4px; content: " "; display: inline-block; vertical-align: text-bottom; transition: 0.3s; background: url(../images/radio.svg) no-repeat; }

input.radiostyle[type=radio]:checked + .radiobefore:before { background: url(../images/radio_checked.svg) no-repeat; }

.radiobox { margin-right: 10px; }

.radiostyle { margin-right: 3px; }

input.checkstyle[type=checkbox] { visibility: hidden; position: absolute; }

input.checkstyle[type=checkbox] + .checkboxbefore { cursor: pointer; display: inline-block; }

input.checkstyle[type=checkbox] + .checkboxbefore:before { height: 24px; width: 23px; margin-right: 4px; content: " "; display: inline-block; vertical-align: text-bottom; transition: 0.3s; background: url(../images/checkbox.svg) no-repeat; }

input.checkstyle[type=checkbox]:checked + .checkboxbefore:before { background: url(../images/checkbox_checked.svg) no-repeat; }

input.checkstyle2[type=checkbox] { visibility: hidden; position: absolute; }

input.checkstyle2[type=checkbox] + .checkboxbefore2 { cursor: pointer; display: inline-block; }

input.checkstyle2[type=checkbox] + .checkboxbefore2:before { height: 41px; width: 41px; margin-right: 4px; content: " "; display: inline-block; vertical-align: text-bottom; transition: 0.3s; background: url(../images/checkbox2.png) no-repeat; }

input.checkstyle2[type=checkbox]:checked + .checkboxbefore2:before { background: url(../images/checkbox2_checked.png) no-repeat; }

.listystyle { padding-left: 20px; }
.listystyle li { margin-bottom: 10px; }

.page_box { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; text-align: center; padding: 40px 0; color: #959696; }
.page_box .page_num { display: inline-block; font-size: 18px; font-weight: 100; text-align: center; margin: 0 5px; text-decoration: none; border-radius: 100%; width: 30px; height: 30px; line-height: 30px; color: #333; font-weight: 200; }
.page_box .page_num.active, .page_box .page_num:hover { background: #fc5517; color: #fff; font-size: 16px; font-weight: 500; }
.page_box .page_num.page_arrow { color: #999999; font-size: 13px; background-color: initial; border: 1px solid #999999; margin: 0 10px; }
.page_box .page_num.page_arrow:hover { border: 1px solid #fc5517; color: #fc5517; background-color: initial; }
.page_box .page_dot { display: inline-block; padding: 10px; text-align: center; margin: 0 3px; }
.page_box .page_select { display: inline-block; margin-left: 20px; font-size: 14px; padding: 15px 0; }
.page_box .page_select .num_input { border: 1px solid #cfcfcf; width: 40px; height: 25px; padding: 3px 5px; }

@media (max-width: 540px) { .page_box { padding: 30px 0; }
  .page_box .page_num { font-size: 16px; margin: 0 2px; } }
.page_box2 { text-align: center; padding: 20px 0; }
.page_box2 select.selectstyle { border: 2px solid #dddddd; padding: 3px 10px; border-radius: 3px; }
.page_box2 span.totalnum { margin-left: 5px; }

.unreset { line-height: 1.8; color: #4f4f4f; }

table.formtable { border: 1px solid #eeeeee; width: 100%; }
table.formtable tbody tr td { padding: 10px 15px; border: 1px solid #eeeeee; background: #fff; }
@media (max-width: 767px) { table.formtable tbody tr td { display: block; width: 100%; } }
table.formtable tbody tr td.graybg { background: #eeeeee; border-bottom: 1px solid #fff; }
@media (max-width: 767px) { table.formtable tbody tr td.graybg { border-bottom: none; } }

table.noborder { width: 100%; }
@media (max-width: 480px) { table.noborder tr td { display: block; width: 100%; }
  table.noborder tr td.mobileinlineblock { display: inline-block; width: initial; }
  table.noborder tr td:first-child { padding-bottom: 0; }
  table.noborder tr td:nth-child(2) { padding-top: 0; } }
table.noborder tr td { padding: 5px; }

table.borderbottom { width: 100%; }
@media (max-width: 767px) { table.borderbottom { font-size: 12px; } }
table.borderbottom tr th, table.borderbottom tr td { text-align: center; padding: 8px 5px; }
table.borderbottom tr th { font-weight: bold; border-bottom: 1px solid #333; }
table.borderbottom tr td { border-bottom: 1px solid #c6c6c6; }

table.calendartable { width: 100%; border: 4px solid #e5e5e5; }
table.calendartable tr th, table.calendartable tr td { padding: 5px 10px; border: 1px solid #e5e5e5; text-align: center; }
table.calendartable tr th { background: #999999; font-size: 18px; font-weight: bold; color: #fff; }
table.calendartable tr td { font-size: 18px; height: 100px; }
table.calendartable tr td.today { background: #fff8e1; }

ul.iconlist li { list-style: none; display: flex; flex-wrap: wrap; font-weight: bold; margin-bottom: 3px; }
ul.iconlist li.normalweight { font-weight: normal; }
ul.iconlist li .icon { flex-shrink: 0; }
ul.iconlist li .txt { flex: 1; padding-left: 5px; }

ol.ollist { padding-left: 22px; }

.opendetail_cart { display: none; }

/*-------------------unrest css-----------------*/
.unreset { font-size: 16px; }
.unreset li { display: list-item; }
.unreset head { display: none; }
.unreset col { display: table-column; }
.unreset colgroup { display: table-column-group; }
.unreset td, .unreset th { display: table-cell; }
.unreset caption { display: table-caption; text-align: center; }
.unreset th { font-weight: bold; text-align: center; }
.unreset body { margin: 8px; }
.unreset address, .unreset blockquote, .unreset dd, .unreset div, .unreset dl, .unreset dt, .unreset fieldset, .unreset form, .unreset frame, .unreset frameset, .unreset h1, .unreset h2, .unreset h3, .unreset h4, .unreset h5, .unreset h6, .unreset noframes, .unreset ol, .unreset p, .unreset ul, .unreset center, .unreset dir, .unreset hr, .unreset menu, .unreset pre { display: block; }
.unreset h1 { font-size: 2em; margin: 0.67em 0; }
.unreset h2 { font-size: 1.5em; margin: 0.75em 0; }
.unreset h3 { font-size: 1.17em; margin: 0.83em 0; }
.unreset h4, .unreset p, .unreset blockquote, .unreset ul, .unreset fieldset, .unreset form, .unreset ol, .unreset dl, .unreset dir, .unreset menu { margin: 1.12em 0; }
.unreset h5 { font-size: .83em; margin: 1.5em 0; }
.unreset h6 { font-size: .75em; margin: 1.67em 0; }
.unreset h1, .unreset h2, .unreset h3, .unreset h4, .unreset h5, .unreset h6, .unreset b, .unreset strong { font-weight: bolder; }
.unreset blockquote { margin-left: 40px; margin-right: 40px; }
.unreset i, .unreset cite, .unreset em, .unreset var, .unreset address { font-style: italic; }
.unreset pre, .unreset tt, .unreset code, .unreset kbd, .unreset samp { font-family: monospace; }
.unreset pre { white-space: pre; }
.unreset button, .unreset textarea, .unreset input, .unreset select { display: inline-block; }
.unreset big { font-size: 1.17em; }
.unreset small, .unreset .unreset sub, .unreset .unreset sup { font-size: 0.83em; }
.unreset sub { vertical-align: sub; }
.unreset sup { vertical-align: super; }
.unreset s, .unreset strike, .unreset del { text-decoration: line-through; }
.unreset hr { border: 1px inset; }
.unreset ol, .unreset ul, .unreset dir, .unreset menu, .unreset dd { margin-left: 40px; }
.unreset ol, .unreset ol li { list-style-type: decimal; }
.unreset ol ul, .unreset ul ol, .unreset ul ul, .unreset ol ol { margin-top: 0; margin-bottom: 0; }
.unreset ul, .unreset ul li { list-style-type: disc; }
.unreset u, .unreset ins { text-decoration: underline; }
.unreset br:before { content: "\A"; white-space: pre-line; }
.unreset center { text-align: center; }
.unreset:link, .unreset:visited { text-decoration: underline; }
.unreset:focus { outline: thin dotted invert; }
.unreset img { max-width: 100%; height: initial !important; }
.unreset iframe { max-width: 100%; }
.unreset .embeddedContent { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; }
.unreset .embeddedContent iframe, .unreset .embeddedContent object, .unreset .embeddedContent embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.unreset a { color: #0066ff; }

.unreset table { background-color: transparent; border-collapse: collapse; font-family: Arial, Helvetica, sans-serif; }
.unreset th { text-align: left; }
.unreset .dcf-txt-center { text-align: center !important; }
.unreset .dcf-txt-left { text-align: left !important; }
.unreset .dcf-txt-right { text-align: right !important; }
.unreset .dcf-table caption { color: var(--caption); font-size: 1.13em; font-weight: 700; padding-bottom: 0.56rem; }
.unreset .dcf-table thead { font-size: 0.84em; }
.unreset .dcf-table tbody { border-bottom: 1px solid var(--b-table); border-top: 1px solid var(--b-table); font-size: 0.84em; }
.unreset .dcf-table tfoot { font-size: 0.84em; }
.unreset .dcf-table td, .unreset .dcf-table th { padding-right: 1.78em; }
.unreset .dcf-table-bordered, .unreset .dcf-table-bordered td, .unreset .dcf-table-bordered th { border: 1px solid var(--b-table); }
.unreset .dcf-table-bordered td, .unreset .dcf-table-bordered th, .unreset .dcf-table-striped td, .unreset .dcf-table-striped th { padding-left: 1em; padding-right: 1em; }
.unreset .dcf-table-bordered tr:not(:last-child), .unreset .dcf-table-striped tr:not(:last-child) { border-bottom: 1px solid var(--b-table); }
.unreset .dcf-table-striped tbody tr:nth-of-type(2n) { background-color: var(--bg-table-stripe); }
.unreset .dcf-table thead td, .unreset .dcf-table thead th { padding-bottom: .75em; vertical-align: bottom; }
.unreset .dcf-table tbody td, .unreset .dcf-table tbody th, .unreset .dcf-table tfoot td, .unreset .dcf-table tfoot th { padding-top: .75em; vertical-align: top; }
.unreset .dcf-table tbody td, .unreset .dcf-table tbody th { padding-bottom: 0.75em; }
.unreset .dcf-table-bordered thead th { padding-top: 1.33em; }
.unreset .dcf-wrapper-table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; left: 50%; margin-left: -50vw; margin-right: -50vw; padding-bottom: 1em; position: relative; right: 50%; width: 100vw; }
.unreset .dcf-overflow-x-auto { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }

@media only screen and (max-width: 42.09em) { .unreset .dcf-table-responsive thead { clip: rect(0 0 0 0); -webkit-clip-path: inset(50%); clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; width: 1px; white-space: nowrap; }
  .unreset .dcf-table-responsive tr { display: block; }
  .unreset .dcf-table-responsive td { -webkit-column-gap: 3.16vw; -moz-column-gap: 3.16vw; column-gap: 3.16vw; display: grid; grid-template-columns: 1fr 2fr; text-align: left !important; }
  .unreset .dcf-table-responsive.dcf-table-bordered, .unreset .dcf-table-responsive.dcf-table-bordered thead th { border-width: 0; }
  .unreset .dcf-table-responsive.dcf-table-bordered tbody td { border-top-width: 0; }
  .unreset .dcf-table-responsive:not(.dcf-table-bordered) tbody tr { padding-bottom: 0.75em; }
  .unreset .dcf-table-responsive:not(.dcf-table-bordered) tbody td { padding-bottom: 0; }
  .unreset .dcf-table-responsive:not(.dcf-table-bordered):not(.dcf-table-striped) tbody td { padding-right: 0; }
  .unreset .dcf-table-responsive.dcf-table-bordered tbody tr:last-child td:last-child { border-bottom-width: 0; }
  .unreset .dcf-table-responsive tbody td:before { content: attr(data-label); float: left; font-weight: 700; padding-right: 1.78em; } }
/*-------------------basic scss---------------------*/
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; word-break: break-word; }

html { position: relative; font-size: 100%; }

html * { transition: 0.3s; position: relative; }

@media print { * { -webkit-print-color-adjust: exact !important; /* Chrome, Safari 6 – 15.3, Edge */ color-adjust: exact !important; /* Firefox 48 – 96 */ print-color-adjust: exact !important; /* Firefox 97+, Safari 15.4+ */ }
  table { page-break-inside: auto; }
  tr { page-break-inside: avoid; page-break-after: auto; }
  .page { page-break-inside: avoid; /* 若順著向下排列時會切開此元素，則直接換頁 */ } }
body { color: #222222; font-size: 16px; font-family: myriad-pro, open-sans, Microsoft JhengHei, PMingLiU, Arial, sans-serif, "FontAwesome"; line-height: 1.6; width: 100%; min-width: 360px; margin: 0 auto; position: relative; overflow-x: hidden; letter-spacing: 0.03em; min-height: 100vh; }

@media (max-width: 320px) { body { overflow-x: auto; } }
a { text-decoration: none; color: inherit; -moz-transition: all 0.3s; -o-transition: all 0.3s; -webkit-transition: all 0.3s; transition: all 0.3s; }

a:active, a:focus { text-decoration: none; }

h1, h2, h3 { font-size: inherit; font-weight: inherit; }

table { table-layout: fixed; }

::-webkit-input-placeholder { color: #999; }

::-moz-placeholder { color: #999; opacity: 1; }

/* firefox 19+ */
:-ms-input-placeholder { color: #999; opacity: 1; }

/* ie */
input:-moz-placeholder { color: #999; }

input, button { outline: none; }

::-webkit-scrollbar { background-color: transparent; width: 5px; height: 5px; }

/* background of the scrollbar except button or resizer */
::-webkit-scrollbar-track { background-color: transparent; }

::-webkit-scrollbar-track:hover { background-color: #f4f4f4; }

/* scrollbar itself */
::-webkit-scrollbar-thumb { background-color: #bfbfbf; }

::-webkit-scrollbar-thumb:hover { background-color: #a0a0a5; }

/*反白文字*/
::selection { background: yellow; color: #000; }

::-moz-selection { background: yellow; color: #000; }

.inlineblock { display: inline-block; }

.floatleft { float: left; }

.floatright { float: right; }

.clearfloat { clear: both; height: 0; line-height: 0px; }

.video-container { position: relative; padding-bottom: 53.8%; padding-top: 30px; height: 0; overflow: hidden; }

.video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.oembed-provider-youtube { position: relative; padding-bottom: 56.25%; /* padding-top: 30px; */ height: 0; overflow: hidden; }

.oembed-provider-youtube iframe, .oembed-provider-youtube object, .oembed-provider-youtube embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.googlemap-container { position: relative; padding-bottom: 25%; padding-top: 30px; height: 0; overflow: hidden; }

.googlemap-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.vermid { vertical-align: middle; }

.vertop { vertical-align: top; }

.txtleft { text-align: left; }

.txtrigh { text-align: right; }

.txtcenter { text-align: center; }

.textunderline { text-decoration: underline; }
.textunderline:hover { color: #eb5d28; }

/*如果有載入字型用這段*/
.wrapper { max-width: 1480px; margin: 0 auto; padding: 0 40px; }

@media (max-width: 480px) { .wrapper { padding: 0 20px; } }
.secSpacing { padding: 130px 0 130px 0; }
@media (max-width: 768px) { .secSpacing { padding: 40px 0 40px 0; } }

.mainTitle { text-align: center; font-size: 40px; font-family: "jf-openhuninn"; margin-bottom: 55px; letter-spacing: 0.1em; line-height: calc(65/40); padding: 0 20px; }
@media (max-width: 768px) { .mainTitle { margin-bottom: 25px; font-size: 35px; line-height: 1.5; } }
@media (max-width: 480px) { .mainTitle { font-size: 30px; } }

.normalP { font-size: 16px; line-height: calc(29/16); letter-spacing: 0; }

.normalP2 { font-size: 17px; line-height: calc(30/17); letter-spacing: 0.02em; }

.topnews { background-color: #eb5d28; color: #fff; font-size: 15px; padding: 10px 20px; display: flex; justify-content: center; letter-spacing: 0.02em; height: 44px; }
@media (max-width: 768px) { .topnews { height: 64px; } }
@media (max-width: 480px) { .topnews { font-size: 12px; padding: 8px 15px; } }
.topnews .icon { flex-shrink: 0; }
.topnews .txt { padding-left: 5px; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; line-height: 24px; max-height: 24px; }
@media (max-width: 768px) { .topnews .txt { -webkit-line-clamp: 2; max-height: 48px; } }

.distributor { color: #6f4f39; margin-right: 40px; margin-left: 60px; font-size: 14px; letter-spacing: 0; }
@media (max-width: 1100px) { .distributor { margin-right: 20px; margin-left: 20px; } }
.distributor a { display: inline-block; }
.distributor a img { margin-right: 5px; }
/*@media (max-width: 1100px) { .distributor a .txt { display: none; } }*/

.bagshopping { color: #6f4f39; font-size: 14px; }
.bagshopping a { display: inline-block; }
.bagshopping a img { margin-right: 5px; }
.bagshopping a .circle { width: 25px; height: 25px; background-color: #eb5d28; display: inline-block; color: #fff; line-height: 25px; border-radius: 100%; text-align: center; margin-left: -10px; }

header { position: fixed; top: 0; z-index: 10; background: #fff; width: 100%; }
header.active { top: -46px; box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.2); }
@media (max-width: 768px) { header.active { top: -64px; } }
header .wrapper { display: flex; justify-content: space-between; }
header .wrapper .headertop { flex-shrink: 0; }
@media (max-width: 1100px) { header .wrapper .headertop { width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; } }
header .wrapper .headertop .logo { margin-top: 20px; }
@media (max-width: 1100px) { header .wrapper .headertop .logo { margin-top: 10px; } }
@media (max-width: 480px) { header .wrapper .headertop .logo { margin-bottom: 5px; } }
header .wrapper .headertop .logo a { display: block; }
@media (max-width: 1100px) { header .wrapper .headertop .logo a img { max-width: 60px; } }
header .wrapper .headertop .mobile_menu { display: none; }
@media (max-width: 1100px) { header .wrapper .headertop .mobile_menu { display: flex; flex-wrap: wrap; align-items: center; } }
header .wrapper .headertop .mobile_menu #btn .texthidden { clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; }
header .wrapper .headerright { max-width: 1084px; }
@media (min-width: 1101px) { header .wrapper .headerright { display: block !important; } }
@media (max-width: 1100px) { header .wrapper .headerright { display: none; position: absolute; width: 100%; left: 0; top: 61px; background: #f2f2f2; z-index: 999; } }
@media (max-width: 767px) { header .wrapper .headerright { height: calc(100vh - 61px); overflow: auto; } }
header .wrapper .headerright .box1 { border-bottom: 1px solid #e9e9e9; display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; padding: 6px 0; }
@media (max-width: 1100px) { header .wrapper .headerright .box1 { justify-content: center; } }
@media (max-width: 767px) { header .wrapper .headerright .box1 { display: flex; flex-direction: column-reverse; align-items: initial; text-align: center; } }
header .wrapper .headerright .box1 .nav1 { margin-right: 3.125vw; }
@media (max-width: 1100px) { header .wrapper .headerright .box1 .nav1 { margin-right: 10px; } }
@media (max-width: 767px) { header .wrapper .headerright .box1 .nav1 { margin-right: 0px; } }
header .wrapper .headerright .box1 .nav1 ul { height: 100%; display: flex; flex-wrap: wrap; align-items: center; }
@media (max-width: 767px) { header .wrapper .headerright .box1 .nav1 ul { display: block; } }
header .wrapper .headerright .box1 .nav1 ul li { list-style: none; font-size: 15px; color: #666666; padding: 0 14px; letter-spacing: 0.03em; }
@media (max-width: 767px) { header .wrapper .headerright .box1 .nav1 ul li { padding: 10px 10px; } }
@media (max-width: 767px) { header .wrapper .headerright .box1 .searchbox { display: flex; justify-content: center; } }
header .wrapper .headerright .box1 .searchbox:before { content: "/"; font-size: 25px; color: #cccccc; display: inline-block; position: absolute; top: 0; left: 0; }
@media (max-width: 1100px) { header .wrapper .headerright .box1 .searchbox:before { display: none; } }
header .wrapper .headerright .box1 .searchbox form .searchboxin { display: flex; flex-wrap: wrap; padding-left: 20px; }
@media (max-width: 1100px) { header .wrapper .headerright .box1 .searchbox form .searchboxin { padding-left: 10px; } }
header .wrapper .headerright .box1 .searchbox form .searchboxin .searchinput { color: #999999; border: none; padding: 10px; width: 250px; font-size: 14px; background: none; }
@media (max-width: 1100px) { header .wrapper .headerright .box1 .searchbox form .searchboxin .searchinput { width: 180px; } }
header .wrapper .headerright .box1 .searchbox form .searchboxin button { background: none; border: none; }
header .wrapper .headerright .box1 .searchbox form .searchboxin button:hover { transform: scale(1.1); }
header .wrapper .headerright .box1 .lang { font-size: 15px; color: #816349; margin-left: 35px; cursor: pointer; }
@media (max-width: 767px) { header .wrapper .headerright .box1 .lang { margin-left: 0px; } }
header .wrapper .headerright .box1 .lang .fa-solid { margin-right: 3px; }
header .wrapper .headerright .box2 { display: flex; flex-wrap: wrap; align-items: center; }
@media (max-width: 1100px) { header .wrapper .headerright .box2 { display: block; } }
header .wrapper .headerright .box2 .menu ul { display: flex; flex-wrap: wrap; }
@media (max-width: 1100px) { header .wrapper .headerright .box2 .menu ul { justify-content: center; } }
@media (max-width: 767px) { header .wrapper .headerright .box2 .menu ul { display: block; padding-bottom: 10px; padding-top: 10px; } }
header .wrapper .headerright .box2 .menu ul li { list-style: none; color: #444444; font-size: 18px; padding: 0px 18px; font-family: source-han-sans-traditional,sans-serif; font-weight: 400; font-style: normal; letter-spacing: 0.05em; }
@media (max-width: 767px) { header .wrapper .headerright .box2 .menu ul li { text-align: center; } }
header .wrapper .headerright .box2 .menu ul li a { padding: 15px 6px; display: block; }
@media (max-width: 1100px) { header .wrapper .headerright .box2 .menu ul li a { padding: 10px 6px; } }
@media (max-width: 768px) { header .wrapper .headerright .box2 .menu ul li a { padding: 8px 6px; } }
header .wrapper .headerright .box2 .menu ul li a.active, header .wrapper .headerright .box2 .menu ul li a:hover { color: #60372a; }
header .wrapper .headerright .box2 .menu ul li a.active:before, header .wrapper .headerright .box2 .menu ul li a:hover:before { content: ""; background-color: #a1c242; height: 4px; width: 100%; position: absolute; top: -2px; left: 0; }
@media (max-width: 768px) { header .wrapper .headerright .box2 .menu ul li a.active:before, header .wrapper .headerright .box2 .menu ul li a:hover:before { display: none; } }
header .wrapper .headerright .box2 .menu ul li .submenu { display: none; }
@media (max-width: 1100px) { header .wrapper .headerright .box2 .distributor { display: none; } }
@media (max-width: 1100px) { header .wrapper .headerright .box2 .bagshopping { display: none; } }

.showMenu { display: none; cursor: pointer; height: 30px; width: 30px; margin-left: 20px; }
@media (max-width: 1100px) { .showMenu { display: block; } }

.showMenu span { background: #222; position: absolute; height: 2px; width: 30px; }

.showMenu span:nth-child(1) { top: 0; }

.showMenu span:nth-child(2) { top: 10px; }

.showMenu span:nth-child(3) { top: 20px; }

#btn { position: absolute; width: 30px; height: 30px; top: 50%; left: 50%; transform: translate(-50%, -50%); cursor: pointer; background: none; border-radius: 50%; border: none; outline: none; }

#btn span { position: absolute; width: 30px; height: 2px; top: 50%; left: 50%; background: #6f4f39; border-radius: 2px; overflow: hidden; transition: all 0.3s linear; }

#btn span::before { content: ""; position: absolute; width: 0; height: 100%; top: 0; right: 0; background: #6f4f39; transition: all 0.3s linear; }

#btn span:nth-child(1) { animation: span-first-off 0.5s ease-in-out; animation-fill-mode: forwards; }

#btn span:nth-child(2) { animation: span-second-off 0.5s ease-in-out; animation-fill-mode: forwards; }

#btn span:nth-child(3) { animation: span-third-off 0.5s ease-in-out; animation-fill-mode: forwards; }

#btn.on:hover span::before { width: 100%; transition: all 0.3s linear; }

#btn.on span:nth-child(1) { animation: span-first-on 0.5s ease-in-out; animation-fill-mode: forwards; }

#btn.on span:nth-child(2) { animation: span-second-on 0.5s ease-in-out; animation-fill-mode: forwards; }

#btn.on span:nth-child(3) { animation: span-third-on 0.5s ease-in-out; animation-fill-mode: forwards; }

@keyframes span-first-on { 0% { transform: translate(-50%, -300%); }
  30% { transform: translate(-50%, -50%); }
  100% { transform: translate(-50%, -50%) rotate(-45deg); } }
@keyframes span-first-off { 0% { transform: translate(-50%, -50%) rotate(-45deg); }
  30% { transform: translate(-50%, -50%) rotate(0deg); }
  100% { transform: translate(-50%, -500%); } }
@keyframes span-second-on { 0% { transform: translate(-50%, -50%); }
  25% { background: #6f4f39; }
  50% { transform: translate(-50%, -50%) scale(1); }
  100% { transform: translate(-150%, -50%) scale(0); } }
@keyframes span-second-off { 0% { transform: translate(-150%, -50%) scale(0); }
  25% { background: #6f4f39; }
  50% { transform: translate(-50%, -50%) scale(1); }
  100% { transform: translate(-50%, 0%); } }
@keyframes span-third-on { 0% { transform: translate(-50%, 200%); }
  30% { transform: translate(-50%, -50%); }
  100% { transform: translate(-50%, -50%) rotate(45deg); } }
@keyframes span-third-off { 0% { transform: translate(-50%, -50%) rotate(45deg); }
  30% { transform: translate(-50%, -50%) rotate(0deg); }
  100% { transform: translate(-50%, 500%); } }
footer { background-color: #029354; color: #fff; overflow: hidden; }
footer .wrapper { display: flex; flex-wrap: wrap; justify-content: space-between; padding-top: 50px; padding-bottom: 60px; }
@media (max-width: 1200px) { footer .wrapper { display: block; } }
@media (max-width: 540px) { footer .wrapper { padding-top: 30px; padding-bottom: 30px; } }
footer .wrapper .leftbox { letter-spacing: 0.05em; }
footer .wrapper .leftbox .box1 { font-size: 20px; margin-bottom: 5px; font-weight: bold; }
@media (max-width: 540px) { footer .wrapper .leftbox .box1 { font-size: 18px; } }
footer .wrapper .leftbox .box2 { font-size: 17px; margin-bottom: 5px; display: flex; }
@media (max-width: 540px) { footer .wrapper .leftbox .box2 { font-size: 15px; } }
footer .wrapper .leftbox .box2.flexwrap { flex-wrap: wrap; }
footer .wrapper .leftbox .box2 .marginright { margin-right: 10px; }
footer .wrapper .leftbox .box2 .t1 { flex-shrink: 0; }
footer .wrapper .leftbox .box2 .t2 .greenlight { color: #acdece; }
footer .wrapper .rightbox .rbox1 { display: flex; flex-wrap: wrap; align-items: center; border-bottom: 1px solid #81c9aa; justify-content: end; }
@media (max-width: 1200px) { footer .wrapper .rightbox .rbox1 { justify-content: flex-start; } }
footer .wrapper .rightbox .rbox1:after { content: ""; display: block; width: 100%; bottom: -1px; height: 1px; position: absolute; right: -100%; background: #81c9aa; }
@media (max-width: 1200px) { footer .wrapper .rightbox .rbox1:after { display: none; } }
footer .wrapper .rightbox .rbox1 .fmenu { letter-spacing: 0.05em; }
footer .wrapper .rightbox .rbox1 .fmenu ul { display: flex; flex-wrap: wrap; }
footer .wrapper .rightbox .rbox1 .fmenu ul li { list-style: none; font-weight: bold; margin-left: 30px; }
@media (max-width: 1200px) { footer .wrapper .rightbox .rbox1 .fmenu ul li { margin-left: 0px; margin-right: 30px; } }
footer .wrapper .rightbox .rbox1 .fmenu ul li a { padding: 15px 0; display: block; }
@media (max-width: 540px) { footer .wrapper .rightbox .rbox1 .fmenu ul li a { font-size: 15px; } }
footer .wrapper .rightbox .rbox1 .fmenu ul li a:hover:after { content: ""; display: block; background: #ffe138; height: 4px; width: 100%; position: absolute; bottom: -2px; left: 0; }
footer .wrapper .rightbox .rbox1 .sociallinks { margin-left: 40px; }
@media (max-width: 640px) { footer .wrapper .rightbox .rbox1 .sociallinks { margin-left: 0px; width: 100%; margin-bottom: 20px; } }
footer .wrapper .rightbox .rbox1 .sociallinks ul { display: flex; flex-wrap: wrap; align-items: center; }
footer .wrapper .rightbox .rbox1 .sociallinks ul li { list-style: none; }
footer .wrapper .rightbox .rbox1 .sociallinks ul li a { display: inline-block; margin-left: 15px; width: 30px; height: 30px; background: #fff; text-align: center; line-height: 30px; color: #029354; border-radius: 100%; }
@media (max-width: 640px) { footer .wrapper .rightbox .rbox1 .sociallinks ul li a { margin-left: 0; margin-right: 15px; } }
footer .wrapper .rightbox .rbox1 .sociallinks ul li a:hover { transform: scale(1.1); }
footer .wrapper .rightbox .rbox1 .sociallinks ul li a .fa-facebook { font-size: 16px; }
footer .wrapper .rightbox .rbox1 .sociallinks ul li a .fa-instagram { font-size: 18px; }
footer .wrapper .rightbox .rbox1 .sociallinks ul li a .fa-youtube { font-size: 17px; }
footer .wrapper .rightbox .rbox2 { margin-top: 20px; text-align: right; padding-left: 30px; }
@media (max-width: 1200px) { footer .wrapper .rightbox .rbox2 { text-align: left; padding-left: 0px; } }
footer .wrapper .rightbox .rbox2 .t1 { font-size: 15px; display: inline-block; }
@media (max-width: 540px) { footer .wrapper .rightbox .rbox2 .t1 { font-size: 14px; } }
footer .wrapper .rightbox .rbox2 .t2 { font-size: 14px; opacity: 0.5; margin-left: 20px; display: inline-block; margin-left: 20px; }
@media (max-width: 640px) { footer .wrapper .rightbox .rbox2 .t2 { margin-left: 0px; width: 100%; } }
@media (max-width: 540px) { footer .wrapper .rightbox .rbox2 .t2 { font-size: 13px; } }

@media (max-width: 540px) { footer .wrapper .rightbox .rbox1 .fmenu ul li a { padding: 0px 0 10px 0; }
  footer .wrapper .rightbox .rbox1 .fmenu { padding: 15px 0; margin-top: 10px; border-top: 1px solid #81c9aa; } }
.footerbot { background: #ecf8f4; padding: 20px 0; }
.footerbot .wrapper { display: flex; flex-wrap: wrap; justify-content: flex-end; }
.footerbot .wrapper a { display: block; margin-left: 25px; }

.floatimg { position: fixed; bottom: 35px; right: 35px; z-index: 9; }
@media (max-width: 480px) { .floatimg { right: 10px; } }
.floatimg a.floatlink { display: block; top: 30px; }
.floatimg a.floatlink img { max-width: 170px; }
@media (max-width: 480px) { .floatimg a.floatlink img { max-width: 100px; } }
.floatimg .close { display: block; position: absolute; right: 0; top: 0; z-index: 1; }
.floatimg .close i { color: #002915; font-size: 24px; }

.iabout { margin-top: 100px; padding-bottom: 80px; }
@media (max-width: 480px) { .iabout { margin-top: 60px; padding-bottom: 0px; } }
.iabout .iaboutboxs { display: flex; flex-wrap: wrap; }
.iabout .iaboutboxs .oneset { width: calc(100% / 4); border-right: 1px solid #dddddd; text-align: center; padding: 55px 20px 30px 20px; }
@media (max-width: 1024px) { .iabout .iaboutboxs .oneset { width: calc(100% / 2); margin-bottom: 40px; }
  .iabout .iaboutboxs .oneset:nth-child(even) { border-right: none; } }
.iabout .iaboutboxs .oneset:last-child { border-right: none; }
.iabout .iaboutboxs .oneset .in { display: block; }
.iabout .iaboutboxs .oneset .in:hover .number { transform: translate(-50%, -20px); }
.iabout .iaboutboxs .oneset .in:hover .icon img { filter: brightness(0) saturate(100%) invert(47%) sepia(73%) saturate(2985%) hue-rotate(347deg) brightness(100%) contrast(102%); }
.iabout .iaboutboxs .oneset .in .number { position: absolute; font-size: 120px; font-family: open-sans, sans-serif; font-weight: 800; font-style: normal; color: #edeef0; left: 50%; top: -40%; transform: translate(-50%, 0); width: 100%; }
@media (max-width: 480px) { .iabout .iaboutboxs .oneset .in .number { font-size: 60px; top: -94px; } }
.iabout .iaboutboxs .oneset .in .icon img { transition: 0s; }
@media (max-width: 480px) { .iabout .iaboutboxs .oneset .in .icon img { height: 80px; } }
.iabout .iaboutboxs .oneset .in .t1 { color: #444444; margin-bottom: 10px; margin-top: 20px; font-size: 22px; font-weight: bold; }
.iabout .iaboutboxs .oneset .in .t2 { color: #555; }
.iabout .btnposition { padding: 60px 20px; text-align: center; }
@media (max-width: 800px) { .iabout .btnposition { padding: 0px 20px 40px 20px; } }

@media (max-width: 480px) { .iabout .iaboutboxs .oneset { padding: 55px 15px 30px 15px; width: 100%; border-right: none; } }
.ititle { text-transform: uppercase; color: #029354; font-size: 50px; font-family: roboto, sans-serif; font-weight: 900; font-style: normal; line-height: 1; letter-spacing: 0; }
@media (max-width: 960px) { .ititle { font-size: 36px; } }
@media (max-width: 480px) { .ititle { font-size: 24px; } }
.ititle::first-letter { color: #775e4d; }

.iproducts { margin-top: 6.77083vw; }
.iproducts .wrapper .ip_titlearrow { display: flex; align-items: flex-end; }
.iproducts .wrapper .ip_titlearrow .ititle { margin-right: 10px; }
.iproducts .wrapper .ip_titlearrow .ititle::first-letter { font-size: 90px; flex-shrink: 0; }
@media (max-width: 960px) { .iproducts .wrapper .ip_titlearrow .ititle::first-letter { font-size: 70px; } }
@media (max-width: 480px) { .iproducts .wrapper .ip_titlearrow .ititle::first-letter { font-size: 45px; } }
.iproducts .wrapper .ip_titlearrow .line { height: 1px; background: #dddddd; width: 100%; flex: 1; margin-bottom: 15px; }
.iproducts .wrapper .ip_titlearrow .arrowbox { flex-shrink: 0; display: flex; flex-wrap: wrap; align-items: center; }
.iproducts .wrapper .ip_titlearrow .arrowbox .arrow { border-radius: 50%; border: 1px solid #eb5d28; width: 35px; height: 35px; text-align: center; margin-left: 15px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.iproducts .wrapper .ip_titlearrow .arrowbox .arrow:hover { background: #eb5d28; }
.iproducts .wrapper .ip_titlearrow .arrowbox .arrow:hover img { filter: brightness(0) saturate(100%) invert(95%) sepia(0%) saturate(6788%) hue-rotate(142deg) brightness(110%) contrast(98%); }
.iproducts .wrapper .ip_titlearrow .arrowbox .arrow.right { transform: rotate(-180deg); }
.iproducts .wrapper .ip_titlearrow .arrowbox .arrow img { transition: 0s; }
@media (max-width: 768px) { .iproducts .wrapper .ipboxs .oneset .onesetin .box3 img.cert { display: none; }
  .iproducts .wrapper .ipboxs .oneset .onesetin .box3 img.cert:nth-child(1), .iproducts .wrapper .ipboxs .oneset .onesetin .box3 img.cert:nth-child(2) { display: inline; } }

.ipboxs.prosec { display: flex; flex-wrap: wrap; }
.ipboxs.prosec .oneset { width: calc(100% / 4); margin-bottom: 40px; }
@media (max-width: 1280px) { .ipboxs.prosec .oneset { width: calc(100% / 3); } }
@media (max-width: 960px) { .ipboxs.prosec .oneset { width: calc(100% / 2); } }
@media (max-width: 640px) { .ipboxs.prosec .oneset { width: calc(100% / 1); } }
.ipboxs.prosec .onesetin .box3 img.cert { display: none; }
.ipboxs.prosec .onesetin .box3 img.cert:nth-child(1), .ipboxs.prosec .onesetin .box3 img.cert:nth-child(2) { display: inline; }
.ipboxs .oneset { padding: 30px; }
@media (max-width: 480px) { .ipboxs .oneset { padding: 30px 10px; } }
.ipboxs .oneset .onesetin:hover .photo img { transform: scale(1.05); }
.ipboxs .oneset .onesetin .pic { overflow: hidden; padding: 20px; }
.ipboxs .oneset .onesetin .photo { height: 0; text-align: center; position: relative; display: block; overflow: hidden; overflow: initial; padding-bottom: 55.29412%; }
.ipboxs .oneset .onesetin .photo img { max-width: 100%; max-height: 100%; width: 100%; transition: 0.5s; position: absolute; display: block; margin: auto; top: 0; left: 0; right: 0; bottom: 0; width: auto; }
.ipboxs .oneset .onesetin .box1 { padding: 10px 20px; font-size: 18px; text-align: center; font-weight: bold; }
.ipboxs .oneset .onesetin .box2 { font-size: 14px; color: #666666; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; padding: 10px; text-align: center; }
.ipboxs .oneset .onesetin .box2 .t2 { color: #cccccc; padding: 0 15px; }
.ipboxs .oneset .onesetin .box2 .t3 { color: #2f7d64; display: inline-block; }
.ipboxs .oneset .onesetin .box3 { margin-top: 15px; text-align: center; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; }
.ipboxs .oneset .onesetin .box3.twocartflex .right { display: flex; align-items: center; margin-right: 12px; }
.ipboxs .oneset .onesetin .box3.twocartflex .left { display: flex; align-items: center; }
.ipboxs .oneset .onesetin .box3.twocartflex .left .select_orangebg { display: flex; }
.ipboxs .oneset .onesetin .box3.twocartflex .left .select_orangebg select.inputstyle { margin: 0; margin-right: 8px; flex: 1; border: 1px solid #dddddd; }
.ipboxs .oneset .onesetin .box3.twocartflex .left .select_orangebg .orangebg { background-color: #f66f34; padding: 5px 10px; border: none; flex-shrink: 0; }
.ipboxs .oneset .onesetin .box3.twocartflex .left .select_orangebg .orangebg:hover { background-color: #029354; }
.ipboxs .oneset .onesetin .box3 img.cert { margin: 0 5px 5px 5px; }

.inews { display: flex; flex-wrap: wrap; align-items: flex-end; }
@media (max-width: 1100px) { .inews { margin-top: 20px; } }
.inews:after { content: ""; background: #029354; width: 6.5vw; height: 250px; display: block; position: absolute; right: 0; bottom: 0; }
@media (max-width: 480px) { .inews:after { height: 100px; } }
.inews .box1 { width: calc((260 / 1920)*100%); height: 262px; background: #029354; color: #fff; padding: 25px; text-align: right; }
@media (max-width: 1200px) { .inews .box1 { width: 130px; } }
@media (max-width: 480px) { .inews .box1 { width: 75px; padding: 5px; text-align: center; } }
.inews .box1 .inewsyeararrow .inewsyear { font-size: 25px; font-weight: 800; font-family: roboto, sans-serif; }
@media (max-width: 480px) { .inews .box1 .inewsyeararrow .inewsyear { font-size: 20px; } }
.inews .box1 .inewsyeararrow .inewsarrow { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; }
@media (max-width: 480px) { .inews .box1 .inewsyeararrow .inewsarrow { justify-content: center; } }
.inews .box1 .inewsyeararrow .inewsarrow .arrow { cursor: pointer; }
.inews .box1 .inewsyeararrow .inewsarrow .arrow.right { transform: rotate(180deg); }
.inews .box1 .inewsyeararrow .inewsarrow .arrow.left { margin-right: 27px; }
@media (max-width: 480px) { .inews .box1 .inewsyeararrow .inewsarrow .arrow.left { margin-right: 15px; } }
.inews .box1 .inewsyeararrow .inewsarrow .arrow img { vertical-align: baseline; filter: brightness(0) saturate(100%) invert(100%) sepia(93%) saturate(3%) hue-rotate(156deg) brightness(108%) contrast(99%); }
.inews .box1 .inewsyeararrow .inewsarrow .arrow img:hover { filter: brightness(0) saturate(100%) invert(99%) sepia(52%) saturate(1829%) hue-rotate(323deg) brightness(108%) contrast(102%); transform: scale(1.1); }
.inews .box2 { width: calc((700 / 1920)*100%); }
@media (max-width: 1200px) { .inews .box2 { width: calc(100% - 130px); } }
@media (max-width: 480px) { .inews .box2 { width: calc(100% - 85px); } }
.inews .box2 .ititle { font-size: 4.94792vw; margin-bottom: 4.6875vw; line-height: 0.7; }
@media (max-width: 960px) { .inews .box2 .ititle { font-size: 36px; } }
@media (max-width: 480px) { .inews .box2 .ititle { font-size: 24px; } }
.inews .box2 .ititle::first-letter { font-size: 9.89583vw; }
@media (max-width: 960px) { .inews .box2 .ititle::first-letter { font-size: 70px; } }
@media (max-width: 480px) { .inews .box2 .ititle::first-letter { font-size: 45px; } }
.inews .box2 .inewsbox { padding: 0 3.125vw; }
@media (max-width: 1200px) { .inews .box2 .inewsbox { padding-bottom: 20px; } }
@media (max-width: 480px) { .inews .box2 .inewsbox { padding-bottom: 10px; } }
.inews .box2 .inewsbox .datetitle { padding-bottom: 20px; border-bottom: 1px solid #e6e6e6; display: flex; flex-wrap: wrap; }
@media (max-width: 480px) { .inews .box2 .inewsbox .datetitle { padding-bottom: 10px; } }
.inews .box2 .inewsbox .datetitle .date { color: #008c89; font-size: 30px; font-weight: 100; font-family: roboto, sans-serif; margin-right: 10px; line-height: 1; flex-shrink: 0; }
@media (max-width: 480px) { .inews .box2 .inewsbox .datetitle .date { font-size: 22px; } }
.inews .box2 .inewsbox .datetitle .title { font-size: 22px; color: #444; font-weight: bold; line-height: 1.4; flex: 1; }
@media (max-width: 480px) { .inews .box2 .inewsbox .datetitle .title { font-size: 18px; } }
.inews .box2 .inewsbox .con { color: #555555; font-size: 15px !important; margin-top: 20px; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 8; line-height: 24px; max-height: 192px; }
.inews .box2 .inewsbox .con * { font-size: 15px !important; }.inews .box2 .inewsbox .readmore { display: inline-block; margin-top: 30px; text-transform: uppercase; font-size: 12px; color: #999999; }
.inews .box2 .inewsbox .readmore:hover { transform: scale(1.1); }
.inews .box2 .inewsbox .readmore .fa-solid { color: #ff301b; }
.inews .box3 { width: calc((865 / 1920)*100%); }
@media (max-width: 1200px) { .inews .box3 { width: 100%; } }
.inews .box3 img { width: 100%; display: initial;}

.ibigclass { margin-top: -18.22917vw; width: 100vw; overflow: hidden; }
.ibigclass:after { width: 64.94792vw; height: 100%; content: ""; background: #ebebeb; position: absolute; z-index: -1; display: block; right: 0; top: 0; }
.ibigclass .wrapper { max-width: 1240px; }
@media (max-width: 768px) { .ibigclass .wrapper { padding: 0 100px; } }
@media (max-width: 768px) { .ibigclass .wrapper { padding: 0 70px; } }
.ibigclass .wrapper:before { content: ""; display: block; width: 17.70833vw; height: 6.92708vw; background-image: url(../images/leap1.png); background-repeat: no-repeat; background-size: contain; position: absolute; left: calc(-17.70833vw + 40px); top: 3.28125vw; }
@media (max-width: 1440px) { .ibigclass .wrapper:before { width: 10vw; height: 4.9vw; top: 3vw; left: -7vw; } }
@media (max-width: 1280px) { .ibigclass .wrapper:before { width: 11vw; } }
@media (max-width: 768px) { .ibigclass .wrapper:before { width: 100px; height: 45px; left: 0px; } }
@media (max-width: 480px) { .ibigclass .wrapper:before { width: 70px; height: 45px; left: 0px; } }
.ibigclass .wrapper:after { content: ""; display: block; width: 16.66667vw; height: 6.92708vw; background-image: url(../images/leap2.png); background-repeat: no-repeat; background-size: contain; position: absolute; right: calc(-16.66667vw + 40px); top: 3.28125vw; }
@media (max-width: 1440px) { .ibigclass .wrapper:after { width: 11vw; height: 5vw; top: 1vw; right: -8vw; } }
@media (max-width: 1366px) { .ibigclass .wrapper:after { top: 0.8vw; } }
@media (max-width: 1280px) { .ibigclass .wrapper:after { width: 12vw; top: 0vw; } }
@media (max-width: 768px) { .ibigclass .wrapper:after { width: 100px; right: 0; height: 39px; top: 10px; } }
@media (max-width: 480px) { .ibigclass .wrapper:after { width: 70px; height: 39px; top: 10px; } }
.ibigclass .wrapper .ibigclassboxs { padding-bottom: 120px; z-index: 1; }
.ibigclassboxs .slick-track{ transform: initial!important; }
@media (max-width: 480px) { .ibigclass .wrapper .ibigclassboxs { padding-bottom: 60px; } }
@media (min-width: 1101px) { .ibigclass .wrapper .ibigclassboxs .slick-current .oneset .in { background-image: url(../images/greenbg.png); color: #fff; }
  .ibigclass .wrapper .ibigclassboxs .slick-current .oneset .in::after { content: ""; width: 10px; height: 100%; display: block; position: absolute; right: -10px; top: 0; background-image: url(../images/shadow.png); background-repeat: no-repeat; z-index: 1; }
  .ibigclass .wrapper .ibigclassboxs .slick-current .oneset .in .icon img { filter: brightness(0) saturate(100%) invert(100%) sepia(25%) saturate(284%) hue-rotate(215deg) brightness(117%) contrast(100%); }
  .ibigclass .wrapper .ibigclassboxs .slick-current .oneset .in .box1 .txt { color: #fff; }
  .ibigclass .wrapper .ibigclassboxs .slick-current .oneset .in .box1 .tri img { filter: brightness(0) saturate(100%) invert(96%) sepia(23%) saturate(7499%) hue-rotate(322deg) brightness(117%) contrast(111%); }
  .ibigclass .wrapper .ibigclassboxs .slick-current .oneset .in .box2 { color: #fff; } }
.ibigclass .wrapper .ibigclassboxs .oneset { cursor: pointer; }
@media (max-width: 1100px) { .ibigclass .wrapper .ibigclassboxs .oneset:nth-child(2) .in { border-right: 1px solid #c3ddd5; border-bottom: none; } }
@media (min-width: 769px) { .ibigclass .wrapper .ibigclassboxs .oneset { height: 345px; overflow: hidden;} }
@media (max-width: 76px) { .ibigclass .wrapper .ibigclassboxs .oneset { width: 100%; margin-top: 10px; }
  .ibigclass .wrapper .ibigclassboxs .oneset:nth-child(1) .in, .ibigclass .wrapper .ibigclassboxs .oneset:nth-child(2) .in, .ibigclass .wrapper .ibigclassboxs .oneset:nth-child(3) .in { border-bottom: 1px solid #c3ddd5; } }
.ibigclass .wrapper .ibigclassboxs .oneset:last-child .in { border-right: 1px solid #c3ddd5; }
.ibigclass .wrapper .ibigclassboxs .oneset .in { transition: none; display: block; border: 1px solid #c3ddd5; border-right: none; padding: 1.82292vw 2.08333vw; background-image: url(../images/graybg.png); background-repeat: no-repeat; background-size: cover; height: 100%; }
@media (max-width: 1100px) { .ibigclass .wrapper .ibigclassboxs .oneset .in { padding: 40px; } }
@media (max-width: 768px) { .ibigclass .wrapper .ibigclassboxs .oneset .in a{ display: flex; align-items: center;  } }
@media (max-width: 480px) { .ibigclass .wrapper .ibigclassboxs .oneset .in { border-right: 1px solid #c3ddd5; padding: 15px; } }
@media (minx-width: 769px) { .ibigclass .wrapper .ibigclassboxs .oneset .in:hover { background-image: url(../images/greenbg.png); color: #fff; }
  .ibigclass .wrapper .ibigclassboxs .oneset .in:hover::after { content: ""; width: 10px; height: 100%; display: block; position: absolute; right: -10px; top: 0; background-image: url(../images/shadow.png); background-repeat: no-repeat; z-index: 1; }
  .ibigclass .wrapper .ibigclassboxs .oneset .in:hover .icon img { filter: brightness(0) saturate(100%) invert(100%) sepia(25%) saturate(284%) hue-rotate(215deg) brightness(117%) contrast(100%); }
  .ibigclass .wrapper .ibigclassboxs .oneset .in:hover .box1 .txt { color: #fff; }
  .ibigclass .wrapper .ibigclassboxs .oneset .in:hover .box1 .tri img { filter: brightness(0) saturate(100%) invert(96%) sepia(23%) saturate(7499%) hue-rotate(322deg) brightness(117%) contrast(111%); }
  .ibigclass .wrapper .ibigclassboxs .oneset .in:hover .box2 { color: #fff; } }
.ibigclass .wrapper .ibigclassboxs .oneset .in.active {  background-image: url(../images/greenbg.png); color: #fff; transition: none;}
.ibigclass .wrapper .ibigclassboxs .oneset .in.active::after { content: ""; width: 10px; height: 100%; display: block; position: absolute; right: -10px; top: 0; background-image: url(../images/shadow.png); background-repeat: no-repeat; z-index: 1; }
.ibigclass .wrapper .ibigclassboxs .oneset .in.active .icon img { filter: brightness(0) saturate(100%) invert(100%) sepia(25%) saturate(284%) hue-rotate(215deg) brightness(117%) contrast(100%); }
.ibigclass .wrapper .ibigclassboxs .oneset .in.active .box1 .txt { color: #fff; }
.ibigclass .wrapper .ibigclassboxs .oneset .in.active .box1 .tri img { filter: brightness(0) saturate(100%) invert(96%) sepia(23%) saturate(7499%) hue-rotate(322deg) brightness(117%) contrast(111%); }
.ibigclass .wrapper .ibigclassboxs .oneset .in.active .box2 { color: #fff; }
.ibigclass .wrapper .ibigclassboxs .oneset .in .icon { max-width: initial; margin-bottom: 30px; }
@media (max-width: 768px) { .ibigclass .wrapper .ibigclassboxs .oneset .in .icon { margin-bottom: 0px; } }
@media (max-width: 640px) {
  .ibigclassboxs .oneset .in {
    transition: none !important;
  }
}
@media (max-width: 480px) { .ibigclass .wrapper .ibigclassboxs .oneset .in .icon { padding: 0 10px 0 0; } }
.ibigclass .wrapper .ibigclassboxs .oneset .in .icon img { height: 50px; }
@media (max-width: 768px) { .ibigclass .wrapper .ibigclassboxs .oneset .in .icon img { height: 42px; } }
.ibigclass .wrapper .ibigclassboxs .oneset .in .box1 { display: flex; align-items: center; margin-bottom: 20px; border-bottom: 1px solid #cccccc; padding-bottom: 20px; }
@media (max-width: 768px) { .ibigclass .wrapper .ibigclassboxs .oneset .in .box1 { border-bottom: none; padding-bottom: 0px; margin-bottom: 0px; } }
.ibigclass .wrapper .ibigclassboxs .oneset .in .box1 .tri { flex-shrink: 0; margin-right: 10px; }
@media (max-width: 768px) { .ibigclass .wrapper .ibigclassboxs .oneset .in .box1 .tri { display: none; } }
.ibigclass .wrapper .ibigclassboxs .oneset .in .box1 .txt {font-size: 18px;line-height: 1.6;font-size: 18px;line-height: 1.6;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
@media (max-width: 768px) { .ibigclass .wrapper .ibigclassboxs .oneset .in .box1 .txt { padding-left: 15px; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-height: 28px; max-height: 56px; } }
@media (min-width: 480px) { .ibigclass .wrapper .ibigclassboxs .oneset .in .box1 { height: 79px; } }
@media (max-width: 480px) { .ibigclass .wrapper .ibigclassboxs .oneset .in .box1 .txt { font-size: 16px; padding-left: 10px; } }
.ibigclass .wrapper .ibigclassboxs .oneset .in .box2 { font-size: 14px; color: #444; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; white-space: normal;}
@media (max-width: 768px) { .ibigclass .wrapper .ibigclassboxs .oneset .in .box2 { display: none; } }
.ibigclass .wrapper .ibigclassboxs .slick-list { padding: 0 !important; }

.ibanner { width: 100%; padding-top: 152px; }
@media (max-width: 1100px) { .ibanner { padding-top: 105px; } }
@media (max-width: 768px) { .ibanner { padding-top: 130px; } }
.ibanner .ibanslick { mask: url(../images/mask_bg.png); -webkit-mask: url(../images/mask_bg.png); mask-size: cover; -webkit-mask-size: cover; }
.ibanner .ibanslick:hover .slick-prev, .ibanner .ibanslick:hover .slick-next { opacity: 1; }
.ibanner .ibanslick .slick-next { right: 20px; }
.ibanner .ibanslick .slick-prev { left: 20px; z-index: 9; }
.ibanner .ibanslick .slick-prev:before, .ibanner .ibanslick .slick-next:before { font-size: 35px; }
.ibanner .ibanslick .slick-prev, .ibanner .ibanslick .slick-next { width: 35px; height: 35px; opacity: 0; }
.ibanner .oneset { 
  width: 100%; 
}



.ibanner .oneset .mask { width: 100vw; height: 58.22917vw; background-repeat: no-repeat; background-size: 100%; }

.logwrapper { background-color: #f2f2f2; }
.logwrapper .wrapper { width: 100%; max-width: 1480px; margin: 0 auto; padding: 0 40px; }
@media (max-width: 540px) { .logwrapper .wrapper { padding: 0 20px; } }

.log_breadCrumbs { font-size: 16px; padding: 25px 0 20px 0; }
@media (max-width: 480px) { .log_breadCrumbs { font-size: 14px; padding: 20px 0 15px 0; } }
.log_breadCrumbs .inlineblock { display: inline-block; }
.log_breadCrumbs a:hover { color: #eb5d28; }
.log_breadCrumbs .spacer { padding: 0 10px; font-size: 12px; }

.log_main { display: flex; }
@media (max-width: 1100px) { .log_main { display: block; } }

.log_sidemenu { width: 20%; }
@media (max-width: 1100px) { .log_sidemenu { width: 100%; } }
.log_sidemenu .membertoggle { display: none; }
@media (max-width: 1100px) { .log_sidemenu .membertoggle { display: flex; flex-wrap: wrap; justify-content: space-between; padding: 10px; background: #029354; align-items: center; color: #fff; } }
.log_sidemenu .log_sidemenuin { width: 100%; background: #fff; border: 1px solid #e8e9ed; padding: 10px 30px; }
@media (min-width: 1099px) { .log_sidemenu .log_sidemenuin { display: block !important; } }
@media (max-width: 1100px) { .log_sidemenu .log_sidemenuin { display: none; padding: 10px; } }
@media (max-width: 1100px) { .log_sidemenu .log_sidemenuin .sidenavul { display: flex; flex-wrap: wrap; } }
.log_sidemenu .log_sidemenuin .sidenavul li { list-style: none; }
.log_sidemenu .log_sidemenuin .sidenavul > li { border-bottom: 1px solid #cccccc; padding-bottom: 20px; padding-top: 20px; }
@media (max-width: 1100px) { .log_sidemenu .log_sidemenuin .sidenavul > li { width: 25%; padding-right: 0; padding-left: 15px; } }
@media (max-width: 640px) { .log_sidemenu .log_sidemenuin .sidenavul > li { width: calc(100% / 3); } }
@media (max-width: 540px) { .log_sidemenu .log_sidemenuin .sidenavul > li { width: calc(100% / 2); } }
.log_sidemenu .log_sidemenuin .sidenavul > li:last-child { border-bottom: none; }
.log_sidemenu .log_sidemenuin .sidenavul > li > a { font-size: 20px; font-weight: bold; color: #000; }
@media (max-width: 1100px) { .log_sidemenu .log_sidemenuin .sidenavul > li > a { font-size: 16px; } }
.log_sidemenu .log_sidemenuin .sidenavul > li > a.active { color: #eb5d28; }
.log_sidemenu .log_sidemenuin .sidenavul > li > a.active:before { background: #eb5d28; }
@media (max-width: 1100px) { .log_sidemenu .log_sidemenuin .sidenavul > li > a.logout { padding-left: 10px; } }
.log_sidemenu .log_sidemenuin .sidenavul > li > a.logout:before { content: "\f2f5"; font-size: 22px; color: #a1c242; width: initial; height: initial; background: none; line-height: 1; }
@media (max-width: 1100px) { .log_sidemenu .log_sidemenuin .sidenavul > li > a.logout:before { margin-left: 0px; font-size: 16px; } }
.log_sidemenu .log_sidemenuin .sidenavul > li > a:before { width: 9px; height: 25px; background: #a1c242; content: ""; display: block; position: absolute; left: -30px; top: 2px; }
@media (max-width: 1100px) { .log_sidemenu .log_sidemenuin .sidenavul > li > a:before { width: 6px; height: 18px; left: -12px; top: 2px; } }
.log_sidemenu .log_sidemenuin .sidenavul > li > ul.secnav { color: #333333; padding-left: 15px; padding-top: 5px; }
@media (max-width: 1100px) { .log_sidemenu .log_sidemenuin .sidenavul > li > ul.secnav { padding-left: 15px; } }
.log_sidemenu .log_sidemenuin .sidenavul > li > ul.secnav > li { margin-bottom: 5px; }
.log_sidemenu .log_sidemenuin .sidenavul > li > ul.secnav > li:hover { color: #eb5d28; }
.log_sidemenu .log_sidemenuin .sidenavul > li > ul.secnav > li:hover:before { color: #eb5d28; }
.log_sidemenu .log_sidemenuin .sidenavul > li > ul.secnav > li.active { color: #eb5d28; font-weight: bold; }
.log_sidemenu .log_sidemenuin .sidenavul > li > ul.secnav > li.active:before { color: #eb5d28; }
.log_sidemenu .log_sidemenuin .sidenavul > li > ul.secnav > li:before { content: "\f105"; font-size: 12px; color: #333333; position: absolute; left: -15px; top: 4px; }
.log_sidemenu .log_sidemenuin .sidenavul > li > ul.secnav > li > a { font-size: 17px; }
@media (max-width: 1100px) { .log_sidemenu .log_sidemenuin .sidenavul > li > ul.secnav > li > a { font-size: 15px; letter-spacing: 0; } }
.log_sidemenu .log_locationlink { width: 100%; margin-top: 40px; margin-bottom: 40px; }
@media (max-width: 1100px) { .log_sidemenu .log_locationlink { display: none; } }
.log_sidemenu .log_locationlink a { width: 100%; display: block; }
.log_sidemenu .log_locationlink a img { width: 100%; }

.log_rightcon { width: 80%; padding-left: 35px; }
@media (max-width: 1100px) { .log_rightcon { width: 100%; flex: initial; padding-left: 0px; margin-top: 20px; } }

.log_announcement { margin-bottom: 35px; }
@media (max-width: 480px) { .log_announcement { margin-bottom: 25px; } }
.log_announcement .log_anno_title { font-size: 18px; font-weight: bold; letter-spacing: 0.1em; text-align: center; background: url(../images/log_tagbg.png) no-repeat; width: 155px; height: 44px; color: #fff; padding-top: 5px; margin-bottom: 15px; }
.log_announcement .log_anno_com { font-size: 18px; color: #333333; }
@media (max-width: 480px) { .log_announcement .log_anno_com { font-size: 16px; } }

.onemo_block { padding-bottom: 45px; }
@media (max-width: 480px) { .onemo_block { padding-bottom: 35px; } }
.onemo_block .flexbetween { display: flex; flex-wrap: wrap; justify-content: space-between; }
.onemo_block .flexbetween .achievement_time { font-size: 14px; }
@media (max-width: 480px) { .onemo_block .flexbetween .achievement_time { width: 100%; } }

.log_secwhite { background-color: #fff; padding: 30px; border: 1px solid #e8e9ed; width: 100%; }
.log_secwhite.style2 { padding: 30px 50px; }
@media (max-width: 768px) { .log_secwhite.style2 { padding: 20px 20px; } }
@media (max-width: 768px) { .log_secwhite { padding: 20px 20px; } }

.log_calenderline { display: flex; flex-wrap: wrap; justify-content: space-between; margin-bottom: 20px; align-items: center; }
@media (max-width: 640px) { .log_calenderline { margin-bottom: 15px; } }
.log_calenderline .monthselect { display: flex; flex-wrap: wrap; }
.log_calenderline .monthselect .monthyear { font-size: 28px; color: #029354; font-weight: bold; margin-right: 20px; }
@media (max-width: 768px) { .log_calenderline .monthselect .monthyear { font-size: 20px; margin-right: 10px; } }
.log_calenderline .monthselect .prenext { display: flex; flex-wrap: wrap; color: #029354; align-items: center; }
.log_calenderline .monthselect .prenext .arrow { display: flex; padding: 0 10px; align-items: center; line-height: 1; }
.log_calenderline .monthselect .prenext .arrow:hover { color: #eb5d28; }
.log_calenderline .monthselect .prenext .arrow .fa-solid { font-size: 20px; margin: 0 5px; }
.log_calenderline .calendarbtn .smallgraybtnstyle img { margin-right: 5px; }
@media (max-width: 540px) { .log_calenderline .calendarbtn { margin-top: 10px; width: 100%; } }

.log_calenbotcon .oneline { font-size: 20px; display: flex; flex-wrap: wrap; margin-bottom: 8px; }
@media (max-width: 640px) { .log_calenbotcon .oneline { font-size: 16px; } }
.log_calenbotcon .oneline .icon { flex-shrink: 0; margin-right: 12px; }
@media (max-width: 640px) { .log_calenbotcon .oneline .icon img { height: 20px; } }
.log_calenbotcon .oneline .txt { flex: 1; }
.log_calenbotcon .oneline .txt .inlineblock { display: inline-block; }

.icon_title { display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 10px; }
.icon_title .icon { flex-shrink: 0; margin-right: 10px; }
@media (max-width: 480px) { .icon_title .icon img { height: 28px; } }
.icon_title .txt { font-size: 28px; font-weight: bold; color: #4f4f4f; }
@media (max-width: 768px) { .icon_title .txt { font-size: 22px; } }
.icon_title .txt.titledown { cursor: pointer; }

.toggleBox { display: none; }

.subline { margin-bottom: 5px; }
.subline .biggreen { font-size: 24px; font-weight: bold; color: #029354; display: inline-block; margin-right: 10px; }
@media (max-width: 640px) { .subline .biggreen { font-size: 20px; } }
.subline .smalltxt { color: #666666; font-size: 16px; display: inline-block; }
@media (max-width: 640px) { .subline .smalltxt { font-size: 14px; } }
.subline.flex { display: flex; flex-wrap: wrap; justify-content: space-between; margin-bottom: 0; }
@media (max-width: 480px) { .subline.flex .tabswitch { width: 100%; } }
.subline.flex .tabswitch ul { display: flex; flex-wrap: wrap; }
.subline.flex .tabswitch ul li { list-style: none; padding-left: 30px; }
@media (max-width: 480px) { .subline.flex .tabswitch ul li { padding-left: 0px; padding-right: 20px; padding-top: 10px; } }
.subline.flex .tabswitch ul li a { font-size: 20px; }
@media (max-width: 640px) { .subline.flex .tabswitch ul li a { font-size: 16px; } }
.subline.flex .tabswitch ul li a:after { content: ""; display: block; height: 8px; width: 100%; }
.subline.flex .tabswitch ul li a.active { font-weight: bold; }
.subline.flex .tabswitch ul li a.active:after { background: #a1c242; }
.subline.flex .tabswitch ul li a:hover { font-weight: bold; }

.memberinfo { display: flex; flex-wrap: wrap; }
.memberinfo .memminwrap { width: 50%; display: flex; flex-wrap: wrap; }
@media (max-width: 768px) { .memberinfo .memminwrap { width: 40%; border-right: 1px solid #e7e7e7; display: block; } }
@media (max-width: 640px) { .memberinfo .memminwrap { width: 100%; border-right: none; } }
.memberinfo .memphoto { width: 40%; padding-right: 2.60417vw; }
@media (max-width: 768px) { .memberinfo .memphoto { width: 50%; padding-right: 0vw; } }
@media (max-width: 480px) { .memberinfo .memphoto { width: 55%; } }
.memberinfo .memphoto .pic { background-repeat: no-repeat; background-size: cover; height: 0; text-align: center; position: relative; display: block; overflow: hidden; padding-bottom: 100%; border-radius: 50%; }
.memberinfo .minfo1 { width: 60%; border-right: 1px solid #e7e7e7; padding-right: 2.60417vw; }
@media (max-width: 768px) { .memberinfo .minfo1 { width: 100%; border-right: none; padding-right: 0; margin-top: 10px; } }
@media (max-width: 768px) and (max-width: 640px) { .memberinfo .minfo1 { width: 100%; } }

.memberinfo .minfo1 .infobox1 .memname { font-size: 24px; font-weight: bold; margin-bottom: 10px; }
.memberinfo .minfo1 .infobox1 .iconstage { display: flex; flex-wrap: wrap; margin-bottom: 15px; }
.memberinfo .minfo1 .infobox1 .iconstage .icon { width: 50px; padding-right: 10px; }
.memberinfo .minfo1 .infobox1 .iconstage .stage { flex: 1; line-height: 1; }
.memberinfo .minfo1 .infobox1 .iconstage .stage .t1 { margin-bottom: 8px; }
.memberinfo .minfo1 .infobox1 .iconstage .stage .t1 .gray { font-weight: bold; color: #999999; margin-right: 5px; }
.memberinfo .minfo1 .infobox1 .iconstage .stage .t1 .green { font-size: 20px; color: #029354; font-weight: bold; }
.memberinfo .minfo1 .infobox1 .iconstage .stage .t2 { color: #000; font-size: 14px; font-weight: bold; }
.memberinfo .minfo1 .infobox1 .iconstage .stage .t2 .red { color: #ff301b; }
.memberinfo .minfo1 .infobox2 { margin-bottom: 15px; }
.memberinfo .minfo1 .infobox2 .oneline { font-size: 16px; color: #4f4f4f; margin-bottom: 0px; }
.memberinfo .minfo1 .infobox3 { display: flex; flex-wrap: wrap; }
.memberinfo .minfo1 .infobox3 .onebox { margin-bottom: 10px; }
.memberinfo .minfo1 .infobox3 .onebox:not(:last-child) { margin-right: 20px; }
.memberinfo .minfo1 .infobox3 .onebox .t1 { color: #4f4f4f; font-size: 16px; }
.memberinfo .minfo1 .infobox3 .onebox .t2 { font-size: 20px; color: #029354; font-weight: bold; line-height: 1.2; }
.memberinfo .minfo2 { width: 50%; padding-left: 3.125vw; }
@media (max-width: 768px) { .memberinfo .minfo2 { width: 60%; } }
@media (max-width: 640px) { .memberinfo .minfo2 { width: 100%; padding-left: 0vw; margin-top: 20px; } }
.memberinfo .minfo2 .box1 { display: flex; flex-wrap: wrap; font-weight: bold; font-size: 16px; margin-bottom: 10px; align-items: baseline; }
.memberinfo .minfo2 .box1 .oneline { display: inline-block; color: #99999a; margin-right: 5px; }
.memberinfo .minfo2 .box1 .oneline.smalltxt { font-size: 14px; margin-right: 0; color: #000000; }
.memberinfo .minfo2 .box1 .oneline .green { color: #029354; font-weight: bold; font-size: 20px; }
.memberinfo .minfo2 .box2 .progressbox { margin-bottom: 15px; }
.memberinfo .minfo2 .box2 .progressbox .txt { font-size: 18px; font-weight: bold; }
.memberinfo .minfo2 .box2 .progressbox .barline { display: flex; flex-wrap: wrap; }
.memberinfo .minfo2 .box2 .progressbox .barline .bar { width: 70%; padding-right: 15px; margin-top: 5px; }
@media (max-width: 480px) { .memberinfo .minfo2 .box2 .progressbox .barline .bar { width: 65%; padding-right: 10px; } }
.memberinfo .minfo2 .box2 .progressbox .barline .bar .barin { height: 10px; border-radius: 10px; background: #dcdcdc; overflow: hidden; }
.memberinfo .minfo2 .box2 .progressbox .barline .bar .barin .greenbar { height: 10px; position: absolute; top: 0; left: 0; background: #029354; width: 50%; }
.memberinfo .minfo2 .box2 .progressbox .barline .bar .smalltxt { font-size: 12px; color: #029354; position: relative; transform: translate(-50%, 0); left: 50%; display: inline-block; }
.memberinfo .minfo2 .box2 .progressbox .barline .uptxt { width: 30%; font-weight: bold; color: #029354; font-size: 14px; }
@media (max-width: 540px) { .memberinfo .minfo2 .box2 .progressbox .barline .uptxt { font-size: 12px; letter-spacing: 0; } }
@media (max-width: 480px) { .memberinfo .minfo2 .box2 .progressbox .barline .uptxt { width: 35%; } }
.memberinfo .minfo2 .box2 .progressbox .barline .uptxt .fa-solid { margin-right: 5px; }
.memberinfo .minfo2 .box3 ul li { list-style: none; }
.memberinfo .minfo2 .box3 ul li .numtxtout { display: flex; margin-bottom: 8px; }
.memberinfo .minfo2 .box3 ul li .numtxtout .num { color: #fff; font-size: 16px; font-weight: bold; background: #029354; width: 24px; height: 24px; line-height: 24px; text-align: center; border-radius: 50%; margin-right: 5px; flex-shrink: 0; }
.memberinfo .minfo2 .box3 ul li .numtxtout .txt { flex: 1; }
.memberinfo .minfo2 .box3 ul li .stage { padding-left: 30px; display: flex; flex-wrap: wrap; align-items: center; margin-top: 10px; }
.memberinfo .minfo2 .box3 ul li .stage .stagenum { display: flex; margin-right: 20px; }
.memberinfo .minfo2 .box3 ul li .stage .stagenum .one { display: flex; margin-right: 3px; }
.memberinfo .minfo2 .box3 ul li .stage .stagenum .one .num { background: #dcdcdc; color: #fff; font-size: 18px; font-weight: bold; padding: 3px; margin-left: -1px; }
.memberinfo .minfo2 .box3 ul li .stage .stagenum .one::before { display: block; content: ""; clip-path: polygon(100% 0, 100% 100%, 0% 100%, 91% 50%, 0 0); width: 15px; height: 35px; background: #dcdcdc; }
.memberinfo .minfo2 .box3 ul li .stage .stagenum .one::after { display: block; content: ""; clip-path: polygon(100% 50%, 0 0, 0 100%); width: 16px; height: 35px; background: #dcdcdc; position: absolute; right: -15px; z-index: 0; }
.memberinfo .minfo2 .box3 ul li .stage .stagenum .one.active .num { background-color: #029354; }
.memberinfo .minfo2 .box3 ul li .stage .stagenum .one.active::before { background-color: #029354; }
.memberinfo .minfo2 .box3 ul li .stage .stagenum .one.active::after { background-color: #029354; }
.memberinfo .minfo2 .box3 ul li .stage .txtrightgreen { font-size: 14px; font-weight: bold; color: #029354; }

.achievement_set { display: flex; flex-wrap: wrap; }
.achievement_set .one { width: calc(100% / 3); text-align: center; margin: 20px 0; }
@media (max-width: 540px) { .achievement_set .one { width: calc(100% / 1); margin: 10px 0; } }
.achievement_set .one .num { line-height: 1; margin-bottom: 10px; }
.achievement_set .one .num .green { font-size: 45px; font-weight: 800; color: #029354; margin-right: 5px; }
.achievement_set .one .num .green.style2 { color: #a1c242; }
@media (max-width: 800px) { .achievement_set .one .num .green { font-size: 28px; } }
.achievement_set .one .num .small { font-size: 20px; color: #999999; }
.achievement_set .one .txt { font-size: 24px; color: #4f4f4f; margin-bottom: 5px; }
@media (max-width: 800px) { .achievement_set .one .txt { font-size: 16px; } }

.incentiveout { display: flex; flex-wrap: wrap; }
.incentiveout .oneset { width: 50%; padding: 10px; }
@media (max-width: 1024px) { .incentiveout .oneset { width: 100%; margin-bottom: 40px; } }
.incentiveout .oneset .charttitle { font-weight: bold; font-size: 24px; text-align: center; }
.incentiveout .oneset .charttitle .orangetxt { color: #ff5e1f; }
.incentiveout .oneset .chartbox #chart-container1, .incentiveout .oneset .chartbox #chart-container2 { height: 500px; }
@media (max-width: 1024px) { .incentiveout .oneset .chartbox #chart-container1, .incentiveout .oneset .chartbox #chart-container2 { height: 450px; } }
@media (max-width: 1024px) { .incentiveout .oneset .chartcontent { font-size: 14px; } }
.incentiveout .oneset .chartcontent .redcolor { color: #ff0000; font-weight: bold; }

#chart-container3, #chart-container4 { height: 500px; }

.overtableflow { width: 100%; overflow: auto; }

.greenheadtable { width: 100%; min-width: 550px; background: #fff; border-left: 1px solid #e8e9ed; border-right: 1px solid #e8e9ed; font-size: 16px; }
@media (max-width: 1440px) { .greenheadtable { font-size: 16px; } }
@media (max-width: 640px) { .greenheadtable { font-size: 14px; letter-spacing: 0; } }
.greenheadtable.stickyth tr th { position: sticky; top: 0; z-index: 1; }
.greenheadtable.firsttdleft tr td:first-child { text-align: left; }
.greenheadtable.style2 { border-left: none; border-right: none; min-width: 100%; }
.greenheadtable.style2 tr th, .greenheadtable.style2 tr td { padding: 10px 15px; }
@media (max-width: 640px) { .greenheadtable.style2 tr th:first-child, .greenheadtable.style2 tr td:first-child { width: initial !important; } }
.greenheadtable.f15 { font-size: 15px; }
.greenheadtable.f12 { font-size: 12px; }
.greenheadtable.f14 { font-size: 14px; }
.greenheadtable.smallstyle { font-size: 14px; }
.greenheadtable.smallstyle tr th, .greenheadtable.smallstyle tr td { padding: 10px 7px; }
.greenheadtable.smallstyle tr th { font-size: 16px; }
.greenheadtable tbody tr.trbgfff1cf td { background-color: #fff1cf; }
.greenheadtable tbody tr th, .greenheadtable tbody tr td { padding: 10px; text-align: center; }
@media (max-width: 1440px) { .greenheadtable tbody tr th, .greenheadtable tbody tr td { padding: 10px 5px; } }
.greenheadtable tbody tr th.textalignleft, .greenheadtable tbody tr td.textalignleft { text-align: left; }
.greenheadtable tbody tr th { color: #fff; background: #389074; }
.greenheadtable tbody tr td { border-bottom: 1px solid #c6c6c6; }
.greenheadtable tbody tr td.lightyellowbg { background-color: #fff1cf; border-bottom: 2px solid #707070; }

.izi_header { background-color: #dadbdc; width: 100%; display: flex; align-items: center; padding: 10px 25px; z-index: 1; position: fixed; top: 0; }
@media (max-width: 767px) { .izi_header { padding: 5px 15px; } }
.izi_header .titlebox { flex: 1; display: flex; padding-right: 70px; align-items: center; }
@media (max-width: 1260px) { .izi_header .titlebox { padding-right: 30px; } }
.izi_header .titlebox .icon { flex-shrink: 0; }
.izi_header .titlebox .icon img { height: 45px; }
@media (max-width: 767px) { .izi_header .titlebox .icon img { height: 25px; } }
.izi_header .titlebox .title { flex: 1; padding-left: 15px; }
@media (max-width: 767px) { .izi_header .titlebox .title { padding-left: 10px; } }
.izi_header .titlebox .title .t1 { font-size: 23px; font-weight: bold; color: #333333; margin-bottom: 0px; }
@media (max-width: 767px) { .izi_header .titlebox .title .t1 { font-size: 20px; } }
.izi_header .titlebox .title .t2 { font-size: 16px; font-weight: bold; color: #858585; }
@media (max-width: 767px) { .izi_header .titlebox .title .t2 { font-size: 12px; } }
.izi_header .fullclose_icon { flex-shrink: 0; }
.izi_header .fullclose_icon .iziModal-button { display: block; float: right; z-index: 2; outline: 0; height: 34px; width: 34px; border: 0; padding: 0; margin: 0; opacity: .3; border-radius: 50%; transition: transform 0.3s cubic-bezier(0.16, 0.81, 0.32, 1), opacity 0.3s ease; background-size: 67% !important; -webkit-tap-highlight-color: transparent; -webkit-tap-highlight-color: transparent; }
.izi_header .fullclose_icon .iziModal-button-close { background: url(../images/close.png) no-repeat 50% 50%; }
.izi_header .fullclose_icon .iziModal-button-fullscreen { background: url(../images/fullscreen.png) no-repeat 50% 50%; }

.izi_maincon { padding: 40px; margin-top: 60px; }
@media (max-width: 767px) { .izi_maincon { padding: 40px 15px; margin-top: 85px; } }

@media (max-width: 767px) { .iziModal .iziModal-header-buttons { top: 25px !important; } }

@keyframes circleZoomOut { 0% { width: 230vw; height: 230vw; }
  70% { opacity: 1; }
  100% { width: 20vw; height: 20vw; opacity: 0; } }
#birthday { position: fixed; top: 50%; left: 50%; width: 95vw; height: 95vh; max-width: 800px; max-height: 400px; overflow: hidden; transform: translate(-50%, -50%); z-index: 999999; border-radius: 40px; }
#birthday .bgcircle { width: 300vw; height: 300vw; border-radius: 50%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); opacity: 1; overflow: hidden; }
#birthday .bgcircle.hidecircle { animation: circleZoomOut 0.8s ease 0s; animation-fill-mode: forwards; }
#birthday canvas#happybirthday { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 9999; }

.closebirthday { position: absolute; z-index: 99; top: 2.08333vw; right: 2.08333vw; cursor: pointer; z-index: 99999; }
.closebirthday img { opacity: 0.5; width: 35px; height: 35px; }
.closebirthday img:hover { transform: rotate(180deg); opacity: 0.8; }

.tab_menu ul { display: flex; flex-wrap: wrap; }
.tab_menu ul li { padding: 0px 15px; list-style: none; }
.tab_menu ul li a { font-size: 18px; padding-bottom: 10px; padding-top: 10px; display: block; }
.tab_menu ul li a.active, .tab_menu ul li a:hover { font-weight: bold; }
.tab_menu ul li a.active:after, .tab_menu ul li a:hover:after { content: ""; height: 3px; width: 100%; position: absolute; display: block; background: #a2c245; bottom: 0; }

.formtitle { font-size: 18px; font-weight: bold; margin-bottom: 10px; }
.formtitle .redcolor { display: inline-block; margin-left: 10px; }

.firstblock { border-bottom: 1px dotted #d6d6d6; padding-bottom: 10px; }

.secblock { padding-top: 10px; }

.pagebox { text-align: center; padding: 40px; }
.pagebox .selectstyle { border-radius: 1px solid #dddddd; padding: 5px; }
.pagebox .selectstyle .totalnum { padding-left: 15px; }

.nofound { text-align: center; margin-bottom: 20px; }
.nofound .txt { font-size: 24px; color: #333333; font-weight: bold; margin-bottom: 10px; }
.nofound .photo { max-width: 200px; margin: 0 auto; }

.explainbox { color: #333333; margin-top: 15px; }
.explainbox .txt { font-weight: bold; font-size: 18px; margin-bottom: 5px; }
.explainbox ol { margin-left: 20px; }
.explainbox ol li { font-size: 16px; margin-bottom: 3px; }

.addlove { font-size: 24px; color: #cccccc; cursor: pointer; }
.addlove.active, .addlove:hover { color: #fb612b; }

.leftlinetitle { font-size: 18px; font-weight: bold; padding-left: 15px; margin-bottom: 10px; }
.leftlinetitle:before { display: block; content: ""; position: absolute; width: 4px; height: 18px; background: #333; left: 0; top: 5px; }

.flexboxaligncenter { display: flex; align-items: center; }
.flexboxaligncenter .qrcode { padding-right: 10px; }

.leftspacebox { padding-left: 20px; }

.applybox { display: flex; align-items: center; padding: 20px 10px; border-bottom: 1px dotted #8a8a8a; }
.applybox .applylink { flex-shrink: 0; }
.applybox .applylink a.applylinkstyle { font-size: 18px; font-weight: bold; display: inline-block; background-color: #3e9176; background-image: url(../images/application_bg.png); background-repeat: no-repeat; background-position: bottom left -15px; border-radius: 30px; padding: 15px 38px; color: #fff; -webkit-box-shadow: 3px 3px 7px 0px rgba(18, 124, 151, 0.35); -moz-box-shadow: 3px 3px 7px 0px rgba(18, 124, 151, 0.35); box-shadow: 3px 3px 7px 0px rgba(18, 124, 151, 0.35); }
.applybox .applylink a.applylinkstyle:hover { background-color: #eb5d28; }
.applybox .rightbox { font-size: 18px; padding-left: 20px; }

@media (max-width: 480px) { .applybox { flex-wrap: wrap; }
  .applybox .rightbox { margin-top: 20px; padding-left: 0; } }
.agreebox { text-align: center; padding: 20px 0; }

.agreeboxflex { display: inline-block; }

.checkboxbefore2 { vertical-align: middle; }

.remiderflex { display: flex; align-items: center; justify-content: center; margin-bottom: 20px; }
.remiderflex.style2 { justify-content: flex-start; }
.remiderflex .icon { flex-shrink: 0; }
.remiderflex .icon .bell { color: #fff; background-color: #d91312; text-align: center; width: 40px; height: 40px; border-radius: 100%; line-height: 40px; font-size: 20px; }
.remiderflex .txt { padding-left: 10px; }

.clansearchflexbox { display: flex; flex-wrap: wrap; align-items: center; }
.clansearchflexbox.style2 { flex-wrap: initial; }
.clansearchflexbox.style2 .clendarbox2 { margin-right: 10px; }
.clansearchflexbox .clendarimg { margin-right: 25px; }
.clansearchflexbox .clendarbox2 { margin-right: 25px; }
.clansearchflexbox .clendarbox2.flex1 { flex: 1; }

@media (max-width: 767px) { .clansearchflexbox { display: block; }
  .clansearchflexbox .inputstyle.w150 { width: 100%; }
  .clansearchflexbox .clendarbox2 { margin: 10px 0; } }
.calendarsec { margin-top: 30px; }

.calendertoptxtbox { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; margin-bottom: 10px; }
.calendertoptxtbox .calenderlefttxt { display: flex; flex-wrap: wrap; align-items: baseline; line-height: 1; }
.calendertoptxtbox .calenderlefttxt .city { font-size: 50px; font-weight: bold; margin-right: 25px; }
.calendertoptxtbox .calenderlefttxt .month { font-size: 50px; font-weight: bold; margin-right: 12px; }
.calendertoptxtbox .calenderlefttxt .year { font-size: 20px; }
.calendertoptxtbox .calenderrightarrow { display: flex; flex-wrap: wrap; }
.calendertoptxtbox .calenderrightarrow .squarebtnstyle.today { margin-right: 20px; }
.calendertoptxtbox .calenderrightarrow .squarebtnstyle.arrow { margin-left: 5px; }

@media (max-width: 960px) { .calendertoptxtbox .calenderlefttxt .city { font-size: 36px; margin-right: 10px; }
  .calendertoptxtbox .calenderlefttxt .month { font-size: 36px; margin-right: 10px; }
  table.calendartable tr th { font-size: 14px; }
  table.calendartable .selectclassroom { padding-left: 0px; }
  table.calendartable tr th, table.calendartable tr td { padding: 5px 5px; }
  table.calendartable tr td { font-size: 12px; height: 100px; vertical-align: text-top; padding-top: 24px; text-align: left; }
  table.calendartable.schooltimetable tr td { font-size: 12px; height: initial; vertical-align: middle; padding-top: initial; text-align: center; }
  table.calendartable .squarebtnstyle3 { padding: 2px 2px; font-size: 12px; margin: 2px; } }
@media (max-width: 480px) { .calenderrightarrow { margin-top: 10px; } }
.loginoutbox { padding: 40px; }
@media (max-width: 960px) { .loginoutbox { padding: 20px 0px; } }

.loginflexsec { display: flex; flex-wrap: wrap; }
.loginflexsec .leftbox { width: 60%; }
@media (max-width: 960px) { .loginflexsec .leftbox { width: 100%; } }
.loginflexsec .rightbox { width: 40%; padding-left: 90px; }
@media (max-width: 960px) { .loginflexsec .rightbox { display: none; padding-left: 0; } }

.calendae_date_out { min-height: 100px; }

.calendae_date { position: absolute; top: 5px; left: 5px; }

.selectclassroom { padding-left: 15px; }

.cartstep { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; margin-bottom: 40px; }
.cartstep .onestep.active .numcircle .numcirclein { background: url(../images/cartstep_active.png) no-repeat; width: 68px; height: 74px; top: 0px; }
.cartstep .onestep.active .numcircle .step { display: block; }
.cartstep .onestep.active .dot { background-color: #91af3c; }
.cartstep .onestep .numcircle { display: flex; justify-content: center; margin-bottom: 6px; height: 74px; }
.cartstep .onestep .numcircle .numcirclein { background: url(../images/cartstep.png) no-repeat; width: 53px; height: 58px; text-align: center; top: 16px; }
.cartstep .onestep .numcircle .num { font-size: 28px; font-weight: 900; color: #fff; line-height: 1; padding: 10px 0 4px 0; }
.cartstep .onestep .numcircle .step { font-size: 12px; color: #fff; text-align: center; line-height: 1; display: none; }
.cartstep .onestep .dotout { display: flex; flex-wrap: wrap; justify-content: center; }
.cartstep .onestep .dotout:before { height: 1px; width: 100%; background: #e6e6e6; position: absolute; content: ""; top: 5px; }
.cartstep .onestep .dot { width: 12px; height: 12px; border-radius: 100%; background-color: #e4e4e4; }
.cartstep .onestep .steptxt { font-size: 13px; color: #333333; text-align: center; padding: 10px 20px; }

.cartproduct { display: flex; flex-wrap: wrap; align-items: center; }
.cartproduct .photo { padding: 0 10px; }
.cartproduct .photo img { max-width: 60px; }
.cartproduct .txt { padding: 0 10px; }
.cartproduct .txt .t1 { font-size: 16px; font-weight: bold; margin-bottom: 0px; }
.cartproduct .txt .t2 { font-size: 14px; color: #4f4f4f; }

.svprice .svcircle { width: 22px; height: 22px; border-radius: 100%; background: #a1c242; color: #fff; padding: 2px; margin-right: 4px; font-size: 12px; display: inline-block; }
.svprice .sv { color: #a1c242; }

.lightyellowtdcenter .txt1 { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; }
.lightyellowtdcenter .txt1 .svprice { margin-left: 5px; }

.cart_complete_sec .cartcomplete_img { margin-bottom: 10px; }
.cart_complete_sec p { margin-bottom: 10px; }

.classrentalth { width: 70px; }
@media (max-width: 768px) { .classrentalth { width: 30px; } }

@media (max-width: 767px) { table.calendartable.classrentaltable tr th, table.calendartable.classrentaltable tr td { display: none; }
  table.calendartable.classrentaltable tr th:nth-child(6), table.calendartable.classrentaltable tr th:nth-child(7), table.calendartable.classrentaltable tr td:nth-child(6), table.calendartable.classrentaltable tr td:nth-child(7) { display: table-cell; } }
.blackhbg { display: flex; flex-wrap: wrap; padding: 0 3px; }
.blackhbg .oneset { margin: 5px 1px 5px 0; }
.blackhbg .oneset .onesetin { background-color: #efefef; height: 100%; text-align: center; }
.blackhbg .oneset .onesetin .htxt { color: #fff; font-size: 16px; font-weight: bold; background-color: #666666; padding: 8px 13px; }
.blackhbg .oneset .onesetin .people { color: #000; padding: 8px 15px; }

.bonus_detailsbox { display: flex; flex-wrap: wrap; }
.bonus_detailsbox .oneset { padding: 5px; width: calc(100% / 3); }
@media (max-width: 1200px) { .bonus_detailsbox .oneset { width: 100%; } }
.bonus_detailsbox .oneset .onesetin { border-radius: 3px; border: 1px solid #b7b7b7; padding: 30px 20px; height: 100%; }
.bonus_detailsbox .oneset .onesetin .bonuslist { display: flex; flex-wrap: wrap; margin-bottom: 8px; justify-content: space-between; align-items: center; color: #000; }
.bonus_detailsbox .oneset .onesetin .bonuslist:hover { background-color: yellow; }
.bonus_detailsbox .oneset .onesetin .bonuslist .t1 { font-weight: bold; font-size: 16px; }
.bonus_detailsbox .oneset .onesetin .bonuslist .t1.normalweight { font-weight: normal; }

.graybgcontent { background-color: #efefef; padding: 8px 10px; color: #000000; }

.smallcalender { display: flex; flex-wrap: wrap; }
.smallcalender .oneset { width: calc(100% / 4); padding: 15px; }
@media (max-width: 1200px) { .smallcalender .oneset { width: calc(100% / 2); } }
@media (max-width: 480px) { .smallcalender .oneset { padding: 10px 0px; width: calc(100% / 1); } }
.smallcalender .oneset .square_border { width: 14px; height: 14px; border-radius: 3px; }

table.smallcalendertable { width: 100%; font-size: 13px; }
table.smallcalendertable tr td { padding: 4px 2px; text-align: center; }

.bgsquareradius { padding: 0px; border-radius: 3px; }

.drawbox { padding: 5px 10px; background-color: #dbdbdb; }
.drawbox .inputset { margin-right: 40px; }
.drawbox .inputset .t1 { margin-right: 10px; }
.drawbox .whitecircle { background-color: #fff; color: #666666; border-radius: 50%; width: 30px; height: 30px; line-height: 30px; text-align: center; margin: 5px 8px; cursor: pointer; }
.drawbox .whitecircle.drag { cursor: all-scroll; }
@media (max-width: 768px) { .drawbox .whitecircle.drag { display: none; } }
.drawbox .whitecircle:hover { background-color: #029354; color: #fff; }

.dragsec table.formtable tbody tr td { padding: 5px 10px; }

.dragsec .oneset { margin-bottom: 2px; }

.tablechart2 { width: 100%; margin-top: 30px; }
.tablechart2 table { width: 100%; color: #444444; }
.tablechart2 table tbody th, .tablechart2 table tbody td { font-size: 13px; padding: 5px; text-align: center; border: 1px solid #eae8e8; }
.tablechart2 table tbody th { color: #fff; background: #029354; }
.tablechart2 table tbody tr:nth-child(odd) td { background-color: #ffffff; }
.tablechart2 table tbody tr td { background-color: #f0f0f0; }

.innerban { width: 100%; padding-top: 155px; }
@media (max-width: 1100px) { .innerban { padding-top: 105px; } }
@media (max-width: 768px) { .innerban { padding-top: 124px; } }
.innerban img { width: 100%; }

@media (max-width: 480px) { .innerban { display: none; } }
.breadcrumbs { padding: 0; background: url(../images/bread_bg.jpg) repeat; overflow: hidden; width: 100%; }
.breadcrumbs:before { content: url(../images/bread_shadow.png); width: 100%; height: 4px; display: block; position: absolute; z-index: 1; left: 50%; transform: translate(-50%, 0); top: -13px; }
@media (max-width: 480px) { .breadcrumbs { padding: 10px 0px; } }
.breadcrumbs .wrapper { padding: 15px 40px; }
.breadcrumbs .road { font-size: 15px; font-weight: 100; color: #888888; display: flex; flex-wrap: wrap; align-items: center; }
.breadcrumbs .road img { vertical-align: sub; }
.breadcrumbs .road .spacer { color: #bbbbbb; font-size: 14px; margin: 0 8px; }

@media (max-width: 640px) { .breadcrumbs .wrapper { padding: 5px 15px; } }
@media (max-width: 480px) { .breadcrumbs { margin-top: 130px; }
  .breadcrumbs .road { font-size: 13px; } }
.innersec .wrapper .innertitle { color: #5b4231; font-size: 40px; font-weight: 100; padding-top: 80px; }
.innersec .wrapper .innertitle.borderbottom { border-bottom: 1px solid #ebebeb; }
.innersec .wrapper .innertitle::first-letter { font-weight: bold; letter-spacing: 0.02em; }

.innermenu { margin-bottom: 20px; margin-top: 20px; border-bottom: 1px solid #ebebeb; display: flex; justify-content: center; align-items: center; }
.innermenu ul.innermenuslick { display: flex; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch; padding-bottom: 16px; }
.innermenu ul.innermenuslick::-webkit-scrollbar { width: 0px; height: 5px; }
@media (max-width: 768px) { .innermenu ul.innermenuslick::-webkit-scrollbar { height: 2px; } }
.innermenu ul.innermenuslick li { list-style-type: none; }
.innermenu ul.innermenuslick li:last-child a:before { display: none; }
.innermenu ul.innermenuslick li a { font-size: 17px; color: #888888; letter-spacing: 0.05em; padding: 7px 25px; display: inline-block; white-space: nowrap; }
.innermenu ul.innermenuslick li a:before { content: ""; display: block; position: absolute; width: 1px; height: 40px; right: 0; top: 0; /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f1f1f1+0,d0d0d0+49,f1f1f1+100 */ background: #f1f1f1; /* Old browsers */ background: -moz-linear-gradient(left, #f1f1f1 0%, #d0d0d0 49%, #f1f1f1 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(left, #f1f1f1 0%, #d0d0d0 49%, #f1f1f1 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, #f1f1f1 0%, #d0d0d0 49%, #f1f1f1 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1f1f1', endColorstr='#f1f1f1',GradientType=1 ); /* IE6-9 */ }
.innermenu ul.innermenuslick li a.active, .innermenu ul.innermenuslick li a:hover { color: #5a3a24; }
.innermenu ul.innermenuslick li a.active:after, .innermenu ul.innermenuslick li a:hover:after { content: ""; width: 25px; height: 1px; background: #5a3a24; position: absolute; display: block; bottom: 0; left: 50%; transform: translate(-50%, 0); }
.innermenu .arrow_wrap { padding: 0 10px; font-size: 18px; }
.innermenu .arrow_wrap.style1 { margin-left: 10px; }
.innermenu .arrow_wrap a.arrow { color: #746052; }
.innermenu .arrow_wrap a.arrow.disabled { color: #cccccc; }

.innerspace { padding-top: 30px; padding-bottom: 40px; }

.newssec { display: flex; flex-wrap: wrap; }
.newssec .newslist { width: 70%; padding-right: 50px; }
.newssec .newslist .oneset { margin-bottom: 40px; padding-left: 20px; }
.newssec .newslist .oneset:hover:before { background: #389074; }
.newssec .newslist .oneset:before { content: ""; width: 6px; background: #dddddd; height: 42px; position: absolute; display: block; top: 4px; left: 0; transition: 0.3s; }
.newssec .newslist .oneset .newstitle { margin-bottom: 5px; }
.newssec .newslist .oneset .newstitle .txt { font-size: 18px; color: #333333; margin-right: 5px; letter-spacing: 0.05em; }
.newssec .newslist .oneset .newstitle .txt:hover { text-decoration: underline; }
.newssec .newslist .oneset .newstitle .newtag { font-size: 13px; color: #fff; display: inline-block; text-transform: uppercase; letter-spacing: 0.03em; background-color: #ec5151; padding: 2px 14px; border-radius: 12px; font-family: roboto, sans-serif; font-weight: 500; font-style: normal; vertical-align: text-bottom; }
.newssec .newslist .oneset .botbox { font-size: 14px; color: #555555; letter-spacing: 0.02em; display: flex; flex-wrap: wrap; }
.newssec .newslist .oneset .botbox .spacer { color: #999999; font-weight: 100; font-size: 13px; padding: 0 10px; }
.newssec .newsphotoblock { width: 30%; }
.newssec .newsphotoblock .oneset { margin-bottom: 30px; }
.newssec .newsphotoblock .oneset .onesetin { display: block; overflow: hidden; }
.newssec .newsphotoblock .oneset .onesetin:hover img { transform: scale(1.1); }

@media (max-width: 540px) { .newssec .newslist { width: 100%; padding-right: 0px; }
  .newssec .newsphotoblock { width: 100%; }
  .newssec .newslist .oneset .newstitle .txt { font-size: 16px; }
  .newssec .newslist .oneset .newstitle .newtag { font-size: 12px; }
  .innersec .wrapper .innertitle { padding-top: 30px; font-size: 34px; }
  .innermenu { margin-bottom: 30px; }
  .innerspace { padding-top: 20px; padding-bottom: 20px; }
  .innermenu ul.innermenuslick li a { font-size: 15px; padding: 7px 15px; } }
.newsdetailsec .nd_date { font-size: 15px; color: #aaaaaa; }
.newsdetailsec .nd_date .fa-solid { font-size: 14px; margin-right: 5px; }
.newsdetailsec .nd_title { font-size: 25px; font-weight: bold; color: #333333; margin-bottom: 35px; }
#location_content img { width: auto !important; height: auto !important; }

.nd_bottombox { background-color: #f5f5f5; width: 100%; padding: 40px 0; }
.nd_bottombox .wrapper { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; }
.nd_bottombox .nd_otherlist { letter-spacing: 0.03em; display: block; width: calc(50% - 130px); }
.nd_bottombox .nd_otherlist:hover .onelsit .box1 { color: #333; }
.nd_bottombox .nd_otherlist:hover .onelsit .box1 .icon { color: #eb5d28; }
.nd_bottombox .nd_otherlist.next { text-align: right; }
.nd_bottombox .nd_otherlist.next .onelsit .box1 .icon { margin-right: 0px; margin-left: 5px; }
.nd_bottombox .nd_otherlist.next .onelsit .box2 { padding-left: 0px; padding-right: 15px; }
.nd_bottombox .nd_otherlist .onelsit .box1 { margin-bottom: 8px; color: #888888; font-size: 16px; display: flex; flex-wrap: wrap; align-items: center; }
.nd_bottombox .nd_otherlist .onelsit .box1 .icon { margin-right: 5px; flex-shrink: 0; }
.nd_bottombox .nd_otherlist .onelsit .box1 .txt { flex: 1; }
.nd_bottombox .nd_otherlist .onelsit .box2 { color: #aaaaaa; font-size: 14px; padding-left: 15px; }
.nd_bottombox .nd_backlist .btnstyle { display: inline-block; color: #fff; font-size: 17px; padding: 8px 50px; }
.nd_bottombox .nd_backlist .btnstyle .fa-solid { margin-right: 5px; }

@media (max-width: 767px) { .nd_bottombox .nd_backlist .btnstyle { padding: 8px 20px; font-size: 14px; }
  .nd_bottombox .nd_otherlist { letter-spacing: 0em; width: calc(50% - 70px); }
  .nd_bottombox .nd_otherlist .onelsit .box1 { font-size: 14px; }
  .nd_bottombox .nd_otherlist .onelsit .box2 { font-size: 12px; } }
@media (max-width: 480px) { .nd_bottombox .nd_backlist .btnstyle { padding: 8px 12px; font-size: 12px; }
  .nd_bottombox .nd_otherlist { letter-spacing: 0em; width: calc(50% - 55px); }
  .nd_bottombox .nd_otherlist .onelsit .box1 { font-size: 14px; }
  .nd_bottombox .nd_otherlist .onelsit .box2 { font-size: 12px; } }
.aboutlist .oneset { display: flex; flex-wrap: wrap; margin-bottom: 50px; }
.aboutlist .oneset:nth-child(even) { flex-direction: row-reverse; }
.aboutlist .oneset:nth-child(even) .photo { padding-right: 0px; padding-left: 40px; }
.aboutlist .oneset:nth-child(even) .photo img { border-radius: 140px 140px 140px 5px; }
.aboutlist .oneset .photo { width: 50%; padding-right: 40px; }
.aboutlist .oneset .photo img { width: 100%; border-radius: 140px 140px 5px 140px; }
.aboutlist .oneset .con { width: 50%; padding-top: 20px; }
.aboutlist .oneset .con .box1 { font-size: 23px; font-weight: bold; color: #333333; margin-bottom: 20px; letter-spacing: 0.05em; }
.aboutlist .oneset .con .box2 { font-size: 17px; letter-spacing: 0.02em; margin-bottom: 30px; line-height: calc(30 / 17); }
.aboutlist .oneset .con .box3 { display: flex; flex-wrap: wrap; border-top: 1px solid #ebebeb; border-bottom: 1px solid #ebebeb; padding-top: 10px; padding-bottom: 10px; }
.aboutlist .oneset .con .box3 .onelink { letter-spacing: 0.02em; font-size: 15px; color: #999999; font-weight: bold; }
.aboutlist .oneset .con .box3 .onelink::after { content: "｜"; display: inline-block; margin: 0 8px; }
.aboutlist .oneset .con .box3 .onelink:hover { color: #ed5310; }
.aboutlist .oneset .con .box3 .spacer { font-size: 15px; color: #cccccc; padding: 0 15px; }

@media (max-width: 640px) { .aboutlist .oneset .photo { width: 100%; padding-right: 0px; }
  .aboutlist .oneset .con { width: 100%; margin-top: 20px; }
  .aboutlist .oneset .con .box1 { margin-bottom: 10px; }
  .aboutlist .oneset:nth-child(even) .photo { padding-left: 0px; }
  .aboutlist .oneset .photo img { border-radius: 60px 60px 5px 60px; }
  .aboutlist .oneset:nth-child(even) .photo img { border-radius: 60px 60px 60px 5px; } }
.innersubout { display: flex; justify-content: center; align-items: center; margin-bottom: 12px; }

.innersubtitle { padding-bottom: 15px; display: flex; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch; }
.innersubtitle::-webkit-scrollbar { width: 0px; height: 5px; }
@media (max-width: 768px) { .innersubtitle::-webkit-scrollbar { height: 2px; } }
.innersubtitle li { list-style: none; font-size: 17px; letter-spacing: 0.05em; color: #888888; white-space: nowrap; }
@media (max-width: 540px) { .innersubtitle li { font-size: 15px; } }
.innersubtitle li:last-child::after { display: none; }
.innersubtitle li::after { content: "．"; display: inline-block; margin: 0 8px; }
.innersubtitle li a.active, .innersubtitle li a:hover { color: #333333; }
.innersubtitle li .dotspacer { margin: 0 10px; }

.innersearch_sec { display: flex; flex-wrap: wrap; justify-content: flex-end; font-size: 15px; }
.innersearch_sec .box1 { margin-right: 10px; }
.innersearch_sec .box1 form .innersearchfilter { display: flex; flex-wrap: wrap; align-items: center; }
.innersearch_sec .box1 form .innersearchfilter .inputstyle.w150 { border: 1px solid #dddddd; }
.innersearch_sec .box1 form .innersearchfilter select.inputstyle { border-radius: 5px 0 0 5px; }
.innersearch_sec .box1 form .innersearchfilter .innersearchtxt { border: 1px solid #dddddd; border-left: none; display: flex; flex-wrap: wrap; border-radius: 0 5px 5px 0; }
.innersearch_sec .box1 form .innersearchfilter .innersearchtxt .inputstyle.w200 { border: none; padding: 6px 10px; }
.innersearch_sec .box1 form .innersearchfilter .innersearchtxt button { background: none; border: none; }
.innersearch_sec .box2 .inputstyle { border: 1px solid #dddddd; padding: 8px 10px; padding-right: 20px; border-radius: 5px; }

@media (max-width: 768px) { .innersearch_sec { justify-content: center; } }
@media (max-width: 480px) { .innersearch_sec { display: block; }
  .innersearch_sec .box1 form .innersearchfilter .inputstyle.w150 { width: 100%; border-radius: 5px; margin-bottom: 10px; }
  .innersearch_sec .box1 form .innersearchfilter .innersearchtxt { width: 100%; border-radius: 5px; }
  .innersearch_sec .box1 form .innersearchfilter .innersearchtxt .inputstyle.w200 { width: calc(100% - 35px); }
  .innersearch_sec .box1 form .innersearchfilter .innersearchtxt { border-left: 1px solid #dddddd; margin-bottom: 10px; }
  .innersearch_sec .box1 { margin-right: 0px; } }
.honor_sec { display: flex; flex-wrap: wrap; }
.honor_sec .oneset { width: 25%; padding: 18px; margin-bottom: 10px; }
.honor_sec .oneset .onesetin .photo { margin-bottom: 15px; }
.honor_sec .oneset .onesetin .photo .pic img { border-radius: 50px 50px 10px 50px; }
.honor_sec .oneset .onesetin .name { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; }
.honor_sec .oneset .onesetin .name .t1 { font-size: 20px; font-weight: bold; letter-spacing: 0.1em; margin-right: 8px; }
.honor_sec .oneset .onesetin .name .t2 { color: #999999; font-size: 13px; }

@media (max-width: 960px) { .honor_sec .oneset { width: calc(100% / 3); } }
@media (max-width: 640px) { .honor_sec .oneset { width: calc(100% / 2); padding: 8px; } }
@media (max-width: 480px) { .honor_sec .oneset .onesetin .name .t1 { margin-right: 0px; width: 100%; text-align: center; } }
.enho_sec .enho_sec_top { display: flex; flex-wrap: wrap; }
.enho_sec .enho_sec_top .leftbox { width: 50%; }
.enho_sec .enho_sec_top .leftbox .wrapper { padding: 0 38px 0 67px; height: 100%; }
.enho_sec .enho_sec_top .leftbox .wrapper .icondate { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; }
.enho_sec .enho_sec_top .leftbox .wrapper .icondate .icon .pic {/* background-color: #7e6c5f; *//* padding: 20px 15px; */text-align: center;}
.enho_sec .enho_sec_top .leftbox .wrapper .icondate .icon .txt { text-align: center; font-size: 18px; font-weight: bold; margin-top: 10px; letter-spacing: 0.03em; }
.enho_sec .enho_sec_top .leftbox .wrapper .icondate .date { font-size: 14px; font-family: roboto, sans-serif; font-weight: 700; font-style: normal; text-align: right; }
.enho_sec .enho_sec_top .leftbox .wrapper .name { display: flex; flex-wrap: wrap; font-size: 50px; font-family: source-han-sans-traditional, sans-serif; font-weight: 400; font-style: normal; letter-spacing: 0.1em; height: calc(100% - 150px); align-items: center; }
.enho_sec .enho_sec_top .leftbox .wrapper .name .spacer { font-size: 45px; color: #999999; margin: 0 20px; }
.enho_sec .enho_sec_top .rightbox { width: 50%; }
.enho_sec .enho_sec_top .rightbox .photo { width: 100%; height: 0; text-align: center; position: relative; display: block; overflow: hidden; padding-bottom: 100%; }
.enho_sec .enho_sec_top .rightbox .photo img { width: 100%; max-width: 100%; max-height: 100%; width: 100%; transition: 0.5s; position: absolute; display: block; margin: auto; top: 0; left: 0; right: 0; bottom: 0; }
.enho_sec .enho_sec_bot { display: flex; flex-wrap: wrap; padding-left: 68px; margin-top: -100px; }
.enho_sec .enho_sec_bot .promotion { width: calc((852/1333)*100%); }
.enho_sec .enho_sec_bot .promotion .title { font-size: 20px; color: #69594d; font-family: roboto, sans-serif; font-weight: 900; font-style: normal; text-transform: uppercase; margin-bottom: 10px; line-height: 1; }
.enho_sec .enho_sec_bot .promotion .title .t1 { margin-right: 5px; }
.enho_sec .enho_sec_bot .promotion .title .t2 { display: flex; flex-wrap: wrap; align-items: center; }
.enho_sec .enho_sec_bot .promotion .title .t2:after { content: ""; flex: 1; display: block; width: 100%; height: 1px; background-color: #e7dfd9; }
.enho_sec .enho_sec_bot .promotion .process { padding: 25px 30px 70px 30px; background-color: #7e6c5f; }
.enho_sec .enho_sec_bot .promotion .process ul { display: flex; flex-wrap: wrap; }
.enho_sec .enho_sec_bot .promotion .process ul li { list-style: none; color: #fff; font-size: 17px; letter-spacing: 0; width: 25%; padding: 5px; }
.enho_sec .enho_sec_bot .recommon { flex: 1; padding: 36px 30px; color: #6d5b55; font-size: 17px; letter-spacing: 0; display: flex; align-items: self-end; }

@media (max-width: 1280px) { .enho_sec .enho_sec_top .leftbox .wrapper .name { font-size: 36px; }
  .enho_sec .enho_sec_top .leftbox .wrapper .name .spacer { font-size: 30px; }
  .enho_sec .enho_sec_bot .promotion .process ul li { width: calc(100% / 3); }
  .enho_sec .enho_sec_bot .promotion .process { padding: 25px 30px 40px 30px; } }
@media (max-width: 1024px) { .enho_sec .enho_sec_top .leftbox .wrapper .name { font-size: 24px; }
  .enho_sec .enho_sec_bot .promotion .process ul li { width: calc(100% / 2); }
  .enho_sec .enho_sec_bot .promotion .process { padding: 25px 20px 40px 20px; }
  .enho_sec .enho_sec_top .leftbox .wrapper .name .spacer { font-size: 20px; }
  .enho_sec .enho_sec_bot { padding-left: 20px; margin-top: 0; }
  .enho_sec .enho_sec_top .leftbox .wrapper { padding: 0 20px 0 20px; }
  .enho_sec .enho_sec_bot .recommon { padding: 40px 20px 20px 20px; align-items: flex-start; } }
@media (max-width: 768px) { .enho_sec .enho_sec_bot .promotion .process ul li { font-size: 12px; }
  .enho_sec .enho_sec_bot .recommon { font-size: 12px; } }
@media (max-width: 540px) { .enho_sec .enho_sec_top .leftbox { width: 100%; }
  .enho_sec .enho_sec_top .rightbox { width: 100%; }
  .enho_sec .enho_sec_top .leftbox .wrapper .name { height: initial; margin: 10px 0; }
  .enho_sec .enho_sec_bot .promotion { width: 100%; margin-top: 10px; }
  .enho_sec .enho_sec_bot { padding-left: 10px; padding-right: 10px; margin-top: 10px; }
  .enho_sec .enho_sec_bot .recommon { padding: 20px 10px 20px 10px; }
  .iziModal.mobile_close .iziModal-button-close { background: url(../images/close_gray.png) no-repeat 50% 50%; } }
.ingtxt { margin-bottom: 10px; }
.ingtxt .icon { font-size: 18px; color: #228058; margin-right: 5px; }
.ingtxt .t1 { font-size: 15px; font-weight: bold; }
.ingtxt .spacer { font-size: 14px; font-weight: bold; color: #999999; margin: 0 5px; }
.ingtxt .t2 { color: #228058; font-size: 13px; }
.ingtxt.style2 { border-bottom: 1px solid #ebebeb; padding-bottom: 15px; margin-bottom: 15px; }
.ingtxt.style2 .icon { font-size: 25px; }
.ingtxt.style2 .t1 { font-size: 18px; }
.ingtxt.style2 .spacer { font-size: 15px; }
.ingtxt.style2 .t2 { font-size: 14px; }

.prodetail { display: flex; flex-wrap: wrap; margin-top: 50px; margin-bottom: 50px; }
.prodetail .box1 { width: 35%; padding-top: 25px; }
.prodetail .box1 img { border-radius: 6.5px; }
.prodetail .box2 { width: 65%; padding: 0 0 0 35px; }
.prodetail .box2 .protitle { font-size: 28px; font-weight: bold; color: #333333; margin-bottom: 5px; }
.prodetail .box2 .subt { font-size: 14px; color: #666666; padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid #dddddd; }
.prodetail .box2 .subt .oneline { display: inline-block; }
.prodetail .box2 .subt .oneline:last-child::after { display: none; }
.prodetail .box2 .subt .oneline::after { content: " | "; color: #cccccc; display: inline-block; margin: 0 5px; }
.prodetail .box2 .pro_ing .ingcon { font-size: 15px; margin-bottom: 15px; }
.prodetail .box2 .pro_ing form .pronumprice { display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 15px; }
.prodetail .box2 .pro_ing form .pronumprice .inputstyle.w100 { margin-right: 15px; }
.prodetail .box2 .pro_ing form .pronumprice .price { color: #2f7d64; }
.prodetail .box2 .pro_ing form .pronumprice .price .set { display: inline-block; }
.prodetail .box2 .pro_ing form .pronumprice .price .set .orange_e4531a { font-family: roboto, sans-serif; margin-right: 5px; }
.prodetail .box2 .pro_ing form .pronumprice .price .spacer { margin: 0 10px; }
.prodetail .box2 .pro_ing form .certi_cartbtn { display: flex; flex-wrap: wrap; align-items: center; }
.prodetail .box2 .pro_ing form .certi_cartbtn .certibox { display: flex; flex-wrap: wrap; align-items: center; margin-right: 15px; padding: 10px 0; }
.prodetail .box2 .pro_ing form .certi_cartbtn .certibox .one { margin-right: 10px; }
.prodetail .box2 .pro_ing form .certi_cartbtn .certibox .one img { max-width: 60px; }
.prodetail .box2 .pro_ing form .certi_cartbtn .cartbtn { padding: 10px 0; }
.prodetail .box2 .pro_ing form .certi_cartbtn .cartbtn .prodetailcartbtn { color: #fff; font-size: 16px; font-weight: bold; background-color: #ed7035; border-radius: 3px; border: none; padding: 13px 40px; letter-spacing: 0.05em; }

@media (max-width: 768px) { .prodetail { margin-top: 0; } }
@media (max-width: 640px) { .prodetail .box1 { width: 100%; }
  .prodetail .box2 { width: 100%; padding: 0; padding-top: 20px; } }
ul.diamondlist li { list-style: none; font-size: 17px; padding-left: 15px; margin-bottom: 10px; display: flex; letter-spacing: 0.03em; line-height: calc(35 / 17); }
ul.diamondlist li:before { content: "◆"; color: #7e6c5f; display: block; flex-shrink: 0; margin-right: 5px; }

.multilovesec .topsec { display: flex; align-items: center; margin-bottom: 60px; background: url(../images/multilove_bg.png) no-repeat bottom; padding-top: 30px; }
.multilovesec .topsec .leader { width: calc((322 / 1400)*100%); text-align: right; padding-right: 38px; }
.multilovesec .topsec .leader img { max-width: 157px; }
.multilovesec .topsec .rightcon .t1 { font-size: 30px; font-weight: bold; color: #333333; margin-bottom: 30px; }
.multilovesec .topsec .rightcon .t2 { font-size: 16px; letter-spacing: 0.05em; line-height: calc(27/16); color: #444444; margin-bottom: 20px; }
.multilovesec .topsec .rightcon .sign { max-width: 90px; }

@media (max-width: 960px) { .multilovesec .topsec { background-size: contain; }
  .multilovesec .topsec .rightcon .t1 { font-size: 30px; font-weight: bold; color: #333333; margin-bottom: 15px; } }
@media (max-width: 800px) { .multilovesec .topsec .leader img { width: 100%; }
  .multilovesec .topsec { align-items: end; }
  .multilovesec .topsec .leader { width: 200px; padding-right: 20px; } }
@media (max-width: 640px) { .multilovesec .topsec .leader { width: 130px; flex-shrink: 0; padding-right: 10px; } }
.qalist { margin-bottom: 20px; }
.qalist .oneset { border-bottom: 1px dotted #d7d7d7; }
.qalist .oneset .qblock { font-size: 17px; color: #333333; letter-spacing: 0.03em; display: flex; flex-wrap: wrap; padding-top: 15px; padding-bottom: 15px; cursor: pointer; }
.qalist .oneset .qblock:hover .txt { text-decoration: underline; }
.qalist .oneset .qblock .icon { color: #705d4f; font-size: 24px; flex-shrink: 0; margin-right: 10px; line-height: 1.2; }
.qalist .oneset .qblock .txt { flex: 1; }
.qalist .oneset .anblockout { display: none; }
.qalist .oneset .anblock { display: flex; background: #f6f6f6; padding: 25px; }
.qalist .oneset .anblock .icon { color: #eb5d28; font-size: 24px; flex-shrink: 0; margin-right: 10px; line-height: 1.2; }
.qalist .oneset .anblock .txt { font-size: 16px; color: #5f4b3d; letter-spacing: 0.03em; line-height: calc(27 / 16); }
.qalist .oneset .anblock .txt ol { padding-left: 20px; }

.contactsec { margin-top: 30px; }
.contactsec .contact_txt { display: flex; font-size: 16px; font-weight: bold; color: #715f52; margin-bottom: 20px; }
.contactsec .contact_txt .icon { flex-shrink: 0; }
.contactsec .contact_txt .icon .fa-regular { margin-right: 10px; }
.contactsec .contact_txt .txt { flex: 1; letter-spacing: 0.02em; }
.contactsec .contact_img { width: 100%; }
.contactsec .contact_img img { width: 100%; }

.contactform { display: flex; flex-wrap: wrap; margin-top: 60px; }
@media (max-width: 640px) { .contactform { margin-top: 30px; } }
.contactform .oneset { width: 100%; padding: 8px; display: flex; flex-wrap: wrap; align-items: center; }
@media (max-width: 640px) { .contactform .oneset { display: block; } }
@media (max-width: 480px) { .contactform .oneset { padding: 10px 0px; } }
.contactform .oneset.w50 { width: 50%; }
@media (max-width: 800px) { .contactform .oneset.w50 { width: 100%; } }
.contactform .oneset.w70 { width: 70%; }
@media (max-width: 800px) { .contactform .oneset.w70 { width: 100%; } }
.contactform .oneset .t1 { flex-shrink: 0; width: 100px; font-size: 17px; padding-right: 20px; }
.contactform .oneset .t1.initialw { width: initial; }
@media (max-width: 800px) { .contactform .oneset .t1.initialw { width: 100px; } }
@media (max-width: 640px) { .contactform .oneset .t1.initialw { width: 100%; } }
.contactform .oneset .fillbox { flex: 1; }
.contactform .oneset .fillbox.flex { display: flex; flex-wrap: wrap; align-items: center; }
@media (max-width: 640px) { .contactform .oneset .fillbox.flex { display: block; } }
.contactform .oneset .fillbox.flex .txt { margin-left: 10px; color: #888888; font-size: 15px; }
.contactform .oneset .fillbox .inputstyle { width: 100%; flex: 1; padding: 10px; }

.contactformbottom { padding-top: 40px; padding-bottom: 40px; width: 100%; }
.contactformbottom .recaptch { display: flex; justify-content: center; }
.contactformbottom .btnbox { display: flex; justify-content: center; padding-top: 30px; }
.contactformbottom .btnbox .squarebtnstyle { background-color: #999999; color: #fff; font-weight: bold; font-size: 16px; padding: 15px 60px; border-radius: 0; letter-spacing: 0.05em; }
.contactformbottom .btnbox .squarebtnstyle:hover { transform: scale(1.05); }
.contactformbottom .btnbox .squarebtnstyle.deepgarybg { background-color: #029354; }
.contactformbottom .btnbox .squarebtnstyle:first-child { margin-right: 10px; }

.searchresultsec .searchre_txt { font-size: 16px; font-weight: bold; margin-bottom: 30px; }
.searchresultsec .searchre_txt .fa-solid { color: #eb5d28; }
.searchresultsec .search_pro { border: 1px solid #e8e8e8; padding: 50px 60px; }
.searchresultsec .search_pro .searchp_nameblock { position: absolute; color: #fff; background: #6d594d; font-size: 15px; font-weight: bold; padding: 10px 15px; left: 0; top: 40px; }
.searchresultsec .search_pro .searchp_block .ipboxs { padding: 0 80px; }
.searchresultsec .search_pro .searchp_block .ipboxs .slick-prev:before, .searchresultsec .search_pro .searchp_block .ipboxs .slick-next:before { font-size: 25px; color: #6d594d; }
.searchresultsec .search_pro .searchp_block .ipboxs .slick-prev { left: 0; }
.searchresultsec .search_pro .searchp_block .ipboxs .slick-next { right: 0; }
.searchresultsec .search_pro .searchp_block .searchp_bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding-top: 15px; border-top: 1px solid #e8e8e8; }
.searchresultsec .search_pro .searchp_block .searchp_bottom .total_num { color: #888888; font-size: 16px; letter-spacing: 0.05em; }
.searchresultsec .search_pro .searchp_block .searchp_bottom .viewall { color: #f85a1f; font-size: 15px; letter-spacing: 0.02em; font-family: roboto, sans-serif; font-weight: 500; font-style: normal; }
.searchresultsec .search_pro .searchp_block .searchp_bottom .viewall a { display: inline-block; }
.searchresultsec .search_pro .searchp_block .searchp_bottom .viewall a:hover { transform: scale(1.05); }

@media (max-width: 1024px) { .searchresultsec .search_pro .searchp_block .ipboxs { padding: 0 30px; } }
@media (max-width: 767px) { .searchresultsec .search_pro { padding: 50px 30px; }
  .searchresultsec .search_pro .searchp_nameblock { top: 10px; } }
@media (max-width: 480px) { .searchresultsec .search_pro { padding: 50px 15px 20px; } }
.researchsec { margin-top: 30px; }
.researchsec .oneset { width: 100%; padding: 20px 0; }
.researchsec .oneset .onesetin { display: block; background: #fff; border: 1px solid #eaeaea; display: flex; flex-wrap: wrap; }
.researchsec .oneset .onesetin .topbox { width: 20%; padding: 0px; }
.researchsec .oneset .onesetin .topbox .photo { width: 100%; }
.researchsec .oneset .onesetin .topbox .photo .pic { width: 100%; }
.researchsec .oneset .onesetin .topbox .photo .pic img { width: 100%; }
.researchsec .oneset .onesetin .bottxt .t1 { font-size: 16px; line-height: calc(20/16); margin-bottom: 10px; letter-spacing: 0.05em; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; line-height: 20px; max-height: 20px; }
.researchsec .oneset .onesetin .bottxt .t2 { line-height: calc(20/14); color: #666666; font-size: 14px; letter-spacing: 0.03em; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-height: 20px; max-height: 60px; }
.researchsec .oneset .onesetin .botdate { width: 80%; padding: 20px 30px; }
.researchsec .oneset .onesetin .botdate .class { border-top: 1px solid #eceaea; width: 100%; font-size: 12px; letter-spacing: 0.03em; color: #999999; text-transform: uppercase; padding: 10px 0 0 0; font-weight: bold; margin-top: 20px; }
.researchsec .oneset .onesetin .botdate .class i { margin-right: 5px; color: #ff301b; }

@media (max-width: 1440px) { .researchsec .oneset .onesetin .topbox { width: 275px; flex-shrink: 0; }
  .researchsec .oneset .onesetin .botdate { flex: 1; } }
@media (max-width: 640px) { .researchsec .oneset .onesetin .topbox { width: 150px; flex-shrink: 0; padding: 10px; }
  .researchsec .oneset .onesetin .botdate .class { margin-top: 10px; }
  .researchsec .oneset .onesetin .botdate { padding: 10px 10px; }
  .researchsec .oneset .onesetin .botdate .class { padding: 5px 0 0 0; } }
.icon_exclamation { font-size: 17px; color: #eb5d28; display: flex; }
.icon_exclamation .icon { margin-right: 5px; flex-shrink: 0; }
.icon_exclamation .txt { font-size: 16px; font-weight: bold; flex: 1; }
.icon_exclamation .txt .oneline1 { display: inline-block; margin-right: 5px; }
.icon_exclamation .txt .oneline2 { display: inline-block; color: #999999; font-size: 15px; }

.location_site { display: flex; flex-wrap: wrap; }
.location_site .photo { width: 50%; }
.location_site .content { width: 50%; padding-left: 45px; }
.location_site .content .box1 { display: flex; flex-wrap: wrap; max-width: 512px; align-items: center; justify-content: space-between; padding-bottom: 5px; margin-bottom: 15px; border-bottom: 1px solid #e7e7e7; }
.location_site .content .box1 .txt { font-size: 25px; letter-spacing: 0.05em; color: #333333; padding: 5px 0; }
.location_site .content .box1 a { padding: 5px 0; display: inline-block; color: #1c8530; letter-spacing: 0.02em; font-size: 15px; }
.location_site .content .box2 { margin-bottom: 60px; }
.location_site .content .box2 .oneline { display: flex; font-size: 17px; margin-bottom: 5px; letter-spacing: 0.02em; }
.location_site .content .box2 .oneline .t1 { flex-shrink: 0; }
.location_site .content .box2 .oneline .t2 { flex: 1; }

.starlist { font-size: 15px; display: flex; color: #7e6c5f; }
.starlist .icon { flex-shrink: 0; margin-right: 5px; }
.starlist .txt { flex: 1; }

.horizontal_spacer { width: 100%; height: 1px; background-color: #dddddd; margin-top: 15px; margin-bottom: 15px; }

.traffic_box1 { width: 100%; }
.traffic_box1 .traffic_title { display: inline-block; color: #fff; padding: 10px 30px; background-color: #279e3c; font-size: 25px; letter-spacing: 0.05em; font-weight: bold; margin-bottom: 30px; margin-top: 80px; border-radius: 32.5px; }
.traffic_box1 .diamondlist li { margin-bottom: 0px; padding-left: 0px; }
.traffic_box1 .horizontal_spacer { max-width: 715px; }

.traffic_box2 .oneset { display: flex; flex-wrap: wrap; margin-top: 60px; padding-bottom: 60px; border-bottom: 1px solid #dddddd; }
.traffic_box2 .oneset:last-child { border-bottom: none; }
.traffic_box2 .oneset .leftbox { width: calc((542 / 1400)*100%); }
.traffic_box2 .oneset .leftbox img { width: 100%; }
.traffic_box2 .oneset .rightbox { width: calc((858 / 1400)*100%); padding-left: 40px; }
.traffic_box2 .oneset .rightbox .box1 { font-size: 20px; font-weight: 100; color: #573925; letter-spacing: 0.05em; line-height: 1; margin-bottom: 10px; }
.traffic_box2 .oneset .rightbox .box2 { font-size: 30px; letter-spacing: 0.05em; margin-bottom: 10px; }
.traffic_box2 .oneset .rightbox .box2 .oneline { display: inline-block; }
.traffic_box2 .oneset .rightbox .box2 .oneline .c999999 { font-size: 15px; }
.traffic_box2 .oneset .rightbox .box2 .arrow { margin: 0 10px; }
.traffic_box2 .oneset .rightbox .schedule { overflow: auto; }
.traffic_box2 .oneset .rightbox .schedule .timetable { border: 1px solid #dddddd; width: 100%; margin-bottom: 10px; min-width: 767px; border-radius: 3px; }
.traffic_box2 .oneset .rightbox .schedule .timetable tbody tr td, .traffic_box2 .oneset .rightbox .schedule .timetable tbody tr th { font-size: 20px; letter-spacing: 0.03em; padding: 8px; text-align: center; }
.traffic_box2 .oneset .rightbox .schedule .timetable tbody tr td:first-child, .traffic_box2 .oneset .rightbox .schedule .timetable tbody tr th:first-child { border-right: 1px solid #dddddd; }
.traffic_box2 .oneset .rightbox .schedule .timetable tbody tr th { color: #fff; background: #846f60; }
.traffic_box2 .oneset .rightbox .schedule .timetable tbody tr td { line-height: 2; vertical-align: top; color: #333333; }
.traffic_box2 .oneset .rightbox .schedule .timetable tbody tr td .borderbot_orang { border-bottom: 3px solid #eb5d28; }
.traffic_box2 .oneset .rightbox .schedule .timetable tbody tr td .green_cicle { color: #fff; background-color: #279e3c; border-radius: 100%; text-align: center; line-height: 34px; font-size: 16px; width: 34px; height: 34px; display: inline-block; }

@media (max-width: 1260px) { .traffic_box2 .oneset .rightbox .schedule .timetable tbody tr td, .traffic_box2 .oneset .rightbox .schedule .timetable tbody tr th { font-size: 15px; letter-spacing: 0; padding: 8px 5px; }
  .traffic_box2 .oneset .rightbox { padding-left: 30px; }
  .traffic_box2 .oneset .rightbox .schedule .timetable tbody tr td .green_cicle { line-height: 30px; font-size: 14px; width: 30px; height: 30px; } }
@media (max-width: 1100px) { .location_site .photo { width: 100%; }
  .location_site .content { width: 100%; padding-left: 0; margin-top: 30px; }
  .location_site .content .box2 { margin-bottom: 20px; }
  .traffic_box2 .oneset .leftbox { width: 100%; }
  .traffic_box2 .oneset .rightbox { width: 100%; padding-left: 0px; margin-top: 30px; } }
@media (max-width: 1280px) { .history-sec { padding: 20px; } }

.history-timeline { display: flex; flex-wrap: wrap; max-width: 1230px; margin: 0 auto; padding: 0 60px; margin-top: 40px; }
.history-timeline .interval-block { width: 20%; }
.history-timeline .interval-block .interval { width: 85px; text-align: center; margin-left: 44px; }
.history-timeline .interval-block .interval .icon img { height: 82px; }
.history-timeline .interval-block .interval .year { font-size: 23px; font-weight: bold; color: #333333; letter-spacing: 0.02em; margin-top: 15px; }
.history-timeline .interval-block .circlebox { padding-left: 70px; }
.history-timeline .interval-block .circlebox .circle { border: 1px solid #999999; border-radius: 100%; height: 22px; width: 22px; background-color: #fff; }
.history-timeline .interval-block .circlebox:before { content: ""; display: block; position: absolute; height: 1px; width: 100%; background-color: #999; top: 50%; left: 0px; }
.history-timeline .interval-block .info { padding-left: 44px; padding-top: 32px; }
.history-timeline .interval-block .info:before { content: ""; width: 1px; height: 100%; background: #999; position: absolute; top: 0; left: 80px; }
.history-timeline .interval-block .info .month-box { display: flex; margin-bottom: 20px; }
.history-timeline .interval-block .info .month-box .month { font-size: 15px; flex-shrink: 0; margin-right: 13px; }
.history-timeline .interval-block .info .month-box .month .circlem { display: inline-block; border-radius: 100%; color: #fff; background: #27aa16; height: 30px; width: 30px; line-height: 30px; text-align: center; }
.history-timeline .interval-block .info .month-box .list { flex: 1; max-width: 120px; }
.history-timeline .interval-block .info .month-box .list .photo { max-width: 120px; margin-bottom: 15px; }
.history-timeline .interval-block .info .month-box .list .content { font-size: 16px; color: #444444; }
.history-timeline .historyarrow { position: absolute; background: none; color: #999999; font-size: 40px; top: 115px; border: none; padding: 0; }
.history-timeline .historyarrow:hover { color: #7b6553; }
.history-timeline .historyarrow.prev { left: 0; }
.history-timeline .historyarrow.next { right: 0; }

.history-title { max-width: 1050px; margin: 0 auto; padding-top: 30px; }
.history-title .en { font-size: 90px; color: #555555; line-height: 1; font-family: roboto, sans-serif; font-weight: 900; font-style: normal; }
.history-title .tw { font-size: 30px; color: #444444; margin-top: 10px; letter-spacing: 0.05em; }

.iziModal.historyizi .iziModal-button-close { background: url(../images/close_gray.png) no-repeat 50% 50%; }

@media (max-width: 640px) { .history-title .en { font-size: 50px; }
  .history-timeline { padding: 0 50px; }
  .history-timeline .interval-block .circlebox { padding-left: 32px; }
  .history-timeline .interval-block .info:before { left: 42px; }
  .history-timeline .interval-block .info { padding-left: 8px; padding-top: 20px; }
  .history-timeline .historyarrow { top: 115px; } }
.et_in_manytabs { display: flex; justify-content: center; margin-top: 10px; }

.et_in_manytabs .arrow_wrap { display: none; }

.et_in_manytabs .arrow_wrap .arrow { font-size: 17px; color: white; text-align: center; padding: 8px 5px; background: #ccc; display: inline-block; }

.et_in_manytabs .arrow_wrap .arrow.arrow-prev { margin-right: 2px; }

.et_in_manytabs .arrow_wrap .arrow.arrow-next { margin-left: 2px; }

.et_in_manytabs .manynav { display: flex; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch; }

.et_in_manytabs .manynav::-webkit-scrollbar { display: none; }

.et_in_manytabs .oneset { margin-right: 2px; margin-bottom: 2px; }

.et_in_manytabs .oneset a { font-size: 17px; color: white; text-align: center; padding: 8px 15px; background: #43b7a9; display: inline-block; white-space: nowrap; }

.et_in_manytabs .oneset a:hover, .et_in_manytabs .oneset a.active { background: #fc9e6d; text-decoration: none; }

.et_in_manytabs .oneset .btnclass { border: none; height: 45px; font-size: 17px; color: white; text-align: center; padding: 8px 15px; background: #41858d; display: inline-block; white-space: nowrap; }

.et_in_manytabs .oneset .btnclass:hover, .et_in_manytabs .oneset .btnclass.active { background: #fc9e6d; text-decoration: none; }

.et_in_manytabs .oneset .btnclass:focus { outline: none; }

/*# sourceMappingURL=style.css.map */


/* 20250704banner下方樣式調整 */
.ibigclass .wrapper:before {
    width: 22vw;
    height: 8vw;    
    background-size: 100%;
    left: -19vw;
    top: 2.4vw;
}

.ibigclass .wrapper:after {    
    width: 23vw;
    height: 13vw;    
    background-size: 100%;
    right: -20vw;
    top: 0.5vw;
}




@media (max-width: 1440px) {
  .ibigclass .wrapper:before {
    width: 17vw;
    height: 8vw;
    background-size: 100%;
    left: -8vw;
    top: 3.4vw;
  }

  .ibigclass .wrapper:after {
      width: 17vw;
      height: 18vw;
      background-size: 100%;
      right: -14vw;
      top: 0;
  }
}

@media (max-width: 1280px) {
  .ibigclass .wrapper:after {
      width: 17vw;
      height: 18vw;
      background-size: 100%;
      right: -13vw;
      top: -1vw;
  }
}

@media (max-width: 768px) {
  .ibigclass .wrapper:before {
      width: 17vw;
      height: 8vw;
      background-size: 100%;
      left: -4vw;
      top: 3vw;
  }
  .ibigclass .wrapper:after {
    width: 17vw;
    height: 18vw;
    background-size: 100%;
    right: -7vw;
    top: 0vw;
  }
}

@media (max-width: 480px) {
  .ibigclass .wrapper:before {
      width: 18vw;
      height: 8vw;
      background-size: 100%;
      left: -1vw;
      top: 3vw;
  }
  .ibigclass .wrapper:after {
    width: 18vw;
    height: 18vw;
    background-size: 100%;
    right: -3vw;
    top: 1vw;
  }
}

@media (max-width: 430px) {
  .ibigclass{
    margin-top: calc(-18.22917vw - 4px);
    padding-top: 4px;
  }
  .ibigclass .wrapper {
    padding: 0 30px;
  }
  .ibigclass .wrapper:before {
      width: 37px;
      height: 33px;
      background-size: 100%;
      left: 0;
      top: 10px;
      background-image: url(../images/leaf_left_mobile.png.png);
  }
  .ibigclass .wrapper:after {
    width: 36px;
    height: 50px;
    background-size: 100%;
    right: 0;
    top: -5px;
    background-image: url(../images/leaf_right_mobile.png.png);
  }
}



/* 20250908 */
header {
  position: sticky;
}
.ibanner {
  padding-top: 0px!important;
}
.innerban {
  padding-top: 0px!important;
}
.ibanslick .slick-active .oneset .mask{
  /* animation: zoomOutImage 4s both; */
}

@keyframes zoomOutImage {
  from {
    transform: scale3d(1.2, 1.2, 1.2);
  }
  to {
    transform: scale3d(1, 1, 1);
  }
}
@media (max-width: 1230px) {
  .logo img {
    max-width: 150px;
  }
}

@media (max-width: 1100px) {
  header .wrapper {
    padding: 15px 20px;
  }
}

@media (max-width: 480px) {
  .breadcrumbs { margin-top: 0px;}
  
}