@charset "utf-8";
@import url(../fonts/font-PT_Sans.css);/*font-family: "PT Sans", serif; Regular 400,Bold 700*/
/* Font Awesome 5 Pro - regular */
@font-face{font-family:"Font Awesome 5 Pro";font-style:normal;font-weight:400;font-display:auto;src:url(../fonts/fa-regular-400.eot);src:url(../fonts/fa-regular-400.eot?#iefix) format("embedded-opentype"),url(../fonts/fa-regular-400.woff2) format("woff2"),url(../fonts/fa-regular-400.woff) format("woff"),url(../fonts/fa-regular-400.ttf) format("truetype"),url(../fonts/fa-regular-400.svg#fontawesome) format("svg")}
.far{font-family:"Font Awesome 5 Pro";font-weight:400}
/* Font Awesome 5 Pro - solid */
@font-face {font-family:"Font Awesome 5 Pro";font-style:normal;font-weight:900;font-display:auto;src:url(../fonts/fa-solid-900.eot);src:url(../fonts/fa-solid-900.eot?#iefix) format("embedded-opentype"),url(../fonts/fa-solid-900.woff2) format("woff2"),url(../fonts/fa-solid-900.woff) format("woff"),url(../fonts/fa-solid-900.ttf) format("truetype"),url(../fonts/fa-solid-900.svg#fontawesome) format("svg")}
.fa,.fas{font-family:"Font Awesome 5 Pro";font-weight:900}

/* CSS Reset */
html, body, div, span, applet, object, iframe, form,
h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, 
em, img, q, strong, sub, sup,
dl, dt, dd, ol, ul, li { margin:0; padding:0; }
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, textarea, input, button, header, footer, section, nav, main, figcaption, figure { box-sizing:border-box; }
img { border:0; }
ul, ol { list-style:none; }
table { border-collapse:collapse; border-spacing:0; }

select, input, textarea, button { font-size:1rem; }
input[type="checkbox"], input[type="radio"] { margin-right:5px; margin-left:0; vertical-align:middle; }
input[type="button"], input[type="submit"], input[type="reset"], input[type="file"], select, button { cursor:pointer; }
input:not([type="checkbox"]), input:not([type="radio"]), input:not([type="file"]) { padding:0; }
button { padding:0; transition:all 0.3s ease; }
/*ios樣式清除*/
input[type="button"], input[type="submit"], input[type="reset"], button {
	background-color:transparent; border:none; margin:0px;
	background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 100%);
	background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=1 );
}

/*字型設定*/
body, button { font-family: "PT Sans", "Microsoft YaHei", "微软雅黑", sans-serif; color: #333; letter-spacing: .01em; }
input, textarea, select { font-family: "PT Sans", "Microsoft YaHei", "微软雅黑", sans-serif; }
h1, h2, h3, h4, h5, h6 { line-height:1.75em; }

/* 共用 */
#Wrap { position: relative; z-index: 1; }
a { color:#333; transition: all 0.3s ease; }
a:hover, a:focus { text-decoration:none; color: var(--color1); }
a:focus, :focus { outline: none; }
body.fixed { overflow:hidden; }
.imgBox img { max-width: 100%; }
:root {
    --main_color: #2ec8c0;
    --color1: #344094;
    --color2: #dc8f37;
    --color3: #1cafa4;
}

/* 無障礙樣式設定 */
.noscript { font-size:0.9375rem; text-align:left; }
.sr-only { 
	position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(1px, 1px, 1px, 1px); border:0; 
	white-space:nowrap; font-size:0.8125rem; letter-spacing:0.05em; 
	}
.sr-only:focus { width:auto; height:auto; margin:0; overflow:visible; clip:auto; }

@media screen and (max-width: 639px) {
	.inner { padding-left: 15px; padding-right: 15px; }
}
@media screen and (min-width: 640px) and (max-width: 1279px) {
	.inner { padding-left: 4%; padding-right: 4%; }
}
@media screen and (min-width: 1280px) {
    .inner { max-width:1440px; margin:0 auto; padding-left: 40px; padding-right: 40px; }
}

/*----------------------------------------------------------------------*/
/* 雜湊值頁 */
#Wrap.layoutless { padding-top: 64px; }
#Wrap.layoutless #Header { position: fixed; top: 0; left: 0; z-index: 9990; height: 64px; width: 100%; box-sizing: border-box; box-shadow: 0 4px 4px rgba(0,0,0,.1); background-color: #fff; border-top: 0px; padding: 0;}
#Wrap.layoutless #Header > .inner { padding-top: 0; padding-bottom: 0; }
#Wrap.layoutless #Header .logo { margin:0 auto; padding: 7px 0; float: none; }
#Wrap.layoutless #Header .logo h1 { height:inherit; }
#Wrap.layoutless #Header .logo a { height: 50px; }

/*----------------------------------------------------------------------*/
/* Header */
#Header { position: relative; z-index: 99; background-color: #fff; box-shadow: 0 0 18px 10px rgba(0, 0, 0, .1); }
#Header .logo { text-align: center; display: table; }
#Header .logo h1 { display: table-cell; vertical-align: middle; }
#Header .logo a { position: relative; z-index: 5; margin: 0 auto; display: flex; justify-content: center; align-items: center; height: inherit; }
#Header .logo a:hover, #Header .logo a:focus { opacity: 0.7; }
#Header .logo img { max-width: 100%; max-height: 100%; }

.other_btn { display: flex; flex-wrap: wrap; align-items: center; padding-left: 1vw; }
.other_btn a { text-decoration: none; display: block; }
.other_btn li { position: relative; }
.other_btn > li { padding: 5px; }
.other_btn > li > a { position: relative; color: #fff; padding: 11px; font-weight: 700; }
.other_btn > li > a > span { position: relative; z-index: 5; display: flex; align-items: center; }
.other_btn > li > a > span::before { content: ''; display: inline-block; width: 25px; height: 25px; background: url(../images/header_icon.png) no-repeat; margin-right: 0.25em; }

.other_btn > li > ul { position: absolute; top: 58px; right: 5px; z-index: 8884; }
.other_btn ul {
    background-color: #fff; width: calc(100% - 10px); display: none;
    -webkit-box-shadow:0 4px 20px rgba(0,0,0,0.35); 
    -moz-box-shadow:0 4px 20px rgba(0,0,0,0.35);
    box-shadow:0 4px 20px rgba(0,0,0,0.35);
}
.other_btn > li:hover > ul { display: block; }
.other_btn ul li { text-align: center; }
.other_btn ul li a { padding: 10px 18px; }
.other_btn ul li a:hover, .other_btn ul li a:focus { background: var(--color1); color: #fff; }

.other_btn > li > a::before {
    content: ''; width: 100%; height: 100%; display: block;
    background: linear-gradient(to right, #0ba193 0%,#2ec8c0 100%);
    position: absolute; left: 0; top: 0; opacity: 1;
    -moz-transition: all .7s cubic-bezier(0.77, 0, 0.175, 1);
    -o-transition: all .7s cubic-bezier(0.77, 0, 0.175, 1);
    -webkit-transition: all .7s cubic-bezier(0.77, 0, 0.175, 1);
    transition: all .7s cubic-bezier(0.77, 0, 0.175, 1);
} 
.other_btn > li > a::after {
    content: ''; width: 0%; height: 100%; display: block; background: #0ba193;
    position: absolute; left: 0; top: 0; opacity: 0;
    -webkit-transition: all .94s cubic-bezier(.2,.95,.57,.99);
    -moz-transition: all .4s cubic-bezier(.2,.95,.57,.99);
    -o-transition: all .4s cubic-bezier(.2,.95,.57,.99);
    transition: all .4s cubic-bezier(.2,.95,.57,.99);
}
.other_btn > li > a:hover::before,
.other_btn > li.sfHover > a::before {	box-shadow:2px 0px 14px rgba(0,0,0,.6); }
.other_btn > li > a:hover::after,
.other_btn > li.sfHover > a::after { opacity:1; width: 100%; }

.other_btn li.member a span::before { background-position: left bottom; }
.other_btn li.member a::before { background: linear-gradient(to right, #dc8f37 0%,#eec785 100%); }
.other_btn li.member a::after { background: #dc8f37; }

@media screen and (max-width: 479px) {
    #Header .logo { margin: 7px 0; }
    #Header .logo h1 { width: 240px; }
}

@media screen and (max-width: 1023px) {
    #Wrap { padding-top: 64px; }
    #Header { position: fixed; top: 0; left: 0; z-index: 9990; height: 64px; width: 100%; box-sizing: border-box; box-shadow: 0 4px 4px rgba(0,0,0,.1); background-color: #fff; }
    .header_info, .MenuBox { display:none; }
    #Header .logo { margin: 7px auto; }
    #Header .logo a { height: 50px; }
}

@media screen and (min-width: 1024px) {
    .header_info { width: 100%; padding: 8px; }
    #Header { display: flex; flex-wrap: wrap; justify-content: space-between; padding: 25px 40px; border-top: 6px solid #2ec8c0; }
    .MenuBox { display: flex; flex-wrap: wrap; align-items: center; }

    /* Menu */
    #Menu { padding-top: 18px; display: flex; }
    #Menu li a { text-decoration:none; color:#333; display:block; }
    #Menu > li { position: relative; line-height: 1.5em; height: 40px; padding: 0 20px; }
    #Menu > li > a { font-size:1.25em; text-align: center; color: #333; position: relative; font-family:'Noto Sans TC', sans-serif; font-weight: 700; }
    #Menu > li.with > a { padding-right: 18px; }
    #Menu > li.with > a::after { content: ''; position: absolute; right: 4px; top: 28%; height: 6px; width: 6px; border-right: 2px solid #333; border-bottom: 2px solid #333; transform: rotate(45deg); }
    #Menu > li > a:hover, #Menu > li > a:focus, #Menu > li.sfHover > a, #Menu > li.selected > a { color: var(--color1); }
    #Menu > li.with > a:hover::after,
    #Menu > li.with > a:focus::after,
    #Menu > li.sfHover > a::after { border-color: var(--color1); }
    #Menu > li:last-child { padding-right: 0; }

    /* 先隱藏子選單,等網頁載入完畢後再顯示 */
    #Menu.superfish { overflow:hidden; position:relative; }
    #Menu.superfish.sf-js-enabled { overflow:visible; }

    /*第二層底下共用*/
    #Menu ul {
        -webkit-box-shadow:0 4px 20px rgba(0,0,0,0.35); 
        -moz-box-shadow:0 4px 20px rgba(0,0,0,0.35);
        box-shadow:0 4px 20px rgba(0,0,0,0.35);
    }
    #Menu ul li { position: relative; text-align: center; }
    #Menu ul li a { line-height:1.5em; padding:10px 18px; text-decoration:none; font-size: 1rem; }
    #Menu ul li a:hover, #Menu ul li a:focus { background: var(--color1); color: #fff; }
    #Menu.superfish ul a.sf-with-ul::after { 
        content:''; position:absolute; top:50%; right:10px; width:6px; height:6px; margin-top: -3px; 
        border-top:2px solid #333; border-right:2px solid #333;
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        transform: rotate(45deg);
        }
        #Menu.superfish ul a.sf-with-ul:hover::after, #Menu.superfish ul a.sf-with-ul:focus::after { border-color: #fff; }

    /*第二層*/
    #Menu > li > ul { display:none; position:absolute; top:40px; left:50%; width:160px; margin-left: -80px; z-index:8884; background-color:#fff; }

    /*第三層*/
    #Menu > li > ul > li > ul { display:none; position:absolute; left:100%; top:0px; width:100%; z-index:8883; background-color:#ffffff; }

    /*第四層*/
    #Menu > li > ul > li > ul li > ul { display:none; position:absolute; left:100%; top:0px; width:100%; z-index:8882; background-color:#ffffff; }

    /* 選單第1個的處理 */
    #Menu.superfish > li:first-child > ul { left:0; margin-left: 0; }

    /* 選單倒數第1個的處理 */
    #Menu.superfish > li:last-child > ul { left:auto; right:0; }
    #Menu.superfish > li:last-child > ul > li > ul { left:auto; right:100%; }
    #Menu.superfish > li:last-child ul a.sf-with-ul::after { 
        left:10px; right:auto; 
        -webkit-transform: rotate(-135deg);
        -moz-transform: rotate(-135deg);
        transform: rotate(-135deg);
        }

    /* 選單倒數第2個的處理 */
    #Menu.superfish > li:nth-last-child(2) > ul > li > ul { left:auto; right:100%; }
    #Menu.superfish > li:nth-last-child(2) ul a.sf-with-ul::after { 
        left:10px; right:auto; 
        -webkit-transform: rotate(-135deg);
        -moz-transform: rotate(-135deg);
        transform: rotate(-135deg);
        }
}

@media screen and (min-width: 1024px) and (max-width: 1319px) {
	#Menu > li { padding: 0 .4vw; }
	#Menu > li > a { font-size: min(max(16px, 1.5vw), 1.125rem); }
    #Header .logo h1 { height: 40px; }
    #Header { padding: 20px 15px 20px 20px; }
}
@media screen and (min-width: 1320px) and (max-width: 1599px) {
	#Menu > li { padding: 0 .4vw; }
}
@media screen and (min-width: 1600px) {
	#Menu > li > a { font-size: 1.5em; }
    #Menu ul li a { font-size: 1.125em; }
    .other_btn { padding-left: 2vw; }
    .other_btn > li > a { font-size: 1.25em; }
    .other_btn ul li a { font-size: 1.125em; }
    #Menu > li > ul { width: 200px; }
}

/*----------------------------------------------------------------------*/
/* footer */
#Footer .footer_info { position: relative; background-color: #0ba193; background-image: url(../images/footer_bg.jpg); background-repeat: no-repeat; background-position: right bottom; background-size: cover; padding-top: 25px; padding-bottom: 20px; }
#Footer a { text-decoration: none; }
#Footer .copyright { background: #444; color: #fff; text-align: center; line-height: 1.5em; padding: 8px 0; }

#Footer .sites_info { font-size: 1.375em; font-weight: 700; color: #fff; margin-bottom: .5em; text-shadow: 0 0 10px rgba(0, 0, 0, .3); line-height: 1.5em; }
#Footer .sites_info .big_title { font-size: 2rem; line-height: 1.5em; }

#Footer .social { display: flex; flex-wrap: wrap; }
#Footer .social li { padding: 0 12px 12px; }
#Footer .social li a { display: block; padding: 5px; background-color: #fff; width: 42px; height: 42px; font-size: 0; position: relative; }
#Footer .social li a::before { content: ''; background: url(../images/ft_social.png) no-repeat; width: 30px; height: 30px; position: absolute; left: 50%; top: 50%; margin: -15px 0 0 -15px; }
#Footer .social li.fb a::before { background-position: 0 0; }
#Footer .social li.yt a::before { background-position: 0 -30px; }
#Footer .social li.mail a::before { background-position: 0 -60px; }
#Footer .social li a:hover { background-color: var(--color1); box-shadow:2px 0px 7px rgba(0,0,0,.5); }
#Footer .social li.fb a:hover::before { background-position: -30px 0; }
#Footer .social li.yt a:hover::before { background-position: -30px -30px; }
#Footer .social li.mail a:hover::before { background-position: -30px -60px; }

@media screen and (max-width: 1023px) {
    #Footer .inner { max-width: 600px; margin: 0 auto; text-align: center; }
    #Footer .social { justify-content: center; margin: 5px 0; }
    #Footer .sites_info .big_title { font-size: 1.75rem; }
    #Footer .social li { padding: 8px; }
    #Footer .social li a { width: 40px; height: 40px; }
}
@media screen and (min-width: 1024px) {
    #Footer .footer_info { padding: 30px 0 25px; }
    #Footer .inner { display: flex; justify-content: space-between; align-items: center; }
    #Footer .col_left { max-width: 540px; }
    #Footer .col_right { display: flex; flex-direction: column; align-items: end; }
    #Footer .social { margin-bottom: 20px; }
    #Footer .social li:last-child { padding-right: 0; }
}

@media screen and (max-width: 639px) {
    #Footer .sites_info .big_title { font-size: 1.375rem; }
    #Footer .sites_info { font-size: 1.125em; }
}

@media screen and (min-width: 1280px) {
    #Footer .footer_info { padding: 40px 0; }
    #Footer .sites_info .big_title { font-size: 2.25rem; }
    #Footer .sites_info { font-size: 1.5em; }
}

/*----------------------------------------------------------------------*/
/* Btn Top */
.BtnTop { text-align:center; z-index:9999; position:fixed; bottom:20px; right: 15px; opacity: 0; visibility: hidden; transition: all 0.3s ease; }
	.MenuFix .BtnTop { visibility: visible; opacity: 1; }
.BtnTop a { 
	display:block; background-color: #fff; color: var(--color1); text-align:center; text-decoration:none; font-weight: 700; letter-spacing: .05em;
	overflow:hidden; position:relative; z-index:9999; box-shadow: 0 0 8px 2px rgba(0, 0, 0, .1);
	}
.BtnTop a::after {
	content:''; position:absolute; top:14px; left:29px; width:8px; height:8px; border-top:2px solid var(--color1); border-left:2px solid var(--color1);
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	transform: rotate(45deg);
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
	}
.BtnTop a:hover, .BtnTop a:focus { background-color: var(--color1); color: #fff; box-shadow:2px 0px 14px rgba(0,0,0,.6); }
.BtnTop a:hover::after, .BtnTop a:focus::after { border-color: #fff; }

@media screen and (max-width: 1023px) {
	.BtnTop a { font-size:0.875rem; padding: 20px 8px 8px; width: 46px; }
	.BtnTop a::after { top:14px; left:19px; width:6px; height:6px; }
}
@media screen and (min-width: 1024px) {
	.BtnTop { bottom:40px; }
	.BtnTop a { width:60px; padding: 26px 15px 14px; }
	.BtnTop a::after { top:18px; left:25px; width:7px; height:7px; }
}

/*----------------------------------------------------------------------*/
/* bxSlider_list共通設定 */
/* 不顯示子項目 */
.bxSlider_list li { float:left; list-style:none; position:relative; display:none; }
/* 顯示第一筆項目 */  
.bxSlider_list li:first-child { display:block; }
/* 當JS執行時顯示全部 */
.bx-viewport .bxSlider_list li { display:block; }

.bx-wrapper { position:relative; margin:auto; padding:0; zoom:1; }
.bx-viewport { z-index:5555; position:relative; zoom:1; }
.bxSlider_list { clear:both; position:relative; z-index:9999; overflow:hidden; }

/* 修改Key visual圖片載入時Slider高度過高問題 */
.bxSlider_list { position:relative; }
/* 載入時顯示loading動畫,載完後圖片淡入 */
.bxSlider_list { background:url("../../loader.gif") no-repeat center center; overflow:hidden; }
.bxSlider_list li { 
	opacity:0; display:block; 
	/*-webkit-transition: all 2s ease;
	-moz-transition: all 2s ease;
	transition: all 2s ease;*/
	}
.bxSlider_list.show { background-image:none; }
.bxSlider_list.show li { opacity:1; }

/* DIRECTION CONTROLS (NEXT / PREV) */
.bx-wrapper .bx-controls-direction a.disabled { display:none; }
.bx-wrapper .bx-controls-direction a { 
	display:block; position:absolute; text-indent:-10000px; z-index:9990;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
	}
	
/* PAGER */
.bx-wrapper .bx-pager { position:absolute; z-index:9990; }
.bx-wrapper .bx-pager .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item { display:inline-block; }
.bx-wrapper .bx-pager.bx-default-pager a { display:block; text-indent:10000px; }

/*----------------------------------------------------------------------*/
/* 表單 */
.FormGroupWarp .FormGroup { margin:40px 0; }
.FormGroupWarp .FormGroup + .FormGroup { margin-top:60px; }
.FormGroup { 
	border: none; border-top: 4px solid var(--main_color); padding: 56px 40px 40px; margin:25px 0 40px; position:relative; background-color: #f2f2f2; background-image: url(../images/bg_shadow.png); background-repeat: no-repeat; background-position: right bottom;
	}
 	fieldset.FormGroup { max-width:100%; box-sizing:border-box; }
.FormGroup .FormGroupTitle { position:absolute; left:0; top:-27px; border-width: 0; background-color: var(--color3); color: #fff; }
.FormGroup .FormGroupTitle span { padding:0 1em; display:inline-block; border-width: 0; font-size:1.5em; font-weight: 700; line-height: 50px; }
	.FormGroup legend.FormGroupTitle { margin:0; display:block; }
.FormGroup .last_info { border-top: 1px solid #949494; padding-top: 10px; }

.FormGroup.color2 { border-color: var(--color2); }
.FormGroup.color2 .FormGroupTitle { background-color: var(--color2); }
.FormGroup.color2 .avatar_edit input + label { background-color: var(--color2); }

@media screen and (min-width: 1024px) {
    .FormGroupTitle { min-width: 334px; }
}

table.FormTable { width:100%; }
.FormTable > tbody > tr > th, .FormTable > tbody > tr > td { font-size:100%; }
.FormTable > tbody > tr > th { line-height:28px; position:relative; font-weight: 400; background-color: #fff;  }
.FormTable > tbody > tr > th span.required { margin-left: 4px; }
.FormTable > tbody > tr > th span.date { color: #038e81; display: block; }
.FormTable > tbody > tr > td { line-height:40px; }
.FormTable > tbody > tr > th.text-top { vertical-align:top; }

/* 表單內按鈕 */
.FormElmt input.check_btn { background-color:#333; color:#fff; height:40px; line-height:40px; padding:0 8px; font-size:1rem; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; transition:all 0.3s ease; }
.FormElmt input.check_btn:hover { background-color:#1eb9ee; }

.FormElmt .go_btn input { -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; background-color: #f4a657; width: 60px; height: 46px; line-height: 46px; }
.FormElmt .go_btn input:hover, .FormElmt .go_btn input:focus { background-color: #7e4e2b; }

/* 表單元件 */
.FormElmt input[type="text"], .FormElmt input[type="password"], .FormElmt input[type="file"], 
.FormElmt input[type="number"], .FormElmt input[type="date"], .FormElmt input[type="month"],
.FormElmt input[type="week"], .FormElmt input[type="time"], .FormElmt input[type="datetime-local"],
.FormElmt input[type="email"], .FormElmt input[type="search"], .FormElmt input[type="tel"],
.FormElmt input[type="url"] { line-height:35px; height:35px; }

.FormElmt input[type="text"], .FormElmt input[type="password"], .FormElmt input[type="file"], 
.FormElmt input[type="number"], .FormElmt input[type="date"], .FormElmt input[type="month"],
.FormElmt input[type="week"], .FormElmt input[type="time"], .FormElmt input[type="datetime-local"],
.FormElmt input[type="email"], .FormElmt input[type="search"], .FormElmt input[type="tel"],
.FormElmt input[type="url"],
.FormElmt select, .FormElmt textarea { vertical-align:top; }

.FormElmt input[type="text"], .FormElmt input[type="password"], 
.FormElmt input[type="number"], .FormElmt input[type="date"], .FormElmt input[type="month"],
.FormElmt input[type="week"], .FormElmt input[type="time"], .FormElmt input[type="datetime-local"],
.FormElmt input[type="email"], .FormElmt input[type="search"], .FormElmt input[type="tel"],
.FormElmt input[type="url"], 
.FormElmt textarea, .FormElmt select {
	border: 1px solid rgba(170,170,170,.8); font-size:1em; box-sizing:border-box; background-color:#fff; color:#222; border-radius: 4px;
}
	
.FormElmt input[type="text"], .FormElmt input[type="password"], .FormElmt input[type="file"], 
.FormElmt input[type="number"], .FormElmt input[type="date"], .FormElmt input[type="month"],
.FormElmt input[type="week"], .FormElmt input[type="time"], .FormElmt input[type="datetime-local"],
.FormElmt input[type="email"], .FormElmt input[type="search"], .FormElmt input[type="tel"],
.FormElmt input[type="url"] { 
	padding:0 .5em; 
	}
.FormElmt textarea { padding:5px 10px; }
.FormElmt select {
	line-height:26px; padding:5px .25em; height:35px; color:#333; max-width:100%;
}	

.FormElmt input[type="text"]:hover, .FormElmt input[type="password"]:hover, .FormElmt input[type="file"]:hover, 
.FormElmt input[type="number"]:hover, .FormElmt input[type="date"]:hover, .FormElmt input[type="month"]:hover,
.FormElmt input[type="week"]:hover, .FormElmt input[type="time"]:hover, .FormElmt input[type="datetime-local"]:hover,
.FormElmt input[type="email"]:hover, .FormElmt input[type="search"]:hover, .FormElmt input[type="tel"]:hover,
.FormElmt input[type="url"]:hover,
.FormElmt textarea:hover, .FormElmt select:hover {
	border: 1px solid #666;
	-webkit-transition: all ease-in .2s;
	-moz-transition: all ease-in .2s;
	transition: all ease-in .2s;
	}

.FormElmt input[type="text"]:focus, .FormElmt input[type="password"]:focus, .FormElmt input[type="file"]:focus, 
.FormElmt input[type="number"]:focus, .FormElmt input[type="date"]:focus, .FormElmt input[type="month"]:focus,
.FormElmt input[type="week"]:focus, .FormElmt input[type="time"]:focus, .FormElmt input[type="datetime-local"]:focus,
.FormElmt input[type="email"]:focus, .FormElmt input[type="search"]:focus, .FormElmt input[type="tel"]:focus,
.FormElmt input[type="url"]:focus,
.FormElmt textarea:focus, .FormElmt select:focus {
	border: 1px solid #333; background-color: #fffef3;
	-webkit-transition: all ease-in .2s;
	-moz-transition: all ease-in .2s;
	transition: all ease-in .2s;
	}

.FormElmt input[type="text"]:disabled, .FormElmt input[type="password"]:disabled, .FormElmt input[type="file"]:disabled, 
.FormElmt input[type="number"]:disabled, .FormElmt input[type="date"]:disabled, .FormElmt input[type="month"]:disabled,
.FormElmt input[type="week"]:disabled, .FormElmt input[type="time"]:disabled, .FormElmt input[type="datetime-local"]:disabled,
.FormElmt input[type="email"]:disabled, .FormElmt input[type="search"]:disabled, .FormElmt input[type="tel"]:disabled,
.FormElmt input[type="url"]:disabled,
.FormElmt textarea:disabled, .FormElmt select:disabled {
	border: 1px solid #ccc; opacity: .5;
	}
	
.FormElmt hr { margin:25px 0; }
.FormElmt input.addr { margin-top:8px; display:block; }
.FormElmt .gender { display:inline-block; }
.FormElmt .gender input[type="radio"] { margin-left:25px; }
.FormElmt .w40 { width:40px; }
.FormElmt .w60 { width:60px; }
.FormElmt .w80 { width:80px; }
.FormElmt .w100 { width:100px; }
.FormElmt .w160 { width:100%; max-width:160px; }
.FormElmt .w200 { width:100%; max-width:200px; }
.FormElmt .w260 { width:100%; max-width:260px; }
.FormElmt .w300 { width:100%; max-width:300px; }
.FormElmt .w400 { width:100%; max-width:400px; }
.FormElmt .w500 { width:100%; max-width:500px; }
.FormElmt .w600 { width:100%; max-width:600px; }
.FormElmt .fullwidth { width:100%; }
.FormElmt .dev-calendar { width:100%; max-width:150px; }
.FormElmt .note { line-height:1.5em; color: #007970; }
.FormElmt .alert { line-height:1.5em; color: #ff000c; }
.FormElmt .FormTable .note { padding: 5px 0; }
.FormElmt .desc { font-size:0.875em; line-height:1.5em; vertical-align:middle; }
.FormElmt span.required { font-weight: bold; color: #ff000c; }
.FormElmt .Foreword { padding: 5px 0; color: #ff000c; }

.post_info + .FormGroup { margin-top:60px; }

.FormBody > .note { margin-bottom: 14px; padding: 2px; }

/* checkbox/radio群組 */
.FormElmt .input_group.inline { display:flex; flex-wrap: wrap; }
.FormElmt .input_group.inline > div { margin-right: 15px; }
.FormElmt .input_group input[type="text"] { width: 180px; margin-left: 8px; }
.FormElmt .input_group input[type="radio"] { margin-top: 0; }

.input_boxs { display: flex; flex-wrap: wrap; }
.input_boxs > div { margin-top: 5px; margin-bottom: 5px; width: 100%; }
.input_boxs.name > div:not(:first-child) { margin-left: 10px; }
.input_boxs.name > div { flex: 1.5; }
.input_boxs.name > div:first-child { flex: 1; }
.input_boxs.mobile > div:not(:first-child) { flex: 1; }
.input_boxs.mobile > div:first-child { margin-right: 10px; width: 125px; flex-shrink: 0; }
.input_boxs input { width: 100%; }
.input_boxs input[type="text"].dev-calendar { max-width: 100%; }

/* 檔案上傳 */
.FormElmt .file_uploa_mgt .row { margin:5px 0; display:flex; flex-wrap:wrap; align-items:center; -ms-display:flex; -ms-flex-wrap:wrap; -ms-align-items:center; }
.FormElmt .file_uploa_mgt .row > div { position:relative; }
.FormElmt .file_uploa_mgt .input { flex: 1; }
	/*demo用css*/
	.FormElmt .file_uploa_mgt .input.upload_demo::after { 
		content:''; display:block; position:absolute; top:0; left:0; width:100%; height:100%; 
		background: #f2f2f2 url(../../../layout/input_file_demo.png) no-repeat 0 center;
		}
	.FormElmt .file_uploa_mgt .input.upload_demo1::after { 
		content:''; display:block; position:absolute; top:0; left:0; width:100%; height:100%; 
		background: #f2f2f2 url(../../../layout/input_file_demo1.png) no-repeat 0 center;
		}
	/*demo end*/
.FormElmt .file_uploa_mgt .input input[type="file"] { margin:0; font-size:0.875rem; padding: 0; }
.FormElmt .file_uploa_mgt button { border:none; width:90px; font-size:1rem; line-height:36px; text-align:center; color: #fff; }
.FormElmt .file_uploa_mgt .del button { background-color: #666; }
.FormElmt .file_uploa_mgt .del button:hover, .FormElmt .file_uploa_mgt .del button:focus { background-color:var(--color1); }
.FormElmt .file_uploa_mgt .add { margin-top:8px; padding-top:8px; border-top:1px solid #1cafa4; text-align:right; }
.FormElmt .file_uploa_mgt .add button { background-color: var(--color3); }
.FormElmt .file_uploa_mgt .add button:hover, .FormElmt .file_uploa_mgt .add button:focus { background-color:var(--color1); }

/* 驗證碼 */
.FormElmt .randomcode::after { content:''; display:block; clear:both; }
.FormElmt .randomcode { display: flex; flex-wrap: wrap; }
.FormElmt .randomcode > div:not(:last-child) { margin-right:15px; }
	.FormElmt .randomcode .input input[type="text"] { width:120px; }
	.FormElmt .randomcode .img { display:inline-flex; align-items:center; justify-content: center; }
.FormElmt .randomcode .btns { display: flex; flex-wrap: wrap; align-items: center; }
.FormElmt .randomcode .btns > * { 
    margin-left: 1.125rem; font-size: .875rem; border-bottom: 1px solid #777; line-height: 1.5em; position: relative;
    }
.FormElmt .randomcode .btns > *:last-child { margin-right:0; }
.FormElmt .randomcode .btns > *:hover, .FormElmt .randomcode .btns > *:focus { border-color: var(--color2); color: var(--color2); }
.FormElmt .randomcode .btns > *:hover::before, .FormElmt .randomcode .btns > *:focus::before { color: var(--color2); }
.FormElmt .randomcode .btns > *::before { 
    content:"\f01e"; font-family:'Font Awesome 5 Pro'; font-weight:400; position:absolute; left: -1.125rem; top:.125em; z-index:1; color: #666; transition: all 0.3s ease;
    }
    .FormElmt .randomcode .btns a { display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; }

/* 按鈕 - 內元素只能button或a */
.BtnCommon { display: flex; justify-content: center; flex-wrap: wrap; margin: 20px 0; }
.BtnCommon > div { margin: 10px 20px; }
	.BtnCommon.tl { justify-content: flex-start; }
	.BtnCommon.tr { justify-content: flex-end; }

.BtnCommon a, .BtnCommon button {
    display:block; font-weight: 700; padding: 12px 1em;
    box-sizing:border-box; position:relative; cursor: pointer; text-decoration: none;
	-webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; transition:all 0.3s ease;
}
	.BtnCommon.large a, .BtnCommon.large button { font-size:1.5em; }
	.BtnCommon.mid a, .BtnCommon.mid button { font-size:1em; }
	.BtnCommon.small a, .BtnCommon.small button { font-size:0.9375em; }

.BtnCommon > div > *::before {
    content: ''; width: 100%; height: 100%; display: block;
    background: linear-gradient(to right, #dc8f37 0%,#eec785 100%);
    position: absolute; left: 0; top: 0; opacity: 1;
    -moz-transition: all .7s cubic-bezier(0.77, 0, 0.175, 1);
    -o-transition: all .7s cubic-bezier(0.77, 0, 0.175, 1);
    -webkit-transition: all .7s cubic-bezier(0.77, 0, 0.175, 1);
    transition: all .7s cubic-bezier(0.77, 0, 0.175, 1);
}
.BtnCommon > div > *::after {
    content: ''; width: 0%; height: 100%; display: block; background: #dc8f37;
    position: absolute; left: 0; top: 0; opacity: 0;
    -webkit-transition: all .94s cubic-bezier(.2,.95,.57,.99);
    -moz-transition: all .4s cubic-bezier(.2,.95,.57,.99);
    -o-transition: all .4s cubic-bezier(.2,.95,.57,.99);
    transition: all .4s cubic-bezier(.2,.95,.57,.99);    
}
    .BtnCommon > div.reset > *::before { background: linear-gradient(to right, #7f7f7f 0%,#aaaaaa 100%); }
    .BtnCommon > div.reset > *::after { background: #7f7f7f; }
.BtnCommon > div > *:hover::before, .BtnCommon > div > *:focus::before { box-shadow:0 0px 8px rgba(0,0,0,.6); }
.BtnCommon > div > *:hover::after, .BtnCommon > div > *:focus::after { opacity:1; width: 100%; }

.BtnCommon > div > * > span { position: relative; z-index: 5; display: flex; align-items: center; justify-content: space-between; color: #fff; line-height: 1.5em; }
.BtnCommon > div > * > span::after { content: '\f00c'; font-family: 'Font Awesome 5 Pro'; font-weight: 400; color: #fff; display: inline-block; margin-left: .5em; }
.BtnCommon > div.reset > * > span::after { content: '\f2ea'; }
.BtnCommon > div.next > * > span::after { content: '\f178'; }

/* 表單送出畫面 */
.form_feedback_box { line-height: 1.333333em; }
.form_feedback_box p { margin-bottom: 1em; }
.form_feedback_box p:not(:first-child) { margin-top: 1em; }
.form_feedback_box .icon { 
	margin:0 auto 20px; 
	display: flex; justify-content: center; align-items: center;
	}
    .form_feedback_box .icon::before { font-family:"Font Awesome 5 Pro"; font-weight:700; font-size: 5rem; }
	.form_feedback_box .icon.check::before { content: '\f058'; }
	.form_feedback_box .icon.xmark::before { content: '\f057'; }

/* 全選 */
.all_box { padding: 10px; background-color: #fff; margin: 0 2px 2px; border-top: 2px solid #2ec8c0; }
.FormGroup.color2 .all_box { border-color: var(--color2); }

@media screen and (max-width: 639px) {
    .FormGroupWarp .FormGroup { margin: 40px 0 20px; }
    .FormGroup { padding: 40px 12px 25px 12px; margin-bottom:20px; }
    .FormGroup .FormGroupTitle { top: -22px; }
    .FormGroup .FormGroupTitle span { font-size: 1.125em; line-height: 40px; }
    .FormTable, .FormTable > tbody, .FormTable > tbody > tr, .FormTable > tbody > tr > th, .FormTable > tbody > tr > td { display:block; }
    .FormTable > tbody > tr > th { text-align:left; padding: 5px 8px; border-left: 4px solid var(--main_color); margin: 8px 0; }
    .FormTable > tbody > tr { padding: 5px 10px; }
    .FormGroup .FormTable > tbody > tr { padding: 5px; }
    .FormTable > tbody > tr > td { line-height:35px; }

    /* 表單元件 */
    .FormElmt input[type="text"], .FormElmt input[type="password"], .FormElmt input[type="file"], 
    .FormElmt input[type="number"], .FormElmt input[type="date"], .FormElmt input[type="month"],
    .FormElmt input[type="week"], .FormElmt input[type="time"], .FormElmt input[type="datetime-local"],
    .FormElmt input[type="email"], .FormElmt input[type="search"], .FormElmt input[type="tel"],
    .FormElmt input[type="url"] { line-height:35px; height:35px; }
    .FormElmt select { height:35px; }
    
    /* 按鈕 */
    .BtnCommon.large a, .BtnCommon.large button { font-size: 1em; }
    .BtnCommon > div { margin: 10px; }
}

@media screen and (min-width: 640px) {
    .FormTable { border-collapse: separate; border-spacing: 2px; }
    .FormTable > tbody > tr > th { vertical-align:top; text-align:left; line-height: 1.5rem; position: relative; padding:16px 15px; }
    .FormTable > tbody > tr > th .text { display: block; border-left: 4px solid var(--main_color); padding-left: 17px; }
    .FormGroup.color2 .FormTable > tbody > tr > th .text { border-color: var(--color2); }

    .input_boxs.two > div { width: calc(50% - 7px); margin-left: 14px; }
    .input_boxs.two > div:nth-child(odd) { margin-left: 0; }
    .input_boxs.threeQuarters > div { margin-left: calc(10px * 3 / 2); width: calc(100% / 3 - 10px); }
    .input_boxs.threeQuarters > div:nth-child(3n+1) { margin-left: 0; }
}

@media screen and (max-width: 1023px) {
    .two_table table.FormTable + table { margin-top: -2px; }
}

@media screen and (min-width: 640px) and (max-width: 1023px) {    
    .FormTable > tbody > tr > th { width:135px; }
    .FormTable > tbody > tr > td { padding:10px 15px 4px; }
    .FormGroup .FormTable > tbody > tr > td { padding:4px 0 4px 15px; }
    .two_table .FormTable > tbody > tr > th { width: 40%; }

    /* 表單元件 */
    .FormElmt input + input, .FormElmt input + select, .FormElmt select + input, .FormElmt select + select { margin-left:4px; }

    /* 表單元件 */
    .FormElmt input[type="text"], .FormElmt input[type="password"], .FormElmt input[type="file"], 
    .FormElmt input[type="number"], .FormElmt input[type="date"], .FormElmt input[type="month"],
    .FormElmt input[type="week"], .FormElmt input[type="time"], .FormElmt input[type="datetime-local"],
    .FormElmt input[type="email"], .FormElmt input[type="search"], .FormElmt input[type="tel"],
    .FormElmt input[type="url"] { line-height:40px; height:40px; }
    .FormElmt select { height:40px; }

    .FormElmt .go_btn input { line-height:40px; height:40px; }
    .form_box.FormElmt .go_btn input { width: 40px; }

    /* 按鈕 */
    .BtnCommon.large a, .BtnCommon.large button { font-size: 1.25em; }
    .BtnCommon > div { margin: 10px 15px; }
}

@media screen and (min-width: 1024px) {    
    .FormTable, .privacy_cont { font-size: 1.125rem; }
    .FormTable > tbody > tr > th { width:235px; }
    .FormTable > tbody > tr > th:empty::after { display:none; }
    .FormTable > tbody > tr > td { padding:6px 15px; }
    .FormGroup > * { max-width: 1060px; margin-left: auto; margin-right: auto; }
    .FormGroup .FormTable > tbody > tr > td { padding: 4px 0 4px 30px; }
    .FormBody { font-size: 1.125em; }
    .two_table { display: flex; }
    .two_table .FormTable > tbody > tr > th { width: 190px; }
    .FormGroup .two_table .FormTable > tbody > tr > td { padding: 6px 15px; }
    .form_feedback_box { font-size:1.125em; }

    /* 表單元件 */
    .FormElmt input + input, .FormElmt input + select, .FormElmt select + input, .FormElmt select + select { margin-left:4px; }
    .FormElmt .randomcode { align-items: center; }

    /* 表單元件 */
    .FormElmt input[type="text"], .FormElmt input[type="password"], .FormElmt input[type="file"], 
    .FormElmt input[type="number"], .FormElmt input[type="date"], .FormElmt input[type="month"],
    .FormElmt input[type="week"], .FormElmt input[type="time"], .FormElmt input[type="datetime-local"],
    .FormElmt input[type="email"], .FormElmt input[type="search"], .FormElmt input[type="tel"],
    .FormElmt input[type="url"] { line-height:40px; height:40px; }
    .FormElmt select { height:40px; }

    .FormElmt .go_btn input { line-height:40px; height:40px; }
    .form_box.FormElmt .go_btn input { width: 40px; }
}

@media screen and (min-width: 1280px) {
    .BtnCommon a, .BtnCommon button { padding: 17px 1em; width: 270px; }
    .two_table .FormTable > tbody > tr > th { width: 235px; }
    .FormGroup .two_table .FormTable > tbody > tr > td { padding: 4px 15px 4px 30px; }
}

/*----------------------------------------------------------------------*/
/* 客製checkbox/radio */
.control { cursor: pointer; position: relative; padding-left: 1.5em; }
.control_indicator { position: absolute; top: 3px; left: 0px; height: 18px; width: 18px; border: 1px solid #aaa; background: #fff; transition: all ease .2s; }
.control:hover input ~ .control_indicator { border: 1px solid #666; }
.control input:checked:focus ~ .control_indicator { border: 1px solid #1cafa4; }
.control input:disabled ~ .control_indicator { background: #fff; border: 1px solid #ccc; opacity: 0.5; pointer-events: none; }
.control_indicator:after { content: ''; position: absolute; visibility: hidden; opacity: 0; transition: all ease .2s; }
.control input:checked ~ .control_indicator:after { visibility: visible; opacity: 1; }

/* checkbox */
.control.control_checkbox input[type="checkbox"] { position: absolute; z-index: -1; opacity: 0; width: 0; height: 0; }
.control_checkbox input[type="checkbox"]:checked ~ .control_indicator {
    background: #1cafa4; border: 1px solid #1cafa4;
}
.control_checkbox:hover input:not([disabled]):checked ~ .control_indicator,
.control_checkbox input:checked:focus ~ .control_indicator {
    background: #1cafa4;
}
.control_checkbox .control_indicator { border-radius: 2px; }
.control_checkbox .control_indicator:after {
    left: 4px; top: 1px; width: 5px; height: 9px; border: solid #fff; border-width: 0 3px 3px 0; transform: rotate(45deg);
}
.control_checkbox input:disabled ~ .control_indicator:after {
    border-color: #fff;
}

/* radio */
.control.control_radio input[type="radio"] { position: absolute; z-index: -1; opacity: 0; width: 0; height: 0; }
.control_radio .control_indicator { border-radius: 50%; }
.control_radio:hover input:not([disabled]):checked ~ .control_indicator,
.control_radio input:checked:focus ~ .control_indicator {
    background: #fff;
}
.control_radio input:checked ~ .control_indicator {
    background: #fff; border: 1px solid #1cafa4;
}
.control_radio .control_indicator:after {
    left: 3px; top: 3px; height: 10px; width: 10px; border-radius: 50%; background: #1cafa4;
}
.control_radio input:disabled ~ .control_indicator:after {
    background: #1cafa4;
}

@media screen and (max-width: 1023px) {
    .control_indicator { top: 1px; }
}

/*----------------------------------------------------------------------*/
/* datepicker共通設定 */
.ui-datepicker { 
	background-color:#fff; padding:15px 8px 7px 8px; position:relative; display:none;
	box-shadow: 1px 2px 5px rgba(0,0,0,.08); border:1px solid #eee; border-radius:5px; 
	}
.ui-datepicker-prev, .ui-datepicker-next { 
	display:block; position:absolute; top:15px; width:36px; height:36px; cursor:pointer; 
	}
	.ui-datepicker-prev { left:0; }
	.ui-datepicker-next { right:0; }
.ui-datepicker-prev span, .ui-datepicker-next span { 
	display:block; position:absolute; top:50%; left:50%; margin:-6px 0 0 -6px; width:12px; height:12px; background:url("../images/icon_datepicker.png") no-repeat; 
	text-indent:-10000px; 
	}
	.ui-datepicker-prev span { background-position:0 0; }
	.ui-datepicker-next span { background-position:0 -12px; }
	.ui-datepicker-prev:hover span { background-position:-12px 0; }
	.ui-datepicker-next:hover span { background-position:-12px -12px; }
.ui-datepicker-title { text-align:center; font-size:0.9375rem; font-weight:bold; line-height:30px; }
.ui-datepicker-title select { height:36px; padding:7px 0 8px; border:1px solid #ccc; border-radius:5px; font-size:0.9375rem; transition: all ease .2s; }
    .ui-datepicker-title select:hover, .ui-datepicker-title select:focus { border-color: #666; }
.ui-datepicker-title select.ui-datepicker-year { margin-right:4px; }
.ui-datepicker-title select.ui-datepicker-month { margin-left:6px; }
.ui-datepicker-title select.ui-datepicker-month:first-child { margin-left:0; }
.ui-datepicker-title select.ui-datepicker-month + select.ui-datepicker-year { margin-left:6px; margin-right:0; }
.ui-datepicker-calendar { margin-top:5px; }
.ui-datepicker-calendar th, .ui-datepicker-calendar td { width:32px; padding:0; font-family:Arial, Helvetica, "微軟正黑體", sans-serif; text-align:center; }
.ui-datepicker-calendar th { font-size:0.875rem; font-weight:bold; }
.ui-datepicker-calendar td { font-size:0.875rem; }
	.ui-datepicker-calendar th span, .ui-datepicker-calendar td span, .ui-datepicker-calendar td a { display:block; padding:5px 0 5px; }
	.ui-datepicker-calendar td a { text-decoration:none; color:#333; line-height:22px; }
	.ui-datepicker-unselectable { color:#cfcfcf; }
	.ui-datepicker-today, .ui-datepicker-today a { background-color: #666; }
		.ui-datepicker-calendar td.ui-datepicker-today a { color:#fff !important; }
		.ui-datepicker-unselectable.ui-datepicker-today { background-color:#f0f0f0; }
	.ui-datepicker-calendar td a.ui-state-default:hover { color:var(--color3); }
	.ui-datepicker-current-day a { border:1px solid var(--color3); }
    .ui-datepicker-calendar .ui-datepicker-current-day a { color: var(--color3); }

/*----------------------------------------------------------------------*/
/* popup box */
.popup_box { 
	display:none; position:fixed; top:0; left:0; width:100%; height:100vh; background-color:rgba(0,0,0,0.7); box-sizing:border-box; z-index:10006; 
	}
	.popup_box.show { display:block; }
.popup_box .box_wrap { 
	background-color:#fff; position:relative; box-sizing:border-box;
	-webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px;
	-webkit-box-shadow: 0 0 20px rgba(0,0,0,0.75);
	-moz-box-shadow: 0 0 20px rgba(0,0,0,0.75);
	box-shadow: 0 0 20px rgba(0,0,0,0.75);
	}
.popup_box .box_wrap > div { overflow-y:auto; overflow-x:hidden; height:100%; box-sizing:border-box; position:relative; }
.popup_box .box_wrap > div::-webkit-scrollbar { -webkit-appearance:none; width:14px; height:14px; }
.popup_box .box_wrap > div::-webkit-scrollbar-thumb { border-radius:8px; border:3px solid #fff; background-color:rgba(0, 0, 0, .3); }
.popup_box .box_wrap > div::-webkit-scrollbar-thumb:hover { background-color:#000; }
.popup_box .cont > *:last-child { margin-bottom:0; }

.popup_box .close { 
	position:absolute; background-color:#bbb; text-indent:-10000px; cursor:pointer; z-index:10000;
	top:8px; right:8px; width:28px; height:28px;
	-webkit-border-radius:50%;
	-moz-border-radius:50%;
	border-radius:50%;
	}
.popup_box .close::before, .popup_box .close::after { 
	display:block; content:''; position:absolute; top:50%; left:50%; width:2px; height:14px; margin:-7px 0 0 -1px; background-color:#fff; 
	}
.popup_box .close::before {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    transform: rotate(-45deg);
	}
.popup_box .close::after {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
	}
.popup_box .close:hover { background-color:#333; }

@media screen and (max-width: 639px) {
    .popup_box { padding:12px; }
    .popup_box .box_wrap { padding:10px; }
    .popup_box .box_wrap > div { height:calc(100vh - 44px); }
}

/*----------------------------------------------------------------------*/
/* 提醒視窗 */
.modal {
    display: none; position: fixed; z-index: 999; left: 0; top: 0;
    width: 100%; height: 100%; overflow: auto; background-color: rgba(0,0,0,0.4); 
    -webkit-animation-name: fadeIn; -webkit-animation-duration: 0.4s;
    animation-name: fadeIn; animation-duration: 0.4s
}
.modal-content {
    position: relative; background-color: #fefefe; width: 90%; margin: 15% auto; max-width: 400px;
    -webkit-animation-name: fadeIn; -webkit-animation-duration: 0.4s;
    animation-name: fadeIn; animation-duration: 0.4s
}
.close { color: #333; float: right; font-size: 28px; font-weight: bold; }
.close:hover, .close:focus { color: #000; text-decoration: none; cursor: pointer; }
.modal-body { padding: 24px; font-size: 1.5em; }
.modal-content .btn_box { padding: 18px; }
.modal-content .btn_box > div { width: 100%; }
.modal-content .btn_box a { width: auto; }

@-webkit-keyframes fadeIn {
    from {opacity: 0 } 
    to {opacity: 1 }
}
@keyframes fadeIn {
    from { opacity: 0 } 
    to { opacity: 1 }
}

@media screen and (max-width: 1023px) {
    .modal { padding-top: 100px; }
    .modal-content { margin: auto; }
    .modal-body { font-size: 1.125em; padding-bottom: 0; }
}

/*----------------------------------------------------------------------*/
/* 編輯器 */
.editable_content { padding-top: 10px; }
.editable_content.content { margin-top:20px; margin-bottom:30px; }

/* 為文字上稿區可能出現的元素做設定 */
.editable_content, .editable_content p, .editable_content li, .editable_content dt, .editable_content dd, .editable_content div, .editable_content blockquote { 
	line-height:1.5em; font-size: 1.125rem;
	}
.editable_content .district, .editable_content div, .editable_content table, .editable_content iframe, .editable_content blockquote { 
	margin-top:2.25em; margin-bottom:2.25em; 
	}
.editable_content p, .editable_content ul, .editable_content ol, .editable_content dl { 
	margin-top:1.25em; margin-bottom:1.25em; 
	}
.editable_content p { padding:0; }
.editable_content h4, .editable_content h5, .editable_content h6 { margin-bottom:5px; line-height:1.5em; }
.editable_content h4 + *:not(h4):not(h5):not(h6),
.editable_content h5 + *:not(h4):not(h5):not(h6),
.editable_content h6 + *:not(h4):not(h5):not(h6) { margin-top:0.625em; }
.editable_content h4 + h4, .editable_content h4 + h5, .editable_content h4 + h6,
.editable_content h5 + h4, .editable_content h5 + h5, .editable_content h5 + h6,
.editable_content h6 + h4, .editable_content h6 + h5, .editable_content h6 + h6 { margin-top:1.25em; }
	.editable_content h4 { font-size:1.5rem; color:#222; overflow:hidden; border-left: 4px solid #2ec8c0; padding-left: .75em; }
	.editable_content h5 { font-size:1.375rem; color:#222; }
	.editable_content h6 { font-size:1.25rem; color:#222; }
.editable_content blockquote {
    margin:0px 0 35px 0; padding:4rem 55px; background: #f5f5f5; border-left:none; overflow:hidden; position: relative; font-family:'Noto Sans TC', sans-serif; font-weight: 500;
    }
.editable_content blockquote::before, .editable_content blockquote::after { 
        display:block; content: ''; position: absolute; width: 38px; height: 47px; background: url(../images/icon_quote.png) no-repeat; background-size: contain;
    }
	.editable_content blockquote::before { left: 15px; top: 15px; }
	.editable_content blockquote::after { right: 20px; bottom: 15px; transform: rotate(180deg); }
    .editable_content .district .imgleft ~ blockquote, .editable_content .district .imgright ~ blockquote { 
        margin-left:0; margin-right:0; 
        }

.editable_content ol { list-style-type:decimal; padding-left:2em; overflow:hidden; }
.editable_content ul { list-style-type:disc; padding-left:2em; overflow:hidden; }
	.editable_content ul[type="disc"] { list-style-type:disc; }
	.editable_content ul[type="circle"] { list-style-type:circle; }
	.editable_content ul[type="square"] { list-style-type:square; }
.editable_content li { margin-bottom:0.625em; }
.editable_content ol ol { list-style-type:lower-alpha; }
.editable_content ul ul { list-style-type:circle; }
.editable_content ul ul, .editable_content ul ol, .editable_content ol ul, .editable_content ol ol { margin-top:5px; margin-bottom:0; }
.editable_content ul li:last-child, .editable_content ol li:last-child { margin-bottom:0; }
.editable_content dl { overflow:hidden; }
.editable_content dl dt { font-weight:bold; margin-bottom:0.625em; }
.editable_content dl dd { padding-left:25px; margin-bottom:0.625em; position:relative; }
.editable_content dl dd::before {  
	content:''; display:block; position:absolute; top:1em; left:6px; width:6px; height:6px; margin-top:-3px; background-color:#333; border-radius:50%; }
	
.editable_content dl dl, .editable_content dl ul, .editable_content dl ol, .editable_content ul dl.editable_content ol dl { margin-top:5px; margin-bottom:0; }
.editable_content dl dd:last-child { margin-bottom:0; }
.editable_content hr { margin:1.875em 0; }

/* 影片、相關連結、相關檔案 */
.MsgModule_Download span, .MsgModule_Link span { white-space:nowrap; font-weight:bold; color: #038e81; }
.MsgModule_Download + .MsgModule_Download, .MsgModule_Download + .MsgModule_Link, .MsgModule_Link + .MsgModule_Download, .MsgModule_Link + .MsgModule_Link { 
	margin-top:-10px; 
	}
.editable_content .MsgModule_Download span.file_hashes { margin-left:4px; }
	
    .editable_content .MsgModule_Media { margin-left:auto; margin-right:auto; width:560px; }
	.editable_content .MsgModule_Media.left { margin-left:0; }
	.editable_content .MsgModule_Media.right { margin-right:0; }
	.editable_content .MsgModule_Media.landscape { width:560px; }
	.editable_content .MsgModule_Media.portrait { width:315px; }
.editable_content .MsgModule_Media .media_wrap { margin-top:0; margin-bottom:0; padding-bottom:56.25%; text-align:left; position:relative; overflow:hidden; }
	.editable_content .MsgModule_Media.landscape.ratio_16by9 .media_wrap { padding-bottom:56.25%; }
	.editable_content .MsgModule_Media.portrait.ratio_16by9 .media_wrap { padding-bottom:177.77%; }
	.editable_content .MsgModule_Media.landscape.ratio_4by3 .media_wrap { padding-bottom:75%; }
	.editable_content .MsgModule_Media.portrait.ratio_4by3 .media_wrap { padding-bottom:133.33%; }
	.editable_content .MsgModule_Media .media_wrap iframe,
	.editable_content .MsgModule_Media .media_wrap object,
	.editable_content .MsgModule_Media .media_wrap embed { position:absolute; top:0; left:0; width:100%; height:100%; border:0; margin:0; }
.editable_content .MsgModule_Media .describe { text-align:left; margin:0; padding:20px; background-color:#ebebeb; line-height:150%; }
	.editable_content .MsgModule_Media .describe span { display:block; }
	.editable_content .MsgModule_Media .describe .title { margin-bottom:10px; }
	.editable_content .MsgModule_Media .describe .desc { font-size:0.9375rem; }
	.editable_content noscript div.ytlink { padding:0; margin:0; line-height:1.25em; }/* no script時影片區塊顯示的訊息 */
	
.editable_content .MsgModule_Media video  { display:block; width:100%; }

/* 文繞圖設定 */
.editable_content .district::after { content:''; display:block; clear:both; }
.editable_content .district > *:first-child { margin-top:0; }
.editable_content .district > *:last-child { margin-bottom:0; }
.editable_content .img_bg { margin-bottom:20px; text-align:center; }
.editable_content .img_bg figure { display:inline-block; margin:0; }
.editable_content .imgleft { float:left; }
.editable_content .imgright { float:right; }
.editable_content .imgcenter { clear:both; text-align:center; max-width:1200px; margin-left:auto; margin-right:auto; }
.editable_content .imgleft, .editable_content .imgright { max-width:50%; }
.editable_content .img_bg figcaption, .editable_content .img_bg span { 
	display:block; padding:0 0 0 14px; margin:0 auto; position:relative;
	font-size:0.875rem; font-weight:300; color:#555; line-height:1.5em; text-align:left; 
	}
.editable_content .img_bg figcaption::after, .editable_content .img_bg span::after { 
	content:''; display:block; position:absolute; top:9px; left:0;
	border-left:5px solid transparent; border-right:5px solid transparent; border-bottom:5px solid #999;
	}
	
/* 單篇延伸區塊 */
.editable_content h4.ext_title { margin-top:25px; margin-bottom: 10px; position:relative; font-size:1.5rem; letter-spacing:0.05em; padding-top: 0; padding-bottom: 0; display: flex; align-items: center; border-left: 0; padding-left: 0; }
h4.ext_title:before { content: ""; flex-shrink: 0; margin-right: 5px; width: 40px; height: 40px; background-image: url(../images/member_icon_module.png); background-repeat: no-repeat; background-size: 100%; }
	h4.icon_file:before { background-position: 0 0; }
	h4.icon_link:before { background-position: 0 50%; }
	h4.icon_photo:before { background-position: 0 100%; }
.editable_content+h4.ext_title { margin-top:30px; }
.prevNextLink+h4.ext_title { margin-top:30px; }

.editable_content ul.ext_list { padding-left: 0; }
.editable_content ul.ext_list li { position:relative; margin: 5px 8px 5px 0; line-height:1.5em; background-color: #f2f2f2; border: 1px solid #d3d3d3; padding: 0.375em .75em; border-radius: 10px; display: inline-flex; align-items: center; flex-wrap: wrap; }
.editable_content ul.ext_list li a { color:#333; text-decoration:none; word-wrap:break-word; }
.editable_content ul.ext_list li:hover { background-color: transparent; }
.editable_content ul.ext_list li a:hover, ul.ext_list li a:focus { text-decoration: underline; color: var(--color1); }
.editable_content ul.ext_list li span.file_ext { width:24px; height:24px; margin-left:6px; text-indent:-10000px; vertical-align: middle; }

/* html編輯區的表格預設樣式 */
.editable_content table[align="center"] { margin-left:auto; margin-right:auto; }
.editable_content table caption { margin:5px 0; padding:5px 0; font-weight:bold; color:#333; text-align:left; line-height:1.5em; }
.editable_content .tableWrap { position:relative; overflow-y:auto; _overflow:auto; width:100%; margin-bottom:1em; -webkit-overflow-scrolling:touch; }
.editable_content .tableWrap table { margin:0; }
/*添加IOS下卷軸*/
.editable_content .tableWrap::-webkit-scrollbar { -webkit-appearance:none; width:14px; height:14px; }
.editable_content .tableWrap::-webkit-scrollbar-thumb { border-radius:8px; border:3px solid #fafafa; background-color:rgba(0, 0, 0, .3); }
.editable_content .tableWrap::-webkit-scrollbar-thumb:hover { background-color: var(--main_color); }

/* 移除第一個物件的上邊界、上間距避免過大的空白 */
.editable_content > *:first-child, .editable_content blockquote > *:first-child, .editable_content td > *:first-child { 
	margin-top:0; 
	}
/* 移除最後一個物件的下邊界、下間距避免過大的空白 */
.editable_content > *:last-child, .editable_content blockquote > *:last-child, .editable_content td > *:last-child { 
	margin-bottom:0; 
	}
/* 避免爆版 */
.editable_content iframe, 
.editable_content img, 
.editable_content div, 
.editable_content p, 
.editable_content span, 
.editable_content ul,
.editable_content ol,
.editable_content li,
.editable_content figure, 
.editable_content figcaption { 
	max-width:100%; 
	}
.editable_content * { word-wrap:break-word; }
/* 取消圖片的高度設定避免RWD時不等比例縮放 */
.editable_content img { height:auto; }

/* html編輯區的表格外框樣式 */
.editable_content .table_style1 { width:100%; border-left:1px solid #333; border-top:1px solid #333; }
.editable_content .table_style1 > tbody > tr > th, .editable_content .table_style1 > tbody > tr > td { 
	padding:5px 8px; border-right:1px solid #333; border-bottom:1px solid #333; line-height:160%; 
	}
.editable_content .table_style1 > tbody > tr > th { background-color:#dedede; color:#333; white-space:nowrap; }
.editable_content .table_style1 > tbody > tr > td { background-color:#fff; color:#333; }

@media screen and (max-width: 639px) {
    .editable_content .district .imgleft, .editable_content .district .imgright { float:none; clear:both; max-width:100%; text-align:center; margin-left:auto; margin-right:auto; }
    .editable_content blockquote { padding: 50px 20px 55px; }
    .editable_content h4.ext_title { margin-bottom: 10px; }
    #colorbox_thum a { width:120px; height:90px; margin:0 5px 5px; }
}
@media screen and (min-width: 640px) and (max-width: 1279px) {
    .editable_content .imgleft { margin-right:20px; }
    .editable_content .imgright { margin-left:20px; }
}

@media screen and (min-width: 640px) and (max-width: 1023px) {    
    #colorbox_thum a { width: 160px; height: 120px; margin:0 10px 20px; }
}
@media screen and (min-width: 1024px) {  
    #colorbox_thum a { margin-bottom: 20px; margin-left: calc(20px * 6 / 5); width: calc(100% / 6 - 20px);  }
    #colorbox_thum a:nth-child(6n+1) { margin-left: 0; }
    .editable_content blockquote { font-size: 1.125em; }
}
@media screen and (min-width: 1280px) {
    .editable_content .imgleft { margin-right:25px; }
    .editable_content .imgright { margin-left:25px; }
    .editable_content { font-size: 1.125em; }
    .editable_content ul.ext_list { font-size: 1.125rem; }
}

/*----------------------------------------------------------------------*/
/* 微編輯器 */
.textarea_editor, .textarea_editor p, .textarea_editor li, .textarea_editor dt, .textarea_editor dd, .textarea_editor div, .textarea_editor blockquote { 
	line-height:1.5em;
	}
.textarea_editor div, .textarea_editor table, .textarea_editor iframe { 
	margin-top:1.5em; margin-bottom:1.5em; 
	}
.textarea_editor p, .textarea_editor ul, .textarea_editor ol, .textarea_editor dl, .textarea_editor blockquote { 
	margin-top:1.25em; margin-bottom:1.25em; 
	}
.textarea_editor p { padding:0; }
.textarea_editor h4, .textarea_editor h5, .textarea_editor h6 { margin-bottom:5px; line-height:1.5em; }
.textarea_editor h4 + *:not(h4):not(h5):not(h6),
.textarea_editor h5 + *:not(h4):not(h5):not(h6),
.textarea_editor h6 + *:not(h4):not(h5):not(h6) { margin-top:0.625em; }
.textarea_editor h4 + h4, .textarea_editor h4 + h5, .textarea_editor h4 + h6,
.textarea_editor h5 + h4, .textarea_editor h5 + h5, .textarea_editor h5 + h6,
.textarea_editor h6 + h4, .textarea_editor h6 + h5, .textarea_editor h6 + h6 { margin-top:1.25em; }
	.textarea_editor h4 { font-size:1.375rem; color:#4c7697; overflow:hidden; }
	.textarea_editor h5 { font-size:1.25rem; }
	.textarea_editor h6 { font-size:1.125rem; }
.textarea_editor blockquote { 
	padding:15px 24px; overflow:hidden; position:relative; box-sizing:border-box; 
	}
.textarea_editor blockquote::before, .textarea_editor blockquote::after { 
	display:block; position:absolute; font-family: "PT Sans", serif; font-weight: 700; line-height:100%; font-size:48px; 
	}
	.textarea_editor blockquote::before { content:'“'; left:0; top:0; }
	.textarea_editor blockquote::after { content:'”'; right:0; bottom:-20px; }

.textarea_editor ol { list-style-type:decimal; padding-left:2em; overflow:hidden; }
.textarea_editor ul { list-style-type:disc; padding-left:2em; overflow:hidden; }
	.textarea_editor ul[type="disc"] { list-style-type:disc; }
	.textarea_editor ul[type="circle"] { list-style-type:circle; }
	.textarea_editor ul[type="square"] { list-style-type:square; }
.textarea_editor li { margin-bottom:0.625em; }
.textarea_editor ol ol { list-style-type:lower-alpha; }
.textarea_editor ul ul { list-style-type:circle; }
.textarea_editor ul ul, .textarea_editor ul ol, .textarea_editor ol ul, .textarea_editor ol ol { margin-top:5px; margin-bottom:0; }
.textarea_editor ul li:last-child, .textarea_editor ol li:last-child { margin-bottom:0; }
.textarea_editor dl { overflow:hidden; }
.textarea_editor dl dt { font-weight:bold; margin-bottom:0.625em; }
.textarea_editor dl dd { padding-left:25px; margin-bottom:0.625em; position:relative; }
.textarea_editor dl dd::before {  
	content:''; display:block; position:absolute; top:1em; left:6px; width:6px; height:6px; margin-top:-3px; background-color:#333; border-radius:50%; }
	
.textarea_editor dl dl, .textarea_editor dl ul, .textarea_editor dl ol, .textarea_editor ul dl.textarea_editor ol dl { margin-top:5px; margin-bottom:0; }
.textarea_editor dl dd:last-child { margin-bottom:0; }
.textarea_editor hr { margin:1.625em 0; }

/* html編輯區的表格預設樣式 */
.textarea_editor table[align="center"] { margin-left:auto; margin-right:auto; }
.textarea_editor table caption { margin:5px 0; padding:5px 0; font-weight:bold; color:#333; text-align:left; line-height:1.5em; }
.textarea_editor .tableWrap { position:relative; overflow-y:auto; _overflow:auto; width:100%; margin-bottom:1em; -webkit-overflow-scrolling:touch; }
.textarea_editor .tableWrap table { margin:0; }
/*添加IOS下卷軸*/
.textarea_editor .tableWrap::-webkit-scrollbar { -webkit-appearance:none; width:14px; height:14px; }
.textarea_editor .tableWrap::-webkit-scrollbar-thumb { border-radius:8px; border:3px solid #fafafa; background-color:rgba(0, 0, 0, .3); }
.textarea_editor .tableWrap::-webkit-scrollbar-thumb:hover { background-color:#4c7697; }

/* 移除第一個物件的上邊界、上間距避免過大的空白 */
.textarea_editor > *:first-child, .textarea_editor .district > *:first-child, .textarea_editor blockquote > *:first-child, .textarea_editor td > *:first-child { 
	margin-top:0; 
	}
/* 移除最後一個物件的下邊界、下間距避免過大的空白 */
.textarea_editor > *:last-child, .textarea_editor .district > *:last-child, .textarea_editor blockquote > *:last-child, .textarea_editor td > *:last-child { 
	margin-bottom:0; 
	}
/* 避免爆版 */
.textarea_editor iframe, 
.textarea_editor img, 
.textarea_editor div, 
.textarea_editor p, 
.textarea_editor span, 
.textarea_editor ul,
.textarea_editor ol,
.textarea_editor li,
.textarea_editor figure, 
.textarea_editor figcaption { 
	max-width:100%; 
	}
.textarea_editor * { word-wrap:break-word; }
/* 取消圖片的高度設定避免RWD時不等比例縮放 */
.textarea_editor img { height:auto; }

/*----------------------------------------------------------------------*/
/*
    ColorBox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper { position:absolute; top:0; left:0; z-index:10001; overflow:hidden; }
#cboxOverlay { position:fixed; width:100%; height:100%; }
#cboxMiddleLeft, #cboxBottomLeft { clear:left; }
#cboxContent { position:relative;font-size:14px; text-align:center; }
#cboxLoadedContent { overflow:auto;padding:30px 5px 60px 5px; }
#cboxTitle { margin:0; }
#cboxLoadingOverlay, #cboxLoadingGraphic { position:absolute; top:0; left:0; width:100%; height:100%; }
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow { cursor:pointer; }
.cboxPhoto { float:left; margin:auto; border:0; display:block; max-width:none; }
.cboxIframe { width:100%; height:100%; display:block; border:0; }
#colorbox, #cboxContent, #cboxLoadedContent { box-sizing:content-box; }

#colorbox_thum { display:flex; align-items:center; flex-wrap:wrap; }
#colorbox_thum a { display:block; text-align:center; vertical-align:middle; }
#colorbox_thum a:hover { 
    transform: scale(1.02);
	}
#colorbox_thum a * { vertical-align:middle; }
#colorbox_thum a span { display:inline-block; height:100%; }
#colorbox_thum a img { max-width:100%; max-height:100%; }

@media screen and (max-width:399px) {
#colorbox_thum { margin-left:-5px; margin-right:-5px; }
#colorbox_thum a { padding:5px; }
}
@media screen and (min-width: 400px) {
#colorbox_thum { margin-left:-10px; margin-right:-10px; }
#colorbox_thum a { padding:10px; }
}

@media screen and (max-width: 639px) {
#colorbox_thum a { width:140px; height:100px; }
}
@media screen and (min-width: 640px) and (max-width: 1199px) {
#colorbox_thum a { width:180px; height:120px; }
}
@media screen and (min-width: 1200px) {
#colorbox_thum a { height:145px; }
}

/* 
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay { background:#000; }
#colorbox {}
    #cboxContent { margin-top:20px; }
        .cboxIframe { background:#fff; }
        #cboxError { padding:50px; border:1px solid #ccc; }
        #cboxLoadedContent { border:5px solid #000; background:#000; }
        #cboxTitle { position:absolute; bottom:10px; *bottom:20px; left:0; width:100%; padding:0 10px; box-sizing:border-box; color:#fff; line-height:18px; }
        #cboxCurrent { position:absolute; top:-20px; right:0px; color:#ccc; }
        #cboxSlideshow { position:absolute; top:-20px; right:90px; color:#fff; }
        #cboxPrevious { 
			position:absolute; top:50%; left:5px; margin-top:-32px; background:url("../images/colorbox_controls.png") no-repeat top left; 
			width:28px; height:65px; text-indent:-9999px;
			}
        #cboxPrevious:hover { background-position:bottom left; }
        #cboxNext { 
			position:absolute; top:50%; right:5px; margin-top:-32px; background:url("../images/colorbox_controls.png") no-repeat top right; 
			width:28px; height:65px; text-indent:-9999px;
			}
        #cboxNext:hover { background-position:bottom right; }
        #cboxLoadingOverlay { background:#000; }
        #cboxLoadingGraphic { background:url("../images/colorbox_loading.gif") no-repeat center center; }
        #cboxClose { 
			position:absolute; top:5px; right:5px; display:block; background:url("../images/colorbox_controls.png") no-repeat top center; 
			width:38px; height:19px; text-indent:-9999px;
			}
        #cboxClose:hover {background-position:bottom center; }	

/*----------------------------------------------------------------------*/
/*測試用menu*/
.ifun_text_menu { position:fixed; top:0; left:0; z-index:10004; }
.ifun_text_menu a { display:block; text-decoration:none; }
.ifun_text_menu a:hover { color: #f08000; }
.ifun_text_menu li { position: relative; }
.ifun_text_menu > ul > li > a { text-indent:-10000px; width:30px; height:30px; }
.ifun_text_menu > ul ul { display:none; position:absolute; top:30px; left:0; width:160px; }
.ifun_text_menu > ul ul > li:hover > ul { display:block; }
.ifun_text_menu > ul ul li { background-color:rgba(255,255,255,0.75); }
.ifun_text_menu > ul ul a, .ifun_text_menu > ul ul span { padding:5px 10px; line-height:180%; font-size:0.875rem; color:#333; }
.ifun_text_menu li.with::after { content: ''; position: absolute; right: 5px; top: 13px; width: 0; height: 0; border-style: solid; border-width: 4px 0 4px 7px; border-color: transparent transparent transparent #333; }
.ifun_text_menu > ul > li:hover > ul { display:block; }
.ifun_text_menu > ul ul ul { top: 0; left: 160px; }
.ifun_text_menu .other { border-top: 1px solid #ccc; }

/*----------------------------------------------------------------------*/
/* jQuery.mmenu CSS */

#nav ul { display:none; }/*預先隱藏選單*/

@media screen and (min-width: 1024px) {
#nav, #MenuMobile, .switch {
	display: none;
}
}
@media screen and (max-width: 1023px) {
.switch a {
	display: block;	position: fixed; top: 8px; left: 12px;
    font-size: 0;
	z-index:10005;
	background-color: var(--main_color);
	border-radius:10px;
	transition-delay:0.3s;
}
html.mm-opening .switch a { 
	/*opacity:0; */ transition-delay:0s;
	}
.menu-action::after, .menu-action::before, .menu-action > i::before  {
	background:#fff none repeat scroll 0 0;
	content:"";
	height:2px;
	left:0;
	position:absolute;
	border-radius:2px;
    transition: all 0.3s ease;
}
.menu-action, .menu-action > i {
	position:absolute;
	top:50%;
	transform:translateY(-50%);
}
.menu-action::after { bottom:7px; }
.menu-action::before { top:7px; }
.menu-action > i { height:2px; left:0; text-indent:-999px; overflow:hidden; }
.menu-action > i::before { top:0; }

	.mm-opened .menu-action > i { opacity:0; }
	.mm-opened .menu-action::after {
		bottom:14px;
		transform: rotate(45deg);
		}
	.mm-opened .menu-action::before {
		top:14px;
		transform: rotate(-45deg);
		}

.menu-action::after, .menu-action::before, .menu-action > i::before, .menu-action, .menu-action > i { width:30px; }
.menu-action { height:30px; left:50%; margin-left:-15px; }

@media screen and (max-width: 639px) {
.switch a { width: 40px; height: 40px; top: 10px; }
.menu-action::after, .menu-action::before, .menu-action > i::before, .menu-action, .menu-action > i { width: 24px; }
.menu-action { margin-left: -12px; }
}
@media screen and (min-width: 640px) {
.switch a { width: 48px; height: 48px; }
}

.mm-search.mm-listitem { padding:10px; }
.mm-search.mm-listitem::after { inset-inline-start: 0; }
.mm-search .search_box { width:100%; position:relative; }
.mm-search .search_box input[type="text"] { 
	width:100%; height:40px; line-height:40px; padding:0 40px 0 8px; background-color:rgba(0, 0, 0, .05); border:none; font-size:1em; border-radius: 5px;
	}
.mm-search .search_box input[type="text"], .mm-search .search_box input[type="text"]::placeholder { color:#636363; }
.mm-search .search_box .btn { 
	position:absolute; top:-1px; right:-1px; width:40px; height:40px; text-indent:-9999px; overflow:hidden;
	}
.mm-search .search_box .btn::before { 
	content:''; display:block; position:absolute; top:50%; left:50%; width:18px; height:18px; margin:-9px 0 0 -9px; 
	background:url(../images/icon_search.svg) no-repeat 0 0; background-size:100%; 
	}

/* mmenu補丁 */
#mm-1 .mm-navbar { display:none; }
#MenuMobile .mm-navbars--bottom .mm-navbar { padding: 8px 0; background: var(--main_color); }
#MenuMobile .mm-navbars--bottom ul { display: flex; flex-wrap: wrap; }
#MenuMobile .mm-navbars--bottom ul li { padding: 0 8px; margin: 5px 0; }
#MenuMobile .mm-navbars--bottom li a { color: #fff; }
#MenuMobile .mm-navbars--bottom .social li { height: 30px; }
#MenuMobile .mm-navbars--bottom .social li a { padding: 0; }
#MenuMobile .mm-navbars--bottom li:not(:last-child) { border-right: 1px solid #ccc; }

/*!
 * mmenu.js
 * mmenujs.com
 *
 * Copyright (c) Fred Heusschen
 * frebsite.nl
 *
 * License: CC-BY-NC-4.0
 * http://creativecommons.org/licenses/by-nc/4.0/
 */
:root {
    --mm-lineheight: 22px
}

.mm-hidden {
    display: none !important
}

.mm-wrapper {
    overflow-x: hidden;
    position: relative
}

.mm-menu,
.mm-menu *,
.mm-menu :after,
.mm-menu :before {
    -webkit-transition-property: none;
    -o-transition-property: none;
    transition-property: none;
    -webkit-transition-duration: .4s;
    -o-transition-duration: .4s;
    transition-duration: .4s;
    -webkit-transition-timing-function: ease;
    -o-transition-timing-function: ease;
    transition-timing-function: ease
}

:root {
    --mm-blocker-visibility-delay: 0.4s;
    --mm-blocker-opacity-delay: 0s
}

.mm-blocker {
    display: block;
    position: absolute;
    bottom: 100%;
    top: 0;
    right: 0;
    left: 0;
    z-index: 3;
    opacity: 0;
    background: var(--mm-color-background);
    -webkit-transition: bottom 0s ease var(--mm-blocker-visibility-delay), width .4s ease, opacity .4s ease var(--mm-blocker-opacity-delay), -webkit-transform .4s ease;
    transition: bottom 0s ease var(--mm-blocker-visibility-delay), width .4s ease, opacity .4s ease var(--mm-blocker-opacity-delay), -webkit-transform .4s ease;
    -o-transition: bottom 0s ease var(--mm-blocker-visibility-delay), width .4s ease, opacity .4s ease var(--mm-blocker-opacity-delay), transform .4s ease;
    transition: bottom 0s ease var(--mm-blocker-visibility-delay), width .4s ease, opacity .4s ease var(--mm-blocker-opacity-delay), transform .4s ease;
    transition: bottom 0s ease var(--mm-blocker-visibility-delay), width .4s ease, opacity .4s ease var(--mm-blocker-opacity-delay), transform .4s ease, -webkit-transform .4s ease
}

.mm-blocker:focus-visible {
    opacity: .75
}

.mm-btn {
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    width: 50px;
    padding: 0
}

.mm-btn--next,
[dir=rtl] .mm-btn--prev {
    --mm-btn-rotate: 135deg
}

.mm-btn--prev,
[dir=rtl] .mm-btn--next {
    --mm-btn-rotate: -45deg
}

.mm-btn--next:after,
.mm-btn--prev:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    width: 8px;
    height: 8px;
    margin: auto;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 2px solid var(--mm-color-icon);
    border-bottom: none;
    border-right: none;
    -webkit-transform: rotate(var(--mm-btn-rotate));
    -ms-transform: rotate(var(--mm-btn-rotate));
    transform: rotate(var(--mm-btn-rotate))
}

.mm-btn--prev:before {
    inset-inline-start: 23px
}

.mm-btn--next:after {
    inset-inline-end: 23px
}

.mm-btn--close:before {
    content: "×";
    font-size: 150%
}

.mm-btnreset {
    padding: 0;
    background: 0 0;
    border: none;
    cursor: pointer
}

.mm-divider {
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    position: -webkit-sticky;
    position: sticky;
    z-index: 2;
    top: 0;
    min-height: var(--mm-lineheight);
    padding: calc((var(--mm-listitem-size) * .65 - var(--mm-lineheight)) * .5) 20px;
    font-size: 75%;
    text-transform: uppercase;
    background: var(--mm-color-background);
    background-image: -webkit-gradient(linear, left top, left bottom, from(var(--mm-color-background-highlight)), to(var(--mm-color-background-highlight)));
    background-image: -o-linear-gradient(var(--mm-color-background-highlight), var(--mm-color-background-highlight));
    background-image: linear-gradient(var(--mm-color-background-highlight), var(--mm-color-background-highlight));
    opacity: 1;
    -webkit-transition-property: opacity;
    -o-transition-property: opacity;
    transition-property: opacity
}

.mm-navbar:not(.mm-hidden)~.mm-listview .mm-divider {
    top: var(--mm-navbar-size)
}

:root {
    --mm-listitem-size: 50px
}

.mm-listitem {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    position: relative;
    padding: 0;
    margin: 0;
    color: var(--mm-color-text);
    border-color: var(--mm-color-border)
}

.mm-listitem:after {
    content: "";
    border-color: inherit;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    display: block;
    position: absolute;
    inset-inline-start: 20px;
    inset-inline-end: 0;
    bottom: 0
}

.mm-listitem__btn,
.mm-listitem__text {
    padding: calc((var(--mm-listitem-size) - var(--mm-lineheight))/ 2) 0
}

.mm-listitem__text {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -ms-flex-preferred-size: 10%;
    flex-basis: 10%;
    display: block;
    padding-left: 20px;
    padding-right: 20px;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.mm-listitem__btn {
    display: block;
    position: relative;
    width: auto;
    -webkit-padding-end: 50px;
    padding-inline-end: 50px;
    border-color: inherit;
    background: rgba(3, 2, 1, 0)
}

.mm-listitem__btn:not(.mm-listitem__text) {
    border-left-width: 1px;
    border-left-style: solid
}

.mm-listitem--selected>.mm-listitem__text {
    background: var(--mm-color-background-emphasis)
}

.mm-listitem--opened>.mm-listitem__btn,
.mm-listitem--opened>.mm-panel {
    background: var(--mm-color-background-highlight)
}

.mm-listview {
    list-style: none;
    display: block;
    padding: 0;
    margin: 0
}

.mm-menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 0;
    margin: 0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 0;
    -ms-scroll-chaining: none;
    overscroll-behavior: none;
    background: var(--mm-color-background);
    border-color: var(--mm-color-border);
    color: var(--mm-color-text);
    line-height: var(--mm-lineheight);
    -webkit-tap-highlight-color: var(--mm-color-background-emphasis);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.mm-menu ::-webkit-input-placeholder {
    color: var(--mm-color-text-dimmed)
}

.mm-menu ::-moz-placeholder {
    color: var(--mm-color-text-dimmed)
}

.mm-menu :-ms-input-placeholder {
    color: var(--mm-color-text-dimmed)
}

.mm-menu ::-ms-input-placeholder {
    color: var(--mm-color-text-dimmed)
}

.mm-menu ::placeholder {
    color: var(--mm-color-text-dimmed)
}

.mm-menu,
.mm-menu * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.mm-menu :focus,
.mm-menu :focus-visible,
.mm-menu:focus,
.mm-menu:focus-visible {
    outline: 0
}

.mm-menu a,
.mm-menu button,
.mm-menu label {
    color: inherit
}

.mm-menu a:focus,
.mm-menu button:focus,
.mm-menu label:focus {
    outline: 0
}

.mm-menu a:focus-visible,
.mm-menu button:focus-visible,
.mm-menu label:focus-visible {
    outline: 2px solid var(--mm-color-focusring);
    outline-offset: -5px
}

.mm-menu input:focus,
.mm-menu input:focus-visible,
.mm-menu select:focus,
.mm-menu select:focus-visible,
.mm-menu textarea:focus,
.mm-menu textarea:focus-visible {
    outline: 2px solid var(--mm-color-focusring);
    outline-offset: 2px
}

.mm-menu a,
.mm-menu a:active,
.mm-menu a:hover,
.mm-menu a:link,
.mm-menu a:visited {
    text-decoration: none;
    color: inherit
}

:root {
    --mm-navbar-size: 50px
}

.mm-navbar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 2;
    min-height: var(--mm-navbar-size);
    padding-top: env(safe-area-inset-top);
    color: var(--main_color2);
	font-weight: bold;
    text-align: center;
    opacity: 1;
    background: var(--mm-color-background);
    border-bottom: 1px solid var(--mm-color-border);
    -webkit-transition-property: opacity;
    -o-transition-property: opacity;
    transition-property: opacity;
}

.mm-navbar>* {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.mm-navbar__btn {
    -webkit-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0
}

.mm-navbar__title {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 50%;
    flex: 1 1 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0 20px;
    overflow: hidden
}

.mm-navbar__title[href="#"] {
    pointer-events: none
}

.mm-navbar__title>span {
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.mm-btn.mm-hidden+.mm-navbar__title:not(:last-child) {
    -webkit-padding-start: 60px;
    padding-inline-start: 60px;
    -webkit-padding-end: 10px;
    padding-inline-end: 10px
}

.mm-btn:not(.mm-hidden)+.mm-navbar__title:last-child {
    -webkit-padding-start: 10px;
    padding-inline-start: 10px;
    -webkit-padding-end: 60px;
    padding-inline-end: 60px
}

.mm-panel {
    --mm-panel-child-offset: 100%;
    --mm-panel-parent-offset: -30%;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 1;
    -webkit-overflow-scrolling: touch;
    overflow: hidden;
    overflow-y: auto;
    -ms-scroll-chaining: none;
    overscroll-behavior: contain;
    color: var(--mm-color-text);
    border-color: var(--mm-color-border);
    background: var(--mm-color-background);
    -webkit-transform: translate3d(var(--mm-panel-child-offset), 0, 0);
    transform: translate3d(var(--mm-panel-child-offset), 0, 0);
    -webkit-transition-property: inset-inline-start, -webkit-transform;
    transition-property: inset-inline-start, -webkit-transform;
    -o-transition-property: transform, inset-inline-start;
    transition-property: transform, inset-inline-start;
    transition-property: transform, inset-inline-start, -webkit-transform
}

[dir=rtl] .mm-panel {
    --mm-panel-child-offset: -100%;
    --mm-panel-parent-offset: 30%
}

.mm-panel:after {
    content: "";
    display: block;
    height: var(--mm-listitem-size)
}

.mm-panel:focus {
    outline: 0
}

.mm-panel--opened {
    z-index: 2;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition-delay: 0s;
    -o-transition-delay: 0s;
    transition-delay: 0s
}

.mm-panel--parent {
    -webkit-transform: translate3d(var(--mm-panel-parent-offset), 0, 0);
    transform: translate3d(var(--mm-panel-parent-offset), 0, 0);
    z-index: 0
}

.mm-panel--highest {
    z-index: 3
}

.mm-menu--opened .mm-panel--noanimation {
    -webkit-transition: none !important;
    -o-transition: none !important;
    transition: none !important;
    -webkit-transition-duration: 0s !important;
    -o-transition-duration: 0s !important;
    transition-duration: 0s !important
}

.mm-panel__content {
    padding: 20px
}

.mm-panels {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    position: relative;
    height: 100%;
    overflow: hidden;
    background: var(--mm-color-background);
    border-color: var(--mm-color-border);
    color: var(--mm-color-text)
}

.mm-panels:focus {
    outline: 0
}

:root {
    --mm-toggle-size: 34px
}

.mm-toggle {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-item-align: center;
    align-self: center;
    -webkit-box-flex: calc(var(--mm-toggle-size) * 1.75);
    -ms-flex: calc(var(--mm-toggle-size) * 1.75) 0 0px;
    flex: calc(var(--mm-toggle-size) * 1.75) 0 0;
    height: var(--mm-toggle-size);
    -webkit-margin-end: 10px;
    margin-inline-end: 10px;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    border: none !important;
    border-radius: var(--mm-toggle-size);
    border: var(--mm-color-border);
    background: var(--mm-color-border);
    cursor: pointer;
    -webkit-transition-property: background-color;
    -o-transition-property: background-color;
    transition-property: background-color
}

.mm-toggle:before {
    content: "";
    aspect-ratio: 1;
    margin: 2px;
    border-radius: 100%;
    background: var(--mm-color-background);
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform
}

.mm-toggle:checked {
    background: #4bd963
}

.mm-toggle:checked:before {
    -webkit-transform: translateX(calc(var(--mm-toggle-size) * .75));
    -ms-transform: translateX(calc(var(--mm-toggle-size) * .75));
    transform: translateX(calc(var(--mm-toggle-size) * .75))
}

[dir=rtl] .mm-toggle:checked:before {
    -webkit-transform: translateX(calc(var(--mm-toggle-size) * -.75));
    -ms-transform: translateX(calc(var(--mm-toggle-size) * -.75));
    transform: translateX(calc(var(--mm-toggle-size) * -.75))
}

.mm-listitem--vertical>.mm-panel {
    position: static;
    width: 100%;
    padding: 10px 0 10px 20px;
    -webkit-transform: none !important;
    -ms-transform: none !important;
    transform: none !important;
    -webkit-transition: none !important;
    -o-transition: none !important;
    transition: none !important
}

.mm-listitem--vertical>.mm-panel:after {
    content: none;
    display: none
}

.mm-listitem--vertical:not(.mm-listitem--opened)>.mm-panel {
    display: none
}

.mm-listitem--vertical>.mm-listitem__btn {
    height: var(--mm-listitem-size);
    bottom: auto
}

.mm-listitem--vertical .mm-listitem:last-child:after {
    border-color: transparent
}

.mm-listitem--opened>.mm-listitem__btn:after {
    -webkit-transform: rotate(225deg);
    -ms-transform: rotate(225deg);
    transform: rotate(225deg);
    right: 19px
}

:root {
    --mm-size: 80%;
    --mm-min-size: 240px;
    --mm-max-size: 440px
}

.mm-menu--offcanvas {
    position: fixed;
    z-index: 0
}

.mm-page {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    min-height: 100vh;
    background: inherit
}

:where(.mm-slideout) {
    position: relative;
    z-index: 1;
    width: 100%;
    -webkit-transition-duration: .4s;
    -o-transition-duration: .4s;
    transition-duration: .4s;
    -webkit-transition-timing-function: ease;
    -o-transition-timing-function: ease;
    transition-timing-function: ease;
    -webkit-transition-property: width, -webkit-transform;
    transition-property: width, -webkit-transform;
    -o-transition-property: width, transform;
    transition-property: width, transform;
    transition-property: width, transform, -webkit-transform
}

.mm-wrapper--opened,
.mm-wrapper--opened body {
    overflow: hidden
}

.mm-wrapper__blocker {
    background: rgba(0, 0, 0, .4)
}

.mm-wrapper--opened .mm-wrapper__blocker {
    --mm-blocker-visibility-delay: 0s;
    --mm-blocker-opacity-delay: 0.4s;
    bottom: 0;
    opacity: .5
}

.mm-menu {
    --mm-translate-horizontal: 0;
    --mm-translate-vertical: 0
}

.mm-menu--position-left,
.mm-menu--position-left-front {
    right: auto
}

.mm-menu--position-right,
.mm-menu--position-right-front {
    left: auto
}

.mm-menu--position-left,
.mm-menu--position-left-front,
.mm-menu--position-right,
.mm-menu--position-right-front {
    width: clamp(var(--mm-min-size), var(--mm-size), var(--mm-max-size))
}

.mm-menu--position-left-front {
    --mm-translate-horizontal: -100%
}

.mm-menu--position-right-front {
    --mm-translate-horizontal: 100%
}

.mm-menu--position-top {
    bottom: auto
}

.mm-menu--position-bottom {
    top: auto
}

.mm-menu--position-bottom,
.mm-menu--position-top {
    width: 100%;
    height: clamp(var(--mm-min-size), var(--mm-size), var(--mm-max-size))
}

.mm-menu--position-top {
    --mm-translate-vertical: -100%
}

.mm-menu--position-bottom {
    --mm-translate-vertical: 100%
}

.mm-menu--position-bottom,
.mm-menu--position-left-front,
.mm-menu--position-right-front,
.mm-menu--position-top {
    z-index: 2;
    -webkit-transform: translate3d(var(--mm-translate-horizontal), var(--mm-translate-vertical), 0);
    transform: translate3d(var(--mm-translate-horizontal), var(--mm-translate-vertical), 0);
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform
}

.mm-menu--position-bottom.mm-menu--opened,
.mm-menu--position-left-front.mm-menu--opened,
.mm-menu--position-right-front.mm-menu--opened,
.mm-menu--position-top.mm-menu--opened {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.mm-wrapper--position-left {
    --mm-translate-horizontal: clamp(var(--mm-min-size),
            var(--mm-size),
            var(--mm-max-size))
}

.mm-wrapper--position-right {
    --mm-translate-horizontal: clamp(calc(-1 * var(--mm-max-size)),
            calc(-1 * var(--mm-size)),
            calc(-1 * var(--mm-min-size)))
}

/* .mm-wrapper--position-left .mm-slideout,
.mm-wrapper--position-right .mm-slideout {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
} */

.mm-wrapper--position-left.mm-wrapper--opened .mm-slideout,
.mm-wrapper--position-right.mm-wrapper--opened .mm-slideout {
    -webkit-transform: translate3d(var(--mm-translate-horizontal), 0, 0);
    transform: translate3d(var(--mm-translate-horizontal), 0, 0)
}

.mm-wrapper--position-bottom .mm-wrapper__blocker,
.mm-wrapper--position-left-front .mm-wrapper__blocker,
.mm-wrapper--position-right-front .mm-wrapper__blocker,
.mm-wrapper--position-top .mm-wrapper__blocker {
    z-index: 1
}

.mm-menu--theme-light {
    --mm-color-background: #fff;
    --mm-color-border: rgb(0 0 0 / 0.1);
    --mm-color-icon: rgb(0 0 0 / 0.4);
    --mm-color-text: rgb(0 0 0 / 0.8);
    --mm-color-text-dimmed: rgb(0 0 0 / 0.4);
    --mm-color-background-highlight: rgb(0 0 0 / 0.05);
    --mm-color-background-emphasis: rgb(255 255 255 / 0.75);
    --mm-color-focusring: #06c
}

.mm-menu--theme-light-contrast {
    --mm-color-background: #f3f3f3;
    --mm-color-border: rgb(0 0 0 / 0.5);
    --mm-color-icon: rgb(0 0 0 / 0.5);
    --mm-color-text: #000;
    --mm-color-text-dimmed: rgb(0 0 0 / 0.7);
    --mm-color-background-highlight: rgb(0 0 0 / 0.05);
    --mm-color-background-emphasis: rgb(255 255 255 / 0.9);
    --mm-color-focusring: #06c
}

.mm-menu--theme-dark {
    --mm-color-background: #333;
    --mm-color-border: rgb(0, 0, 0, 0.4);
    --mm-color-icon: rgb(255, 255, 255, 0.4);
    --mm-color-text: rgb(255, 255, 255, 0.8);
    --mm-color-text-dimmed: rgb(255, 255, 255, 0.4);
    --mm-color-background-highlight: rgb(255, 255, 255, 0.08);
    --mm-color-background-emphasis: rgb(0, 0, 0, 0.1);
    --mm-color-focusring: #06c
}

.mm-menu--theme-dark-contrast {
    --mm-color-background: #333;
    --mm-color-border: rgb(255 255 255 / 0.5);
    --mm-color-icon: rgb(255 255 255 / 0.5);
    --mm-color-text: #fff;
    --mm-color-text-dimmed: rgb(255 255 255 / 0.7);
    --mm-color-background-highlight: rgb(255 255 255 / 0.1);
    --mm-color-background-emphasis: rgb(0 0 0 / 0.3);
    --mm-color-focusring: #06c
}

.mm-menu--theme-white {
    --mm-color-background: #fff;
    --mm-color-border: rgb(0 0 0 / 0.15);
    --mm-color-icon: rgb(0 0 0 / 0.3);
    --mm-color-text: rgb(0 0 0 / 0.8);
    --mm-color-text-dimmed: rgb(0 0 0 / 0.3);
    --mm-color-background-highlight: rgb(0 0 0 / 0.06);
    --mm-color-background-emphasis: rgb(0 0 0 / 0.03);
    --mm-color-focusring: #06c
}

.mm-menu--theme-white-contrast {
    --mm-color-background: #fff;
    --mm-color-border: rgb(0 0 0 / 0.5);
    --mm-color-icon: rgb(0 0 0 / 0.5);
    --mm-color-text: #000;
    --mm-color-text-dimmed: rgb(0 0 0 / 0.7);
    --mm-color-background-highlight: rgb(0 0 0 / 0.07);
    --mm-color-background-emphasis: rgb(0 0 0 / 0.035);
    --mm-color-focusring: #06c
}

.mm-menu--theme-black {
    --mm-color-background: #000;
    --mm-color-border: rgb(255 255 255 / 0.2);
    --mm-color-icon: rgb(255 255 255 / 0.4);
    --mm-color-text: rgb(255 255 255 / 0.7);
    --mm-color-text-dimmed: rgb(255 255 255 / 0.4);
    --mm-color-background-highlight: rgb(255 255 255 / 0.1);
    --mm-color-background-emphasis: rgb(255 255 255 / 0.06);
    --mm-color-focusring: #06c
}

.mm-menu--theme-black-contrast {
    --mm-color-background: #000;
    --mm-color-border: rgb(255 255 255 / 0.5);
    --mm-color-icon: rgb(255 255 255 / 0.5);
    --mm-color-text: #fff;
    --mm-color-text-dimmed: rgb(255 255 255 / 0.6);
    --mm-color-background-highlight: rgb(255 255 255 / 0.125);
    --mm-color-background-emphasis: rgb(255 255 255 / 0.1);
    --mm-color-focusring: #06c
}

.mm-counter {
    display: block;
    -webkit-padding-start: 20px;
    padding-inline-start: 20px;
    float: right;
    color: var(--mm-color-text-dimmed)
}

[dir=rtl] .mm-counter {
    float: left
}

:root {
    --mm-iconbar-size: 50px
}

.mm-menu--iconbar-left .mm-navbars,
.mm-menu--iconbar-left .mm-panels {
    margin-left: var(--mm-iconbar-size)
}

.mm-menu--iconbar-right .mm-navbars,
.mm-menu--iconbar-right .mm-panels {
    margin-right: var(--mm-iconbar-size)
}

.mm-iconbar {
    display: none;
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 2;
    width: var(--mm-iconbar-size);
    overflow: hidden;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: 0 solid;
    border-color: var(--mm-color-border);
    background: var(--mm-color-background);
    color: var(--mm-color-text-dimmed);
    text-align: center
}

.mm-menu--iconbar-left .mm-iconbar,
.mm-menu--iconbar-right .mm-iconbar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.mm-menu--iconbar-left .mm-iconbar {
    border-right-width: 1px;
    left: 0
}

.mm-menu--iconbar-right .mm-iconbar {
    border-left-width: 1px;
    right: 0
}

.mm-iconbar__bottom,
.mm-iconbar__top {
    width: 100%;
    -webkit-overflow-scrolling: touch;
    overflow: hidden;
    overflow-y: auto;
    -ms-scroll-chaining: none;
    overscroll-behavior: contain
}

.mm-iconbar__bottom>*,
.mm-iconbar__top>* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    padding: calc((var(--mm-iconbar-size) - var(--mm-lineheight))/ 2) 0
}

.mm-iconbar__bottom a,
.mm-iconbar__bottom a:hover,
.mm-iconbar__top a,
.mm-iconbar__top a:hover {
    text-decoration: none
}

.mm-iconbar__tab--selected {
    background: var(--mm-color-background-emphasis)
}

:root {
    --mm-iconpanel-size: 50px
}

.mm-panel--iconpanel-0 {
    inset-inline-start: calc(0 * var(--mm-iconpanel-size))
}

.mm-panel--iconpanel-1 {
    inset-inline-start: calc(1 * var(--mm-iconpanel-size))
}

.mm-panel--iconpanel-2 {
    inset-inline-start: calc(2 * var(--mm-iconpanel-size))
}

.mm-panel--iconpanel-3 {
    inset-inline-start: calc(3 * var(--mm-iconpanel-size))
}

.mm-panel--iconpanel-4 {
    inset-inline-start: calc(4 * var(--mm-iconpanel-size))
}

.mm-panel--iconpanel-first~.mm-panel {
    inset-inline-start: var(--mm-iconpanel-size)
}

.mm-menu--iconpanel .mm-panel--parent .mm-divider,
.mm-menu--iconpanel .mm-panel--parent .mm-navbar {
    opacity: 0
}

.mm-menu--iconpanel .mm-panels>.mm-panel--parent {
    overflow-y: hidden;
    -webkit-transform: unset;
    -ms-transform: unset;
    transform: unset
}

.mm-menu--iconpanel .mm-panels>.mm-panel:not(.mm-panel--iconpanel-first):not(.mm-panel--iconpanel-0) {
    border-inline-start-width: 1px;
    border-inline-start-style: solid
}

.mm-navbars {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.mm-navbars .mm-navbar {
    position: relative;
    padding-top: 0;
    border-bottom: none
}

.mm-navbars--top {
    border-bottom: 1px solid var(--mm-color-border)
}

.mm-navbars--top .mm-navbar:first-child {
    padding-top: env(safe-area-inset-top)
}

.mm-navbars--bottom {
    border-top: 1px solid var(--mm-color-border)
}

.mm-navbars--bottom .mm-navbar:last-child {
    padding-bottom: env(safe-area-inset-bottom)
}

.mm-navbar__breadcrumbs {
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 50%;
    flex: 1 1 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    padding: 0 20px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch
}

.mm-navbar__breadcrumbs>* {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-padding-end: 6px;
    padding-inline-end: 6px
}

.mm-navbar__breadcrumbs>a {
    text-decoration: underline
}

.mm-navbar__breadcrumbs:not(:last-child) {
    -webkit-padding-end: 0;
    padding-inline-end: 0
}

.mm-btn:not(.mm-hidden)+.mm-navbar__breadcrumbs {
    -webkit-padding-start: 0;
    padding-inline-start: 0
}

.mm-navbar__tab {
    padding: 0 10px;
    border: 1px solid transparent
}

.mm-navbar__tab--selected {
    background: var(--mm-color-background)
}

.mm-navbar__tab--selected:not(:first-child) {
    border-inline-start-color: var(--mm-color-border)
}

.mm-navbar__tab--selected:not(:last-child) {
    border-inline-end-color: var(--mm-color-border)
}

.mm-navbars--top.mm-navbars--has-tabs {
    border-bottom: none
}

.mm-navbars--top.mm-navbars--has-tabs .mm-navbar {
    background: var(--mm-color-background-emphasis)
}

.mm-navbars--top.mm-navbars--has-tabs .mm-navbar--tabs~.mm-navbar {
    background: var(--mm-color-background)
}

.mm-navbars--top.mm-navbars--has-tabs .mm-navbar:not(.mm-navbar--tabs):last-child {
    border-bottom: 1px solid var(--mm-color-border)
}

.mm-navbars--top .mm-navbar__tab {
    border-bottom-color: var(--mm-color-border)
}

.mm-navbars--top .mm-navbar__tab--selected {
    border-top-color: var(--mm-color-border);
    border-bottom-color: transparent
}

.mm-navbars--bottom.mm-navbar--has-tabs {
    border-top: none
}

.mm-navbars--bottom.mm-navbar--has-tabs .mm-navbar {
    background: var(--mm-color-background)
}

.mm-navbars--bottom.mm-navbar--has-tabs .mm-navbar--tabs,
.mm-navbars--bottom.mm-navbar--has-tabs .mm-navbar--tabs~.mm-navbar {
    background: var(--mm-color-background-emphasis)
}

.mm-navbars--bottom .mm-navbar__tab {
    border-top-color: var(--mm-color-border)
}

.mm-navbars--bottom .mm-navbar__tab--selected {
    border-bottom-color: var(--mm-color-border);
    border-top-color: transparent
}

.mm-searchfield {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    height: var(--mm-navbar-size);
    padding: 0;
    overflow: hidden
}

.mm-searchfield__input {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    width: 100%;
    max-width: 100%;
    padding: 0 10px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.mm-searchfield__input input {
    display: block;
    width: 100%;
    max-width: 100%;
    height: calc(var(--mm-navbar-size) * .7);
    min-height: auto;
    max-height: auto;
    margin: 0;
    padding: 0 10px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border: none;
    border-radius: 4px;
    line-height: calc(var(--mm-navbar-size) * .7);
    font: inherit;
    font-size: inherit
}

.mm-searchfield__input input,
.mm-searchfield__input input:focus,
.mm-searchfield__input input:hover {
    background: var(--mm-color-background-highlight);
    color: var(--mm-color-text)
}

.mm-menu[class*=-contrast] .mm-searchfield__input input {
    border: 1px solid var(--mm-color-border)
}

.mm-searchfield__input input::-ms-clear {
    display: none
}

.mm-searchfield__btn {
    display: none;
    position: absolute;
    inset-inline-end: 0;
    top: 0;
    bottom: 0
}

.mm-searchfield--searching .mm-searchfield__btn {
    display: block
}

.mm-searchfield__cancel {
    display: block;
    position: relative;
    -webkit-margin-end: -100px;
    margin-inline-end: -100px;
    -webkit-padding-start: 5px;
    padding-inline-start: 5px;
    -webkit-padding-end: 20px;
    padding-inline-end: 20px;
    visibility: hidden;
    line-height: var(--mm-navbar-size);
    text-decoration: none;
    -webkit-transition-property: visibility, margin;
    -o-transition-property: visibility, margin;
    transition-property: visibility, margin
}

.mm-searchfield--cancelable .mm-searchfield__cancel {
    visibility: visible;
    -webkit-margin-end: 0;
    margin-inline-end: 0
}

.mm-panel--search {
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    border: none !important
}

.mm-panel__splash {
    padding: 20px
}

.mm-panel--searching .mm-panel__splash {
    display: none
}

.mm-panel__noresults {
    display: none;
    padding: 40px 20px;
    color: var(--mm-color-text-dimmed);
    text-align: center;
    font-size: 150%;
    line-height: 1.4
}

.mm-panel--noresults .mm-panel__noresults {
    display: block
}

:root {
    --mm-sectionindexer-size: 20px
}

.mm-sectionindexer {
    background: inherit;
    text-align: center;
    font-size: 12px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: var(--mm-sectionindexer-size);
    position: absolute;
    top: 0;
    bottom: 0;
    inset-inline-end: calc(-1 * var(--mm-sectionindexer-size));
    z-index: 5;
    -webkit-transition-property: inset-inline-end;
    -o-transition-property: inset-inline-end;
    transition-property: inset-inline-end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: space-evenly;
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly
}

.mm-sectionindexer a {
    color: var(--mm-color-text-dimmed);
    line-height: 1;
    text-decoration: none;
    display: block
}

.mm-sectionindexer~.mm-panel {
    -webkit-padding-end: 0;
    padding-inline-end: 0
}

.mm-sectionindexer--active {
    right: 0
}

.mm-sectionindexer--active~.mm-panel {
    -webkit-padding-end: var(--mm-sectionindexer-size);
    padding-inline-end: var(--mm-sectionindexer-size)
}

.mm-menu--selected-hover .mm-listitem__btn,
.mm-menu--selected-hover .mm-listitem__text,
.mm-menu--selected-parent .mm-listitem__btn,
.mm-menu--selected-parent .mm-listitem__text {
    -webkit-transition-property: background-color;
    -o-transition-property: background-color;
    transition-property: background-color
}

@media (hover:hover) {
    .mm-menu--selected-hover .mm-listview:hover>.mm-listitem--selected:not(:hover)>.mm-listitem__text {
        background: 0 0
    }

    .mm-menu--selected-hover .mm-listitem__btn:hover,
    .mm-menu--selected-hover .mm-listitem__text:hover {
        background: var(--mm-color-background-emphasis)
    }
}

.mm-menu--selected-parent .mm-listitem__btn,
.mm-menu--selected-parent .mm-listitem__text {
    -webkit-transition-delay: .2s;
    -o-transition-delay: .2s;
    transition-delay: .2s
}

@media (hover:hover) {

    .mm-menu--selected-parent .mm-listitem__btn:hover,
    .mm-menu--selected-parent .mm-listitem__text:hover {
        -webkit-transition-delay: 0s;
        -o-transition-delay: 0s;
        transition-delay: 0s
    }
}

.mm-menu--selected-parent .mm-panel--parent .mm-listitem:not(.mm-listitem--selected-parent)>.mm-listitem__text {
    background: 0 0
}

.mm-menu--selected-parent .mm-listitem--selected-parent>.mm-listitem__btn,
.mm-menu--selected-parent .mm-listitem--selected-parent>.mm-listitem__text {
    background: var(--mm-color-background-emphasis)
}

:root {
    --mm-sidebar-collapsed-size: 50px;
    --mm-sidebar-expanded-size: var(--mm-max-size)
}

.mm-wrapper--sidebar-collapsed .mm-slideout {
    width: calc(100% - var(--mm-sidebar-collapsed-size));
    -webkit-transform: translate3d(var(--mm-sidebar-collapsed-size), 0, 0);
    transform: translate3d(var(--mm-sidebar-collapsed-size), 0, 0)
}

[dir=rtl] .mm-wrapper--sidebar-collapsed .mm-slideout {
    -webkit-transform: none;
    -ms-transform: none;
    transform: none
}

.mm-wrapper--sidebar-collapsed:not(.mm-wrapper--opened) .mm-menu--sidebar-collapsed .mm-divider,
.mm-wrapper--sidebar-collapsed:not(.mm-wrapper--opened) .mm-menu--sidebar-collapsed .mm-navbar {
    opacity: 0
}

.mm-wrapper--sidebar-expanded .mm-menu--sidebar-expanded {
    width: var(--mm-sidebar-expanded-size);
    border-right-width: 1px;
    border-right-style: solid
}

.mm-wrapper--sidebar-expanded.mm-wrapper--opened {
    overflow: auto
}

.mm-wrapper--sidebar-expanded.mm-wrapper--opened .mm-wrapper__blocker {
    display: none
}

.mm-wrapper--sidebar-expanded.mm-wrapper--opened .mm-slideout {
    width: calc(100% - var(--mm-sidebar-expanded-size));
    -webkit-transform: translate3d(var(--mm-sidebar-expanded-size), 0, 0);
    transform: translate3d(var(--mm-sidebar-expanded-size), 0, 0)
}

[dir=rtl] .mm-wrapper--sidebar-expanded.mm-wrapper--opened .mm-slideout {
    -webkit-transform: none;
    -ms-transform: none;
    transform: none
}
}
/* mm-menu 結束 */

/* 針對iPhone的補丁 */
#MenuMobile.mm-menu { opacity:0; }
#MenuMobile.mm-menu.mm-menu--opened { opacity:1; }