@charset "utf-8";

/* CSS Document */



@import url(font-awesome/css/font-awesome.min.css);

@import url(icomoon/style.css);

@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@500&display=swap");

@import url("https://fonts.googleapis.com/css?family=Roboto&display=swap");

@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100..900&display=swap");

@import url("https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap");





body {

    font-family: 'Roboto', 微軟正黑體, 新細明體, sans-serif;

	font-size: 17px;

	color: #262626;

	background: #fff;

	line-height: 2.0;

}



a {

	cursor: pointer;

	color: #262626;

	text-decoration: none;

	-webkit-transition: all 0.5s ease;

	-moz-transition: all 0.5s ease;

	-o-transition: all 0.5s ease;

	transition: all 0.5s ease;

}



a:hover, a:focus { 

	color: #c06b1b;  

	text-decoration: none; 

}



img { 

	max-width: 100%; 

}



h1, h2, h3, h4, h5, h6 {

	margin: 0;

	font-weight: normal;

	line-height: 1.5;		   

}



p {

	margin: 0;

}



ul, label, figure {

	margin: 0;

	padding: 0;

}



ul, li {

	list-style-type: none;

}



input[type="text"],

input[type="email"] {

	-webkit-appearance: none;

	font-size: 16px;

}



textarea {

	-webkit-appearance: none;

}



.border-box {

  -webkit-box-sizing: border-box;

     -moz-box-sizing: border-box;

          box-sizing: border-box;

}



.wrap {

	width: 1400px;

	margin: 0 auto;

	padding: 0 15px;

	position: relative;

}



.wrap-fluid {

	padding: 0 45px; 

}



/*

::selection {

	color: #fff;

	background-color: #fab000; 

}

*/





/*----- header -----*/

header {

	width: 100%;

	height: 84px; 

	position: fixed;

	top: 0; 

	left: 0;

	z-index: 1000;

	background-color: #fff;

	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);  /* 往右偏移0往下偏移3px ，10px的模糊半徑 */

}



header .logo {

	float: left;

	display: block;

	width: 307px;

	height: 84px;

}



	



/*----- nav -----*/

header nav {

	float: right;

}



header nav > ul.menu {

}



header nav > ul.menu > li {

	float: left;

	font-size: 17px;

	padding: 0 30px;

	position: relative;

	letter-spacing: 1px;

	line-height: 84px;

}



header nav > ul.menu > li:last-child {

	background: none;

}



header nav > ul.menu > li > a {

	color: #222;

	font-weight: 400;

	position: relative;

	display: block;

	font-family: "Noto Sans TC", "微軟正黑體", "Microsoft JhengHei";

}



header nav > ul.menu > li > a:hover,

header nav > ul.menu > li > a:focus,

header nav > ul.menu > li:hover > a {/* 滑鼠移入次選單上層按鈕保持變色*/

	color: #c06b1b;

}



header nav > ul.menu > li.current > a {

	color: #c06b1b;

}



header nav > ul.menu > li > a::after {

	content: '';

	position: absolute;

	display: block;

	width: 0;

	height: 2px;

	left: 0;

	right: 0;

	bottom: 15px;

	background-color: rgba(192, 107, 27, 0.9);

	opacity: 0;

	transition: all .4s ease-out;

}



header nav > ul.menu > li > a:hover::after,

header nav > ul.menu > li:hover > a::after,

header nav > ul.menu > li.current > a::after {

	width: 100%;

	left: 0;

	opacity: 1;

}







/*----- 彈出式第二層 -----*/

nav .dropdown-container {

	position: absolute;

	left: -9999px;

	width: 250px;

	visibility: hidden;

	padding: 31px 30px 17px;

	border-top: 2px solid #c06b1b; 

	box-shadow: 0 10px 23px -3px rgba(0, 0, 0, 0.15);

	background: #fff;

	opacity: 0;

	-webkit-transition: top .45s ease, margin-top .4s ease;

	transition: top .45s ease, margin-top .4s ease;

}

