﻿@charset "utf-8";
html,body {
	height:100%;
	margin:0;
	padding:0;
}
main {
  display:block;
}
body {
    color:#000;
	font:62.5%/1 "微軟正黑體", Microsoft JhengHei, Arial, Helvetica, sans-serif;
	text-size-adjust:100%;
}
/* 修正粗體 */
@font-face {
    font-family:"微軟正黑體修正";
    unicode-range:U+7db0, U+78A7, U+7B75; /* ASCII (碧筵綰) */
    font-style:normal;
    font-weight:bold;
    src:local(Yu Gothic), local(MS Gothic);
}
/* 一般粗細的時候改回微軟正黑 */
@font-face {
    font-family:"微軟正黑體修正";
    unicode-range:U+7db0, U+78A7, U+7B75; /* ASCII (碧筵綰) */
    font-style:normal;
	font-weight:normal;
    src:local("微軟正黑體");
}
a {
	color:#c55400;
	text-decoration:none;
	-webkit-transition:all 0.3s ease;
	   -moz-transition:all 0.3s ease;
	     -o-transition:all 0.3s ease;
	        transition:all 0.3s ease;
}
a:hover,
a:focus {	
	color:#b62824;
	text-decoration:none;
}
a:focus, button:focus, input:focus, select:focus, textarea:focus {
	outline:1px dashed #e84417;
}
a, button, textarea, select, input {
	-webkit-appearance:none;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	-webkit-border-radius:0;
	   -moz-border-radius:0;
			border-radius:0;
}
img{
	max-width:100%;
	height:auto;
	border:none;
	vertical-align:middle;
}
sub,
sup {
    font-size:75%;
    line-height:0;
    position:relative;
    vertical-align:baseline;
}
sup {
    top:-0.5em;
}
sub {
    bottom:-0.25em;
}
:before,
:after {
	-webkit-transition:all 0.5s ease;
	   -moz-transition:all 0.5s ease;
	     -o-transition:all 0.5s ease;
	        transition:all 0.5s ease;
}
table th,
table td {
	padding:10px;
}
table ul,
table ol {
	margin-left:2em;
}
.noscript {
	display:block;
	width:100%;
	font-size:1.5em;
	line-height:135%;
	padding:20px 0px;
	margin:0 auto;
	box-sizing:border-box;
	background:#ffe5e6;
}
.hide-panel {
	display:none !important;
}
/**/
.sr-only {
	position:absolute;
	width:1px;
	height:1px;
	padding:0;
	margin:-1px;
	overflow:hidden;
	clip:rect(0,0,0,0);
	border:0;
}
.sr-only-focusable {
    position:fixed;
	top:0;
	left:0;
	color:#000;
	opacity:0;
	z-index:9999;
}
.sr-only-focusable:active,
.sr-only-focusable:focus {
	color:#FFF;
	font-size:1.2em;
	padding:5px 10px;	
	opacity:1;
	background:rgba(0,0,0,.7);
}
.acKey,
.acKey a {
    color:transparent;
    font-size:0.8rem;
}
.acKey:hover,
.acKey:focus,
.acKey a:hover,
.acKey a:focus {
    color:#F30;
}
.container {
	width:100%;
	padding:0 15px;	
	margin:0 auto;
	box-sizing:border-box;
	max-width:1440px;
}
.row {
    margin-right:-10px;
    margin-left:-10px;
}
@media screen and (max-width:990px) {
	.pc-mode {
	  display:none !important;
	}	
}
@media screen and (min-width:991px) {
	.sp-mode {
	  display:none !important;
	}
}
@media screen and (min-width:1440px) {
	.container {padding:0;}
}

.noscript {
	display:block;
	width:100%;
	font-size:1rem;
	line-height:120%;
	padding:20px 0px;
	margin:0 auto;
	box-sizing:border-box;
	background:#ffe5e6;
}

/** Layout **/
#wrapper {
	position:relative;
	float:left;
	width:100%;
	margin:0 auto;
	overflow:hidden;
}


