.in_section01,
.in_section03{
	width:100%;
	padding:10px 8% 0px;
    border-bottom: 1px solid #e4e8e9;}
.in_section02{
	width:100%;
	padding:60px 0% 0px;
    border-bottom: 1px solid #e4e8e9;}
.in_section01 h2,
.in_section03 h2{
	display:block;
	color:#444a52;
	font-size:34px;
	font-weight:600;
	text-align:center;
	margin-bottom:60px;
	
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
	
	flex-wrap: wrap;}
.in_section01 h2 a{
	font-weight:normal;
	display:inline-block;
	background: #f0efe9;
	color: #333;
    font-size: 13px;
	margin-left:20px;
	max-width:98%;
	padding: 5px 10px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;}
.in_section01 h2 a:hover,
.in_section01 h2 a.in_section01y{	
	background:#5c5a5a;
	color:#fff}

.index02{
	width:100%;
	display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
	-ms-flex-pack: justify;
    justify-content: space-between;}
a.in_box02,
a.in_box03{
	margin:0px 1% 60px;}
a.in_box02{
	display:block;
	width:46%;
    text-align: center;}
a.in_box03{
	display:block;
	width:23%;
    text-align: center;}
.in_box02a{
	width:100%;
	height:0px;
	padding-bottom:66.666%;
	margin-bottom:30px;
	background-repeat:no-repeat;
	background-position:center;
	background-size:cover;
	display:block;
	position:relative;
	overflow:hidden;}
.in_box03a{
	width:100%;
	height:0px;
	padding-bottom:133.3333%;
	margin-bottom:30px;
	background-repeat:no-repeat;
	background-position:center;
	background-size:cover;
	display:block;
	position:relative;
	overflow:hidden;}
.in_box02a:before,
.in_box03a:before,
.in_box06a:before{
    content: "";
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    border: 0 solid rgba(0,0,0,.5);
    left: 0;
    top: 0;
    transition: .4s;
    cursor: pointer;}
a.in_box02:hover .in_box02a:before,
a.in_box03:hover .in_box03a:before,
.case_box01:hover .in_box02a:before,
.in_box06 a:hover .in_box06a:before {
    border: 300px solid rgba(0,0,0,.5);}
.case_box01 .in_box02a{
    margin-bottom: 10px;}
.in_box02a span,
.in_box03a span{
	text-transform:uppercase;
	display: inline-block;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateY(-50%) translateX(-50%);
    color: #fff;
    border-top: 1px solid hsla(0,0%,100%,.5);
    border-bottom: 1px solid hsla(0,0%,100%,.5);
    letter-spacing: 0.3em;
    font-size: 12px;
    padding: 10px 15px 10px 16px;
    opacity: 0;
    z-index: 1;}
a.in_box02:hover .in_box02a span,
a.in_box03:hover .in_box03a span,
.case_box01:hover .in_box02a span,
.in_box06 a:hover .in_box06a span{
    opacity: 1;}
a.in_box02 p.in_box02b,
a.in_box03 p.in_box03b{
	font-size:15px;
    color: #abb9b9;
	letter-spacing:0.1em;
	margin-bottom:12px;
	text-transform:uppercase;}
a.in_box02 h3{
	font-size:36px;
	text-align:center;
	display:block;
	letter-spacing:0.2em;
	margin-bottom:15px;
	text-transform:uppercase;
	color:#333}
a.in_box03 h3 {
	font-size: 30px;
	text-align: center;
	display: block;
	letter-spacing: 0.2em;
	margin-bottom: 15px;
	text-transform: uppercase;
	color: #d4abab
}
a.in_box02 p.in_box02c,
a.in_box03 p.in_box03c {
	font-size: 17px;
	letter-spacing: 0.1em;
	color: #886262;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
/*	font-family: 'jf open 粉圓 1.1';
*/	font-family: 'Noto Sans TC';
}
a.in_box03 p.in_box03c{
	border-top: 1px solid #e4e8e9;
    padding-top: 15px;}
.in_b02{
	text-align:center;
	margin-bottom:50px;}
.in_b02 a{
	display:inline-block;
	text-align: center;
    line-height: 1.5;
    padding: 15px 55px;
    font-size: 14px;
    letter-spacing: 0.25em;
    border: 2px solid rgba(0,0,0,.2);}
.in_b02 a:hover{
	color:#fff;
    border: 2px solid rgba(0,0,0,.2);
	background:#000}


@media only screen and (max-width: 1200px) {
.in_box01{
    width: 47%;
    margin: 0 1.5% 30px;}
.in_box01 h3::after {
    bottom: 15px;}
.in_box01 h3 {
    padding: 20px 0 25px;}
.in_box02a {
    margin-bottom: 15px;}
.in_box03a {
    margin-bottom: 15px;}
a.in_box02 h3 {
    font-size: 26px;
    margin-bottom: 10px;}
a.in_box03 h3 {
    font-size: 20px;
    margin-bottom: 10px;}
a.in_box02 p.in_box02c, 
a.in_box03 p.in_box03c {
    font-size: 14px;}
a.in_box03 p.in_box03c {
    padding-top: 10px;}
.in_section01,
.in_section03{
    padding: 60px 4% 0px;}

}
@media only screen and (max-width: 1023px) {

.index02{}
.in_section01 {
    padding: 60px 0% 0px;}
a.in_box02,
a.in_box03 {
    margin: 0px 0% 60px;}
a.in_box02 {
    width: 48%;}
a.in_box03 {
    width: 24%;}


@media only screen and (max-width: 900px) {

.in_section01 {
    padding: 60px 20px 0px;}
.index02{
	-webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;}
a.in_box02,
a.in_box03{
    width: 100%;}
.in_box02a,
.in_box03a{
    width: 85%;
    padding-bottom: 56.666%;
    margin: 0px auto 20px;}
a.in_box02 p.in_box02b,
a.in_box03 p.in_box03b {
    font-size: 11px;
    margin-bottom: 10px;}
a.in_box03 h3 {
    font-size: 20px;}
a.in_box03 p.in_box03c {
    padding-top: 0px;
    border-top: 0px solid #e4e8e9;}


}
@media only screen and (max-width: 768px) {
.in_section01 h2 {
    margin-bottom: 20px;}
.in_section01 {
    padding: 30px 15px 0px;}
.in_box02a, 
.in_box03a {
    width: 100%;
    padding-bottom: 66.666%;}
a.in_box02 h3 {
    font-size: 20px;}
a.in_box02,
a.in_box03 {
    margin: 0px 0% 45px;}
.in_section03 h2 span{
    display: block;
    width: 100%;
    margin-bottom: 5px;}
.in_section01 h2, .in_section02 h2, .in_section03 h2 {
    font-size: 20px;}


}