nav > ul.menu > li:hover > .dropdown-container {

	left: 50%;

	top: 109px;

	transform: translateX(-50%);

	margin-top: -25px;

	opacity: 1;

	visibility: visible;

	z-index: 100;

}

nav .dropdown-container li {

	margin-bottom: 13px;

	line-height: 1.7;

}

nav .dropdown-container li a {

	padding: 6px 0;

	font-size: 16px;

	font-weight: normal;

	color: #222;

	position: relative;

	letter-spacing: 0;

}

nav .dropdown-container li a:hover,

nav .dropdown-container li.active > a {

	color: #c06b1b;

}

nav .dropdown-container li a:before {

	content: '';

	display: block;

	position: absolute;

	width: 0;

	height: 1px;

	background-color: #c06b1b;

	bottom: 0;

	-webkit-transition: width .2s cubic-bezier(0.25, 0.1, 0.25, 1);

	transition: width .2s cubic-bezier(0.25, 0.1, 0.25, 1);

}

nav .dropdown-container li a:hover:before, 

nav .dropdown-container li.active > a:before {

	width: 100%;

}

nav .dropdown-container li h3 {

	font-size: 16px;

	font-weight: bold;

	color: #000;

	margin: 6px 0 11px;

}





.mobile-menu {

	display: none;

}







/* language */

.language {

	float: right;

	position: relative;

	display: block;

	margin-left: 35px;

    cursor: pointer;

    transition: all .5s;

	line-height: 84px;

}



.language span {

	position: relative;

    display: inline-block;

	font-size: 14px;

	color: #555;

    z-index: 10;

    cursor: pointer;

}



.language span::before {

	content: "\e903";

    font-family: 'icomoon';

    font-size: 18px;

	color: #555;

    display: inline-block;

    margin-right: 12px;

	padding-bottom: 1px;

	vertical-align: bottom;

}



.language span::after {

	content: '\f107';

    font-family: FontAwesome;

    font-size: 12px;

	color: #555;

	font-weight: 600;

    display: inline-block;

    margin-left: 10px;

    transition: all .5s;

}



.language:hover span::after {

    -webkit-transform: rotateX(-180deg);

    transform: rotateX(-180deg);

}



.language ul {

    position: absolute;

    left: 0;

    top: 56px;

    width: 100%;

    opacity: 0;

    visibility: hidden;

    transition: all .5s;

    border: 1px solid #eee;

    box-shadow: 0 5px 10px rgba(60, 60, 60, 0.1);

}



.language:hover ul {

    opacity: 1;

    visibility: visible;

    top: 84px;

}



.language ul li + li a,

.m_lang ul li + li a {

    border-top: 1px solid #d7d7d7;

}



.language ul li a,

.m_lang ul li a {

    display: block;

	font-size: 14px;

	color: #444;

	text-align: center;

    padding: 7px 0;

    background-color: rgba(255, 255, 255, 0.93);

	line-height: 22px;

}



.language ul li:hover a,

.m_lang ul li:hover a {

	color: #000;

    background-color: rgba(210, 210, 210, 1);

}







/*----- banner -----*/

.bannerArea {

	clear: both;

	position: relative;

	height: 310px;

	margin-top: 84px;

	overflow: hidden;

}



.bannerArea .container {

	position: absolute;

	top: 50%;

	left: 50%;

	transform: translate(-50%, -40%);

}



.bannerTitle {

	font-size: 52px;

	color: #e1e1e1;

	position: relative;

	line-height: 1.1;

	letter-spacing: 2px;

	font-family: 'Oswald', 微軟正黑體, 新細明體, sans-serif;

}



.orangeTxt {

	color: #c06b1b;

}



/*

.bannerTitle:after{

	content: " ";

	display: block;

	width: 54px;

	height: 1px;

	background: rgba(255, 255, 255, 0.8);

	position: absolute;

	bottom: -15px;

	left: 50%;

	margin-left: -27px;

}

*/