/*footer*/
#footer{
	width:100%;
	position:relative;
}
/**/
.copyright{
	padding:25px 0;
	width:100%;
	background-color:#f5f5f5;
}
#content + #footer .copyright{ background-color:#fff;}
.fotMix{
	width:100%;
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
}
.copyright .info{
	width:100%;
	line-height:180%;
	color:#333;
	font-size:1.5em;
}
.copyright .info dl dt{ font-weight:bold;}
.copyright .info dl dd{
	display:flex;
	flex-wrap:wrap;
}
.copyright .info dl dd a{ color:#333;}
.copyright .info dl dd a:hover,
.copyright .info dl dd a:focus{ color:#e84417;}
.copyright .info dl dd span + span{
	margin-left:10px;
	display:flex;
	align-items:center;
}
.copyright .info dl dd span + span::before{
	content:"";
	width:1px;
	height:14px;
	background-color:#666;
	display:inline-block;
	margin-right:10px;
}
.copyright .nameSign{
	width:100%;
	max-width:620px;
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;	
	font-size:1.4em;
	margin-top:10px;
}
.nameSign ul{
	list-style:none;
	display:flex;
	flex-wrap:wrap;
	margin:-5px;
}
.nameSign ul li {
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	padding:5px;
	box-sizing:border-box;
}
.nameSign ul li a{
	width:192px;
	height:45px;
	display:inline-block;
	background-repeat:no-repeat;
	background-size:contain;
	position:relative;
}
.nameSign ul li:nth-of-type(1) a{
	background-image:url(../images/itrilogo.svg);}
.nameSign ul li:nth-of-type(2) a{
	width:171px;
	background-image:url(../images/fot_logo2_20230922.png);}
.nameSign ul li a span{
	width:1px;
    height:1px;
    display:block;
    overflow:hidden;
    position:absolute;
}
.nameSign ul li a + span {
	height:45px;
}
.copyright .mark {
	display:inline-block;
}
.copyright .mark a {
	display:inline-block;
}
@media screen and ( max-width:640px) {
	.copyright .mark { margin-top:10px;}
}
@media screen and ( max-width:504px) {
	.nameSign ul li + li { margin-top:10px;}
}
@media screen and ( min-width:1200px) {
	.copyright .info{ width:calc(100% - 490px);}
	.copyright .nameSign{ max-width:485px;  margin-top:0; justify-content:flex-end; align-content:space-between;}
	.copyright .mark { text-align:right; margin-top:10px;}
}
@media screen and ( min-width:1400px) {
	.copyright .info{ width:calc(100% - 650px); margin-right:20px;}
	.copyright .nameSign{ max-width:620px; justify-content:space-between;}
	.copyright .mark { margin-top:0;}
}
/* ----- #qMenu ----- */
#qMenu {
	position:fixed;
	display:none;
	right:0;
	bottom:20px;
	z-index:30;
	transform:translate3d(0, -50%, 0);
}
@media screen and ( min-width:991px) {
	#qMenu {bottom:40%;}
}
/* ----- shareBtn ----- */
.shareBtn {
	position:relative;
	display:block;
	margin:0 auto;
}
.shareBtn .on {
	width:50px;
	height:50px;
	display:block;
	background-color:#127EA5;
}
.shareBtn:hover .on,
.shareBtn .on:focus {
	background-color:#D5431A;
}
.shareBtn span{
	position:relative;
    display:block;
    color:#FFF;
    font-size:0.75rem !important;
    text-align:center;
    padding-top:28px;
}
.shareBtn span::before {
    position:absolute;
    content:"";
    display:block;
    position:absolute;
    left:0;
    top:10px;
    width:100%;
    height:14px;
	background-image:url(../images/btn-share.svg);
	background-repeat:no-repeat;
	background-position:50% 50%;
}
.shareBtn .shareMenu {
	display:none;
	position:absolute;
	padding:0;
	bottom:50px;
	left:0;
	width:50px !important;
}
/**/
.shareMenu ul{
	display:block;
	width:50px;
}	
.shareMenu ul li,
.shareMenu ul li a{
	list-style:none;	
	margin:0;
	padding:0;
}
.shareMenu ul li a{
	background-position:center;
	background-repeat:no-repeat;
	display:block;
	width:100%;
	height:50px;
	font-size:0;
}
.shareMenu ul li a::before{
	content:"";
	width:50px;
	height:50px;
	display:block;
	margin:0 auto;
	background-image:url(../images/fat-social.svg);
	background-repeat:no-repeat;
    background-size:auto 50px;
}
/**/
.shareMenu ul li a.icon-fb{background-color:#3b5998;}
.shareMenu ul li a.icon-fb::before{
	background-position:0 0;
}
.shareMenu ul li a.icon-tt{background-color:#00aced;}
.shareMenu ul li a.icon-tt::before{
	background-position:-50px 0;
}
.shareMenu ul li a.icon-line{background-color:#00b900;}	
.shareMenu ul li a.icon-line::before{
	background-position:-100px 0;
}
.shareMenu ul li a.icon-mail{background-color:#999;}
.shareMenu ul li a.icon-mail::before{
    background-image:url(../images/icon-mail.svg);  
}
.shareMenu ul li a.icon-fb:hover,
.shareMenu ul li a.icon-fb:focus{
	background-color:#193266;
}
.shareMenu ul li a.icon-tt:hover,
.shareMenu ul li a.icon-tt:focus{
	background-color:#0b95da;
}
.shareMenu ul li a.icon-line:hover,
.shareMenu ul li a.icon-line:focus{
	background-color:#008f00;
}
/** goTop **/
#goTop a {
	display:block;
	width:50px;
	height:50px;
	background-color:rgba(0,0,0,.8);	
}
#goTop a::before{ display:none !important;}
#goTop a:hover,
#goTop a:focus {
	background-color:rgba(0,0,0,1);
}
#goTop span {
	position:relative;
	display:block;
	color:#FFF;
	font-size:0.75rem !important;
	text-align:center;
	padding-top:28px;
	font-family:Arial, Helvetica, sans-serif;
}
#goTop span::before{
	position:absolute;
	content:"";
    display:block;
    position:absolute;
	left:50%;
	top:15px;
    width:7px;
    height:7px;    
    border-left:2px solid #FFF;
	border-top:2px solid #FFF;
	margin:0 0 0 -5px;
    z-index:2;
    -webkit-transform:rotate(45deg);
		-ms-transform:rotate(45deg);
			transform:rotate(45deg);
}