@import url('https://fonts.googleapis.com/css?family=Noto+Sans+TC:100,300,400,500,700,900|Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i&subset=chinese-traditional');
@import url('https://use.fontawesome.com/releases/v5.6.1/css/all.css');

/* reset */
*{ margin:0; padding:0; font-size:10px; box-sizing:border-box; -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-tap-highlight-color:transparent; outline:none; }
html,body{ font-family:'Open Sans','Arial','Noto Sans TC','Microsoft JhengHei','Apple LiGothic Medium',sans-serif; }
html{ -ms-text-size-adjust:100%; -webkit-text-size-adjust:100%; }
body{ margin:0; -webkit-overflow-scrolling:touch; text-align:center; }
:before,:after{ font-family:'Font Awesome 5 Free','Font Awesome 5 Brands','fontawesome',Arial,'Microsoft JhengHei','Apple LiGothic Medium',sans-serif; font-weight:900;}
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary,div,a{ display:block; box-sizing:border-box; position:relative;}
a{ background:transparent; text-decoration:none; color:inherit; cursor:pointer; line-height:1em; display:inline-block; font-size:inherit;}
a:active{ outline:0; }
b,strong{ font-weight:bold; font-size:inherit; }
dfn{ font-style:normal; }
img{ border:0; vertical-align:middle; line-height:0; font-size:0; }
input,textarea,button,select,option{ border:0; margin:0; outline:none; padding:0; font-size:1.6rem; font-family:'Noto Sans TC','Open Sans','Arial','Microsoft JhengHei','Apple LiGothic Medium',sans-serif; -webkit-appearance:none; -moz-appearance:none; /*-ms-appearance:none; appearance:none;*/ }
label,span{ font-size:inherit; }
textarea{ resize:none; }
select::-ms-expand{ display:none; }
input::-moz-placeholder,textarea::-moz-placeholder{ color:#ccc; }
input:-ms-input-placeholder,textarea:-ms-input-placeholder{ color:#ccc; }
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{ color:#ccc; }
table{ border-collapse:collapse; border-spacing:0; }
td,th{ padding:0; }
h1,h2,h3,h4,h5,h6,p,figure,form,blockquote{ margin:0; font-weight:normal; line-height:2em; margin-bottom:0;}
ul,ol,li,dl,dd{ margin:0; padding:0; }
ul,ol{ list-style:none; box-sizing:border-box;}
/* reset */

.hidden { display:none;}

/*loading*/
.loading{ width:100vw; height:100%; min-height:100vh; position:fixed; left:0; top:0; background-color:rgba(0,0,0,.9); z-index:100; display:flex; justify-content:center; align-items:center; display:none;}
/*loading 圖*/
.loading-circle circle{ -webkit-animation:c1_2 9s linear infinite,c1_3 4.5s infinite; -moz-animation:c1_2 9s linear infinite,c1_3 4.5s infinite; animation:c1_2 9s linear infinite,c1_3 4.5s infinite; stroke:#ff6600; stroke-width:2px; }
@-webkit-keyframes c1_2{0%{stroke-width:0; } 10%{stroke-width:4; } 75%{stroke-width:4; } 90%{stroke-width:0; } 100%{stroke-width:0; } }
@-webkit-keyframes c1_3{
0%{stroke-dasharray:104,156; stroke-dashoffset:-52; } 16%{stroke-dasharray:1,156; stroke-dashoffset:-52; }
16.01%{stroke-dasharray:1,156; stroke-dashoffset:-208; } 33%{stroke-dasharray:104,52; stroke-dashoffset:-104; }
33.01%{stroke-dasharray:104,52; stroke-dashoffset:-104; } 49%{stroke-dasharray:1,156; stroke-dashoffset:-104; } 
49.01%{stroke-dasharray:1,156; stroke-dashoffset:52; } 66%{stroke-dasharray:104,52; stroke-dashoffset:156; }
66.01%{stroke-dasharray:104,52; stroke-dashoffset:156; } 82%{stroke-dasharray:1,156; stroke-dashoffset:156; }
82.01%{stroke-dasharray:1,156; stroke-dashoffset:156; } 99.99%{stroke-dasharray:104,52; stroke-dashoffset:256; }
}
/*END  loading 圖*/


body{ position:relative; min-height:100%; padding-bottom:80px;}
body.index{ background:url('../images/bg-dot.gif'); }


/*slick*/
.slick-dotted.slick-slider{ margin-bottom:60px; }
.slick-dots{ bottom:-42px; }
.slick-dots li button:before{ opacity:.75; color:#a9a9a9; }
.slick-dots li.slick-active button:before{ color:#f58a00;  }
.slick-initialized .slick-slide{ position:relative; }
.slick-initialized .slick-slide:before{ content:''; display:block; position:absolute; top:0; left:0; width:100%; height:100%; background:#fff; opacity:.6; z-index:1; transition:all 1.2s cubic-bezier(.5,.51,.32,.97);}
.slick-initialized .slick-slide.slick-active:before{ opacity:0; pointer-events:none; }

/*卷軸*/
.mCustomScrollBox{ height:auto; }

/*動態*/


.container-full ,
.container{ padding:0 15px; width:100%; margin:0 auto;}
p,li,div,td,th{ font-size:1.6rem; }

/*header*/
header{ background:#fff; position:fixed; top:0; left:0; width:100%; z-index:90; box-shadow:0 1px 2px 1px rgba(0,0,0,.1); transform:translateY(0);  transition:all .6s;}
header.hide{ transform:translate(0,-100%); }
header .header-container{ display:flex; justify-content:center; align-items:center; }
header .header-container .logo{ position:absolute; top:50%; left:10px; width:auto; height:32px; transform:translateY(-50%); }
header .header-container .logo img{ width:auto; height:100%; margin-right:12px; display:inline-block;}
header .header-container .logo h1{ font-size:1.8rem; color:#008836;  display:inline-block; vertical-align:middle; font-weight:500;}
header nav{ position:initial; width:100%;}
header nav ul.mainMenu{ display:flex; color:#302f2f; width:100%; justify-content:flex-end;}
header nav ul.mainMenu > li{ font-size:1.6rem;}
header nav ul.mainMenu > li > a{ padding:1.5em 1em; }
header nav ul.mainMenu > li:hover .subMenu{ transition:all .4s cubic-bezier(.5,.51,.54,.98);}
header nav ul.mainMenu > li:hover > a:after{ width:100%; }
header nav ul.mainMenu > li.otherMenu{ position:absolute; top:10px; right:15px; }
header nav ul.mainMenu > li.otherMenu .lung{ display:flex; }
header nav ul.mainMenu > li.otherMenu .lung li{ color:#fff; }
header nav ul.mainMenu > li.otherMenu .lung li + li:before{ content:'\/'; }
header nav ul.mainMenu > li.otherMenu .lung li a{ padding:.5em; }
header nav ul.mainMenu > li.otherMenu .lung li.on{ opacity:.5; pointer-events:none; }
header nav ul.mainMenu > li.otherMenu .lung li a:after{ content:''; width:0; height:2px; background:#fff; display:block; transform:translateY(6px); transition:all .6s; }
header nav ul.mainMenu > li.otherMenu .lung li a:hover:after{ width:100%; }
header .subMenu{ position:absolute; left:50%; bottom:0; width:100vw; background:rgba(0,0,0,.75); transform:translate(-50%,99%); height:0; transition:all .4s; overflow:hidden; } 
header .subMenu ul{ width:auto; margin:20px auto; display:flex; justify-content:center;}
header .subMenu ul > li{ margin:0 20px; color:#fff; font-size:1.5rem;}
header .subMenu ul > li a{ padding:10px 15px; }
header .navCheck{ display:none; font-size:0; opacity:0; pointer-events:none; }


/* 200605選單新增 */
header nav ul.mainMenu > li.u-itemicon {  position: relative;  margin: 18px 5px 0 5px; }
header nav ul.mainMenu > li.u-itemicon a{ text-indent: -99999px;width: 22px;  height: 22px;padding: 0 0; background: center center no-repeat; background-size:100% auto;
box-sizing:border-box;  vertical-align:middle; text-align: center;/* width: 100%;padding: 100% 0 0;  */} 
header nav ul.mainMenu > li.Fb a{  background-image:url("../images/fb.svg"); }
header nav ul.mainMenu > li.IG a{  background-image:url("../images/ig.svg"); }
header nav ul.mainMenu > li.line a{  background-image:url("../images/line.svg"); }
header nav ul.mainMenu > li.u-itemicon a:hover{ opacity: .8; }
header nav ul.mainMenu > li:nth-last-of-type(3){ margin-left:.8em;}




/*footer*/
footer{ background:#e5e5e5; padding:15px 0; margin-top:80px;}
body footer{ position:absolute; bottom:0; width:100%;} 
footer p{ line-height:1em; font-size:1.3rem; }

.wrapper{ overflow-x:hidden;  }

/* index */
.index .kv-container{ width:100%; height:auto; }
.index .kv-container .kv-box{ width:100%; height:100%; }
.index .kv-container .slick-dotted.slick-slider{ margin-bottom:100px; }
.index .joinUs-container{ margin-bottom:50px; position:relative; }
.index .joinUs-container h2{ font-family:'Verdana'; font-size:3.2rem; margin:.6em; }
.index .joinUs-container ul{ display:flex; flex-wrap:wrap;}
.index .joinUs-container ul li{ position:relative; line-height:0;}
.index .joinUs-container ul li a ,
.index .joinUs-container ul li img{ width:100%; }
.index .joinUs-container ul li a{ overflow:hidden; }
.index .joinUs-container ul li a:before{ position:relative; content:''; width:100%; padding-top:61%; background:#000; opacity:0; display:block; z-index:2;}
.index .joinUs-container ul li img ,
.index .joinUs-container ul li .text-block{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%) scale(1.01); z-index:0; transition:all 1.6s cubic-bezier(.19,.15,.59,.71);}
.index .joinUs-container ul li .text-block{ color:#fff; font-size:2.2rem; font-weight:300; line-height:1; border:solid 1px; padding:.4em 1.5em .4em 1.3em; z-index:3; transition:all .6s cubic-bezier(.19,.15,.59,.71); }
.index .joinUs-container ul li .text-block span{ position:absolute; display:inline-block; width:1.5em; height:1px; background:#fff; top:50%; right:0; transform:translate(50%,50%); }
.index .joinUs-container ul li .text-block span:before{ position:absolute; content:''; width:35%; height:1px; background:#fff; top:0; right:0; transform-origin:right; transform:rotate(45deg); }
.index .joinUs-container ul li a:hover:before{ opacity:.4; }
.index .joinUs-container ul li a:hover img{ transform:translate(-50%,-50%) scale(1.1); }
.index .joinUs-container ul li a:hover .text-block{ background:#fff; color:#000; border-color:#fff; }
.index .joinUs-container ul li a:hover .text-block span ,
.index .joinUs-container ul li a:hover .text-block span:before{ background:#000; }
.index .joinUs-container .ani-line{ position:absolute; left:50%; bottom:0; width:100vw; transform:translateX(-50%); stroke:#f58a00; stroke-width:3px;}
.index .joinUs-container .ani-line polyline{ fill:none; }
.index .joinUs-container .ani-square-block{ position:absolute; }
.index .joinUs-container .ani-square-block:nth-of-type(1){ transform:rotate(270deg); right:-20px; top:20px; }
.index .joinUs-container .ani-square-block:nth-of-type(2){ transform:scale(.7); right:0; top:0; }
.index .joinUs-container .ani-square-block:nth-of-type(2) .ani-square{ animation-delay:-2s; }
.index .video-container h2{ font-size:2rem; margin:1em; line-height:1.2; }
.index .video-container .video-box{ width:100%; z-index:2; }
.index .video-container .video-box iframe{ width:100%; height:100%; z-index:2; }
.index .video-container .ani-square-block{ position:absolute; transform:rotate(180deg) scale(.5); left:-20px; bottom:20px; }
.index .video-container .ani-square-block:nth-of-type(2){ transform:rotate(270deg) scale(.7); right:-20px; left:auto; bottom:0; animation:10s;}
.ani-square-block{ z-index:0;  }
.ani-square{ z-index:0; fill:#f58a00; animation:act-square 10s infinite alternate; }
@keyframes act-square{ 0%{ opacity:.9; transform:translate(150%,-20%);}  100% { opacity:.6; transform:translate(50%,80%);} }


/* 內頁共用 */
article{ background:#fff; }
.kv-container{ width:100vw; height:33vh; background-position:50% 0%; background-repeat:no-repeat; background-size:cover; display:flex; justify-content:center; align-items:center; text-shadow:2px 2px 10px rgba(0,0,0,.8),1px 1px 1px rgba(0,0,0,.3);} 
.kv-container h1{ color:#fff; font-size:2.8rem; letter-spacing:.25em; }
.top-container ul.breadcrumb{ text-align:left; padding:18px 0 20px; }
.top-container ul.breadcrumb li{ display:inline-block; color:#646464; }
.top-container ul.breadcrumb li + li:before{ content:'\f105'; margin:0 4px; display:inline-block; opacity:.7; }
.top-container ul.breadcrumb li a{ color:inherit; }
ul.tab-menu{ display:flex; position:relative; z-index:89;}
ul.tab-menu li{ color:#f58a00; border:solid 1px #f58a00; font-size:1.7rem; z-index:2; }
ul.tab-menu li + li{ border-left:none; }
ul.tab-menu li a{ width:100%; padding:.8em 0; }
ul.tab-menu span{ position:absolute; top:0; height:100%; width:0; background:#f58a00; opacity:.2; z-index:1; transition:all .4s cubic-bezier(.25,.1,.25,1); }
.top-container h2{ font-size:2.4rem; color:#000402; margin:46px 0 35px; }
.top-container h4{ font-size:1.5rem; color:#555454; line-height:1.4; }
.form-container h4{ font-size:1.8rem; color:#555454; line-height:1.4; }
.form-container h4 span{ color:#f58a00;}
.form-container table{ width:100%; }
.form-container tr{ border-bottom:dashed 1px #b7b7b7; }
.form-container th{ padding:25px 0; }
.form-container td{ padding:17px 0; /*border:solid 1px;*/ }
.form-container th{ font-weight:500; color:#020000; line-height:1.4; }
.form-container th span{ display:inline-block; font-size:1.4rem; color:#666; font-weight:normal; }
.text-system{ min-height:260px; display:flex; align-items:center; justify-content:center; border:solid 1px #f58a00; border-top:solid 20px #fbdfaf; } 
.text-system p{ font-size:2rem; font-weight:300; }
.text-system strong{ color:#f55c00; font-size:inherit; font-weight:400; line-height:1.5; }
.result { overflow-x:auto; }
/*結果頁*/
.apply .apply-container ,
.basic .basic-container{ font-size:2rem; padding:60px 0;}
.apply .apply-container strong ,
.basic .basic-container strong{ font-weight:600; color:#f56e00; font-size:inherit; }

/* 表格共用設定 */
form li{ position:relative; margin-bottom:.4em; line-height:2em;}
form li label{ position:relative; display:block; font-size:inherit; line-height:1em; padding:.5em 0; color:#545454; }
form li.must label:before{ content:'*'; color:#F44336; position:absolute; left:-.6em; top:.7em;}
form li input ,
form li textarea{ border:solid 1px #d5d3d3; outline:0; padding:.2em .4em; box-sizing:border-box; width:100%; transition:all .6s; }
form li textarea{ resize:none; height:2em; min-height:2em; transition:all .6s; }
form li select{ transition:all .6s; }
form li input:focus ,
form li textarea:focus ,
form li select:focus{ border-color:#f58a00; }
form .btn-box input:focus{ border-color:inherit; }
form li textarea:focus{ resize:vertical; height:5em; min-height:5em;  }
form li input[type="checkbox"] ,
form li input[type="radio"]{ position:absolute; top:0; left:0; width:100%; height:100%;cursor:pointer; z-index:1; border:none;  opacity:0; }
/* 表格-下拉選單 */
form .select-style{ display:flex; justify-content:space-between; }
form .select-style li{ position:relative; display:inline-block; outline:0; width:100%; margin-bottom:0; }
form .select-style li:after{ content:'\f107'; font-weight:900; color:#ccc; position:absolute; right:0; top:50%; transform:translateY(-50%); display:inline-block; padding:0 .4em; box-sizing:border-box; pointer-events:none;}
form .select-style li select{ position:relative; border:solid 1px #d5d3d3; background:transparent; pointer-events:auto; box-sizing:border-box; padding:.4em 1.5em .4em .6em; -moz-padding:0; width:100%; outline:none; color:#545454; letter-spacing:.1rem; cursor:pointer;}
form .select-style li select option{ border:none; outline:none; padding:.4rem;}
form .select-style li select option:hover{ box-shadow:0 0 10px 100px #1882A8 inset; background:#000; }
form .select-style select:disabled{ background:#ebebe4; pointer-events:none; }
form .select-style li::-ms-expand{ display:none; }
form .select-style li.btn-block{ margin-left:6px; }
form .select-style li.btn-block input{ padding:.4em .6em;}
form .select-style li.btn-block:after{ display:none; }
/* 表格-複選 */
form .check-style li input[type="checkbox"] + label:before{ content:'\f0c8'; padding-right:.35em; font-weight:400; color:#d5d3d3;}
form .check-style li input[type="radio"]:checked + label:before ,
form .check-style li input[type="checkbox"]:checked + label:before{ content:'\f14a'; font-weight:900; color:#f58a00;}
form .check-style li input[type="radio"]:disabled + label ,
form .check-style li input[type="checkbox"]:disabled + label { color:#ccc; }
form .check-style li.btn-style{ position:relative; border-radius:3px; background:#f58a00; color:#fff; transition:all .6s; font-size:2rem;}
form .check-style li.btn-style button ,
form .check-style li.btn-style input{ background:transparent; border:solid 1px #f58a00; color:inherit; padding:.2em 1em; cursor:pointer; border-radius:3px; font-size:1.5rem;}
/* 表格-單選 */
form .check-style li input[type="radio"] + label:before{ content:'\f111'; padding-right:.35em; font-size:.9em; font-weight:400; color:#d5d3d3;}
form .check-style li input[type="radio"]:checked + label:before{ content:'\f058'; font-weight:900;}
form .check-style .input_time { width: 2em; }
/* 表格-期間 */
form .during{ display:flex; width:100%; justify-content:flex-start;}
form .during > li{ flex-grow:1; margin-right:.5em; width:auto;}
form .during > li.text-block{ flex-grow:0; }
form .during > li.text-block:after{ display:none; }
/*驗證碼*/
form .form-validcode{ display:flex; }
form .form-validcode li + li{ margin-left:20px; }
form .form-validcode li:nth-of-type(1){ width:100px; }
form .form-validcode img{ height:100%; width:auto; display:block;} 
/* 按鈕 */
.btn-box{ display:flex; justify-content:center; margin:30px 0; font-size:2rem;}
.btn-box li{ position:relative; border-radius:3px; background:#5fbce7; color:#fff; margin:0 10px; transition:all .6s; font-size:2rem; }
.btn-box li:after{ position:absolute; top:50%; right:0; transform:translate(-.8em , -50%); content:'\f054'; font-size:.75em;} 
.btn-box li button ,
.btn-box li input{ outline:0; padding:10px 2.5em; font-size:inherit;}
.btn-box li:hover{ box-shadow:inset 0 0 0 100px rgba(255,255,255,.2);  }
.btn-box li button:disabled ,
.btn-box li input:disabled{ background:#ebebe4; background:#dedede; border-color:#d2d2d2;}
.btn-box .btn ,
.btn-box button ,
.btn-box input{ background:transparent; border:solid 1px #5fbce7; color:inherit; margin:0; padding:.4em 1.4em; cursor:pointer; border-radius:3px;}
.btn-box button:disabled{ background:#ebebe4; border-color:transparent; }
.btn-box li.border-style ,
.btn-box .btn.btn-border-style{ background:#fff; color:#7fc9ec; }
.btn-box li.greenborder-style ,
.btn-box .btn.btn-green-border-style{ background:#eff8f3; color:#097c25; border-color:#097c25; }
.btn-box li.border-style:hover ,
.btn-box .btn.btn-border-style:hover{ box-shadow:inset 0 0 0 100px rgba(95,188,231,.1); }
.btn-box li.orange{ background:#f6730a; color:#fff; }
.btn-box li.orange input{ border-color:#f6730a; }
.btn-box li.prev:after{ left:0; right:auto; transform:translate(.8em , -50%) rotate(180deg); } 
.btn-box li.small{ font-size:1.4rem; margin:10px 0;}
.btn-box li.small:after ,
.btn-box li.reset:after{ display:none; }
.btn-box li.small input{ padding:.3em 1em; }
.btn-box a{ color:#f6730a; font-size:1.6rem; position:relative; padding:0 1em; transition:all .6s; }
.btn-box a + a{ border-left:solid 1px #ccc; }
.btn-box a.btn.btn-style{  background:#5fbce7; color:#fff; font-size:inherit; padding:14px 2em;}
.btn-box .btn{ padding:.6em 1.4em; }
.btn-box .arrow-right{ position:relative; padding-right:2em; }
.btn-box .arrow-right:after{ content:'\f054'; position:absolute; right:6px; font-size:.8em;}
.btn-block{ display:inline-block; margin:0;}
.btn-block.border-style{ background:#fff; color:#7fc9ec; }
.btn-block input{ padding:.2em .6em; display:inline-block; }
.btn-box a.orange_bg{ background: #fff; padding:.5em 1em; border:1px solid #f6730a; border-radius: 10px; }
.btn-box a.orange_bg:hover{ color: #fff; background:#f6730a;}

.btn-box li.agree-style,
.btn-box li.agree-style:hover{ background:transparent; box-shadow:none; display:flex; align-items:center;} 
.btn-box li.agree-style:after{ display:none; }
.btn-box li.agree-style label{ width:100%; outline:0; padding:10px 1.5em 10px 1em; font-size:inherit; background:#fff; color:#7fc9ec; border:solid 1px #5fbce7; border-radius:3px; }
.btn-box li.agree-style input[type="checkbox"] + label:before{ content:'\f111'; font-weight:400; color:#ccc; margin-right:2px; }
.btn-box li.agree-style input[type="checkbox"]:checked + label:before{ content:'\f00c'; font-weight:700; color:#7fc9ec; }





/*table*/
.tabel-orange{ border:solid 1px #f58a00; width:100%; text-align:center;}
.tabel-orange tr + tr { border-bottom:solid 1px #d2d2d2; }
.tabel-orange tr:nth-last-of-type(1){ border-bottom:none; }
.tabel-orange th{ background:#fbdfaf; font-weight:normal; }
.tabel-orange th ,
.tabel-orange td{ padding:10px; }
.tabel-orange a{ color:#f57300; }
.tabel-orange label:before{ content:'\f0c8'; padding-right:.35em; font-weight:400; color:#d5d3d3; }
.tabel-orange th label:before{ font-weight:900; color:#fff; }
.tabel-orange input[type="checkbox"]:checked + label:before{ content:'\f14a'; font-weight:900; color:#f58a00; }
.tabel-orange input[type="checkbox"]:checked{ opacity:0; }
.tabel-orange span.disabled{ color:#E0E0E0; }
.tabel-orange td > p { width: 100%; text-align: left; padding: 5px 0;}

.tabel-green{ border:solid 1px #67ab7b; width:100%; }
.tabel-green tr{ border-bottom:none; }
.tabel-green .title{  border-bottom:none;}
.tabel-green .title td{ background:#74bf8a; color:fff; font-size:1.8rem; padding:10px; text-align:center; }
.tabel-green .title + tr{ border-top:none; }
.tabel-green tr + tr{ border-top:solid 1px #b7b7b7; }
.tabel-green td{ padding:15px 16px; }

/*頁碼*/
section.page-container{ display:flex; justify-content:center; padding:30px 0 0;}
/*section.page-container .page-block a{ background:#fff; padding:1em 1.5em; font-size:1.3rem; color:#111; line-height:1; transition:all .6s;}*/
section.page-container .page-block a{ background:#fff; padding:0.5em 0.5em; font-size:1.3rem; color:#111; line-height:1; transition:all .6s;}
section.page-container .page-block ul li a{ min-width:3.5em; padding:1em .5em; } 
section.page-container .page-block ul li + li{ border-left:none; }
section.page-container .page-block a:hover{ background:#eaeaea; }
section.page-container .page-block ul li.active a{ background:#322f2b; color:#fff;}
section.page-container .page-block ,
section.page-container .page-block ul{ display:flex; margin:0 4px;}
section.page-container .page-block a.arrow:after{ font-weight:900; color:#6f6f6f; }
section.page-container .page-block a.arrow.prev:after{ content:'\f104'; }
section.page-container .page-block a.arrow.next:after{ content:'\f105'; }
/*注意事項*/
ul.note{ text-align:left; margin-left:1em; }
ul.note li{ color:#555454; font-size:1.3rem; line-height:1.3; margin-bottom:4px;}
ul.note li:before{ content:'＊'; margin-left:-1em; }

/* 我要應徵 */
.join .kv-container{ background-image:url(../join/images/kv.jpg); }
.search article a{ color:#f56200; transition:all .6s;}
.search article a:hover{ opacity:.85; }
ul.tab-menu li ,
ul.tab-menu:hover span{ width:calc(100% / 3); }
ul.tab-menu li.active{ background:#f58a00; color:#fff; }
ul.tab-menu li.active a{ pointer-events:none; color:inherit;}
ul.tab-menu li.active.active-sub a{ pointer-events:auto; }
.search .form-container{ width:100%; max-width:800px; margin:30px auto 0;}
.search .form-container tr{ width:100%; display:block; padding:0 66px; }
.search .form-container th{ text-align:left; width:180px; vertical-align:top;} 
.search .form-container td{ width:80%;  text-align:left;}
.search.search_1 .form-container .check-style li ,
.search.search_3 .form-container .check-style li{ width:7.5em; display:inline-block; }
.search.search_2 .form-container .check-style li{ display:inline-block; }
.search.search_2 .form-container .check-style li.btn-style{ width:auto; }
.search.search_2 .form-container .check-style label:before{ float:left;}

.career-container{ max-width:1000px; font-size:1.6rem;}
.career-container a{ color:#f58a00; }
.career-container .text-box{ display:flex; justify-content:space-between; bottom:1em;}
.career-container .text-box h3{ font-size:1.9rem; color:#0c0c10; margin: 0 auto;}
.career-container .text-box .num{ font-size:1.5rem; color:#f55c00;  }
.career-container .text-box .num:before ,
.career-container .text-box .num:after{ color:#030000; }
.career-container .text-box .num:before{ content:'共有'; margin-right:6px; }
.career-container .text-box .num:after{ content:'個工作機會'; margin-left:6px; }
.fc.query .career-container .text-box .num:after{ content:'筆履歷表'; margin-left:6px; }
.applys .career-container .text-box .num:after{ content:'筆履歷表'; margin-left:6px; }

.career-container .text-box{ padding:20px 0;}
.search.search_job td:nth-of-type(1){ width:6em; color:#f6730a;}
.search.search_job hr{ margin:20px 0; border:none; border-bottom:dashed 1px #747575;}
.search.search_job .week-days table{ width:auto; }
.search.search_job .week-days td{ border:solid 1px #747575; width:auto; font-size:inherit; text-align:center; padding:6px 10px; } 
.search.search_job .week-days td:nth-of-type(1){ color:inherit; width:auto;}
.search.search_job .week-days td + td{ border-left:none; }
.search.search_job .check-style li.btn-style{ position:relative; border-radius:3px; background:#f58a00; color:#fff; transition:all .6s; font-size:2rem;}
.search.search_job .check-style li.btn-style button ,
.search.search_job .check-style li.btn-style input{ background:transparent; border:solid 1px #f58a00; color:inherit; padding:.2em 1em; cursor:pointer; border-radius:3px; font-size:1.5rem;}
.search.search_2_job td{ padding:5px 10px;}
.search.search_2_job td:nth-of-type(1){ width:10em; color:#f6730a; text-align:right;}
.search.search_3_job tr{ margin-bottom:10px; display:block;}

.search.search_1 ul.joblist { width: 100%; display: flex; flex-wrap: wrap; }
.search.search_1 ul.joblist li {width: calc(100% / 4 - 19px); margin:0 25px 30px 0; text-align: right;}
.search.search_1 ul.joblist li img {width: 100%; border:1px solid #C4C4C4; border-bottom:none; border-radius:5px 5px 0 0;}
.search.search_1 ul.joblist li .joblist_stitle { width: 100%; border:1px solid #C4C4C4; border-top:none; border-radius:0 0 5px 5px; margin-bottom: 8px; background: #80c269; color: #fff; text-align: center; padding: 5px; }
.search.search_1 ul.joblist li .joblist_btn { display: flex; justify-content: right; }
.search.search_1 ul.joblist li .joblist_btn a { display: flex; align-items: center; margin-left: 30px; color: #000402; }
.search.search_1 ul.joblist li .joblist_btn a:first-child { margin-left: 0; }
.search.search_1 ul.joblist li .joblist_btn a:hover { color: #f6730a; }
.search.search_1 ul.joblist li .joblist_btn a:after {content:'\f054'; margin-left: 5px; font-size: 0.5em; }

.search .delete .form-container td{ width:70%; }
.search .delete table input{ border:solid 1px #d5d3d3; outline:0; padding:0.2em 0.4em; box-sizing:border-box; width:100%; transition:all .6s; }

.search .check .info hr{ border-top:dashed 1px #b7b7b7; margin:36px 0; } 
.search .check .info ol{ list-style:decimal; text-align:left; margin-left:2em; }
.search .check .info span{ color: #f6730a; font-size:1.2m; font-weight:700; }
.search .check .info p,
.search .check .info ol .btn-box,
.search .check .info ol .btn-box li,
.search .check .info ol .btn-box li.agree-style label{ display:inline-block; vertical-align:top; }
.search .check .info ol .btn-box{ margin:0; }
.search .check .info p + .btn-box{ margin-right:1em; }
.search .check .info .btn-box li.agree-style{ display:block; margin:0 0 .4em; color:#333; }
.search .check .info .btn-box li.agree-style input[type="checkbox"]:checked + label{ color:#f6730a; border-color:transparent; font-weight:700; }
.search .check .info .btn-box li.agree-style input[type="checkbox"]:checked + label:before{ color:inherit;  }
.search .career-container .result table{ width:100%; margin:0 auto;}

.join .note { width: fit-content; font-size: 1.4rem; line-height: 1.4; text-align: center; color: red; margin: 0 auto; }

.join.process .kv-container{ background-image:url(../join/images/kv-process.jpg); }
.join.process .chart-container{ display:flex; }
.join.process .chart-container .image-box{ display:flex; align-items:center; flex-direction:column; }
.join.process .chart-container h3{ font-size:2.2rem; margin-bottom:1.5em; }
.join.process .chart-container h3:after{ display:block; content:'應徵流程'; font-size:.7em;}
.join.process .btn-box .btn{ background:#5fbce7; color:#fff; text-align:center; font-size:2.4rem; border-radius:50px; position:relative; padding:.6em 2em .6em 1.4em; }
.join.process .btn-box .btn span{ display:block; font-size:.75em; }
.join.process .btn-box .btn:after{ content:'\f054'; position:absolute; top:50%; right:0; transform:translate(-.5em,-50%); }

.join.process .chart-container .image-box{ transform:scale(.8); transition:transform 1.5s cubic-bezier(.18,.86,.34,.99); }
.join.process .chart-container .image-box.act{ transform:scale(1); }
.join.process .chart-container .image-box.act:nth-of-type(2){ transition-delay:.3s; }

.join.alert .kv-container{ background-image:url(../join/images/kv-alert.jpg); }
.join.alert .alert-container{ display:flex; justify-content:space-between;}
.join.alert .alert-container h3{ font-size:2.2rem; margin:1em auto; }
.join.alert .alert-container ul{ text-align:left; margin-left:20px;}
.join.alert .alert-container ul li{ position:relative; line-height:1.5; margin-bottom:.6em; }
.join.alert .alert-container ul li:before{ content:''; width:10px; height:10px; background:#fe8637; display:inline-block; position:absolute; left:-16px; top:8px;}
.join.alert .alert-box{ transform:scale(.8); transition:transform 1.5s cubic-bezier(.18,.86,.34,.99); }
.join.alert .alert-box.act{ transform:scale(1); }
.join.alert .alert-box.act:nth-of-type(2){ transition-delay:.3s; }
.join.alert .alert-box.act:nth-of-type(3){ transition-delay:.5s; }

.join.goto .kv-container{ background-image:url(../join/images/kv-goto.jpg); }
.join.goto .unit-container h3{ font-size:2.2rem; margin:1em 0 2em; }
.join.goto .headquarters-box{ display:flex; padding-bottom:48px; border-bottom:dashed 1px #b7b7b7;}
.join.goto .headquarters-box .block{ padding:6px;}
.join.goto .headquarters-box .map-block{ box-shadow:0 0 2px #ccc; }
.join.goto .headquarters-box .text-block{ text-align:left; }
.join.goto .headquarters-box .text-block .information-group{ font-size:1.8rem; }
.join.goto .headquarters-box .text-block .information-group li{ margin-bottom:1em; }
.join.goto .headquarters-box .text-block .information-group a{ color:#ff6600; }
.join.goto .headquarters-box .text-block .note-group p{ font-size:1.8rem; }
.join.goto .headquarters-box .text-block .note-group li{ margin-left:1em; }
.join.goto .headquarters-box .text-block .note-group li:before{ content:'*'; font-size:1.5rem; margin-left:-1em; width:1em; display:inline-block; text-align:center;}
.join.goto .unit-container{ transform:scale(.8); transition:transform .6s cubic-bezier(.18,.86,.34,.99); }
.join.goto .unit-container.act{ transform:scale(1); }


.join.hot .kv-container{ background-image:url(../join/images/kv-hot.jpg); background-position:50% 50%;}
.join.hot ul.tab-menu li ,
.join.hot ul.tab-menu:hover span{ width:calc(100% / 3); }
.join.hot .top-container .line-box{ position:relative; }
.join.hot .top-container .line-box:after{ content:''; display:block; width:100%; border-bottom:dashed 1px #b7b7b7; position:absolute; top:50%; left:0; }
.join.hot .top-container .line-box h2{ margin:30px 0; }
.join.hot .top-container h2{ position:relative; display:inline-block; background:#fff; z-index:2; padding:0 .5em;}
.join.hot .top-container h2 span{ font-size:.85em; }
.join.hot .area{ padding:40px 0; z-index:2;}
.join.hot .area h2{ font-size:2.6rem; font-weight:600; border-bottom:solid 3px #f58a00; padding:.3em 0; display:inline-block; margin:20px; } 
.join.hot .area .image-block img{ width:100%; }
.join.hot .area p{ line-height:1.5; }
.join.hot .btn.apply{ width:145px; position:fixed; top:50%; right:15px; z-index:89;}
.join.hot .btn.apply:before{ content:''; display:block; width:100%; padding-top:100%; background:url('../join/images/hot_btn.png'); background-size:cover; }


/* 200421 */
.join.hot.hot4-2 .area-5 .zone {width: 100% ;margin-top: 15px; }
.join.hot.hot4-2 .area-5 .zone table{width:95%; margin:0 auto;font-size: 1.6rem;  box-sizing: border-box;  text-align: left;margin-top: 15px;  border: solid 1px #f58a00;background: #fff;}
.join.hot.hot4-2 .area-5 .zone table th{ color: #000;  background: #fbdfaf;font-size: 1.6rem; font-weight: bold; padding: 8px 10px 8px 25px;}
.join.hot.hot4-2 .area-5 .zone table tr{ border-bottom: solid 1px #d2d2d2; }
.join.hot.hot4-2 .area-5 .zone table td{ padding: 8px 5px 8px 25px;}
.join.hot.hot4-2 .area-5 .zone table tr td:nth-child(1){ color: #f56200; }
.join.hot.hot4-2 .area-5 .zone table tr:nth-last-child(1) { border-bottom: none; }

.join.hot.hot4-2 .area-1{ padding-bottom:0; }
.join.hot.hot4-2 .area-1 .text-block b{ font-weight:600; }
.join.hot.hot4-2 .area-1 .text-block strong{ color:#ea6900;  }
.join.hot.hot4-2 .area-1 .box{ display:flex; align-items:center;}
.join.hot.hot4-2 .area-1 .box .image-block{ position:relative; width:calc(100% / 5 * 3); padding-right:30px; margin-right:-75px; }
.join.hot.hot4-2 .area-1 .box .image-block:before {content:''; position:absolute; left:0; top:0; width:70px; height:79px; border-left:solid; border-top:solid; border-width:2px; border-color:#f58a00; transform:translate(-25px,-25px); }
.join.hot.hot4-2 .area-1 .box .text-block{ width:50%; background:#fff; padding:80px 35px 75px; box-shadow:2px 3px 6px 4px rgba(0,0,0,.1); text-align:left; }
.join.hot.hot4-2 .area-2{ position:relative; }
.join.hot.hot4-2 .area-2:before{ content:''; width:1px; height:100%; position:absolute; top:0; left:50%; border-left:dashed 1px rgba(245,138,0,.8); z-index:0;}
.join.hot.hot4-2 .area-2 .box{ display:flex; align-items:center; justify-content:center; border:solid 1px #d2d2d2; z-index:2; background:#fff;}
.join.hot.hot4-2 .area-3{ background:url('../join/images/bg-hot_area-3.jpg') #fdecda; background-size:cover;}
.join.hot.hot4-2 .area-3 .box{ display:flex; justify-content:space-between; }
.join.hot.hot4-2 .area-3 .box .text-block{ background:#fff; width:calc(100% / 2 - 20px); padding:10px 30px 40px;}
.join.hot.hot4-2 .area-3 .box ul{ text-align:left; margin-left:1.5em;}
.join.hot.hot4-2 .area-3 .box ul li{ margin-bottom:.4em; }
.join.hot.hot4-2 .area-3 .box ul li:before{ content:'\f101'; color:#f9a335; margin-left:-1.2em; margin-right:.3em; }
.join.hot.hot4-2 .area-4{ position:relative; }
.join.hot.hot4-2 .area-4:before ,.join.hot.hot4-2 .area-4:after{ content:''; width:1px; height:40%; position:absolute; border-left:dashed 1px rgba(245,138,0,.8); z-index:0;}
.join.hot.hot4-2 .area-4:before{ top:0; left:34%;}
.join.hot.hot4-2 .area-4:after{ bottom:0; right:34%;}
.join.hot.hot4-2 .area-4 .box{ display:flex; justify-content:space-between; align-items:flex-end; z-index:2;}
.join.hot.hot4-2 .area-4 .box .text-block{ width:calc(100% / 2 + 15px); padding:10px 30px 40px; border:solid 1px #c4d700; box-shadow:0 0 8px inset rgba(176, 231, 139, .5); display:flex; flex-direction:column; align-items:center; }
.join.hot.hot4-2 .area-4 .box .text-block:nth-of-type(1){ margin-right:-15px; background:url('../join/images/hot_4_2_area_4-01.png') #fff no-repeat 90% 90%;}
.join.hot.hot4-2 .area-4 .box .text-block:nth-of-type(2){ margin-left:-15px; margin-bottom:-30px;  background:url('../join/images/hot_4_2_area_4-02.png') #fff no-repeat 90% 90%;}
.join.hot.hot4-2 .area-4 .box .text-block h3{ border:solid 1px; font-size:2.2rem; display:inline-block; padding:.4em 1em; margin:1em;}
.join.hot.hot4-2 .area-4 .box .text-block .group{ text-align:left; display:inline-block;}
.join.hot.hot4-2 .area-4 .box ul{ text-align:left; margin-left:1.5em;}
.join.hot.hot4-2 .area-4 .box ul li{ margin-bottom:.4em; }
.join.hot.hot4-2 .area-4 .box ul li:before{ content:'\f101'; color:#a9cb49; margin-left:-1.2em; margin-right:.3em; }
.join.hot.hot4-2 .area-5{ background:url('../join/images/bg-hot_area-5.jpg') #fdecda; background-size:cover;  }
.join.hot.hot4-2 .area-5 .box{ display:flex; justify-content:center; }
.join.hot.hot4-2 .area-5 .box .text-block{ width:20em; text-align:left; margin-right:-4em;}
.join.hot.hot4-2 .area-5 .box .map-block{ width:75%; }
.join.hot.hot4-2 .area-5 .box .map-block .taiwan{ width:261px; position:relative; }
.join.hot.hot4-2 .area-5 .box .map-block .taiwan:before{ content:''; display:block; width:100%; padding-top:186%; background:url('../join/images/hot_4_2_area_5.png'); background-size:cover; }
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul{ position:absolute; width:100%; height:100%; top:0; left:0; }
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li{ position:absolute; }
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li:nth-of-type(1){ top:7.5%; left:59.5%; }
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li:nth-of-type(2){ top:16%; left:45.5%; }
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li:nth-of-type(3){ top:24.5%; left:53.5%; }
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li:nth-of-type(4){ top:32.5%; left:28.5%; }
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li:nth-of-type(5){ top:41%; left:18.5%; }
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li:nth-of-type(6){ top:50%; left:32%; }
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li:nth-of-type(7){ top:59%; left:13%; }
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li:nth-of-type(8){ top:68.5%; left:26%; }
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li h3{ z-index:1; display:inline-block; color:#3c6403; font-size:1.5rem; border:solid 2px #80c269; border-radius:15px; background:#fff; padding:.3em .6em; font-weight:500;}
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li h3:after{ content:'\f054'; font-size:.7em; }
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li h3.on{ color:#ef5c42; border-color:#f6730d; }
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li h4{ color:#ff6600; font-size:1.8rem; }
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li p{ font-size:1.5rem; }
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li .info{ position:absolute; left:160px; top:-25px; width:400px; text-align:left; background:#fff; box-sizing:border-box; padding:1.5em 1.2em; border-radius:4px; border:solid 1px #f6730d;}
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li .info:after{ content:''; position:absolute; width:12px; height:12px; border:solid 1px #f6730d; border-right:none; border-top:none; left:0; top:30px; transform:translateX(-50%) rotate(45deg); background:#fff;} 
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li input{ display:block; z-index:5; position:absolute; top:0; left:0; width:100%; height:30px; cursor:pointer; opacity:0;}
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li label{ display:none; }
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li input[type="radio"]:checked + label{ display:block; }
.join.hot.hot4-2 .area-6 .box .text-block{ text-align:left; }
.join.hot.hot4-2 .area-6 .box .text-block p{ color:#555454; }
.join.hot.hot4-2 .area-6 .box .text-block strong{ color:#ff6600; font-weight:400; }
.join.hot.hot4-2 .area-6 .box .during-group{ width:70%; margin:40px 2.5% 0; border:solid 1.3px #0f8740; border-bottom:none;}
.join.hot.hot4-2 .area-6 .box .during-group h3{ font-size:2rem; color:#0f8740; font-weight:500; display:inline-block; background:#fff; margin-top:-.5em; padding:0 .5em 1em;}
.join.hot.hot4-2 .area-6 .box .position-group{ display:flex; justify-content:space-around; margin-top:25px; }
.join.hot.hot4-2 .area-6 .box .position-group > li{ position:relative; width:calc(100% / 4 - 20px); box-shadow:0 0 6px 2px #dedede; padding-bottom:20px; }
.join.hot.hot4-2 .area-6 .box .position-group > li:nth-of-type(4){ box-shadow:none; }
.join.hot.hot4-2 .area-6 .box .position-group > li + li:before{ position:absolute; top:50%; left:0; content:'\f054'; display:inline-block; background:#cacaca; color:#fff; font-size:2.8rem; padding:6px 10px 6px 14px; border-radius:50%; transform:translate(-80%,-100%);}
.join.hot.hot4-2 .area-6 .box .position-group .icon{ width:70%; margin:-25px auto 20px;}
.join.hot.hot4-2 .area-6 .box .position-group .icon img{ width:100%; }
.join.hot.hot4-2 .area-6 .box .position-group h3{ font-size:2rem; font-weight:600; }
.join.hot.hot4-2 .area-6 .box .position-group h4{ font-size:1.8rem; font-weight:600; color:#8c8c8c; padding:.6em 0; }
.join.hot.hot4-2 .area-6 .box .position-group > li:nth-of-type(1) h3{ color:#ecb200; }
.join.hot.hot4-2 .area-6 .box .position-group > li:nth-of-type(2) h3{ color:#f97b04; }
.join.hot.hot4-2 .area-6 .box .position-group > li:nth-of-type(3) h3{ color:#5aa103; }
.join.hot.hot4-2 .area-6 .box .position-group > li:nth-of-type(4) h3{ color:#047e35; }
.join.hot.hot4-2 .area-6 .box .position-group .info ul{ text-align:left; width:calc(70% - 28px); margin:0 auto; }
.join.hot.hot4-2 .area-6 .box .position-group .info ul li{ margin-bottom:6px; }
.join.hot.hot4-2 .area-6 .box .position-group .info ul li:before{ content:''; display:inline-block; width:10px; height:10px; background:#cacaca; opacity:.5; margin-left:-14px; margin-right:4px; }
.join.hot.hot4-2 .area-6 .box .train-group{ display:flex; justify-content:flex-start; }
.join.hot.hot4-2 .area-6 .box .train-group li{ color:#fff; z-index:2; position:relative; font-size:1.9rem; padding:.3em;}
.join.hot.hot4-2 .area-6 .box .train-group li:after{ content:'\f04b'; position:absolute; top:50%; right:0; transform:translate(98%,-50%); font-size:5.6rem;} 
.join.hot.hot4-2 .area-6 .box .train-group li:nth-of-type(1){ background:#fe8009; }
.join.hot.hot4-2 .area-6 .box .train-group li:nth-of-type(1):after{ color:#fe8009; }
.join.hot.hot4-2 .area-6 .box .train-group li:nth-of-type(2){ background:#7abf25; }
.join.hot.hot4-2 .area-6 .box .train-group li:nth-of-type(2):after{ color:#7abf25; }

.join.hot.hot4-2 .area-1 .ani-line{ position:absolute; left:50%; top:-60%; width:100vw; transform:translateX(-50%); stroke:#f58a00; stroke-width:8px; opacity:.5;} 
.join.hot.hot4-2 .area-1 .ani-line:nth-of-type(2){ position:absolute; left:50%; top:80%; width:100vw; transform:translate(-50%,-50%); stroke:#f58a00; stroke-width:8px; opacity:.5; z-index:-1;} 
.join.hot.hot4-2 .area-1 .ani-line polyline{ fill:none; }
.join.hot.hot4-2 .area-1 .ani-square-block{ position:absolute; }
.join.hot.hot4-2 .area-1 .ani-square-block:nth-of-type(1){ transform:rotate(270deg); right:-20px; top:-40%; opacity:.45; }
.join.hot.hot4-2 .area-1 .ani-square-block:nth-of-type(2){ transform:scale(.7); right:0; top:-50%; }
.join.hot.hot4-2 .area-1 .ani-square-block:nth-of-type(2) .ani-square{ animation-delay:-2s; }
.join.hot.hot4-2 .area-3 .ani-square-block{ position:absolute; z-index:1; }
.join.hot.hot4-2 .area-3 .ani-square-block:before{ content:''; display:block; width:100%; padding-top:100%; background:#dddee5;  }
.join.hot.hot4-2 .area-3 .ani-square-block:nth-of-type(2){ left:-10%; top:-20%; width:50px; animation:act-square 10s infinite alternate; } 
.join.hot.hot4-2 .area-3 .ani-square-block:nth-of-type(2):before{ background:linear-gradient(to bottom, #dddee5 0%,#cee2e6 100%); }
.join.hot.hot4-2 .area-3 .ani-square-block:nth-of-type(3){ left:-5%; top:5%; width:30px; opacity:.5; animation: act-square 10s -2s infinite alternate;}
.join.hot.hot4-2 .area-4 .ani-square-block{ position:absolute; }
.join.hot.hot4-2 .area-4 .ani-square-block:nth-of-type(1){ transform:rotate(225deg); right:-20px; top:30%; } 
.join.hot.hot4-2 .area-4 .ani-square-block:nth-of-type(2){ transform:scale(.7) rotate(225deg); right:5%; top:10%; }
.join.hot.hot4-2 .area-4 .ani-square-block:nth-of-type(2) .ani-square{ animation-delay:-2s; }
.join.hot.hot4-2 .area-4 .ani-square-block .ani-square{ fill:#edf2bb; }

.join.hot.hot4-4 .area-1 .box .text-block{ text-align:left; margin:30px auto;}
.join.hot.hot4-4 .area-1 .box .image-block img{ width:100%; max-width:1000px; height:auto; }
.join.hot.hot4-4 .business-layout .box figure{ z-index:2;}
.join.hot.hot4-4 .business-layout .box figure .image-block img{ width:100%; border-radius:5px;}
.join.hot.hot4-4 .business-layout .box figure .text-block{ width:calc(100% - 20px); margin:-30px auto; background:#fff; padding:28px 45px; box-shadow:0 1px 4px 2px rgba(0,0,0,.3);}
.join.hot.hot4-4 .business-layout .box figure figcaption{ font-size:2rem; font-weight:600; border-bottom:solid 3px #f58a00; padding:.3em 0; display:inline-block; margin-bottom:20px; }
.join.hot.hot4-4 .business-layout .box{ display:flex; justify-content:space-around;}
.join.hot.hot4-4 .business-layout:nth-of-type(even) .box{ display:flex; justify-content:space-around; flex-direction:row-reverse; }
.join.hot.hot4-4 .business-layout:before, .join.hot.hot4-4 .business-layout:after{ content:''; position:absolute; z-index:-1; }
.join.hot.hot4-4 .area-2{ background:url('../join/images/bg-hot4-4_area-2.jpg'); background-size:cover; }
.join.hot.hot4-4 .area-2 .box figure:nth-of-type(1) .image-block:before{content:''; position:absolute; left:0; top:0; width:70px; height:79px; border-left:solid; border-top:solid; border-width:2px; border-color:#f58a00; transform:translate(-25px,-25px); }
.join.hot.hot4-4 .area-4{ background:url('../join/images/bg-hot4-4_area-4.jpg'); background-size:cover; }
.join.hot.hot4-4 .area-5 .image-block{ display:flex; justify-content:center; align-items:center; padding:60px 0; background:url('../join/images/future-area-1_bg.png') center bottom no-repeat; background-size:100% auto; }
.join.hot.hot4-4 .area-5 .image-block img{ width:auto; }
.join.hot.hot4-4 .area-5 .image-block img:nth-of-type(1){ transform:translateX(50%); transition:all 1.2s cubic-bezier(.5,.51,.32,.97);}
.join.hot.hot4-4 .area-5 .image-block img:nth-of-type(3){ transform:translateX(-50%); transition:all 1.2s cubic-bezier(.5,.51,.32,.97);}
.join.hot.hot4-4 .area-5 .image-block img:nth-of-type(2){ transform:scale(.75); opacity:0; transition:all 1s .4s cubic-bezier(.04,1.44,.39,1.07);}
.join.hot.hot4-4 .area-5.act .image-block img{ transform:translateX(0);}
.join.hot.hot4-4 .area-5.act .image-block img:nth-of-type(2){ transform:scale(1);  opacity:1; }
.join.hot.hot4-4 .area-2 .ani-square-block{ position:absolute; z-index:1; }
.join.hot.hot4-4 .area-2 .ani-square-block:before{ content:''; display:block; width:100%; padding-top:100%; background:#fff;  }
.join.hot.hot4-4 .area-2 .ani-square-block:nth-of-type(1){ right:-10%; top:0%; width:50px; animation:act-square 10s infinite alternate; } 
.join.hot.hot4-4 .area-2 .ani-square-block:nth-of-type(2){ right:-5%; top:15%; width:30px; opacity:.7; animation: act-square 10s -2s infinite alternate;}


.join.hot.hot5-1{ background:#e5e5e5; }
.join.hot.hot5-1 h2{ color:#fff; border-bottom-color:#b6985a;}

.join.hot.hot5-1 ul.tab-menu li{ background-color:#fff; }
.join.hot.hot5-1 ul.tab-menu li.active ,.join.hot.hot5-1 ul.tab-menu li.active:hover{ background-color:#f58a00 }
.join.hot.hot5-1 .top-container ul.breadcrumb li{ color:#fff; }
.join.hot.hot5-1 .dark-bg{ background:url('../join/images/hot5-1_dark-bg.jpg') center bottom; background-size:cover; }
.join.hot.hot5-1 .area-1{ padding:60px 0 0; background:url('../join/images/hot5-1_area-1_bg.jpg') center bottom no-repeat; background-size:100% 50px;}
.join.hot.hot5-1 .area-1 .box{ display:flex; margin-bottom:0; }
.join.hot.hot5-1 .area-1 .box .text-block img{ width:auto; max-width:100%; margin-bottom:-1%; }
.join.hot.hot5-1 .area-1 .box .text-block{ color:#fff; text-align:left; }
.join.hot.hot5-1 .area-1 .box .text-block .mark{ background:#b6985a; color:#2a303c; display:inline-block; padding:0 1.2em; font-size:1.8rem; font-weight:600; margin-bottom:.6em; }
.join.hot.hot5-1 .area-1 .box .text-block h3{ font-size:2.2rem; letter-spacing:.07em; margin-bottom:1.2em;}
.join.hot.hot5-1 .area-1 .box .text-block h3 strong{ font-size:1.2em; color:#f4d071; font-weight:400; }
.join.hot.hot5-1 .area-1 .box .text-block p{ font-size:1.8rem; }

.join.hot.hot5-1 .area-2{ background:url('../join/images/hot5-1_area-2-bg.jpg') center bottom; background-size:cover; }
.join.hot.hot5-1 .area-2 ul{ display:flex; flex-wrap:wrap; justify-content:center; }
.join.hot.hot5-1 .area-2 ul li{ width:calc(100% / 3 - 15px); max-width:340px; background:#fff; border:solid 3px #b6985a; margin:0 10px 30px; padding:0 40px 15px; text-align:center;  }
.join.hot.hot5-1 .area-2 ul li .icon{ width:52%; margin:6px auto; }
.join.hot.hot5-1 .area-2 ul li .icon img{ width:100%; }

.join.hot.hot5-1 .area-3{ background:url('../join/images/hot5-1_area-3-bg.jpg') center bottom; background-size:cover; }
.join.hot.hot5-1 .area-3 ul{ display:flex; margin:40px auto 30px;}
.join.hot.hot5-1 .area-3 ul li{ margin:0 20px; position:relative; width:calc(100% /5);}
.join.hot.hot5-1 .area-3 ul li + li:before{ content:'\f054'; position:absolute; top:50%; left:0; font-size:3.5rem; transform:translate(-30px,-50%); }
.join.hot.hot5-1 .area-3 ul li svg{ width:100%; height:auto; }
.join.hot.hot5-1 .area-3 ul li:nth-of-type(1) svg { fill:#ffbf3e; }
.join.hot.hot5-1 .area-3 ul li:nth-of-type(2) svg { fill:#fe912a; }
.join.hot.hot5-1 .area-3 ul li:nth-of-type(3) svg { fill:#78cc7c; }
.join.hot.hot5-1 .area-3 ul li:nth-of-type(4) svg { fill:#579dfe; }
.join.hot.hot5-1 .area-3 ul li:nth-of-type(5) svg { fill:#34b2e4; }
.join.hot.hot5-1 .area-3 ul li:nth-of-type(2):before{ color:#ffbf3e; }
.join.hot.hot5-1 .area-3 ul li:nth-of-type(3):before{ color:#fe912a; }
.join.hot.hot5-1 .area-3 ul li:nth-of-type(4):before{ color:#78cc7c; }
.join.hot.hot5-1 .area-3 ul li:nth-of-type(5):before{ color:#579dfe; }
.join.hot.hot5-1 .area-3 ul li h3{ font-size:2.2rem; color:#fff; position:absolute; display:inline-block; top:50%; left:50%; transform:translate(-50%,-50%); font-weight:600; line-height:1.2; }
.join.hot.hot5-1 .area-4{ background:url('../join/images/hot5-1_area-4_bg.jpg') center bottom; background-size:cover; }
.join.hot.hot5-1 .area-4 h4{ font-size:2.2rem; color:#fff; }
.join.hot.hot5-1 .area-4 ul{ display:flex; justify-content:center; margin:60px auto 40px; }
.join.hot.hot5-1 .area-4 ul li{ margin:0 20px; position:relative; width:calc(100% /3); max-width:290px; background:#fff; display:flex; flex-direction:column;}
.join.hot.hot5-1 .area-4 ul li .title-box ,.join.hot.hot5-1 .area-4 ul li .text-box{ padding:25px 30px; }
.join.hot.hot5-1 .area-4 ul li .title-box{ position:relative; flex:0 1 auto;}
.join.hot.hot5-1 .area-4 ul li .title-box h3{ color:#fff; font-size:2.2rem; line-height:1.4; }
.join.hot.hot5-1 .area-4 ul li .title-box:after{ content:''; display:inline-block; position:absolute; bottom:0; left:50%; width:20px; height:20px; transform:translate(-50%,50%) rotate(45deg); }
.join.hot.hot5-1 .area-4 ul li:nth-of-type(1) .title-box ,.join.hot.hot5-1 .area-4 ul li:nth-of-type(1) .title-box:after{ background:#ffbf3e; }
.join.hot.hot5-1 .area-4 ul li:nth-of-type(2) .title-box ,.join.hot.hot5-1 .area-4 ul li:nth-of-type(2) .title-box:after{ background:#fe912a; }
.join.hot.hot5-1 .area-4 ul li:nth-of-type(3) .title-box ,.join.hot.hot5-1 .area-4 ul li:nth-of-type(3) .title-box:after{ background:#78cc7c; }
.join.hot.hot5-1 .area-4 ul li .text-box{ display:flex; flex-direction:column; flex: 2 2 auto; justify-content:space-between;}
.join.hot.hot5-1 .area-4 ul li .text-box p{ text-align:left; color:#555454;  }
.join.hot.hot5-1 .area-5{ background:url('../join/images/hot5-1_area-5_bg.jpg') center bottom; background-size:cover; }
.join.hot.hot5-1 .area-5 .video-box{ width:100%; max-width:950px; border-radius:5px; border:solid 1px #fff; position:relative; margin:0 auto 20px; overflow:hidden;}
.join.hot.hot5-1 .area-5 .video-box:before{ content:''; display:block; width:100%; padding-top:56%; }
.join.hot.hot5-1 .area-5 .video-box iframe{ width:100%; height:100%; position:absolute; top:0; left:0; }
.join.hot.hot5-1 .area-5 h3{ color:#fff; font-size:2rem; }

/*HOT 進場動態*/
.join.hot .btn.apply{ opacity:0; transform:scale(.75); transition:transform .6s cubic-bezier(.18,.86,.34,.99);}
.join.hot .btn.apply.act{ opacity:1; transform:scale(1);}
.join.hot .area .box{ opacity:0; transform:scale(.75); transition:transform 1.2s cubic-bezier(.18,.86,.34,.99);}
.join.hot .area.act .box{ opacity:1; transform:scale(1); }

.join.hot.hot4-4 .business-layout.act .box{ opacity:1; transform:scale(1); transition:all 0s;}
.join.hot.hot4-4 .business-layout .box figure{ transform:translateY(25%); }
.join.hot.hot4-4 .business-layout.act .box figure{ transform:translateY(0); transition-delay:.4s; transition:transform 1.2s cubic-bezier(.18,.86,.34,.99);  }
.join.hot.hot4-4 .business-layout.act .box figure:nth-of-type(2){ transition-delay:.6s; }

.join.hot.hot5-1 .area-2 li ,.join.hot.hot5-1 .area-4 li{ transform:translateY(30px); transition:transform 1.8s cubic-bezier(.18,.86,.34,.99);}
.join.hot.hot5-1 .area-2 li.act ,.join.hot.hot5-1 .area-4 li.act{ transform:translateY(0); }

.join.hot.hot5-1 .area-3 li{ transition:transform 1.8s cubic-bezier(.18,.86,.34,.99);}


/* 側邊選單 */
.join .fixed-btn { width: 60px; height: 60px; border-radius: 30px; display: flex; justify-content: center; align-items: center; line-height: 1.1em; background: #fe912a; color: #fff; position: fixed; bottom: 20px; right: 12px; z-index: 100; cursor: pointer; box-shadow: 3px 3px 3px rgba(0, 0, 0, .5);  }


/*login*/
.login .top-container h2{ margin:20px 0 35px; }
.login .form-container{ width:100%; max-width:800px; margin:30px auto 0; } 
.login .form-container form{ border-bottom:dashed 1px #b7b7b7; border-top:dashed 1px #b7b7b7; margin:40px auto; padding-top:20px;}
.login .form-container p{ font-size:1.5rem; line-height:1.5; color:#555454; }
.login .form-container p.note { font-size: 1.4rem; line-height: 1.4; color: red; }
.login .form-container table{ width:auto; margin:0 auto; }
.login .form-container tr{ border:none; }
.login .form-container th{ text-align:justify; text-justify:inter-ideograph; width:calc(6em + 60px); padding-right:60px;}
.login .form-container th:after{ content:''; display:inline-block; width:100%; }
.login .form-container td{ width:auto; }
.login .form-container.join_member form{ padding:20px 0;}
.login .form-container.join_member th{ text-align:left; width:calc(6em + 40px);}
.login .form-container.join_member td{ width:260px;}
.login .form-container.join_member p{ font-size:1.6rem; color:#020000; margin-bottom:20px;}
.login .form-container.join_member a{ color:#f6730a; text-decoration: underline;}
.login .form-container .join_clause { font-size: 15px; color: #555454; line-height: 1.5; text-align:left; padding: 20px; border:1px solid #f6730a;}
.login .form-container .join_clause ul { font-size: 15px; list-style: decimal; margin-left:1.5em;}
.login .form-container .join_clause ul li { font-size: 15px; line-height: 1.5; margin-bottom:0;}



/*填寫履歷*/
.resume .form-container td{ padding:0; }
.resume .form-container form{ padding-bottom:30px; overflow-x:auto; }
.resume .form-container form .must:before{ content:'*'; color:#fa0909; font-size:inherit;  }
.resume .form-container form h4{ font-size:1.5rem; text-align:left; }
.resume .form-container form h5{ font-size:1.3rem; text-align:left; margin:4px 0; }
.resume .form-container form td{ padding:15px 16px; }
.resume .form-container form td + td{ border-left:none; }
.resume .form-container form .table-th{ font-size:1.6rem; font-weight:400; color:#383838; display:inline-block; vertical-align:middle;}
.resume .form-container form .table-th:after{ content:'：'; }
.resume .form-container form .photo-box{ display:flex; flex-direction:column; align-items:center; }
.resume .form-container form .photo-box .btn-style{position:relative; border-radius:3px; background:#f58a00; color:#fff; transition:all .6s; font-size:2rem; margin:10px 0;}
.resume .form-container form .photo-box .btn-style input{background:transparent; border:solid 1px #f58a00; color:inherit; padding:.2em 1em; cursor:pointer; border-radius:3px; font-size:1.5rem; }
.resume .form-container form select{ border:solid 1px #d5d3d3; padding:2px .6em; display:inline-block; vertical-align:middle; -webkit-appearance:menulist; -moz-appearance:menulist; -ms-appearance:menulist; appearance:menulist; margin-bottom: 5px; }
.resume .form-container form .check-style li{ display:inline-block; } 
.resume .form-container form .check-style li input[type="radio"] ,
.resume .form-container form .check-style li input[type="checkbox"]{ position:absolute; opacity:0; }
/*
.resume .form-container form .check-style li input[type="radio"] + label:before{ content:'\f111'; padding-right:.35em; font-size:.9em; font-weight:400; color:#d5d3d3; }
.resume .form-container form .check-style li input[type="radio"]:checked + label:before{ color:#74bf8a; font-weight:900; }
.resume .form-container form .check-style li input[type="checkbox"] + label:before{ content:'\f0c8'; padding-right:.35em; font-weight:400; color:#d5d3d3; }
.resume .form-container form .check-style li input[type="checkbox"]:checked + label:before{ content:'\f14a'; color:#74bf8a; font-weight:900; }
*/
.resume .form-container form .check-style li label{ display:inline-block; cursor:pointer;}
.resume .form-container form .check-style li + li{ margin-left:1.5em; }
.resume .form-container form .btn-box li:after{ display:none; }
.resume .form-container form input + span{ margin-left:1.5em; }
.resume .form-container form b{ font-size:inherit; font-weight:600;}
.resume .form-container .tabel-green{ }
.resume .form-container .tabel-green span{ vertical-align:middle; }
.resume .form-container .tabel-green input ,
.resume .form-container .tabel-green .select-block ,
.resume .form-container .tabel-green .check-style{ vertical-align:middle; display:inline-block; }
.resume .form-container .tabel-green input ,
.resume .form-container .tabel-green textarea{ border:solid 1px #d5d3d3; outline:0; padding:3px .4em; box-sizing:content-box; width:auto; transition:all .6s; }
.resume .form-container .tabel-green textarea{ display:block; width:100%; resize:vertical;}
.resume .form-container .tabel-green input:focus ,
.resume .form-container form textarea:focus{ border-color:#74bf8a; }

/*內招公告*/
.in .kv-container{ background-image:url(../in/images/kv.jpg); background-position:50% 45%;}
.in.login .form-container th{ width:calc(7em + 60px); }


/* 聯絡我們 */
.contact .kv-container{ background-image:url(../images/contact/kv.jpg); background-position:50% 48%;}
.contact .info-container .text-box{ display:flex; justify-content:space-between; }
.contact .info-container .text-box .text-block{ border:solid 1px #f37721; padding:30px 45px;}
.contact .info-container .text-box .text-block h3{ color:#f37721; font-size:1.7rem; margin-bottom:.8em;}
.contact .info-container .text-box .text-block p{ font-size:1.4rem; text-align:left; line-height:1.3; }
.contact .info-container .text-box .text-block a{ color:#f37721; }
.contact .info-container .text-box .text-block:nth-of-type(2){ border-color:#008062; }
.contact .info-container .text-box .text-block:nth-of-type(2) h3{ color:#008062; }
.contact .form-container th{ width:calc(5em + 60px); }
.contact .form-container form{ border:none; }



/* 實習計畫 */
.coedu{ padding-bottom:0; }
.coedu .kv-container{ background-image:url(../Coedu/images/kv.jpg); background-position:50% 20%;}
.coedu .top-container{ position:relative; top:0; /*padding:25px 0 30px;*/ transition:top .6s;}
.coedu .top-container.fixed{ position:fixed; left:0; width:100%; padding:8px 0; z-index:90; background:#fff; box-shadow:0 2px 1px 0 rgba(0,0,0,.2); }
.coedu ul.tab-menu{ background:#fff; }
.coedu ul.tab-menu li ,
.coedu ul.tab-menu:hover span{ width:calc(100% / 8); }
.coedu .area .container{ opacity:0; transform:scale(.75); transition:transform .6s cubic-bezier(.18,.86,.34,.99); /*min-height:100vh; border:solid; background:#ddd;*/}
.coedu .area.act .container{ opacity:1; transform:scale(1);}

.coedu article{ background:url(../images/bg-dot.gif); padding-top:25px;}
.coedu article .area{ padding:40px 0;}
.coedu article .area h2{ font-size:2.6rem; font-weight:600; border-bottom:solid 3px #f58a00; padding:.3em 0; display:inline-block; margin-bottom:20px; }
.coedu article .area .image-block img{ width:100%; }
.coedu article .area-1{ z-index:2;}
.coedu article .area-1 .container{ opacity:1; transform:scale(1);}
.coedu article .area-1 .box{ display:flex; align-items:flex-end; }
.coedu article .area-1 .box .image-block{ position:relative; width:calc(100% / 5 * 3); padding:16px 30px 35px 16px; margin-right:-75px; margin-bottom:.2em;}
.coedu article .area-1 .box .image-block:before{ content:''; position:absolute;left: 0; top:0; width:70px; height:79px; border-left:solid; border-top:solid; border-width:2px; border-color:#f58a00; }
.coedu article .area-1 .box .text-block{ width:50%; background:#fff; padding:80px 35px 75px; box-shadow:4px 5px 1px 2px rgba(0,0,0,.05); text-align:left;}
.coedu article .area-1 .box .text-block p{ line-height:1.5; color:#010000; }
.coedu article .area-2{ margin:60px 0 20px; position:relative; }
.coedu article .area-2:before ,
.coedu article .area-2:after{ content:''; display:block; width:100%; height:100%;  position:absolute; left:0; z-index:0; transform:skewY(-2.5deg); }
.coedu article .area-2:before{ border:solid 2px #e8e8e8; border-top:solid 4px #e8e8e8; top:-10px;}
.coedu article .area-2:after{ background:#e8e8e8; top:0;}
.coedu article .area-2 .container{ z-index:1; }
.coedu article .area-2 .box{ display:flex; justify-content:space-between;  }
.coedu article .area-2 .box .text-block{ width:calc(50% - 10px); background:url(../images/bg-dot.gif); padding:30px 45px; display:flex; flex-direction:column; align-items:center;} 
.coedu article .area-2 .box .text-block h3{ font-size:2.25rem; border:solid 1px; font-weight:600; display:inline-block; padding:.4em .8em; }
.coedu article .area-2 .box .text-block dl{ counter-reset:section; text-align:left; margin:20px 0;}
.coedu article .area-2 .box .text-block dl dt{ counter-reset:subsection; display:flex;}
.coedu article .area-2 .box .text-block dl dt + dt{ margin-top:1.5em;}
.coedu article .area-2 .box .text-block strong{ font-size:1.9rem; font-weight:400; position:relative; }
.coedu article .area-2 .box .text-block strong:before{ counter-increment:section 1; content:counters(section, ". "); font-size:2rem; font-weight:400; background:#ffdb47; color:#fff; width:1em; height:1em; margin-right:12px; text-align:center; display:inline-block; padding:.2em; position:absolute; margin-left:-1.8em; }
.coedu article .area-2 .box .text-block strong:after{ content:'\f101'; margin:1em; color:#f9a335; font-weight:900; font-size:.85em; }
.coedu article .area-2 .box .text-block p{ font-size:1.8rem; line-height:2.6rem; color:#545454;}
.coedu article .area-2 .box .text-block:nth-of-type(2) strong:before{ background:#4db560; }
.coedu article .area-2 .box .text-block:nth-of-type(2) strong:after{ color:#67c378; }
.coedu article .area-3{ padding-bottom:60px; }
.coedu article .area-3 ul{ text-align:left; display:inline-block; margin-left:2.5em;} 
.coedu article .area-3 ul li{ position:relative; font-size:1.8rem; color:#010000; margin-bottom:.6em;}
.coedu article .area-3 ul li:before{ content:'\f101'; font-weight:900; color:#f9a335; position:absolute; margin-left:-1.4em; line-height:1.8; }
.coedu article .area-4{ background:#fde8d2; }
.coedu article .area-4 ul{ display:flex; flex-wrap:wrap; justify-content:space-between; width:100%; max-width:830px; margin:20px auto 0;}
.coedu article .area-4 ul li{ width:calc(25% - 30px); max-width:180px; margin-bottom:35px; background:rgba(255,255,255,.5); border-radius:5px; padding:16px 16px 25px; }
.coedu article .area-4 ul li h3{ font-size:2.2rem; color:#2688ae; padding:10px 0 0;  }
.coedu article .area-4 ul li p{ text-align:left; color:#010000; line-height:1.5; margin-top:16px; }
.coedu article .area-5 h3{ font-size:2rem; }
.coedu article .area-5 h3 strong{ color:#f58a00; }
.coedu article .area-5 dl{ counter-reset:section; display:flex; justify-content:space-around; padding:40px 0;}
.coedu article .area-5 dl dt{ counter-reset:subsection; font-size:2.2rem; }
.coedu article .area-5 dl dt + dt{margin-top:.7em;}
.coedu article .area-5 dl dt:before{ counter-increment:section 1; content:counters(section, ". "); font-weight:200; font-style:italic; display:inline-block; text-align:center; padding:.15em; width:1em; line-height:1; border:solid 1px; margin-right:14px;} 
.coedu article .area-5 .text-block{ width:calc(100% / 3); max-width:304px; background:#fff; box-shadow:0 0 4px rgba(0,0,0,.3); text-align:left; }
.coedu article .area-5 .text-block .title{ color:#fff; padding:24px 38px; position:relative;}
.coedu article .area-5 .text-block + .text-block .title:before{ position:absolute; content:'\f105'; font-size:4.5rem; top:65px; left:0; transform:translate(-220%,-50%); }
.coedu article .area-5 .text-block .info{ padding:0 38px 24px; }
.coedu article .area-5 .text-block h4{ font-size:1.9rem; font-weight:500; margin:24px 0 14px; }
.coedu article .area-5 .text-block ul{ margin-left:1.5em; }
.coedu article .area-5 .text-block ul li{ position:relative; font-size:1.8rem;}
.coedu article .area-5 .text-block ul li:before{ position:absolute; content:''; display:inline-block; width:10px; height:10px; opacity:.5; margin:.5em 0 0 -1em; }
.coedu article .area-5 .text-block:nth-of-type(1) .title ,
.coedu article .area-5 .text-block:nth-of-type(1) ul li:before{ background:#f58182; }
.coedu article .area-5 .text-block:nth-of-type(1) h4{ color:#f58182; }
.coedu article .area-5 .text-block:nth-of-type(2) .title ,
.coedu article .area-5 .text-block:nth-of-type(2) ul li:before{ background:#fe8637; }
.coedu article .area-5 .text-block:nth-of-type(2) h4 ,
.coedu article .area-5 .text-block:nth-of-type(2) .title:before{ color:#fe8637; }
.coedu article .area-5 .text-block:nth-of-type(3) .title ,
.coedu article .area-5 .text-block:nth-of-type(3) ul li:before{ background:#51b751; }
.coedu article .area-5 .text-block:nth-of-type(3) h4,
.coedu article .area-5 .text-block:nth-of-type(3) .title:before{ color:#51b751; }
.coedu article .area-6{ background:#f5f5f7; }
.coedu article .area-6 h3{ font-size:2rem; }
.coedu article .area-6 .box{ display:flex; justify-content:center; padding:40px 0;}
.coedu article .area-6 .fTree ul{ position:relative; display:flex; flex-direction:column;}
.coedu article .area-6 .fTree li{ position:relative; display:flex; align-items:center;}
.coedu article .area-6 .fTree li + li{ margin-top:20px; }
.coedu article .area-6 .fTree ul ul{ padding-left:114px; }
.coedu article .area-6 .fTree ul ul:before{ content:''; position:absolute; top:50%; left:0; border-top:2px solid #fb771a; width:70px; height:0; } 
.coedu article .area-6 .fTree ul ul li:before ,
.coedu article .area-6 .fTree ul ul li:after{ content:''; position:absolute; top:50%; left:0; width:43px; height:100%; border:2px solid #fb771a; border-right:0; border-bottom:0;}
.coedu article .area-6 .fTree ul ul li:before{ transform:translateX(-100%); }
.coedu article .area-6 .fTree ul ul li:after{ border-top:0; transform:translate(-100%,-98%);}
.coedu article .area-6 .fTree ul ul li:nth-of-type(1):after{ display:none; }
.coedu article .area-6 .fTree ul ul li:nth-last-of-type(1):before{ border-left:0; }
.coedu article .area-6 .fTree h4{ font-size:2.3rem; padding:1.3em 4.5em; background:#65c276; white-space:nowrap;}
.coedu article .area-6 .fTree > ul{ padding-left:80px; }
.coedu article .area-6 .fTree > ul > li > h4{ writing-mode:vertical-lr; letter-spacing:.3em; padding:3.4em 2em; color:#fff;}
.coedu article .area-6 .fTree ul ul li:nth-of-type(1) h4{ background:#ffab6f; }
.coedu article .area-6 .fTree ul ul li:nth-of-type(2) h4{ background:#feb886; }
.coedu article .area-6 .fTree ul ul li:nth-of-type(3) h4{ background:#fdc69f; }
.coedu article .area-6 .fTree ul ul li:nth-of-type(4) h4{ background:#fcd5b9; }
.coedu article .area-6 .image-block{ padding:60px; padding-right:0; max-width:340px;}
.coedu article .area-7 .box{ display:flex; text-align:left;}
.coedu article .area-7 h3{ font-size:2.2rem; position:relative; padding-left:40px; line-height:1.2; margin-bottom:.8em; } 
.coedu article .area-7 h3:before{ padding:.1em .35em; display:inline-block; color:#fff; font-weight:400; position:absolute; left:0; } 
.coedu article .area-7 .box .text-block:nth-of-type(1) h3:before{ content:'Q'; background:#4db560; }
.coedu article .area-7 .box .text-block:nth-of-type(2) h3:before{ content:'A'; background:#f58a00; }
.coedu article .area-7 .box .text-block table{ width:100%; }
.coedu article .area-7 .box .text-block table th ,
.coedu article .area-7 .box .text-block table td{ font-weight:400; font-size:1.9rem; padding:.6em 1em; }
.coedu article .area-7 .box .text-block table th + th ,
.coedu article .area-7 .box .text-block table td + td{ border-left:solid 1px #fff; }
.coedu article .area-7 .box .text-block table th{ background:#f58a00; color:#fff; }
.coedu article .area-7 .box .text-block table tr{ background:#fff; }
.coedu article .area-7 .box .text-block table tr:nth-of-type(odd){ background:#f3f3f3; }
.coedu article .area-8{ background:#f7f4ed; padding:60px 0 80px;}
.coedu article .area-8 .box{ display:flex; justify-content:center; text-align:left; counter-reset:section;}
.coedu article .area-8 h3{ font-size:2.2rem; position:relative; line-height:1.2; margin-bottom:.8em; } 
.coedu article .area-8 h3:before{ counter-increment:section 1; content:counters(section, ". "); padding:.1em .35em; display:inline-block; color:#fff; background:#6aabf7; font-weight:400; position:absolute; left:-1.8em; }
.coedu article .area-8 .text-block p{ font-size:1.8rem; line-height:1.2; margin-bottom:.4em; }
.coedu article .area-8 .text-block a{ color:#f55c00; }
.coedu article .area-8 .text-block:nth-of-type(2) .mobile-hide{ display:none; }

.coedu article .area-1 .ani-line{ position:absolute; left:50%; top:30%; width:100vw; transform:translateX(-50%); stroke:#f58a00; stroke-width:8px; opacity:.5;} 
.coedu article .area-1 .ani-line:nth-of-type(2){ transform:translateX(-60%); stroke-width:2px; }
.coedu article .area-1 .ani-line polyline{ fill:none; }
.coedu article .area-1 .ani-square-block{ position:absolute; }
.coedu article .area-1 .ani-square-block:nth-of-type(1){ transform:rotate(270deg); right:-20px; top:20px; }
.coedu article .area-1 .ani-square-block:nth-of-type(2){ transform:scale(.7); right:0; top:0; }
.coedu article .area-1 .ani-square-block:nth-of-type(2) .ani-square{ animation-delay:-2s; }

.coedu article .area-2 .ani-line{ position:absolute; left:50%; top:0; width:100vw; transform:translate(-50%,-50%); stroke:#f58a00; stroke-width:8px; opacity:.5; z-index:1;} 
.coedu article .area-2 .ani-square-block{ position:absolute; z-index:1; }
.coedu article .area-2 .ani-square-block:before{ content:''; display:block; width:100%; padding-top:100%; background:#dddee5;  }
.coedu article .area-2 .ani-square-block:nth-of-type(2){ left:40px; bottom:-20px; width:50px; animation:act-square 10s infinite alternate; } 
.coedu article .area-2 .ani-square-block:nth-of-type(2):before{ background:linear-gradient(to bottom, #dddee5 0%,#cee2e6 100%); }
.coedu article .area-2 .ani-square-block:nth-of-type(3){ left:85px; bottom:-45px; width:30px; opacity:.5; animation: act-square 10s -2s infinite alternate;}
.coedu article .area-2 .ani-square-block:nth-of-type(4){ right:85px; top:45px; width:47px; opacity:.5; animation: act-square 10s -2s infinite alternate;}
.coedu article .area-2 .ani-square-block:nth-of-type(4):before{ background:#f2d9e4; background:linear-gradient(to bottom, #f2d9e4 0%,#e5dde5 100%); }


/*加盟主專區*/
.fc .kv-container{ background-image:url(../fc/images/kv.jpg); background-position:50% 37%;}
.fc ul.tab-menu{ margin-bottom:30px; }
.fc ul.tab-menu li, 
.fc ul.tab-menu:hover span{ width:calc(100% / 5); }
.fc .form-container .check-style li{ display:inline-block; }
.fc .form-container .check-style li + li{ margin-left:2em; }

.fc.search td{ color:#555454; }
.fc.search td span.highlight { color:#ff0000; }

.fc.login .form-container th{ width:calc(5em + 60px);}
.fc.login .note{ color:#555454; text-align:left; }
.fc.login .note h3{ font-size:1.7rem; font-weight:500; margin-bottom:.4em; }
.fc.login .note h4{ font-weight:500; margin:.4em 0 .2em; }
.fc.login .note h4 ,
.fc.login .note li{ font-size:1.4rem; }
.fc.login .note a{ color:#f6730a;  }
.fc.login .note strong{ color:#ff0000;  }
.fc.login .note ol{ list-style:decimal; margin-left:1.7em;}
.fc.login .note li{ line-height:1.3; margin-bottom:.6em; }
.fc.login .note li li{ margin-bottom:.4em; }
.fc.login .note ul > li{ padding-left:1em; }
.fc.login .note ul > li:before{ content:'*'; margin-left:-1em; width:1em; display:inline-block; }
.fc.login.forget .form-container th{ width:calc(8em + 80px);}

.fc.basic .text-box h3{ font-size:2.4rem; text-align:center; width:100%;}
.fc.basic .information-box{ display:flex; margin-bottom:60px;}
.fc.basic .information-box .information-block{  }
.fc.basic .information-box table{ width:100%; }
.fc.basic .information-box th{ text-align:left; font-weight:400; }
.fc.basic .information-box th ,
.fc.basic .information-box td{ font-size:1.6rem; }
.fc.basic .information-box th{ padding:0 15px; font-weight:500; }
.fc.basic .information-box td{ display:flex; flex-wrap:wrap; padding:15px; }
.fc.basic .information-box td h4{ display:block; padding-top:.2em; font-size:1.4rem; }
.fc.basic .information-box ul{ width:100%; }
.fc.basic .information-box ul li{ display:flex; justify-content:space-between; }
.fc.basic .information-box ul li input{ width:48%;}
.fc.basic .select-style select{ width:auto; }
.fc.basic select{ border:solid 1px #d5d3d3; background:transparent; padding:.4em 1.5em .4em .6em; -moz-padding:0; width:46%; color:#545454; letter-spacing:.1rem; cursor:pointer; -webkit-appearance:menulist; -moz-appearance:menulist; /*-ms-appearance:unset; appearance:menulist;*/ }
.fc.basic table input{ border:solid 1px #d5d3d3; outline:0; padding:.2em .4em; box-sizing:border-box; width:100%; transition:all .6s; }
.fc.basic table input:focus{ border-color:#f58a00; }

.fc.basic table input[type="checkbox"] + label:before{ content:'\f0c8'; padding-right:.35em; font-weight:400; color:#d5d3d3;}
.fc.basic table input[type="radio"]:checked + label:before ,
.fc.basic table input[type="checkbox"]:checked + label:before{ content:'\f14a'; font-weight:900; color:#f58a00;}
.fc.basic table input[type="radio"]:disabled + label ,
.fc.basic table input[type="checkbox"]:disabled + label { color:#ccc; }


.fc.jobOpen form{ padding:20px 0; display:block; }
.fc.jobOpen form .check-style li{ display:inline-block; }
.fc.jobOpen form .check-style li + li{ margin-left:1.5em; }
.fc.jobOpen form table input{ border:solid 1px #d5d3d3; outline:0; padding:3px .4em; box-sizing:content-box; width:auto; transition:all .6s;}
.fc.jobOpen form table .btn-style input ,.fc.jobOpen form table .btn-box input{ border:none; }
.fc.jobOpen form table .btn-box li:after{ display:none; }
.fc.jobOpen form table .table-th{white-space:nowrap;}
.fc.jobOpen .result td.note{ text-align:right; }
.fc.jobOpen form .check-style.during li{ display:block;}
.fc.jobOpen form .check-style.during li + li{ margin-left:0; }
.fc.jobData form h5{ font-size:.9em; display:inline-block;}
.fc.jobData form select{ position:relative; border:solid 1px #d5d3d3; background:transparent; pointer-events:auto; box-sizing:border-box; padding:.4em 1.5em .4em .6em; -moz-padding:0; width:auto; outline:none; color:#545454; letter-spacing:.1rem; cursor:pointer; }
.fc.jobData form select{-webkit-appearance:menulist; -moz-appearance:menulist;}
.fc.jobData form .check-style li{ width:auto; }
.fc.jobData form .pay > li{ width:100%; }
.fc.jobData form .pay > li + li{ margin-left:0; }
.fc.jobData form .pay .during li{ flex-grow:inherit; }
.fc.jobData form .pay .during li + li{ margin-left:0; }
.fc.jobData form input, .fc.jobData form textarea{ border:solid 1px #d5d3d3; outline:0; padding:.2em .4em; box-sizing:border-box; width:100%; transition:all .6s; width:auto; }
.fc.jobData form input:focus, .fc.jobData form textarea:focus{ border-color:#f58a00; }
.fc.jobData form .deadline li{ width:auto; display:inline-block; }
.fc.jobData .btn-box li{   }
.fc.jobData .btn-box li:after{ display:none; }
.fc.jobData .btn-box li input{ border:0; border:solid 1px #7fc9ec; padding:10px 2.5em;}
.fc.jobData .form-container center{ font-size:1.6rem; }
.fc.jobData .form-container center a{ border:0; border:solid 1px #7fc9ec; padding:10px 2.5em; border-radius:3px; color:#7fc9ec; }
.fc.applys form select{ width:auto; }
.fc.resume.candidate table{ width:100%; max-width:700px; margin:0 auto 30px; }
.fc.resume.candidate td{ padding:8px 10px; }
.fc.resume.candidate table ul { list-style: decimal; margin-left: 2em; }
.fc.resume.candidate table ul li { margin-bottom: 10px; }
.fc.resume.candidate ul.note {max-width: 700px; margin: 0 auto 10px auto; text-align: left; list-style: decimal; color: red;font-size: 1.6rem;}
.fc.resume.candidate ul.note li { margin:5px 0 0; color: red; font-size: 1.6rem; margin-left: 2.5rem;}
.fc.resume.candidate ul.note li:before { content: none; }


.fc.news h2 { font-size: 2.4rem; font-weight: bold; line-height: 1.4; margin: 35px 0 25px 0; text-align: center; color:#f58a00;}
.fc.news h3 { font-size: 1.8rem; font-weight: bold; line-height: 1.4; }
.fc.news p { font-size: 1.6rem; line-height: 1.4;}
.fc.news img { width: 100%; }
.fc.news .news-container { max-width: 800px; text-align: left; margin-bottom: 40px; }
.fc.news .news-container img { width: 100%; height: auto; margin: 20px 0; }
.fc.news ul.newslist { width: 100%; margin: 0 auto; box-sizing: border-box; margin-bottom: 30px; }
.fc.news ul.newslist li, .fc.news ul.newslist li a { width: 100%; display: flex; }
.fc.news ul.newslist li:nth-child(even) {background: #fffaf2;}
.fc.news ul.newslist li a:hover { background: #fff6d4; }
.fc.news ul.newslist li div { padding: 15px 20px; border-bottom: 1px solid #d2d2d2; }
.fc.news ul.newslist li div:nth-child(1) { min-width: 70%; padding-left: 60px; text-align: left; border-right: 1px solid #fff ; color: #010000; }
.fc.news ul.newslist li div:nth-child(2) { min-width: 30%; display: flex; justify-content: center; align-items: center;}
.fc.news ul.newslist li.title div { padding-left: 20px; text-align: center; background: #fbdfaf; border-bottom: none; font-weight: bold; }
.fc.news ul.newslist li .thumbtack:before { content: ""; width: 24px; height: 30px; position: absolute; top: calc(50% - 15px); left: 20px; display:flex; background: url('../fc/images/icon-thumbtack.svg') no-repeat; }

/* popup */
.popup { width: 100%; height: 100%; background: rgba(0, 0, 0, .5); display: flex; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; z-index: 1000; }
.popup .popup-content { width: 94%; max-width: 520px; background: #fff; display: flex; align-items: center; justify-content: center; flex-direction: column; border-radius: 10px; padding: 40px 30px 20px; }
.popup .popup-content .otp-wrap { display: flex; align-items: flex-start; gap: 15px; font-family: sans-serif; margin: 30px 0 0; }
.popup .popup-content .otp-wrap label { white-space: nowrap; font-weight: bold; margin-top: 5px; }
.popup .popup-content .otp-input-group { display: flex; flex-direction: column; }
.popup .popup-content .otp-input-group input { border: 1px solid #d2d2d2; padding: 3px 10px; font-size: 16px; width: 200px; }
.popup .popup-content .otp-input-group .error-msg { color: red; font-size: 14px; margin-top: 4px; }
.popup .popup-content .btn-inactive { background:#b7b7b7; border: solid 1px #b7b7b7; }


/*常見問題*/
.qa .kv-container{ background-image:url(../qa/images/kv.jpg); background-position:50% 37%;}
.qa .question-container{ max-width:1090px; margin:0 auto; }
.qa .question-container ul li{ border-bottom:dashed 1px #b7b7b7; padding:35px 70px 0; }
.qa .question-container h3 ,.qa .question-container .answer{ margin-bottom:35px; position:relative; }
.qa .question-container h3{ font-size:1.6rem; display:block; text-align:left; }
.qa .question-container h3 a{ width:100%; padding:8px 0; line-height:1.4;}
.qa .question-container .answer{ text-align:left; }
.qa .question-container h3:before ,
.qa .question-container .answer:before{ font-weight:400; color:#fff; font-size:1.4em; width:36px; height:36px; line-height:36px; display:inline-block; box-sizing:border-box; text-align:center; position:absolute; /*top:0; left:0;*/ transform:translate(-42px,-4px); }
.qa .question-container h3:before{ content:'Q'; background:#4db560;}
.qa .question-container .answer:before{ content:'A'; background:#f58a00;}
.qa .question-container ul li{ transform:translateY(50%); transition:transform .6s cubic-bezier(.18,.86,.34,.99); }
.qa .question-container ul li.act{ transform:translateY(0); }


/*教育訓練*/
.training .kv-container{ background-image:url(../about/images/kv-training.jpg); background-position:50% 37%;}
.training article .area .image-block img{ width:100%; }
.training article .area h2{ font-size:2.6rem; font-weight:600; border-bottom:solid 3px #f58a00; padding:.3em 0; display:inline-block; margin-bottom:20px; }
.training .area-1{ z-index:2; padding:60px 0;}
.training .area-1 .box{ display:flex; align-items:center; }
.training .area-1 .box .image-block{ position:relative; width:calc(100% / 5 * 3); padding:20px; margin-right:-75px;}
.training .area-1 .box .image-block:before{ content:''; position:absolute;left: 0; top:0; width:70px; height:79px; border-left:solid; border-top:solid; border-width:2px; border-color:#f58a00; /*transform:translateX(30px);*/ }
.training .area-1 .box .text-block{ width:44%; background:#fff; padding:56px 30px; box-shadow:2px 3px 4px 3px rgba(0,0,0,.12), 0 0 1px 0 rgba(0,0,0,.03); text-align:left;}
.training .area-1 .box .text-block p{ line-height:1.5; color:#010000; }
.training .area-1 .ani-square-block{ position:absolute; }
.training .area-1 .ani-square-block:nth-of-type(1){ transform:rotate(270deg); right:-20px; top:20px; }
.training .area-1 .ani-square-block:nth-of-type(2){ transform:scale(.7); right:0; top:0; }
.training .area-1 .ani-square-block:nth-of-type(2) .ani-square{ animation-delay:-2s; }
.training .area-2{ background:url('../about/images/training-bg-area-2.jpg'); background-size:cover; padding:80px 0 60px;}
.training .area-2 ul.box{ display:flex; flex-wrap:wrap; width:100%; /*border:solid 1px;*/ }
.training .area-2 ul.box li{ border:solid 1px #ff6600; background:rgba(254,243,232,.4); padding:30px 20px; margin-bottom:25px;}
.training .area-2 ul.box li h3{ color:#ff6600; font-size:2.2rem; display:inline-block; margin-bottom:.8em; }
.training .area-2 ul.box li p{ line-height:1.5; text-align:left; }
.training .area-3{ padding:80px 0;}
.training .area-3 p{ line-height:1.5; }
.training .area-3 ul.box{ display:flex; width:100%; padding-top:40px;}
.training .area-3 ul.box li{ background:#feb986; padding:45px 20px; margin-bottom:25px; border-radius:5px; position:relative;}
.training .area-3 ul.box li:nth-of-type(2){ background:#fe9f5c; }
.training .area-3 ul.box li:nth-of-type(3){ background:#fe8637; }
.training .area-3 ul.box li + li:before{ position:absolute; display:block; color:#fe8637;}
.training .area-3 ul.box li h3{ color:#fff; font-size:2.2rem; display:inline-block;  }
.training .area ul.box li{ transform:translateY(20%); transition:all 1.4s cubic-bezier(.5,.51,.32,.97); }
.training .area ul.box li.act{ transform:translateY(0); }


/*薪資福利*/
.benefit .kv-container{ background-image:url(../about/images/kv-benefit.jpg); background-position:50% 50%;}
.benefit article .area{ padding:60px 0; }
.benefit article .area h2{ font-size:2.6rem; font-weight:600; border-bottom:solid 3px #f58a00; padding:.3em 0; display:inline-block; margin-bottom:20px; }
.benefit article .area p{ line-height:1.5; }
.benefit .area-1 h2{ margin-bottom:1.3em; }
.benefit .area-1 p{ text-align:left; }
.benefit .area-2{ background:#fdecdb; }
.benefit .area-2 ul.box{ display:flex; flex-wrap:wrap; /* justify-content:space-around; */justify-content:center;}
.benefit .area-2 ul.box > li{ background:#fff; border-radius:5px; margin-bottom:20px; padding:20px; display:flex; /*align-items:center;*/ }
.benefit .area-2 ul.box > li .icon{ width:calc(35% - 16px); min-width:calc(30% - 16px); padding-right:16px; display:flex; align-items:center; }
.benefit .area-2 ul.box > li .icon img{ width:100%; height:auto; }
.benefit .area-2 ul.box > li .text-block{ text-align:left; flex:1 1 auto; }
.benefit .area-2 ul.box > li .info{ color:#010000; }
.benefit .area-2 ul.box > li .info ul{ display:flex; flex-direction:column; }
.benefit .area-2 ul.box > li .info ul li{ padding-right:1em; }
.benefit .area-2 ul.box > li h3{ font-size:2.2rem; color:#2ba0cd; margin-bottom:.6em;}
.benefit .area-2 ul.box > li:nth-of-type(3) .info ul ,
.benefit .area-2 ul.box > li:nth-of-type(6) .info ul{ flex-wrap:wrap; align-content:space-between;  }
.benefit .area-2 ul.box > li:nth-of-type(3) .info ul{ height:12.5em; height:140px; }
.benefit .area-2 ul.box > li:nth-of-type(6) .info ul{ height:14.5em; height:150px;}
.benefit .area-3 .box{ display:flex; align-items:center; justify-content:center; margin-top:-40px;}
.benefit .area-3 .box .text-block{ padding:40px; }
.benefit .area-2 ul.box li, .benefit .area-2 .note{ transform:translateY(20%); transition:all 1.4s cubic-bezier(.5,.51,.32,.97); }
.benefit .area-2 ul.box li.act, .benefit .area-2 .note.act{ transform:translateY(0); }
.benefit .area-2 .note{ padding:20px; }


/*員工關懷*/
.care .kv-container{ background-image:url(../about/images/kv-care.jpg); background-position:50% 0;}
.care article .area{ padding:60px 0; position:relative; }
.care article .area h3{ font-size:2rem; color:#5fbce7; font-weight:600; text-align:center; margin-bottom:.8em; }
.care article .area p{ line-height:1.5; }
.care article .area .box{ display:flex; align-items:center; z-index:2;}
.care article .area .box .image-block img{ width:100%; height:auto; }
.care article .area .box .text-block{ background:#fff; box-shadow:2px 3px 4px 3px rgba(0,0,0,.12), 0 0 1px 0 rgba(0,0,0,.03); text-align:left; }
.care article .area:nth-of-type(2){ background:url('../about/images/care-area-2_bg.jpg'); background-size:cover; }
.care article .area:nth-of-type(4){ background:url('../about/images/care-area-4_bg.jpg'); background-size:cover; }
.care article .area-1 .box .image-block:before{ content:''; position:absolute;left: 0; top:0; width:70px; height:79px; border-left:solid; border-top:solid; border-width:2px; border-color:#f58a00; }
.care article .area-1 .ani-square-block{ position:absolute; }
.care article .area-1 .ani-square-block:nth-of-type(1){ transform:rotate(270deg); right:-20px; top:20px; opacity:.6;}
.care article .area-1 .ani-square-block:nth-of-type(2){ transform:scale(.7); right:0; top:0; }
.care article .area-1 .ani-square-block:nth-of-type(2) .ani-square{ animation-delay:-2s; }
.care article .area-3 .ani-square{ fill:#d7e0e6; }
.care article .area-3 .ani-square-block{ position:absolute; }
.care article .area-3 .ani-square-block:nth-of-type(1){ transform:rotate(45deg) scale(1.5); left:-60px; top:-200px; opacity:.8; }
.care article .area-3 .ani-square-block:nth-of-type(2){ transform:rotate(135deg); left:40px; top:-40px; }
.care article .area-3 .ani-square-block:nth-of-type(2) .ani-square{ animation-delay:-2s; }
.care article .area-3 .ani-line{ position:absolute; left:50%; top:30%; width:100vw; transform:translateX(-50%); stroke:#f58a00; stroke-width:8px; opacity:.5; }
.care article .area-4 .ani-line{position:absolute; left:50%; top:0; width:100vw; transform:translate(-50%,-50%); stroke:#f58a00; stroke-width:8px; opacity:.5; z-index:1; }


/*職涯發展*/
.future .kv-container{ background-image:url(../about/images/kv-future.jpg); background-position:50% 0;}
.future .area{ padding:60px 0;  }
.future .area p{ text-align:left; line-height:1.5; }
.future .area-1 .image-block{ display:flex; justify-content:center; align-items:center; padding:60px 0; background:url('../about/images/future-area-1_bg.png') center bottom no-repeat; background-size:100% auto; }
.future .area-1 .image-block img:nth-of-type(1){ transform:translateX(50%); transition:all 1.2s cubic-bezier(.5,.51,.32,.97);}
.future .area-1 .image-block img:nth-of-type(3){ transform:translateX(-50%); transition:all 1.2s cubic-bezier(.5,.51,.32,.97);}
.future .area-1 .image-block img:nth-of-type(2){ transform:scale(.75); opacity:0; transition:all 1s .4s cubic-bezier(.04,1.44,.39,1.07);}
.future .area-1.act .image-block img{ transform:translateX(0);}
.future .area-1.act .image-block img:nth-of-type(2){ transform:scale(1);  opacity:1; }


/* 關係企業HR專區 */
.logistic .kv-container{ background-image:url(../logistic/images/kv.jpg); background-position:50% 37%;}
.fc.logistic .form-container .check-style li  {margin-right: 2em; margin-left: 0em; color: #545454;}
/*.fc.logistic .form-container .check-style li:first-child { margin-right: 2em;}*/
.logistic .btn-box li.newdata { background:#f68a01; color: #fff; }
.logistic .btn-box li.newdata input { border: none; }
.logistic th.region { display: flex; }
.logistic th.region div { width: 50%;}

/* Atomoic */
.C\(\#8d8d8d\) { color: #8d8d8d;}
.D\(ib\){ display: inline-block; }

/*履歷刪除*/
.resume .kv-container{ background-image:url(../resume/images/kv.jpg); background-position:50% 37%;}


/*
PCSC人才招募申請專區
*/
.pcsc .kv-container{ background-image:url(../pcsc/images/kv.jpg); background-position:50% 37%;}
.pcsc ul.tab-menu{ margin-bottom:30px; }
.pcsc ul.tab-menu li, 
.pcsc ul.tab-menu:hover span{ width:calc(100% / 5); }
.pcsc .form-container .check-style li{ display:inline-block; margin-right:1.5em; }

.pcsc.login .form-container th{ width:calc(5em + 100px);}
.pcsc.login .note{ color:#555454; text-align:left; }
.pcsc.login .note h3{ font-size:1.7rem; font-weight:500; margin-bottom:.4em; }
.pcsc.login .note h4{ font-weight:500; margin:.4em 0 .2em; }
.pcsc.login .note h4 ,
.pcsc.login .note li{ font-size:1.4rem; }
.pcsc.login p a{ color:#f6730a; }
.pcsc.login .note strong{ color:#ff0000;  }
.pcsc.login .note ol{ list-style:decimal; margin-left:1.7em;}
.pcsc.login .note li{ line-height:1.3; margin-bottom:.6em; }
.pcsc.login .note li li{ margin-bottom:.4em; }
.pcsc.login .note ul > li{ padding-left:1em; }
.pcsc.login .note ul > li:before{ content:'*'; margin-left:-1em; width:1em; display:inline-block; }
.pcsc.login.forget .form-container th{ width:calc(8em + 80px);}

.pcsc form .check-style input { margin: 2px; }
.pcsc form li { margin-bottom: 0; }
.pcsc.list form{ padding:20px 0; display:block; }
.pcsc.list form .check-style li{ display:flex; margin-right:1.5em; }
.pcsc.list form .check-style li + li{ margin-right:1.5em; }
.pcsc.list form table input{ border:solid 1px #d5d3d3; outline:0; padding:3px .4em; box-sizing:content-box; width:auto; transition:all .6s;}
.pcsc.list form table .btn-style input ,.pcsc.list form table .btn-box input{ border:none; }
.pcsc.list form table .btn-box { margin: 10px 0;}
.pcsc.list form table .btn-box li:after{ display:none; }
.pcsc.list form table .btn-box li.btn-del { background: #8d8d8d; }
.pcsc.list form table .table-th{white-space:nowrap;}
.pcsc.list .result td.note{ text-align:right; }
.pcsc.list form .check-style.during li{ display:block;}
.pcsc.list form .check-style.during li + li{ margin-left:0; } 

.pcsc.jobData form h5{ font-size:.9em; display:flex; align-items:center;}
.pcsc.jobData form select{ position:relative; border:solid 1px #d5d3d3; background:transparent; pointer-events:auto; box-sizing:border-box; padding:.4em 1.5em .4em .6em; -moz-padding:0; width:auto; outline:none; color:#545454; letter-spacing:.1rem; cursor:pointer; }
.pcsc.jobData form select{-webkit-appearance:menulist; -moz-appearance:menulist;}
.pcsc.jobData form .check-style { display: flex; flex-wrap: wrap; }
.pcsc.jobData form .check-style li{ width:auto;}
.pcsc.jobData form .check-style li.W\(100\%\) { width: 100%; }
.pcsc.jobData form .check-style.Fld\(r\) { flex-direction: row }
.pcsc.jobData form .mix { display: flex;flex-wrap: wrap; }
.pcsc.jobData form input, .pcsc.jobData form textarea{ border:solid 1px #d5d3d3; outline:0; padding:.2em .4em; box-sizing:border-box; width:100%; transition:all .6s; width:auto; }
.pcsc.jobData form input:focus, .pcsc.jobData form textarea:focus{ border-color:#f58a00; }
.pcsc.jobData form textarea { width: 100%; min-height: 6em; }
.pcsc.jobData form .deadline li{ width:auto; display:inline-block; }
.pcsc.jobData form td { color: #545454; }
.pcsc.jobData .btn-box li{   }
.pcsc.jobData .btn-box li:after{ display:none; }
.pcsc.jobData .btn-box li input{ border:0; border:solid 1px #7fc9ec; padding:10px 2.5em;}
.pcsc.jobData .form-container center{ font-size:1.6rem; }
.pcsc.jobData .form-container center a{ border:0; border:solid 1px #7fc9ec; padding:10px 2.5em; border-radius:3px; color:#7fc9ec; }
.pcsc form input.Mr\(1em\), .pcsc form label.Mr\(1em\) { margin-right: 1em; }
.pcsc form input.Mt\(02em\) { margin-top: 0.2em; }
.pcsc form input.Mb\(02em\) { margin-bottom: 0.2em; }
.Mb\(5px\) { margin-bottom: 5px; }
.BgC\(\#8d8d8d\) { background: #8d8d8d; }
.pcsc h4.C\(\#ff0000\), .pcsc .C\(\#ff0000\) { color: #ff0000; }
.pcsc h4.Ta\(start\) { text-align: left; }
.pcsc h4 { font-size: 1.6rem; }
.pcsc h4 span { color: #ff0000; }



/*人才招募recruit*/
.recruit .kv-container { background:url(../join/images/recruit/kv-recruit-m.png); background-size: cover;}
.recruit .container_partner { padding: 60px 0; }
.recruit .container_vedio { max-width: 100%; padding: 60px 0; background: #FFF8EB; display: flex; flex-direction: column; align-items: center; }
.recruit .container_info { padding: 0 0 60px 0; }
.recruit .innerpage { padding:0 0 30px 0; background: #fff;}
.recruit img { width: 100%; height: auto; }
.recruit h2 { width: fit-content; font-size: 2.4rem; border-bottom: 2px solid #FF9122; margin: 0 auto 30px auto; }
.recruit h3 { width: fit-content; font-size: 2.4rem; margin: 0 auto 20px auto; }
.recruit ul.list { width: 94%; max-width: 1170px; display: flex; flex-wrap: wrap; margin: 0 auto; justify-content: flex-start; }
.recruit .container_vedio ul.list { width: 88%; }
.recruit ul.list li { width: calc(100% / 2 - 30px); margin:0 15px 30px 15px; cursor: pointer; transition:.5s; }
.recruit ul.list li:hover img { transform: scale(1.05); transition: .5s; }
.recruit ul.list li:hover p { color:#FF9122 ; transition: .5s; }
.recruit ul.list li img { border-radius: 10px; margin-bottom: 10px; transition:.5s; }
.recruit ul.list li p { font-size: 1.6rem; text-align:left; line-height:1.5; transition:.5s;}
.recruit ul.list.vedio li { width: 100%; margin:0 0 30px 0; }
.recruit ul.list.vedio li img { border: 5px solid #ffffff; }
.recruit .btn { width: fit-content; margin: 0 auto 30px auto; position: relative;}
.recruit .btn input { background: transparent; border: solid 1px #43A071; color: #000402; margin: 0; padding: .4em 2em .4em 1.4em; cursor: pointer; border-radius: 50px; transition:.5s;}
.recruit .btn input:hover { background: #e6fff2; transition:.5s;}
.recruit .btn:after  { position: absolute; top: 50%; right: .8em; transform: translate(-.8em, -50%); content: '\f054'; color:#43A071 ; font-size: .75em; }
.recruit .btn.btn-back input { background: transparent; border: solid 1px #43A071; color: #000402; margin: 0; padding: .4em 1.4em .4em 2em; cursor: pointer; border-radius: 50px; transition:.5s;}
.recruit .btn.btn-back:after  { width: .75em; position: absolute; top: 50%; left: .8em; transform: translate(.8em, -50%) rotate(180deg); content: '\f054'; color:#43A071 ; font-size: .75em; }
.recruit .page-container { padding: 0; margin: 0 0 40px; }
.recruit .page-block {display: flex; justify-content: center; align-items: center;}
.recruit .page-block span { color:#FF9122 ; }
.recruit .page-block .page-number { width: 40px; height: 40px; color: #43A071; cursor: pointer; display: flex; justify-content: center; align-items: center; }
.recruit .page-block .page-number.current { background: #67DEA2; color: #000402; }

.recruit .container_content { width: 92%; max-width: 800px; margin: 0 auto; padding:0 0 60px 0; }
.recruit .container_content p { text-align: left; color: #000402; }
.recruit .container_content p,
.recruit .container_content img { margin-bottom: 20px; }
.recruit .container_content img { border-radius: 15px; }


/* --------------------------------------------------------------------------------------------   Large devices (tablets)    -------------------------------------------------------------------------------------------- */
@media ( max-width:1199.98px ){ 
.container{ max-width:1140px; padding:0 20px;}
section.page-container .page-block ul li a{ min-width:auto; padding:.5em .6em;} 
section.page-container .page-block ul li.active a{ min-width:2.5em;}

/*header*/
header{ position:fixed; top:0; left:0; }
header .header-container{ justify-content:space-between; padding:10px 15px; background:#fff;}
header .header-container .logo{ position:relative; top:auto; left:auto; height:34px; transform:translateY(0);}
header nav{ position:fixed; top:55px; bottom:0; left:0; height:0; overflow:hidden; transition:height 1s; transform:translateY(0); background:rgba(0,0,0,.9); }
header nav ul.mainMenu{ display:flex; flex-direction:column; justify-content:flex-start; padding:0 48px;}
header nav ul.mainMenu > li{ margin-bottom:1em; border:solid 1px rgba(255,255,255,.5)}
header nav ul.mainMenu > li > a{ width:100%;  color:#fff; font-size:1.8rem;}
header nav ul.mainMenu > li.otherMenu{ position:relative; top:auto; right:auto; }
header nav ul.mainMenu > li .subMenu{ position:relative; transform:translate(-50%,0); height:auto; background:transparent; }
header nav ul.mainMenu > li .subMenu ul{ flex-direction:column; margin:0px auto 20px;}
header nav ul.mainMenu > li .subMenu ul > li a{ color:rgba(255,255,255,.7); font-size:1.6rem; }
header nav ul.mainMenu > li .subMenu ul > li a:before{ width:24px; padding-top:24px; margin-bottom:0; margin-right:12px; }
header nav ul.socialMedia{ display:block; display:flex; color:#fff; padding:15px 20px;  margin-bottom:60px;}
header nav ul.socialMedia li{ margin-right:1em; font-size:2rem; }
header nav ul.socialMedia li.fb:before{ content:'\f082'; }
header nav ul.socialMedia li.ig:before{ content:'\f16d'; }
header nav ul.socialMedia li.youtube:before{ content:'\f167'; }
header nav ul.socialMedia li.mail:before{ content:'\f0e0'; }
.navToggle{ width:35px; height:35px; box-sizing:border-box; padding:4px; }
.navToggle span ,
.navToggle span:before ,
.navToggle span:after{ display:block; width:100%; background:#008836; height:2px; border-radius:2px; }
.navToggle span{ position:relative; top:50%; transform:translateY(-50%);}
.navToggle span:before ,
.navToggle span:after{ content:''; position:absolute; }
.navToggle span:before{ top:-8px; }
.navToggle span:after{ bottom:-8px; }
.navToggle.navToggle01 span{ transition:background .3s .6s;}
.navToggle.navToggle01 span:before{ transition:transform .1s .3s ,top .3s .7s;}
.navToggle.navToggle01 span:after{ transition:transform .1s .3s ,bottom .3s .7s;}
.navCheck:checked ~ .navToggle.navToggle01 span{ background:none; transition:background .3s .6s;}
.navCheck:checked ~ .navToggle.navToggle01 span:before{ top:0; transform:rotate(135deg); transition:top .2s .1s,transform .2s .6s;}
.navCheck:checked ~ .navToggle.navToggle01 span:after{ bottom:0; transform:rotate(225deg); transition:bottom .2s .1s,transform .2s .6s;}
.navCheck:checked ~ nav{ height:100vh; overflow:auto; top:0; z-index:-1; padding:75px 0;}
footer p{ line-height:1.5; }



/* 200605選單新增 */
header nav ul.mainMenu > li.u-itemicon {  position: relative;    margin: 0 0 15px 0; }
header nav ul.mainMenu > li.u-itemicon a{ width: 32px;  height: 32px; margin: 10px 0;} 
header nav ul.mainMenu > li.Fb a{  background-image:url("../images/fb-1.svg");  }
header nav ul.mainMenu > li.IG a{  background-image:url("../images/ig-1.svg"); }
header nav ul.mainMenu > li.line a{  background-image:url("../images/line-1.svg"); }
header nav ul.mainMenu > li:nth-last-of-type(3){ margin-left:0em;}


/*共用*/
.text-system{ min-height:20vh; }
ul.tab-menu span{ display:none; }
form .form-validcode li img{ width:100%; height:auto; }
form .form-validcode li input{ width:7em; }
/* 表格-下拉選單 */
form .overSize{ width:100%; }
.tabel-green tr{ display:flex; flex-direction:column;}
/*按鈕*/
.btn-box li{ margin:10px; font-size:1.6rem;}
.btn-box li button, .btn-box li input{ padding:10px 1.5em; }

/*頁碼*/
section.page-container{ padding:20px 0; }

/* index */
.index .kv-container{ width:100%; height:auto; }
.index .kv-container .kv-box{ width:100%; height:auto; }
.index .kv-container .slick-dotted.slick-slider{ margin-bottom:60px; }
.index .kv-container .kv-box a{ width:100%; }
.index .kv-container .kv-box img{ width:100%; height:auto;}
.index .joinUs-container ul li{ width:100%; margin-bottom:15px; }
.index .joinUs-container h2{ font-size:2.8rem; }
.index .joinUs-container ul{ width:calc(100% - 30px); margin:0 auto; }
.index .joinUs-container ul li .text-block{ font-size:1.8rem; }
.index .video-container{ width:calc(100% - 30px); margin:0 auto; }
.index .video-container .video-box{ padding-top:56.25%; margin:0 auto; position:relative; }
.index .video-container .video-box iframe{ position:absolute; top:0; left:0; }
.index .video-container h2{ font-size:1.6rem; }
.index .joinUs-container .ani-line{ bottom:50%; stroke-width:16px;}
.index .joinUs-container .ani-square-block:nth-of-type(1){ transform:scale(.7); }
.index .joinUs-container .ani-square-block:nth-of-type(2){ transform:scale(.5); }


/* 我要應徵 */
.kv-container{ height:20vh; min-height:160px; }
.top-container h2{ margin:15px 0;}
.top-container h4{ text-align:left; }
.search .form-container tr{ padding:20px; }
.search .form-container th{ padding:0 0 10px; display:block; width:100%;}
.search .form-container td{ padding:0; display:block; width:100%;}
.form-container th span{ display:inline-block; margin-left:.5em; } 
.search.search_1 .form-container .check-style li ,
.search.search_3 .form-container .check-style li{ width:calc(100% / 2 - 6px); }
.search.search_2 .form-container .check-style li{ width:calc(100% / 2 - 6px); }
.search.search_2 .form-container .check-style label:after{ content:'星期'; float:left;}
.search .career-container .result .mCustomScrollBox{ height:auto; }
.search .career-container .result table { width: 100%; min-width:700px; margin: 0 auto;}
.search.search_job .career-container .result table{ width:100%; }
.search.search_2_job .career-container .result table{ width:600px; }
.search.search_2_job tr{ margin-bottom:10px; display:block; }
.search.search_2_job td{ display:block; padding:2px 0;}
.search.search_2_job td:nth-of-type(1){ text-align:left; }
.search.search_2_job .career-container .result table.week-days{ width:auto; }
.search.search_2_job .career-container .result table.week-days td{ display:inline-block; }
.search.search_1 ul.joblist li {width: calc(100% / 3 - 19px); margin:0 25px 30px 0; text-align: right;}
.search.search_1 ul.joblist li:nth-child(3n) { margin:0 0 30px 0;}

.resume .top-container h2{ font-size:2.4rem;}


.join.process .chart-container{ flex-direction:column; }
.join.process .chart-container h3{ margin-bottom:1em; }
.join.process .chart-container .image-box{ width:100%; padding:40px 0 60px; margin-bottom:20px; border-bottom:dashed 1px #b7b7b7; }
.join.process .chart-container .image-box img{ max-width:100%; }
.join.alert .alert-container{ flex-direction:column; }
.join.alert .alert-container .alert-box + .alert-box{ margin-top:60px; }
.join.alert .alert-container h3{ font-size:3rem; margin:1em auto; }
.join.goto .headquarters-box{ flex-direction:column; }
.join.goto .headquarters-box .text-block .information-group{ margin-bottom:1.5em; }
.join.goto .headquarters-box .text-block .information-group li{ margin-bottom:.4em; }
.join.goto .headquarters-box .text-block .note-group{ opacity:.8; margin-bottom:1em;}
.join.goto .headquarters-box .text-block .note-group p{ font-size:1.6rem; }
.join.goto .headquarters-box .text-block .note-group li{ font-size:1.4rem; }
.join.goto .unit-container + .unit-container{ margin-top:50px; }
.join.goto .unit-container table{ border:none; }
.join.goto .unit-container table .title{ display:none; }
.join.goto .unit-container table tr{ /*border-top:solid 4px #67ab7b; padding:15px 0 30px;*/ margin-bottom:10px; display:flex; flex-direction:column; border:solid 1px #67ab7b;}
.join.goto .unit-container table tr + tr{/* border-top:none;*/ }
.join.goto .unit-container table td{ display:block; padding:0; }
.join.goto .unit-container table td:before{ content:attr(data-title); font-weight:400;/* flex:0 0 4em;*/float:left; width:70px; min-width:70px; background:#67ab7b; color:#fff; padding:15px 16px; text-align:center; margin-right:10px;}
.join.goto .unit-container table td + td{ border-top:solid 1px #e6e6e6; }
.join.hot .btn.apply{ width:80px;}
.join.hot .top-container h2{ font-size:2.4rem; }
.join.hot.hot4-2 .area-1 .box{ flex-direction:column; z-index:2; }
.join.hot.hot4-2 .area-1 .box .image-block{ width:100%; margin-right:0; padding:16px 15px 0 16px; }
.join.hot.hot4-2 .area-1 .box .text-block { width:100%; margin-top:-30px; padding:80px 35px 60px; z-index:-1; }
.join.hot.hot4-2 .area-2 .box{ flex-direction:column; padding:20px; }
.join.hot.hot4-2 .area-3 .box{ flex-direction:column; }
.join.hot.hot4-2 .area-3 .box .text-block{ width:100%; margin-bottom:20px; }
.join.hot.hot4-2 .area-4 .box{ flex-direction:column; }
.join.hot.hot4-2 .area-4 .box .text-block{ width:100%; margin-bottom:20px; }
.join.hot.hot4-2 .area-4 .box .text-block:nth-of-type(1){ margin-right:0; }
.join.hot.hot4-2 .area-4 .box .text-block:nth-of-type(2){ margin-left:0; margin-bottom:0; }
.join.hot.hot4-2 .area-5 .box{ flex-direction:column; }
.join.hot.hot4-2 .area-5 .box .text-block{ width:100%; text-align:center; }
.join.hot.hot4-2 .area-5 .box .map-block{ width:100%; }
.join.hot.hot4-2 .area-5 .box .map-block .taiwan{ width:75%; max-width:261px; }
.join.hot.hot4-2 .area-5 .box .map-block .taiwan{ margin-left:-40px;}
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li .info{ padding:1.5em .8em; width:40vw; left:100px;}
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li:nth-of-type(1) .info{ left:90px; width:38vw;}
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li:nth-of-type(2) .info{ left:100px; width:40vw;}
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li:nth-of-type(5) .info{ width:56vw;}
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li:nth-of-type(6) .info{ width:52vw;}
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li:nth-of-type(7) .info{ width:60vw;}
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul .info:after{ display:none; }
.join.hot.hot4-2 .area-5.act  .box .map-block .taiwan ul li .info{ width:45vw; position:fixed; top:50%; left:auto; right:10px; }
.join.hot.hot4-2 .area-6 .box .level-block{ display:flex; margin-top:40px;}
.join.hot.hot4-2 .area-6 .box .during-group{ width:10%; width:1.5em; border:solid 1.3px #0f8740; border-right:none; vertical-align:top; text-align:start; padding-top:20px; margin-bottom:83%;} 
.join.hot.hot4-2 .area-6 .box .during-group h3{ -webkit-writing-mode:vertical-rl; writing-mode:vertical-rl; margin-top:0; transform:translateX(-.6em); padding:.5em 0; height:11em; }
.join.hot.hot4-2 .area-6 .box .position-group{ flex-direction:column; width:74%; margin-top:0;}
.join.hot.hot4-2 .area-6 .box .position-group > li{ width:100%; display:flex; flex-direction:column; padding:20px; box-shadow:0 0 3px 1px #dedede; margin-bottom:30px;}
.join.hot.hot4-2 .area-6 .box .position-group .icon{ width:45%; height:auto; margin:0 auto 20px; }
.join.hot.hot4-2 .area-6 .box .position-group .info ul{ width:14.5em; }
.join.hot.hot4-2 .area-6 .box .position-group > li + li:before{ top:0; left:50%; transform:translate(-50%,-90%) rotate(90deg); }
.join.hot.hot4-2 .area-6 .box .train-group{ flex-direction:column; width:10%; margin-bottom:77%;}
.join.hot.hot4-2 .area-6 .box .train-group li{ width:1em; -webkit-writing-mode:vertical-rl; writing-mode:vertical-rl; box-sizing:content-box; padding:2em .2em 2em .5em; text-align:left;} 
.join.hot.hot4-2 .area-6 .box .train-group li:after{ top:auto; left:50%; bottom:0; transform:translate(-50%,90%) rotate(90deg); }
.join.hot.hot4-2 .area-6 .box .train-group li:nth-of-type(1){ flex:6 6 auto; margin-bottom:60px; }
.join.hot.hot4-2 .area-6 .box .train-group li:nth-of-type(2){ flex:1 1 auto;  }
.join.hot.hot4-2 .area-1 .ani-line{ top:30%; }
.join.hot.hot4-2 .area-3 .ani-square-block:nth-of-type(2){ top:-10%; }
.join.hot.hot4-2 .area-3 .ani-square-block:nth-of-type(3){ top:0; left:5%; }
.join.hot.hot4-2 .area-4:before{ left:22%; }

.join.hot.hot4-4 .business-layout .box ,.join.hot.hot4-4 .business-layout:nth-of-type(even) .box{ flex-direction:column; }
.join.hot.hot4-4 .business-layout .box figure{ width:85%; margin:0 auto 70px; }
.join.hot.hot4-4 .business-layout .box figure .image-block{ padding:0 20px; }
.join.hot.hot4-4 .business-layout .box figure .text-block{ margin:-10px auto 40px; }
.join.hot.hot4-4 .area-2:before{ border-right:dashed 2px rgba(245,138,0,.8); bottom:0; left:50%; width:1px; height:75%; }
.join.hot.hot4-4 .area-3:before{ border-right:dashed 2px rgba(245,138,0,.8); bottom:0; left:50%; width:1px; height:100%; }
.join.hot.hot4-4 .area-4:before{ border-right:dashed 2px rgba(245,138,0,.8); top:0; left:50%; width:1px; height:75%; }
.join.hot.hot4-4 .area-5 .image-block{ flex-wrap:wrap; padding:60px 0 15px;}
.join.hot.hot4-4 .area-5 .image-block img{ width:45%; order:2;}
.join.hot.hot4-4 .area-5 .image-block img:nth-of-type(2){ width:90%; order:1; }

.join.hot.hot5-1 .area-1{  background-size:100% auto; }
.join.hot.hot5-1 .area-1 .box{ flex-direction:column;}
.join.hot.hot5-1 .area-2 ul li{ width:calc(100%); max-width:340px; }
.join.hot.hot5-1 .area-3{ background-position-x:40%; }
.join.hot.hot5-1 .area-3 ul{ flex-direction:column; max-width:230px; }
.join.hot.hot5-1 .area-3 ul li{ width:100%; margin:0;}
.join.hot.hot5-1 .area-3 ul li + li{ margin-top:40px; }
.join.hot.hot5-1 .area-3 ul li + li:before{ top:0; left:50%; transform:translate(-50%,-110%) rotate(90deg); }

.join.hot.hot5-1 .area-4 h4{ font-size:2rem; }
.join.hot.hot5-1 .area-4 ul{ flex-direction:column; }
.join.hot.hot5-1 .area-4 ul li{ width:100%; margin:0 auto;}
.join.hot.hot5-1 .area-4 ul li + li{ margin-top:30px; }
.join.hot.hot5-1 .area-4 ul li .text-box p{ margin-bottom:20px; }

.join.hot.hot5-1 .area-3 li{ transform:translateY(-30px); }
.join.hot.hot5-1 .area-3 li.act{ transform:translateY(0); }


/* 200421 */
.join.hot.hot4-2 .area-5 .zone table{width:100%; }
.join.hot.hot4-2 .area-5 .zone table td:nth-child(1){ width: 20%;  }
.join.hot.hot4-2 .area-5 .zone table td {padding: 8px 5px 8px 10px;}
.join.hot.hot4-2 .area-5 .zone table th{ padding: 8px 5px 8px 10px;}

/*.login .form-container table{ width:100%; padding:20px;}*/
.login .form-container tr{ width:100%; padding:20px; display:flex; flex-direction:column;}
.login .form-container th{ text-align:left; padding:0 0 10px; display:block; width:100%;}
.login .form-container td{ padding:0; display:block; width:100%;}

/*填寫履歷*/
.resume .form-container form td.photo-td{ border-left:none; }
.resume .form-container form span.table-th{ display:block; }
.resume .form-container form input + span{ margin-left:0; margin-top:.8em;}
.resume .form-container form ul li ,
.resume .form-container form .check-style li{ display:block; }
.resume .form-container form .check-style li + li{ margin-left:0; }
/*.resume .form-container .tabel-green .select-block{ display:block; }*/
.resume .form-container form input ,
.resume .form-container form select{ margin-bottom:4px;} 
.resume .form-container form .mobile-hide{ display:none; }
.resume .form-container form .pc-center td{ padding:6px 16px; }
.resume .form-container form .table-th2{ display:block; }
.resume .form-container form .table-th2:before{ content:attr(data-title); font-weight:normal; }
.resume .form-container form .table-th2:after{ content:'：'; }
.resume .form-container .tabel-green td{ display:block; width:100%; }
.resume .form-container .tabel-green .title td{ text-align:left; }
.resume .form-container .tabel-green input, .resume .form-container .tabel-green textarea{ max-width:200px; }

/*內招公告*/
.in.search_1 .top-container p ,
.in.search_1 .top-container h4{ text-align:left; }




/* 實習計畫 */
.coedu ul.tab-menu{ flex-wrap:wrap; }
.coedu ul.tab-menu li{ width:calc(100% / 4); }
.coedu ul.tab-menu li:nth-of-type(-n + 4){ border-bottom:none; }
.coedu ul.tab-menu li:nth-of-type(4n + 1){ border-left:solid 1px; }
.coedu article .area-1 .box{ flex-direction:column; align-items:flex-star; } 
.coedu article .area-1 .box .image-block{ width:100%; margin-right:0; padding:16px 15px 0 16px;} 
.coedu article .area-1 .box .text-block{ width:100%; margin-top:-30px; padding:80px 35px 60px; z-index:-1;}
.coedu article .area-2 .box{ flex-direction:column; }
.coedu article .area-2 .box .text-block{ width:100%; margin:20px auto;}
.coedu article .area-2 .box .text-block dl dt{ flex-direction:column; }
.coedu article .area-4 ul li{ width:calc(50% - 10px); max-width:170px; margin-bottom:15px;}
.coedu article .area-4 ul li h3{ font-size:2rem; font-weight:500;}
.coedu article .area-5 dl{ flex-direction:column; }
.coedu article .area-5 .text-block{ width:90%; margin:0 auto 80px; }
.coedu article .area-5 .text-block + .text-block .title:before{ top:-40px; left:50%; transform:translate(-50%,-50%) rotate(90deg); }
.coedu article .area-6 .box{ flex-direction:column; }
.coedu article .area-6 .fTree h4{ font-size:1.8rem; padding:1.3em 3.5em; }
.coedu article .area-6 .fTree ul ul{ padding-left:60px; }
.coedu article .area-6 .fTree ul ul:before{ width:25px; }
.coedu article .area-6 .fTree ul ul li:before, .coedu article .area-6 .fTree ul ul li:after{ width:34px; }
.coedu article .area-6 .fTree > ul{ padding-left:0; }
.coedu article .area-6 .fTree > ul > li > h4{ padding:3.4em 1.5em; }
.coedu article .area-6 .image-block{ padding:0; max-width:65%; margin:30px auto 0; }
.coedu article .area-7 .box{ flex-direction:column; }
.coedu article .area-7 .box .text-block table th, 
.coedu article .area-7 .box .text-block table td{ font-size:1.6rem; min-width:4.5em; }
.coedu article .area-8 .box{ flex-direction:column; padding-left:40px; }
.coedu article .area-8 .box .text-block{ margin:20px auto; }


/* 聯絡我們 */
.contact .top-container h2{ display:none; }
.contact .info-container .text-box{ flex-direction:column; }
.contact .info-container .text-box .text-block{ padding:30px 25px; margin-bottom:20px; }



/*加盟主專區*/
.fc ul.tab-menu{ /*flex-direction:column;*/ flex-wrap:wrap; }
.fc ul.tab-menu li{ font-size:1.4rem; width:calc(100% / 2);}
.fc ul.tab-menu li:nth-of-type(n+3){ border:solid 1px; border-top:0;}
.fc ul.tab-menu li:nth-of-type(even){ border-left:0;}
.fc ul.tab-menu li.active{ background:#f58a00; color:#fff; border:0; }

.fc.basic .tabel-orange{ width:100%; }
.fc.basic h3{ font-size:1.9rem; margin-bottom:1em; color:#0c0c10; text-align:center; margin-bottom:0;}
.fc.basic .information-box{ flex-direction:column; }
.fc.basic .information-box tr{ margin-bottom:16px; display:block; }
.fc.basic .information-box tr.pw{ margin-bottom:6px; }
.fc.basic .information-box th ,
.fc.basic .information-box td{ display:block; padding:2px 0;}
.fc.basic .information-box th:after{ content:'：'; }
.fc.basic .tabel-orange tr{ border-top:solid 4px #f58a00; padding:15px 0 30px; display:flex; flex-direction:column; }
.fc.basic .tabel-orange tr:nth-of-type(1){ display:none; }
.fc.basic .tabel-orange td{ display:block; text-align:left;}
.fc.basic .tabel-orange td:before{ content:attr(data-title); text-align:left; display:block; color:#7b7b7b; }

.fc.jobOpen .result{ overflow:auto; }
.fc.jobOpen form table{ width:700px; }
.fc.jobOpen form .check-style.during li{ display:flex; flex-wrap:wrap; }
.fc.jobOpen form .check-style.during li label,
.fc.jobOpen form .check-style.during li h5{ width:100%; }
.fc.jobOpen form .check-style.during li label{ display:block;}
.fc.jobOpen form .during input{ max-width:100px; }
.fc.jobOpen form select{ max-width:280px; }
.fc.jobOpen form td:nth-of-type(1){ padding-bottom:0; }
.fc.jobOpen form td.note{ padding:10px;text-align:left; }
.fc.jobOpen form .check-style li + li{ margin-left:0; }
.fc.jobOpen .result .btn-box{ margin:20px;}

.fc.jobData form ul{ display:flex; flex-direction:column; align-items:flex-start;}
.fc.jobData form ul.btn-box{ flex-direction:row; align-items: center;}
.fc.jobData form h5{ padding:.4em 0; display:block;}
.fc.jobData form th{ display:block; text-align:left; padding:15px 16px 0;}
.fc.jobData form td{ display:block; }
.fc.jobData .form-container .check-style li + li{ margin-left:0; }
.fc.jobData .tabel-green td + td{ border-left:0; }
.fc.jobData form .pay > li + li{ margin-top:10px; }
.fc.jobData form input ,
.fc.jobData form select{ max-width:280px;  }
.fc.jobData form .pay .during input{ width:40%; }
/*.fc.jobData form ul{ flex-direction:row; }*/
.fc.jobData .btn-box li input{ padding:10px 1.5em; }
.fc.applys .career-container .text-box{ flex-direction:column; align-items:flex-start; }
.fc.applys .career-container .text-box .num{ margin-top:20px; }
.fc.applys .result .tabel-orange{ width:700px; }
.fc.resume .result td{ display:block; }
.fc.resume .result table table td{ display:table-cell; }
.fc.query .resume{ overflow-x:auto; }
.fc.query .resume table{ width:700px; }
.fc.query .career-container .text-box{ flex-direction:column; }



/*常見問題*/
.qa .question-container ul li{ padding:35px 0 0 42px; }


/*教育訓練*/
.training .area-1 .box{ flex-direction:column; align-items:flex-star; padding:30px 0 60px;} 
.training .area-1 .box .image-block{ width:100%; margin-right:0; padding:16px 15px 0 16px;} 
.training .area-1 .box .text-block{ width:100%; margin-top:-30px; padding:80px 35px 60px; z-index:-1;}
.training .area-2 ul.box li{ width:75%; padding:30px 20px; margin:0 auto 25px;}
.training .area-3 ul.box{ flex-direction:column; width:80%; margin:0 auto; }
.training .area-3 ul.box li{ padding:25px 20px; margin-bottom:35px; }
.training .area-3 ul.box li + li:before{ content:'\f078'; top:0; left:50%; transform:translate(-50%,-1.4em); font-size:2rem;}
.training .area-1 .image-block{ transform:translateY(10%); transition:all 2.4s cubic-bezier(.5,.51,.32,.97); }
.training .area-1 .text-block{ transform:translateY(10%); transition:all 1.6s cubic-bezier(.5,.51,.32,.97); }
.training .area-1.act .image-block{ transform:translateY(0); }
.training .area-1.act .text-block{ transform:translateY(0); }

/*薪資福利*/
.benefit .area-2 ul.box > li{ width:100%; max-width:350px; padding-left:10px;margin-left: 10px;}
.benefit .area-2 ul.box > li .icon{  }
.benefit .area-2 ul.box > li:nth-of-type(3) .info ul{ height:14em; height:150px;}
.benefit .area-2 ul.box > li:nth-of-type(6) .info ul{ height:16em; }
.benefit .area-3 .box{ flex-direction:column; }
.benefit .area-3 .image-block img{ width:75%; margin:0 auto; }
.benefit .area-3 .image-block{ transform:translateY(20%); transition:all 2.4s cubic-bezier(.5,.51,.32,.97); }
.benefit .area-3 .text-block{ transform:translateY(20%); transition:all 1.6s cubic-bezier(.5,.51,.32,.97); }
.benefit .area-3.act .image-block{ transform:translateY(0); }
.benefit .area-3.act .text-block{ transform:translateY(0); }

/*員工關懷*/
.care article .area .box{ flex-direction:column; }
.care article .area .box .image-block{ padding:16px 15px 0 16px; }
.care article .area .box .text-block{ margin-top:-30px; padding:80px 45px 60px; z-index:-1; }
.care article .area h3{ letter-spacing:.05em; line-height:1.2; }

.care article .area .image-block{ transform:translateY(20%); transition:all 1.4s cubic-bezier(.5,.51,.32,.97); }
.care article .area .text-block{ transform:translateY(20%); transition:all 2s cubic-bezier(.5,.51,.32,.97); }
.care article .area.act .image-block{ transform:translateY(0); }
.care article .area.act .text-block{ transform:translateY(0); }


/*職涯發展*/
.future .area-1 .image-block{ flex-wrap:wrap; padding:60px 0 15px;}
.future .area-1 .image-block img{ width:45%; order:2;}
.future .area-1 .image-block img:nth-of-type(2){ width:90%; order:1; }



/*
PCSC人才招募申請專區
*/
.pcsc ul.tab-menu{ /*flex-direction:column;*/ flex-wrap:wrap; }
.pcsc ul.tab-menu li{ font-size:1.4rem; width:calc(100% / 2);}
.pcsc ul.tab-menu li:nth-of-type(n+3){ border:solid 1px; border-top:0;}
.pcsc ul.tab-menu li:nth-of-type(even){ border-left:0;}
.pcsc ul.tab-menu li.active{ background:#f58a00; color:#fff; border:0; }

.pcsc.list .result{ overflow:auto; }
.pcsc.list form table{ width:700px; }
.pcsc.list form .check-style.during li{ display:flex; flex-wrap:wrap; }
.pcsc.list form .check-style.during li label,
.pcsc.list form .check-style.during li h5{ width:100%; }
.pcsc.list form .check-style.during li label{ display:block;}
.pcsc.list form .during input{ max-width:100px; }
.pcsc.list form select{ max-width:280px; }
.pcsc.list form td:nth-of-type(1){ padding-bottom:0; }
.pcsc.list form td.note{ padding:10px;text-align:left; }
.pcsc.list form .check-style li + li{ margin-left:0; }

.pcsc.jobData form ul{ display:flex; flex-direction:column; align-items:flex-start;}
.pcsc.jobData form ul.btn-box{ flex-direction:row; align-items: center;}
.pcsc.jobData form h5{ padding:.4em 0; display:block;}
.pcsc.jobData form th{ display:block; text-align:left; padding:15px 16px 0;}
.pcsc.jobData form td{ display:block; }
.pcsc.jobData .form-container .check-style li + li{ margin-left:0; }
.pcsc.jobData .tabel-green td + td{ border-left:0; }
.pcsc.jobData form .pay > li + li{ margin-top:10px; }
.pcsc.jobData form input ,
.pcsc.jobData form select{ max-width:280px;  }
.pcsc.jobData form .pay .during input{ width:40%; }
/*.pcsc.jobData form ul{ flex-direction:row; }*/
.pcsc.jobData .btn-box li input{ padding:10px 1.5em; }




}

/* --------------------------------------------------------------------------------------------   Extra large devices (desktops)    -------------------------------------------------------------------------------------------- */
@media(min-width:1200px){ 
.container{ max-width:1200px; } 
/*header*/
header .header-container .logo{ width:220px; z-index:2; }
header nav{ z-index:0; }
header.fixed ,header.fixed .subMenu{ background:#fff; box-shadow:0 2px 2px 0px rgba(0,0,0,.2);}
header.fixed ul.mainMenu li{ color:#555; }
header.fixed ul.mainMenu > li > a:after{ background:#555; }
header.fixed .subMenu ul > li a:before{ border-color:#ccc; }
header nav ul.mainMenu > li:hover > a ,header .subMenu ul > li a:hover{ color:#f97341; }
header nav ul.mainMenu > li > a:after{ content:''; width:0; height:4px; background:#f97341; display:block; transform:translateY(1.5em); transition:all .6s;}
header nav ul.mainMenu > li:hover .subMenu{ height:80px; }
header .subMenu ul > li{ position:relative; }
header .subMenu ul > li + li:before{ content:''; width:1px; height:1em; background:#fff; display:inline-block; position:absolute; left:-20px; top:50%; transform:rotate(25deg) translateY(-50%); opacity:.5; }

/*共用*/



header nav ul.mainMenu > li.u-itemicon > a:after { content: ''; width: 0; height: 0; background: #fff;}



/* index */
.index .kv-container .kv-box img{ width:auto; height:580px;}
.index .joinUs-container ul li{ width:calc(100% / 2); }
.index .joinUs-container ul{ transform:scale(.8); transition:transform .6s cubic-bezier(.18,.86,.34,.99); }
.index .joinUs-container ul.act{ transform:scale(1); }
.index .video-container .video-box{ height:312px; transform:scale(.8); transition:transform .7s cubic-bezier(.18,.86,.34,.99);}
.index .video-container .video-box.act{ transform:scale(1); }

/* 我要應徵 */
.search.search_2 .during > li{ flex-grow:0; }
.search.search_2 .form-container .check-style li + li{ margin-left:1.5em;}

.search.search_1 ul.joblist li:nth-child(4n) { margin:0 0 30px 0;}

.search .check .info p + .btn-box{ margin-left:1em; }
.btn-box li.agree-style label{ width:auto; }

.join.process .chart-container .image-box:nth-of-type(1){ width:54%; }
.join.process .chart-container .image-box:nth-of-type(2){ width:46%; }
.join.process .chart-container .image-box + .image-box{ border-left:dashed 1px #b7b7b7; }
.join.alert .alert-container .alert-box{ width:calc(100% / 3 - 50px); }
.join.goto .headquarters-box{ max-width:1000px; margin:0 auto 60px; }
.join.goto .headquarters-box .block{ width:calc(100% / 2); }
.join.goto .headquarters-box .text-block{ position:relative;}
.join.goto .headquarters-box .text-block .information-group{ padding-top:1em; }
.join.goto .headquarters-box .text-block .note-group{ position:absolute; bottom:0; padding-right:40px; }
.join.goto .unit-container{  max-width:1000px; margin:0 auto 60px; }
.join.goto .unit-container table td{ /*padding:;*/ }
.join.goto .unit-container table td:nth-of-type(1){ text-align:center; width:18%;}
.join.goto .unit-container table td:nth-of-type(2){ padding:15px 120px; }
.join.goto .unit-container table td:nth-of-type(3){ width:24%; padding:15px 50px;}
.join.goto .unit-container table td + td{ border-left:none; }
.join.goto .unit-container .tabel-green td + td{ border-left:solid 1px #b7b7b7; }

.join.hot .area .box{ margin:0 30px 50px; }
.join.hot.hot4-2 .area-1 .box{ margin-top:50px; margin-bottom:0;}
.join.hot.hot4-2 .area-5 .box .map-block .taiwan ul li:nth-of-type(1) .info{ width:200px;}
.join.hot.hot4-2 .area-6 .box .train-group li:nth-of-type(1){ width:calc(50% - 4rem); margin-right:58px; }
.join.hot.hot4-2 .area-6 .box .train-group li:nth-of-type(2){ width:calc(25% - 4rem); }
.join.hot.hot4-2 .area-6 .box .during-group h3{ padding:0 .5em; transform:translateY(-50%); }

.join.hot.hot4-4 .business-layout .box figure{ width:calc(100% / 2 - 40px); max-width:500px; }
.join.hot.hot4-4 .business-layout .box figure:nth-of-type(2){ margin-top:45px; }
.join.hot.hot4-4 .area-2 .box figure p{ text-align:left; }

.join.hot.hot4-4 .area-2:before{ border-bottom:dashed 2px rgba(245,138,0,.8); top:50%; left:46%; width:20%; height:1px; } 
.join.hot.hot4-4 .area-2:after{ border-right:dashed 2px rgba(245,138,0,.8); bottom:0; right:33.5%; width:1px; height:50%; }
.join.hot.hot4-4 .area-3:before{ border:dashed 2px rgba(245,138,0,.8); border-top:none; border-left:none; top:0; right:33.5%; width:33%; height:40%; }
.join.hot.hot4-4 .area-3:after{ border-right:dashed 2px rgba(245,138,0,.8); bottom:0; left:33%; width:1px; height:60%; } 
.join.hot.hot4-4 .area-4:before{ border:dashed 2px rgba(245,138,0,.8); border-top:none; border-right:none; top:0; left:33%; width:33%; height:40%; }

.join.hot.hot5-1 ul.tab-menu li:hover{ background-color:transparent; }

.join.hot.hot5-1 .area li.act:nth-of-type(2){ transition-delay:.1s; }
.join.hot.hot5-1 .area li.act:nth-of-type(3){ transition-delay:.2s; }
.join.hot.hot5-1 .area li.act:nth-of-type(4){ transition-delay:.3s; }
.join.hot.hot5-1 .area li.act:nth-of-type(5){ transition-delay:.5s; }
.join.hot.hot5-1 .area li.act:nth-of-type(6){ transition-delay:.8s; }

.join.hot.hot5-1 .area-3 li{ transform:translateX(-30px); }
.join.hot.hot5-1 .area-3 li.act{ transform:translateX(0); }


/* 側邊選單 */
.join .fixed-btn { width: 80px; height: 80px; border-radius: 50px; font-size: 1.8rem;}


/*填寫履歷*/
.resume .form-container form td.border-left{ border-left:solid 1px #b7b7b7; }
.resume .form-container form .pc-center td{ text-align:center; }
.resume .form-container form ul li{ display:inline-block; }
.resume .form-container form ul.db-box li{ display:block; }
.resume .form-container form ul.db-box .table-th{ min-width:5em; }
.resume .form-container .tabel-green input ,
.resume .form-container .tabel-green textarea{ max-width:calc(100% - 1em);}


/*內招公告*/
.in.search_job .text-box{ justify-content:center; }
.in.search_job .result{ max-width:800px; margin:0 auto; }




/* 實習計畫 */
.coedu article .area-7 .box .text-block:nth-of-type(1){ width:calc(100% / 3); margin-bottom:25px;}
.coedu article .area-7 .box .text-block:nth-of-type(1) h3{ margin-bottom:.4em;}
.coedu article .area-7 .box .text-block:nth-of-type(2){ width:calc(100% / 3 * 2 - 40px); }
.coedu article .area-7 .box .text-block:nth-of-type(2) h3{ margin-bottom:2.4em;}
.coedu article .area-8 .box{ position:relative; padding:40px 170px 40px 40px; justify-content:space-between;}
.coedu article .area-8 .box:after{ content:''; display:inline-block; width:150px; height:150px; background:url('../Coedu/images/area-8_qrcode.gif'); background-size:cover; position:absolute; right:0; top:0; }
.coedu article .area-8 .text-block{ width:calc(50% - 40px); }
.coedu article .area-8 .text-block:nth-of-type(2){ width:calc(50% - 80px); }
.coedu article .area-8 .text-block:nth-of-type(2) .pc-hide{ display:none; }
.coedu article .area-8 .text-block:nth-of-type(2) .mobile-hide{ display:block; }
/* .coedu article .area-8 .text-block:nth-of-type(2) h3:after{ content:' Qrcode 連結'; font-weight:500;} */




/* 聯絡我們 */
.contact .info-container .text-box .text-block{ width:calc(100% / 2 - 15px); }
.contact .info-container .text-box .text-block p{ font-size:1.3rem; }


/*加盟主專區*/
.fc.applys form .select-style li{ width:auto; }
.fc.jobData .form-container th{ width:9em; }
.fc.basic .information-box{ justify-content:space-between; }
.fc.basic .information-box .information-block{ width:calc(100% / 2 - 15px);  }
.fc.basic .information-box .information-block:nth-of-type(1) th{ width:7em; flex:0 0 7em;}
.fc.basic .information-box .information-block:nth-of-type(2) th{ width:9em; flex:0 0 9em;}
/*.fc.basic .information-box tr.pw-revise th{ padding:15px 15px 71px; }
.fc.basic .information-box tr.pw-revise td{ padding-bottom:71px; }*/
.fc.basic .information-box tr.pw-revise th{ padding:15px ; }
.fc.basic .information-box tr.pw td{ padding-bottom:0; }
.fc.basic .information-box tr.pw-confirm th{ padding-top:6px; vertical-align:top; }
.fc.basic .information-box tr.pw-confirm td{ padding-top:6px; padding-bottom:22px;}

/*常見問題*/
.qa .question-container h3 a{ transition:all .4s; }
.qa .question-container h3 a:hover{ color:#4db560;  }


/*教育訓練*/
.training .area-2 ul.box li{ width:calc(99% / 3 - 20px); margin-right:30px; }
.training .area-2 ul.box li:nth-of-type(3n){ margin-right:0; }
.training .area-3 ul.box{ justify-content:space-between; }
.training .area-3 ul.box li{ width:calc(99% / 3 - 25px); }
.training .area-3 ul.box li + li:before{ content:'\f054'; font-size:2.4rem; top:50%; left:0; transform:translate(-1.2em,-50%);  }
.training .area-1 .image-block{ transform:translateX(5%); transition:all 2.4s cubic-bezier(.5,.51,.32,.97); }
.training .area-1 .text-block{ transform:translateX(-5%); transition:all 1.6s cubic-bezier(.5,.51,.32,.97); }
.training .area-1.act .image-block{ transform:translateX(0); }
.training .area-1.act .text-block{ transform:translateX(0); }
.training .area ul.box li.act:nth-of-type(3n + 2){ transition-delay:.4s; }
.training .area ul.box li.act:nth-of-type(3n){ transition-delay:.6s; }



/*薪資福利*/
.benefit .area-2 ul.box > li{ width:calc(99% / 3 - 20px); margin-right:30px; }
.benefit .area-2 ul.box > li:nth-of-type(3n){ margin-right:0; }
.benefit .area-2 ul.box li.act:nth-of-type(3n + 2){ transition-delay:.4s; }
.benefit .area-2 ul.box li.act:nth-of-type(3n){ transition-delay:.6s; }
.benefit .area-3 .image-block{ transform:translateX(15%); transition:all 2.4s cubic-bezier(.5,.51,.32,.97); }
.benefit .area-3 .text-block{ transform:translateX(-15%); transition:all 3s cubic-bezier(.5,.51,.32,.97); }
.benefit .area-3.act .image-block{ transform:translateX(0); }
.benefit .area-3.act .text-block{ transform:translateX(0); }

/*員工關懷*/
.care article .area .box{ justify-content:space-between; padding:0 30px;}
.care article .area .box .image-block{ width:55%;  }
.care article .area .box .text-block{ width:47%; padding:40px 30px;  }
.care article .area:nth-of-type(even){ background-attachment:fixed; }
.care article .area:nth-of-type(even) .box{ flex-direction:row-reverse; }
.care article .area:nth-of-type(odd) .box .image-block{ margin-right:-20px; }
.care article .area:nth-of-type(even) .box .image-block{ margin-left:-20px; }

.care article .area-1 .box .image-block:before{ transform:translate(-26px,-26px); }


.care article .area .image-block{ transform:translateX(-5%); transition:all 2.4s cubic-bezier(.5,.51,.32,.97); }
.care article .area .text-block{ transform:translateX(5%); transition:all 1.6s cubic-bezier(.5,.51,.32,.97); }
.care article .area:nth-of-type(even) .image-block{ transform:translateX(5%); transition:all 2.4s cubic-bezier(.5,.51,.32,.97); }
.care article .area:nth-of-type(even) .text-block{ transform:translateX(-5%); transition:all 1.6s cubic-bezier(.5,.51,.32,.97); }
.care article .area.act .image-block{ transform:translateX(0); }
.care article .area.act .text-block{ transform:translateX(0); }


/*
PCSC人才招募申請專區
*/
.pcsc.applys form .select-style li{ width:auto; }
.pcsc.jobData .form-container th{ width:9em; }



/*人才招募recruit*/
.recruit .kv-container { background:url(../join/images/recruit/kv-recruit.png); background-size: cover;}
.recruit .container_partner { padding:60px 0; }
.recruit .container_vedio { max-width: 100%; padding: 60px 0; background: #FFF8EB; display: flex; flex-direction: column; align-items: center; }
.recruit .container_info { padding: 0 0 60px 0; }
.recruit img { width: 100%; }
.recruit h2 { width: fit-content; font-size: 2.4rem; border-bottom: 2px solid #FF9122; margin: 0 auto 30px auto; }
.recruit ul.list { width: 100%; max-width: 1170px; display: flex; justify-content: flex-start; }
.recruit ul.list li { width: calc(100% / 4 - 30px); margin:0 40px 30px 0; cursor: pointer; transition:.5s; }
.recruit ul.list li:hover img { transform: scale(1.05); transition: .5s; }
.recruit ul.list li:hover p { color:#FF9122 ; transition: .5s; }
.recruit ul.list li img { border-radius: 10px; margin-bottom: 10px; transition:.5s; }
.recruit ul.list li p { font-size: 1.6rem; text-align:left;transition:.5s;}
.recruit ul.list li:nth-child(4n),
.recruit ul.list.vedio li:nth-child(3n)  { margin:0 0 30px 0;  }
.recruit ul.list.vedio li { width: calc(100% / 3 - 40px); margin:0 60px 30px 0; }
.recruit ul.list.vedio li img { border: 5px solid #ffffff; }
.recruit .btn { width: fit-content; margin: 0 auto; }
.recruit .btn input { background: transparent; border: solid 1px #43A071; color: #000402; margin: 0; padding: .4em 2em .4em 1.4em; cursor: pointer; border-radius: 50px; transition:.5s;}
.recruit .btn input:hover { background: #e6fff2; transition:.5s;}
.recruit .btn:after  { position: absolute; top: 50%; right: .8em; transform: translate(-.8em, -50%); content: '\f054'; color:#43A071 ; font-size: .75em; }

}

/* --------------------------------------------------------------------------------------------   small devices (phone)    -------------------------------------------------------------------------------------------- */
@media   (max-width:767.98px){
.fc.list .tabel-orange tr { display: flex; flex-direction: column;}
.fc.jobData form ul{ flex-direction:column; }    
.fc.jobOpen form table{ width:100%; }

.pcsc.list .tabel-orange tr { display: flex; flex-direction: column;}
.pcsc.jobData form ul{ flex-direction:column; }    
.pcsc.list form table{ width:100%; }

.search.search_1 ul.joblist {justify-content: space-between;}
.search.search_1 ul.joblist li {width:100%; margin:0 0 30px 0;}

}


/* --------------------------------------------------------------------------------------------   IE  only    -------------------------------------------------------------------------------------------- */
/*填寫履歷*/
.resume .form-container form select::-ms-expand, 
.fc select::-ms-expand{ display:inline-block; height:100%; }
.fc form .select-style select::-ms-expand{ display:none; }

.pcsc select::-ms-expand{ display:inline-block; height:100%; }
.pcsc form .select-style select::-ms-expand{ display:none; }


@media screen and (-ms-high-contrast:active),(-ms-high-contrast:none){
.loading{ display:none; }
.search_list .tabel-orange input{ position:absolute; opacity:0; }

/*加盟主專區*/
.fc.basic .information-box ul{ max-width:400px; }
.resume .form-container form select ,
.fc select{ padding:0 0 0 .4em; }
.fc font{ font-size:inherit; }


.pcsc.basic .information-box ul{ max-width:400px; }
.resume .form-container form select ,
.pcsc select{ padding:0 0 0 .4em; }
.pcsc font{ font-size:inherit; }

}