.bannerTxt {

	font-size: 30px;

	color: #fff;

	font-weight: bold;

	margin-top: 2px;

	letter-spacing: 1px;

}



.bannerImg-01 {

	background: url(../images/tw/banner-01.jpg) no-repeat center;

}



.bannerImg-02 {

	background: url(../images/tw/banner-02.jpg) no-repeat center;

}



.bannerImg-03 {

	background: url(../images/tw/banner-03.jpg) no-repeat center;

}



.bannerImg-04 {

	background: url(../images/tw/banner-04.jpg) no-repeat center;

}



.bannerImg-01,

.bannerImg-02,

.bannerImg-03,

.bannerImg-04 {

	-webkit-background-size: cover;

	-moz-background-size: cover;

	-o-background-size: cover;

	background-size: cover;

}







/*----- 內容框架 -----*/

.mainArea {

	padding: 45px 0 100px;

	position: relative;

	background-color: #f9f9f9;

}



.leftArea {

	width: 22.5%;

	float: left;

}



.rightArea {

	width: 71%;

	float: right;

	min-height: 500px;

}



h3.leftTitle {

	color: #09396b;

	font-size: 48px;

	margin-top: -5px;

	padding-bottom: 8px;

	border-bottom: 2px solid #09396b;

	line-height: 1.4;

	font-family: 'Oswald', 微軟正黑體, 新細明體, sans-serif;

}



.title {

	font-size: 30px;

	color: #09396b;

	font-weight: bold;

	margin: 9px 0 60px;

	padding-bottom: 15px;

	border-bottom: 1px solid #c6c6c6;

	font-family: 'Oswald', 微軟正黑體, 新細明體, sans-serif;

}



.mb-70 {

	margin-bottom: 70px;

}







.m_submenuList {

	display: none;

}







/*----- 子選單區 -----*/

ul.subMenu {

	

}



ul.subMenu li a {

	font-size: 17px;

	color: #262626;

	font-weight: bold;

	padding: 15px 30px 15px 18px;

	display: block;

	position: relative;

	border-bottom: 1px solid #ccc;

	line-height: 1.7;

}



ul.subMenu li a:hover,

ul.subMenu li.active > a {

	color: #fff;

	background-color: #09396b;

}



ul.subMenu li a:before {

	content: '+';

    /*font-family: FontAwesome;*/

    font-size: 20px;

	color: #333;

	font-weight: normal;

	position: absolute;

	top: 13px;

	right: 15px;

}



ul.subMenu li a:hover:before,

ul.subMenu li.active > a:before {

	color: #fff;

}



ul.subMenu li ul {

}



ul.subMenu li ul li a {

	font-size: 16px;

	font-weight: normal;

	padding-left: 40px;

	padding-right: 15px;

	margin-bottom: 0;

	display: block;

	background-color: #f0f0f0;

}



ul.subMenu li ul li a:hover,

ul.subMenu li ul li.active > a  {

	color: #c06b1b;

	background-color: #f0f0f0;

}



ul.subMenu li ul li a:before {

	content: '–';

	position: absolute;

	left: 21px;

	top: 16px;

    font-size: 15px;

}



ul.subMenu li ul li a:hover:before,

ul.subMenu li ul li.active > a:before {

	color: #c06b1b;

}





.m_classLink {

	display: none;

}



ul.subLink {

	display: none;

}







/*----- 網站導覽bread -----*/

.bread {

	font-size: 15px;

	color: #333;

}



.bread a {

	color: #333;

}



.bread a:hover {

	color: #09396b;

}



.bread span.current,

.bread span.current a {

	color: #09396b;

}



.divider {

	padding: 0 9px;

}







/*----- 頁碼 -----*/

.page {

	padding-top: 65px;

	clear: both;

}



.page ul {

	text-align: center;

	list-style: none;

}



.page li {

	display: inline-block;

	font-size: 13px;

}



.page li > a {

	color: #777;

	display: inline-block;

	padding: 7px 15px;

	background-color: #fff;

	border: 1px solid #a7a7a7;

}



