@charset "utf-8";
/***************************************
    copyright by MakeWeb.com.tw 
***************************************/

@import url("style.css");
.light_yellow{
	display: inline-block;
	width: 24px;
	height: 24px;
	background: yellow;
	border-radius: 12px;
}
.light_ori{
	display: inline-block;
	width: 24px;
	height: 24px;
	background: orange;
	border-radius: 12px;
}
.light_red{
	display: inline-block;
	width: 24px;
	height: 24px;
	background: red;
	border-radius: 12px;
}
/*-------------------------------------------- 
	container
---------------------------------------------*/
#container {
	width: 100%;
	margin: 102px 0 0;
	background: #ECF0F1;
}

/*-------------------------------------------- 
	content1
---------------------------------------------*/

#content1 {
	width: 100%;
}
.label_menu_title , .canvas_post >h2 , .u2{
	display: none;
}

/*-------------------------------------------- 
	content2
---------------------------------------------*/
#content2 {
	padding: 60px 0;
}
.content_box , .canvas_post{
	max-width: 1280px;
	margin: 0 auto;
}
.sec_1 , .sec_2{
	background-color: #F4F4F5;
}
.sec_1 .content_box{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-template-rows: 128px auto;
	grid-area:2 / 1 / 3 / 3;
	padding: 20px;
}


.list_breadcrumb_blue01 {
	overflow: hidden;
	margin: 0px auto;
	padding: 0px 0px;
	background: #F8F8F8;
}
.list_breadcrumb_blue01 ul {
	/*display: table;*/
	/*width: 100%;*/
	/*max-width: 1280px;*/
	/*margin: 0 auto;*/
	float: right;
	margin: 0 10% 0 0;
	padding: 0;
	list-style: none;
}
.list_breadcrumb_blue01 li {
	float: left;
	line-height: 48px;
	font-size: 1.6rem;
	/*color: #F3BD37;*/
	/*font-weight: bold;*/
}
.list_breadcrumb_blue01 li a {
	color: #849293; 
}
.list_breadcrumb_blue01 li a:hover {
	color: #F3BD37;
}
.list_breadcrumb_blue01 li .crumb_tag {
	color: #849293;
}
/*-------------------------------------------- 
	Media Queries 
---------------------------------------------*/
/* Portrait and Landscape */
/*@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) {
}*/

/*iPad Pro*/
@media screen and (max-width: 1279px) {
}

/*iPad*/
@media screen and (max-width: 1023px) {

	#container {
	}
	
	.label_menu_title h1{
		/*margin: 8% 0 0px 15%;*/
		/*padding: 0px 20px;*/
		font-size: 3rem;
	}

	#side1 {
		display: none;
	}
	#side2 {
		float: left;
		width: 100%;
		padding: 0 20px;
	}
	.canvas_post img{
		/*width: 100%;*/
		max-width: 100%;
	}
}


/*iPhone*/
@media screen and (max-width: 767px) {

	#container {
		/*width: 100%;*/
		margin: 60px 0 0;
	}

	.label_menu_title h1{
		/*margin: 5% 0 0px 5%;*/
		font-size: 2rem;
	}

	.list_breadcrumb_blue01 ul {
		margin: 0 3% 0 0;
	}
	.list_breadcrumb_blue01 li{
		font-size: 1.4rem;
		line-height: 36px
	}

}