@charset "UTF-8";

/* @import url(//fonts.googleapis.com/earlyaccess/notosanstc.css); */
/*100、300、400、500、700、900*/
/* @import url('https://fonts.googleapis.com/css?family=Palanquin+Dark:600,700&display=swap'); */
/* @import url('https://fonts.googleapis.com/css?family=Montserrat:400,800&display=swap'); */
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+TC:400,500,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300&display=swap');
/* @import url('https://fonts.googleapis.com/css?family=Lato:700,900&display=swap'); */


*,html{
margin: 0;
padding: 0;
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
-webkit-appearance: none;
outline: none;
-moz-osx-font-smoothing: grayscale;
}

*,
*::before,
*::after {
    box-sizing: border-box; 
    margin:0;
    padding:0;
}


body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td, figure {
margin: 0;	
padding: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

article, aside, figcaption, figure, footer, header, hgroup, main, nav, section, a, img {
	display: block;
}
  


li      { list-style-type: none; }
img     { vertical-align: bottom; }


/*----------------fontStyle---------------------
------------------fontStyle---------------------
------------------fontStyle------------------ */
body {
/* font-family: 'Lato', "Noto Sans TC", Arial, Helvetica, sans-serif; */
/* font-family: 'Montserrat', "Noto Sans TC", Arial, Helvetica, sans-serif; */
font-family:"Roboto", "Noto Sans TC", "微軟正黑體", "Microsoft JhengHei", "儷黑 Pro", "LiHei Pro", Arial, Helvetica, sans-serif;
font-size: 15px;
line-height: 1.5;
color:#3B3B3B;
letter-spacing:3px;
-webkit-text-size-adjust:100%;
/* background-color: #f7f7f7; */
/*text-shadow:#999 0.01em 0.01em 0.05em ;*/
/*font-weight: 300;*/
}

p { 
	line-height: 1.5;
	font-weight: 400;
	color: #3B3B3B ;
	letter-spacing: 3px;
	word-spacing: 3px;
}

sub {
	display: block;
	bottom: 0;
}

strong  { font-size: 1em;color: #3B3B3B }
a       { color:#3B3B3B; text-decoration:none; }


h1, h2, h3, h4, h5, h6 { 
	line-height: 1.2em;
	font-weight: 500; 
	color: #3B3B3B; 
	letter-spacing: 1px;
}

.h1title {
	
}

.h2title {
	
	font-size: 40px;
}

.h3title {
	
}

.h4title {
	font-size: 18px;
}

.h5title {
	line-height: 2;
	font-size: 15px;
	font-weight: bold;
}



small, .small{ font-size: 75%}


.l-outer {
	/* width: 100%; max-width: 1350px;
	min-height: calc(100vh - 222px);
	margin: 0 auto;
	padding: 20px; */
}

.l-inner {
	width: 100%; max-width: 1200px;
	/* min-height: calc(100vh - 222px); */
	margin: 0 auto;
	padding: 20px;
	overflow: hidden;
}


.j_bgIMG, .j_mvIMG {
 	background-position: center;
 	background-size: cover;
 	background-repeat: no-repeat;
}



/*----------------cleadfix---------------------
------------------cleadfix---------------------
------------------cleadfix------------------ */
.clearfix:before,
.clearfix:after {
	content: " "; /* 1 */
	display: table; /* 2 */
}

.clearfix:after {
clear: both;
}