.page li > a:hover,

.page li > a:focus,

.page li > a.current {

	color: #fff;

	background-color: #e50004;

	border: 1px solid #e50004;

}



.page li > a i {

	font-size: 15px;

}







/*----- 頁尾資訊 -----*/

footer {

	color: #fff;

	background-color: #313131;

}



.footerInfo {

	color: #fff;

	padding: 60px 0;

}



.footerInfo > .wrap > .row {

  margin-left: -30px;

  margin-right: -30px;

}



.footerInfo > .wrap > .row > .col-md-3 {

	padding-left: 35px;

	padding-right: 35px;

}



.footerInfo > .wrap > .row > .col-md-3 > figure > img {

	max-width: 100%;

	height: auto;

}



.headline {

	font-size: 18px;

	font-weight: bold;

	margin-bottom: 12px;

}



ul.branchInfo li {

	display: block;

	font-size: 15px;

	color: #fff;

	margin-top: 6px;

}



ul.branchInfo li span {

	color: #c06b1b;

	margin-right: 8px;

}



ul.branchInfo li a {

	color: #fff;

}



ul.branchInfo li a:hover {

	color: #c06b1b;

}



footer .copyright {

	font-size: 14px;

	color: rgba(255, 255, 255, 0.35);

	padding: 20px;

	position: relative;

	border-top: 1px solid rgba(255, 255, 255, 0.2);

	text-align: center;

}



footer .copyright a {

	color: rgba(255, 255, 255, 0.5);

	margin-left: 10px;

}



footer .copyright a:hover {

	color: #fff;

}









/*---------------loading---------------------*/

.loading {

  position: fixed;

  left: 50%;

  top: 50%;

  width: 60px;

  height: 60px;

  margin: -30px 0 0 -30px;

  z-index: 300;

}

.loading .sk-child {

  width: 100%;

  height: 100%;

  position: absolute;

  left: 0;

  top: 0;

}

.loading .sk-child:before {

  content: '';

  display: block;

  margin: 0 auto;

  width: 15%;

  height: 15%;

  background-color: #bbb;

  border-radius: 100%;

  -webkit-animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;

          animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;

}

.loading .sk-circle2 {

  -webkit-transform: rotate(30deg);

      -ms-transform: rotate(30deg);

          transform: rotate(30deg); }

.loading .sk-circle3 {

  -webkit-transform: rotate(60deg);

      -ms-transform: rotate(60deg);

          transform: rotate(60deg); }

.loading .sk-circle4 {

  -webkit-transform: rotate(90deg);

      -ms-transform: rotate(90deg);

          transform: rotate(90deg); }

.loading .sk-circle5 {

  -webkit-transform: rotate(120deg);

      -ms-transform: rotate(120deg);

          transform: rotate(120deg); }

.loading .sk-circle6 {

  -webkit-transform: rotate(150deg);

      -ms-transform: rotate(150deg);

          transform: rotate(150deg); }

.loading .sk-circle7 {

  -webkit-transform: rotate(180deg);

      -ms-transform: rotate(180deg);

          transform: rotate(180deg); }

.loading .sk-circle8 {

  -webkit-transform: rotate(210deg);

      -ms-transform: rotate(210deg);

          transform: rotate(210deg); }

.loading .sk-circle9 {

  -webkit-transform: rotate(240deg);

      -ms-transform: rotate(240deg);

          transform: rotate(240deg); }

.loading .sk-circle10 {

  -webkit-transform: rotate(270deg);

      -ms-transform: rotate(270deg);

          transform: rotate(270deg); }

.loading .sk-circle11 {

  -webkit-transform: rotate(300deg);

      -ms-transform: rotate(300deg);

          transform: rotate(300deg); }

.loading .sk-circle12 {

  -webkit-transform: rotate(330deg);

      -ms-transform: rotate(330deg);

          transform: rotate(330deg); }

