@charset "utf-8";
/* CSS Document */

html, body { margin:0px; }

body { width:100%; font-size-adjust:100%; -webkit-text-size-adjust:100%; box-sizing:border-box; position:relative; color:#ffffff; font-size:16px; font-family:'Raleway', '微軟正黑體', 'Microsoft JhengHei', sans-serif; }

a { outline:none; text-decoration:none; }

ul, ol { list-style:none; margin:0; padding:0; }
li { vertical-align:top; }

h1, h2, h3, h4, h5, h6, p { padding:0; margin:0; }

img { border:none; }

.object_fit_photo img { width:100%; height:100%; object-fit:cover; }
.object_fit_photo.compat-object-fit { background-repeat:no-repeat; background-position:center center; background-size:cover; }

.object_fit_contain img { width:100%; height:100%; object-fit:contain; }
.object_fit_contain.compat-object-fit { background-repeat:no-repeat; background-position:center center; background-size:contain; }
.object_fit_contain.compat-object-fit img { display:none; }

input, select, textarea { -webkit-appearance:none; appearance:none; font-family:Arial, Helvetica, sans-serif; }

select { display:inline-block; vertical-align:top; width:100%; height:32px; padding:0 10px; border:0; background-color:#ffffff; border-radius:0; box-sizing:border-box; box-shadow:2px 2px 3px rgba(0,0,0,0.17); font-size:18px; color:#666666; }
select::-ms-expand { display:none; }
.select_area { display:inline-block; vertical-align:top; width:100%; background-color:#ffffff; border-radius:0; position:relative; cursor:pointer; }
.select_area:before { position:absolute; right:8px; top:50%; z-index:1; content:""; width:0; height:0; border-style:solid; border-width:6px 5px 0 5px; border-color:#9f75c3 transparent transparent transparent; transform:translateY(-50%); }
.select_area select { background-color:transparent; position:relative; z-index:2; padding:0 26px 0 15px; margin:0; -webkit-appearance:none; -moz-appearance:none; appearance:none; cursor:pointer; }

input:focus, select:focus, textarea:focus { border-color:#66afe9; outline:0; -webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6); box-shadow:inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, 0.6); outline:thin dotted; outline:5px auto -webkit-focus-ring-color; outline-offset:-2px; }

button, input[type=submit], input[type=reset], input[type=button] { -webkit-appearance:none; -moz-appearance:none; appearance:none; }

/* ---------------- clear fix ---------------- */

.clearfix:after { content:"."; display:block; clear:both; visibility:hidden; xline-height:0; height:0; font-size:0; }
.clearfix { display:inline-block; }
html[xmlns] .clearfix { display:block; }
* html .clearfix { height:1%; }

/*-------------------------------------------------------------------------------------*/
/* LAYOUT */

#wrap { width:100%; background-image:url(../img/inner_bg.jpg); background-repeat:no-repeat; background-position:center center; background-size:cover; box-sizing:border-box; position:relative; left:0; z-index:1000; transition:all 0.5s ease; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; }
#wrap .container { width:100%; padding-left:15px; padding-right:15px; margin:0px auto; position:relative; box-sizing:border-box; display:block; transition:all 0.3s ease; }

#top { padding-top:52px; padding-bottom:22px; position:relative; }
#top .logo { width:100%; max-width:124px; }
#top .logo img { width:100%; display:block; }

#top .mobile_btn { position:absolute; right:15px; top:50%; z-index:10; display:none; transform:translateY(-50%); }
#top .mobile_btn a { display:block; width:40px; height:40px; background-color:transparent; border:none; box-sizing:border-box; border-radius:0; text-align:center; text-transform:uppercase; font-weight:700; font-size:0; color:#ffffff; line-height:40px; }
#top .mobile_btn a span { font-size:40px; line-height:inherit; }
#top .mobile_btn a:hover { text-decoration:none; }

#main { width:100%; position:relative; display:block; }
#main .content_area { width:100%; position:relative; }

#footer { padding:26px 0; background-color:rgba(0,0,0,0.37); position:relative; color:#ffffff; font-weight:300; }
#footer .sitemap { width:100%; padding-bottom:30px; }
#footer .sitemap ul { display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; }
#footer .sitemap ul li { -ms-flex:0 0 auto; flex:0 0 auto; width:auto; max-width:100%; font-size:16px; }
#footer .sitemap ul li:after { content:"/"; padding:0 10px; color:#4597d7; }
#footer .sitemap ul li:last-child:after { display:none; }
#footer .sitemap ul li a { color:#ffffff; }

#footer .copyright { display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; -ms-flex-pack:justify; justify-content:space-between; width:100%; }
#footer .copyright p { width:100%; box-sizing:border-box; font-size:10px; }
#footer .copyright a { color:#ffffff; }
#footer .copyright a:hover { text-decoration:underline; }

/*-------------------------------------------------------------------------------------*/
/* INDEX */

.index_bg { background-image:url(../img/index_bg.jpg) !important; }
.index_bg:before { position:absolute; right:0; top:0; content:""; width:100%; height:100%; background-color:rgba(17,32,64,0.79); }
.index_bg .overlay { position:absolute; right:0; top:0; width:100%; height:100%; fill:rgba(17,32,64,0.79); display:none; }

.index_area { display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; -ms-flex-pack:end; justify-content:flex-end; -ms-flex-align:center; align-items:center; width:100%; min-height:100vh; padding:20px; box-sizing:border-box; }
.index_area .index_info { -ms-flex:0 0 100%; flex:0 0 100%; width:100%; max-width:100%; transition:all 0.3s ease; }
.index_area .index_logo { padding-bottom:50px; }
.index_area .index_logo img { display:block; width:100%; max-width:250px; margin:0 auto; }
.index_area .index_btn { text-align:center; }
.index_area .index_btn a { display:inline-block; vertical-align:top; width:83px; height:32px; background-color:transparent; border:1px solid #676d83; box-sizing:border-box; font-size:22px; color:#ffffff; font-weight:100; font-family:'Roboto', '微軟正黑體', 'Microsoft JhengHei', sans-serif; transition:all 0.3s ease; }
.index_area .index_btn a:hover { background-color:#ffffff; border-color:#ffffff; color:#162440; }

/*-------------------------------------------------------------------------------------*/
/* MAP */

.map_content { display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; padding-bottom:42px; }

.information { -ms-flex:0 0 100%; flex:0 0 100%; width:100%; max-width:100%; padding-top:30px; box-sizing:border-box; text-align:center; }
.information p { font-size:13px; color:#ffffff; line-height:2; }

.category_list { -ms-flex:0 0 100%; flex:0 0 100%; width:100%; max-width:100%; padding-top:50px; box-sizing:border-box; text-align:right; }
.category_list .select_area { max-width:260px; }
.category_list ul { display:none; }
.category_list ul li { padding-bottom:8px;}
.category_list ul li a { display:block; font-size:18px; color:#ffffff; font-weight:300; }
.category_list ul li a:hover { color:#5dbef6; }
.category_list ul li a.active { padding-bottom:8px; border-bottom:1px solid #ffffff; margin-bottom:8px; color:#5dbef6; }

.building_area { -ms-flex:0 0 100%; flex:0 0 100%; width:100%; max-width:100%; padding-top:40px; box-sizing:border-box; position:relative; }
.building_area .building { width:100%; max-width:420px; margin:0 auto; }

.building_area .floor { display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; width:100%; position:relative; margin-bottom:8px; }
.building_area .floor_area { display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; -ms-flex:1 0 0%; flex:1 0 0%; width:auto; max-width:100%; background-color:rgba(0,0,0,0.18); position:relative; }
.building_area .floor_area:after { position:absolute; left:0; top:100%; content:""; width:100%; height:8px; background:-moz-linear-gradient(360deg, #5dbef6 0%, #1d54a0 100%); background:-webkit-gradient(linear, left top, right top, color-stop(0%, #5dbef6), color-stop(100%, #1d54a0)); background:-webkit-linear-gradient(360deg, #5dbef6 0%, #1d54a0 100%); background:-o-linear-gradient(360deg, #5dbef6 0%, #1d54a0 100%); background:-ms-linear-gradient(360deg, #5dbef6 0%, #1d54a0 100%); background:linear-gradient(90deg, #5dbef6 0%, #1d54a0 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#5dbef6', endColorstr='#1d54a0',GradientType=1 ); }
.building_area .floor:first-child { margin-top:8px; }
.building_area .floor:first-child .floor_area:before { position:absolute; left:0; top:-8px; content:""; width:100%; height:8px; background:-moz-linear-gradient(360deg, #5dbef6 0%, #1d54a0 100%); background:-webkit-gradient(linear, left top, right top, color-stop(0%, #5dbef6), color-stop(100%, #1d54a0)); background:-webkit-linear-gradient(360deg, #5dbef6 0%, #1d54a0 100%); background:-o-linear-gradient(360deg, #5dbef6 0%, #1d54a0 100%); background:-ms-linear-gradient(360deg, #5dbef6 0%, #1d54a0 100%); background:linear-gradient(90deg, #5dbef6 0%, #1d54a0 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#5dbef6', endColorstr='#1d54a0',GradientType=1 ); }
.building_area .floor_area .area { display:-ms-flexbox; display:flex; -ms-flex:0 0 33.3333334%; flex:0 0 33.3333334%; width:100%; max-width:33.3333334%; border-left:1px solid #3975a2; border-right:1px solid #3975a2; box-sizing:border-box; position:relative; }
.building_area .floor_area .area:first-child { border-left:none; }
.building_area .floor_area .area:nth-child(3) { border-right:none; }
.building_area .floor_area .area a { display:block; width:100%; background-color:#0649a5; transition:all 0.3s ease; }
.building_area .floor_area .area.onHover a { background-color:#6691cb; }

.building_area .floor_number { -ms-flex:0 0 78px; flex:0 0 78px; width:100%; max-width:78px; padding:6px 0; text-align:right; font-size:14px; color:#ffffff; }

.building_area .floor_info { position:absolute; right:100%; top:50%; z-index:100; padding-right:36px; transform:translateY(-50%); transition:all 0.3s ease; display:none; }

.floor_box { width:307px; min-height:262px; padding:18px; background-color:rgba(16,86,168,0.64); box-sizing:border-box; position:relative; }
.floor_box:after { position:absolute; left:100%; top:50%; content:""; width:0; height:0; border-style:solid; border-width:12.5px 0 12.5px 23px; border-color:transparent transparent transparent rgba(16,86,168,0.64); transform:translateY(-50%); }

.floor_box .company_info { display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; -ms-flex-pack:justify; justify-content:space-between; padding-bottom:11px; border-bottom:1px solid #8abad5; font-size:14px; color:#ffffff; }
.floor_box .company_floor { -ms-flex:0 0 auto; flex:0 0 auto; width:auto; max-width:100%; padding-right:12px; box-sizing:border-box; }
.floor_box .company_floor .floor_num { padding-bottom:6px; font-size:64px; color:#5cbef6; line-height:1; font-family:'Oswald', '微軟正黑體', 'Microsoft JhengHei', sans-serif; }
.floor_box .company_floor .unit { font-size:22px; color:#5cbef6; font-weight:600; }
.floor_box .company_photo { -ms-flex:1 0 0%; flex:1 0 0%; width:auto; max-width:157px; }
.floor_box .company_photo img { display:block; width:100%; }
.floor_box .company_data { display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; padding-top:15px; }
.floor_box .company_name { -ms-flex:0 0 100%; flex:0 0 100%; width:100%; max-width:100%; padding-bottom:15px; font-size:21px; font-weight:600; }
.floor_box .company_tel { -ms-flex:0 0 120px; flex:0 0 120px; width:100%; max-width:120px; font-family:'Lato', '微軟正黑體', 'Microsoft JhengHei', sans-serif; }
.floor_box .company_hours { -ms-flex:1 0 0%; flex:1 0 0%; width:auto; max-width:100%; font-family:'Lato', '微軟正黑體', 'Microsoft JhengHei', sans-serif; }

.floor.haveCompany .floor_number { color:#5cbef6; }

.floor.closeFloor .area { background:url(../img/floor_close_img.png) repeat left top; }


.floor_modal { width:100%; min-height:1px; padding:18px; background-color:rgba(16,86,168,0.64); -webkit-border-radius:0; -moz-border-radius:0; -o-border-radius:0; -ms-border-radius:0; border-radius:0; }
.floor_modal:after { display:none; }

/*-------------------------------------------------------------------------------------*/
/* MAP */

.map_modal { padding:0; background-color:rgba(16,86,168,0.64); -webkit-border-radius:0; -moz-border-radius:0; -o-border-radius:0; -ms-border-radius:0; border-radius:0; }

.map { width:100%; height:60vh; }
.map iframe { width:100%; height:100%; border:none; }

/*-------------------------------------------------------------------------------------*/
/* ENQUIRY */

.form_modal { padding:18px; background-color:rgba(16,86,168,0.64); -webkit-border-radius:0; -moz-border-radius:0; -o-border-radius:0; -ms-border-radius:0; border-radius:0; }

.form_area { font-size:16px; color:#ffffff; }
.form_area .form_title { padding-bottom:32px; font-size:21px; font-weight:600; }
.form_area .form_row { display:-ms-flexbox; display:flex; -ms-flex-wrap:wrap; flex-wrap:wrap; padding-bottom:20px; font-family:'Lato', '微軟正黑體', 'Microsoft JhengHei', sans-serif; }
.form_area .form_row .title { -ms-flex:0 0 80px; flex:0 0 80px; width:100%; max-width:80px; padding-right:10px; box-sizing:border-box; text-align:right; line-height:28px; }
.form_area .form_row .field { -ms-flex:1 0 0%; flex:1 0 0%; overflow:hidden; }
.form_area .form_row .field input,
.form_area .form_row .field textarea { display:block; width:100%; background-color:#ffffff; border:none; }
.form_area .form_row .field input { height:28px; padding:0 10px; }
.form_area .form_row .field textarea { height:96px; padding:10px; resize:none; }
.form_area .form_row .btn { -ms-flex:1 0 0%; flex:1 0 0%; overflow:hidden; text-align:right; }
.form_area .form_row .btn input,
.form_area .form_row .btn button { display:inline-block; vertical-align:top; height:28px; padding:0 20px 4px 20px; background-color:#ffffff; border:none; margin-left:10px; font-size:16px; font-family:'Lato', '微軟正黑體', 'Microsoft JhengHei', sans-serif; cursor:pointer; }