.loading .sk-circle2:before {

  -webkit-animation-delay: -1.1s;

          animation-delay: -1.1s; }

.loading .sk-circle3:before {

  -webkit-animation-delay: -1s;

          animation-delay: -1s; }

.loading .sk-circle4:before {

  -webkit-animation-delay: -0.9s;

          animation-delay: -0.9s; }

.loading .sk-circle5:before {

  -webkit-animation-delay: -0.8s;

          animation-delay: -0.8s; }

.loading .sk-circle6:before {

  -webkit-animation-delay: -0.7s;

          animation-delay: -0.7s; }

.loading .sk-circle7:before {

  -webkit-animation-delay: -0.6s;

          animation-delay: -0.6s; }

.loading .sk-circle8:before {

  -webkit-animation-delay: -0.5s;

          animation-delay: -0.5s; }

.loading .sk-circle9:before {

  -webkit-animation-delay: -0.4s;

          animation-delay: -0.4s; }

.loading .sk-circle10:before {

  -webkit-animation-delay: -0.3s;

          animation-delay: -0.3s; }

.loading .sk-circle11:before {

  -webkit-animation-delay: -0.2s;

          animation-delay: -0.2s; }

.loading .sk-circle12:before {

  -webkit-animation-delay: -0.1s;

          animation-delay: -0.1s; }



@-webkit-keyframes sk-circleBounceDelay {

  0%, 80%, 100% {

    -webkit-transform: scale(0);

            transform: scale(0);

  } 40% {

    -webkit-transform: scale(1);

            transform: scale(1);

  }

}



@keyframes sk-circleBounceDelay {

  0%, 80%, 100% {

    -webkit-transform: scale(0);

            transform: scale(0);

  } 40% {

    -webkit-transform: scale(1);

            transform: scale(1);

  }

}







/*----- Go Top -----*/

.gotop {

    width: 56px;

    height: 56px;

    position: fixed;

    bottom: 50px;

    right: 14px;

	padding-top: 5px;

    display: none;

    text-align: center;

    color: #fff;

    background: #09396b;

    z-index: 9999;

	cursor: pointer;

	line-height: 1.3;

	-webkit-transition: all 0.5s ease;

	-moz-transition: all 0.5s ease;

	-o-transition: all 0.5s ease;

	transition: all 0.5s ease;

}



.gotop:hover {

	background: #c06b1b;

	/*filter: alpha(opacity=100);

    opacity: 1;*/

}



.gotop i {

	font-size: 12px;

}



.gotop span {

	font-size: 14px;

	display: block;

}



.gotop:hover,

.gotop:focus {

	color: #fff;

}







/*----- 響應式 -----*/

@media (max-width: 1399px){

.wrap {

	width: 100%;

	padding: 0 3%;

}



}





@media (max-width: 1199px){

.wrap-fluid {

	padding: 0 20px;

}



header nav > ul.menu > li {

	padding: 0 25px;

}



}





/*991*/

@media (max-width: 991px){

.wrap{

	padding: 0 5%;

}



header {

	display: none;

}



.bannerArea {

	margin-top: 60px;

}



.bannerTitle {

	font-size: 48px;

}



.bannerTxt {

	font-size: 28px;

}



.leftArea {

	display: none;

}



.rightArea {

	width: 100%;

	float: none;

	padding-left: 0;

	border-left: none;

}



.footerInfo > .wrap > .row {

  margin-left: -15px;

  margin-right: -15px;

}



.footerInfo > .wrap > .row > .col-md-3 {

	padding-left: 15px;

	padding-right: 15px;

}







/*----- mobile menu -----*/

.mobile-menu {

	display: block;

	width: 100%;

	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);

	position: fixed;

	top: 0;

	left: 0;

	z-index: 9999;

}

.mobile-menu .mask {	

	display: none;

	/*background: rgba(33,33,33,1);*/

	position: fixed;

	width: 100%;

	height: 100%;

	padding-bottom: 60px;

	top: 0;

	left: 0;

	z-index: 10;

}

.mobile-menu a.main { 

	position: absolute;

    right: 0;

    top: 0;

    width: 55px;

    height: 60px;

    font-size: 20px;

    color: #fff;

    line-height: 60px;

	z-index: 1001;

    text-align: center;

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-align: center;

    -ms-flex-align: center;

    align-items: center;

    -webkit-box-pack: center;

    -ms-flex-pack: center;

    justify-content: center;

    cursor: pointer;

}

.mobile-menu a.main span {

    position: relative;

    display: inline-block;

    width: 28px;

    height: 1px;

    background: #1b1b1b;

    -webkit-transition: all .5s;

    -o-transition: all .5s;

    transition: all .5s;

}

.mobile-menu a.main span:before,

.mobile-menu a.main span:after {

    content: '';

    position: absolute;

    left: 0;

    width: 28px;

    height: 1px;

    background: #1b1b1b;

    -webkit-transition: all .5s;

    -o-transition: all .5s;

    transition: all .5s;

}

.mobile-menu a.main span:before {

    top: -8px;

}

.mobile-menu a.main span:after {

    top: 8px;

}

.mobile-menu a.main.show span {

    background: transparent;

}

.mobile-menu a.main.show span:before,

.mobile-menu a.main.show span:after {

	top: 0;

	background: #1b1b1b;

}

.mobile-menu a.main.show span:before {

    -webkit-transform: rotate(45deg);

        -ms-transform: rotate(45deg);

            transform: rotate(45deg);

}

.mobile-menu a.main.show span:after {

    -webkit-transform: rotate(-45deg);

        -ms-transform: rotate(-45deg);

            transform: rotate(-45deg);

}



.mobile-menu .controlBox { 

	background-color: #fff;

	position: relative;

	z-index: 99;

}

.mobile-menu .controlBox .m_logo {

	float: left;

	margin-left: 15px;

}

.mobile-menu .controlBox .m_logo img {

	display: block;

	max-height: 60px;

}



.mobile-menu .controlBox .m_lang {

	float: right;

	margin: 19px 62px 0 0;

	position: relative;

}

.mobile-menu .controlBox .m_lang span {

	font-size: 22px;

	color: #555;

	cursor: pointer;

}

.mobile-menu .controlBox .m_lang ul {

	width: 100px;

	position: absolute;

	left: 50%;

	top: 120%;

	transform: translateX(-50%);

	border: 1px solid #eee;

    box-shadow: 0 5px 10px rgba(60, 60, 60, 0.1);

}

.mobile-menu .controlBox .m_lang ul li a {

    padding: 5px 0;

	-webkit-transition: none;

	-moz-transition: none;

	-o-transition: none;

	transition: none;

}







/*----- mobile menu 內容 -----*/

.mobile-menu .hideBox { 

	position: fixed;

	left: 0;

    top: 50px;

    bottom: 0;

    z-index: 11;

    width: 100%;

    padding: 60px 0;

    overflow-y: auto;

    -webkit-overflow-scrolling: touch;

    opacity: 0;

    background-color: #09396b;

    visibility: hidden;

    pointer-events: none;

    -webkit-transition: all .8s;

    -o-transition: all .8s;

    transition: all .8s;

}

.mobile-menu .hideBox.show {

    top: 0;

    opacity: 1;

    visibility: visible;

    pointer-events: auto;

}

.mobile-menu .hideBox p.sp { 

	display: none;

	padding: 10px;

	font-size: 13px;

	color: #fff;

	background: #c80303;

}

.mobile-menu .contactIcon {

	padding: 30px 0;

	text-align: center;

}

.mobile-menu .contactIcon a {

	margin: 0 9px;

	display: inline-block;

	font-size: 20px;

	color: #fff;

	width: 46px;

	height: 46px;

	line-height: 46px;

	text-align: center;

	border-radius: 100%;

	background-color: rgba(255, 255, 255, 0.2);

}

.mobile-menu ul.nav li {

	border-bottom: 1px solid rgba(255, 255, 255, 0.1);

}

.mobile-menu ul.nav li a {

	padding: 20px 10px; 

	font-family: 'Roboto', 微軟正黑體, 新細明體, sans-serif; 

	display: block; 

	font-size: 17px; 

	color: #fff; 

	text-align: center;

	position: relative;

}

/*.mobile-menu ul.nav li > a:focus, */

.mobile-menu ul.nav li > a:hover {

	background-color: rgba(255, 255, 255, 0.25);

}

.mobile-menu ul.nav li a i {

	display: block;

	position: absolute;

	right: 10px;

	top: 50%;

	margin-top: -7px; 

}

.mobile-menu ul.nav li .submenu {

	display: none;

}

.mobile-menu ul.nav li .submenu a {	

	color: #333; 

	padding: 10px 20px;

	background-color: #fff;

}

.mobile-menu ul.nav li .submenu a:hover {

	background-color: #c0d0e0;

}







/*----- 手機產品分類選單 -----*/

.m_submenu {

	

}

.m_classLink {

	display: block;

	position: relative;

}

.m_classLink a.head {

	width: 100%;

	position: relative;

	display: block;

	font-size: 16px;

	color: #fff;

	padding: 10px 35px 10px 16px;

	background: #09396b;

}

.m_classLink a.head i {

	display: block;

	font-size: 15px;

	position: absolute;

	right: 12px;

	top: 50%;

	margin-top: -7px;

}

.m_classLink a.head:hover {

	color: #fff;

}

.m_classLink ul {

	padding: 0;

	list-style: none;

	display: none;

	width: 100%;

	background: #fff;

	border: 1px solid #09396b;

	border-top: none;

	position: absolute;

	left: 0;

	top: 100%;

	z-index: 99;

	box-sizing: border-box;

}

.m_classLink ul li {

	border-bottom: 1px solid #e3e3e3;

	position: relative;

}

.m_classLink ul li:last-child {

	border-bottom: none;

}

.m_classLink ul li a {

	position: relative;

	display: block;

	padding: 14px 15px 14px 35px;

	font-size: 16px;

	color: #222;

	box-sizing: border-box;

	transition: all .5s;

}

.m_classLink ul li > a:after {

	content: '\f0da';

	font-family: "FontAwesome";

	position: absolute;

	font-size: 13px;

	left: 19px;

	top: 16px;

}

.m_classLink ul li > a:hover,

.m_classLink ul li > a.current {

	background: #dcdcdc;

}



.m_classLink ul.subLink li dl {

	display: none;

	padding: 5px 0 0;

}

.m_classLink ul.subLink li dl dt a {

	display: block;

	padding: 12px 15px 1px 35px;

	font-size: 15px;

	color: #333;

}

.m_classLink ul.subLink li dl dt a.current,

.m_classLink ul.subLink li dl dt a:hover {

	color: #09396b;

	text-decoration: underline;

}



}





/*767*/

@media (max-width: 767px){



.footerInfo > .wrap > .row {

  margin-left: 0;

  margin-right: 0;

}



.footerInfo > .wrap > .row > .col-md-3 {

	padding-left: 0;

	padding-right: 0;

}



.footerInfo > .wrap > .row > .col-md-3 {

	margin-bottom: 35px;

}



.footerInfo > .wrap > .row > .col-md-3:last-child {

	margin-bottom: 0;

}





}





/*575*/

@media (max-width: 575px){



body {

	font-size: 16px;

}



.bannerArea {

	height: 180px;

}



.bannerTitle {

	font-size: 36px;

}



.bannerTxt {

	font-size: 22px;

}



.mainArea {

	padding: 30px 0 70px;

}



.title {

	font-size: 26px;

	margin-bottom: 40px;

}



.footerInfo > .wrap > .row > .col-md-3 > figure > img {

	max-width: 240px;

}



.headline {

	font-size: 17px;

}







/*----- 頁碼 -----*/

.page {

	padding-top: 50px;

}



}

