@charset "utf-8";
/* CSS Document */
body { background:#ececec; }

/*----------------------------------------------------------------------*/
/* 首頁區塊 */
.block_title { max-width:1280px; padding-left:10px; padding-right:10px; margin-left:auto; margin-right:auto; }
.block_title h2 { padding-left:80px; background:url("../images/icon_index_title.png") no-repeat 0 0; color:#d42828; line-height:60px; letter-spacing:3px; }
.block_title h2 span { font-family:'Taviraj', sans-serif; font-size:60%; color:#555; font-style:italic; font-weight:normal; letter-spacing:0; } 
.block_title h2 span::before { content:'－'; margin:0 2px; color:#a0a0a0; }


/*----------------------------------------------------------------------*/
/* 活動訊息 */
.IndexEvent { background:url("../images/index_event_bg.png") no-repeat center 0; background-size:contain; }
.index_event_list { background-repeat:no-repeat; padding-top:1.5vh; position:relative; }
.index_event_list > div { max-width:1320px; padding-left:6.5%; padding-right:6.5%; margin-left:auto; margin-right:auto; }

	@media screen and (orientation: portrait) {
	.IndexEvent > div { padding-top:7vh; }
	.index_event_list > div { padding-bottom:6.25vh; }
	}
	@media screen and (orientation: landscape) {
	.IndexEvent > div { padding-top:12vh; }
	.index_event_list > div { padding-bottom:11vh; }
	}

.index_event_list .item { float:left; box-sizing:border-box; }
.index_event_list .owl-carousel .item { float:none; margin-left:auto; margin-right:auto; }
.index_event_list .item a { 
	display:block; text-decoration:none; background-color:#fff; padding:10px; box-sizing:border-box;
	-webkit-box-shadow:0 0 15px rgba(0,0,0,0.25);
	-moz-box-shadow:0 0 15px rgba(0,0,0,0.25);
	box-shadow:0 0 15px rgba(0,0,0,0.25);
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
	}
.index_event_list .item a:hover, .index_event_list .item a:focus { 
	-webkit-box-shadow:0 0 15px rgba(0,0,0,0.5);
	-moz-box-shadow:0 0 15px rgba(0,0,0,0.5);
	box-shadow:0 0 15px rgba(0,0,0,0.5);
	}
.index_event_list .item .img { padding-bottom:75%; background-repeat:no-repeat; background-position:center center; background-size:cover; position:relative; overflow:hidden; }
.index_event_list .item .img::after { 
	content:''; display:block; position:absolute; bottom:0; right:0; box-sizing:border-box; 
/*	width:100%; height:20px; background-color:#fff; 
	transform-origin:left;
	transform:skewY(3deg);*/
	border-bottom:20px solid #fff;
	border-right:410px solid transparent;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
	}
.index_event_list .item a:hover .img::after, .index_event_list .item a:focus .img::after {
	border-bottom-width:0;
	}
.index_event_list .item .title { margin-bottom:10px; color:#444444; font-size:18px; font-weight:bold; line-height:150%; }
.index_event_list .item .title:hover { color:#d42828; }
.index_event_list .item .title::after { content:''; display:block; margin-top:10px; width:78px; height:10px; background:url("../images/pattern1.png") repeat 0 0; }
.index_event_list .item .desc { color:#999999; font-size:14px; line-height:200%; }

.index_event_list .owl-carousel .owl-nav .owl-prev, .index_event_list .owl-carousel .owl-nav .owl-next { 
	text-indent:-10000px; width:40px; height:40px; position:absolute; top:50%; margin-top:-20px; opacity:0.6; 
	-webkit-border-radius:50%;
	-moz-border-radius:50%;
	border-radius:50%;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
	}
.index_event_list .owl-carousel .owl-nav .owl-prev:hover, .index_event_list .owl-carousel .owl-nav .owl-next:hover { opacity:1; }
.index_event_list .owl-carousel .owl-nav .owl-prev::after, .index_event_list .owl-carousel .owl-nav .owl-next::after {
	content:''; position:absolute; top:50%; border-width:3px 0 0 3px; border-style:solid; box-sizing:border-box; 
	}
	.index_event_list .owl-carousel .owl-nav .owl-prev::after {  
		left:50%; 
		-webkit-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		transform: rotate(-45deg);
		}
	.index_event_list .owl-carousel .owl-nav .owl-next::after {  
		right:50%; 
		-webkit-transform: rotate(135deg);
		-moz-transform: rotate(135deg);
		transform: rotate(135deg);
		}
		

/*----------------------------------------------------------------------*/
/* 企業新聞 */
.IndexNews { background-color:#fff; position:relative; }
.IndexNews > div { position:relative; }
.IndexNews::before, .IndexNews::after, .IndexNews > div::before, .IndexNews > div::after { content:''; display:block; z-index:1; }
.IndexNews::before { 
	width:100%; background:url("../images/pattern1.png") repeat 0 0;
	}
.IndexNews::after { 
	position:absolute; background:url("../images/pattern1.png") repeat 0 0;
	}
.IndexNews > div::before { 
	position:absolute; background:url("../images/index_news_bg1.png") no-repeat 0 0; background-size:cover;
	}
.IndexNews > div::after { 
	position:absolute; background:url("../images/index_news_bg2.png") no-repeat 0 0; background-size:cover;
	}

.index_news_list { max-width:1280px; margin-left:auto; margin-right:auto; padding-top:10px; padding-left:10px; padding-right:10px; box-sizing:border-box; position:relative; z-index:2; }
.index_news_list li { border-top:1px solid #e3e3e3; position:relative; }
.index_news_list li:first-child { border-top:0; }
.index_news_list span { display:block; padding:15px 0; line-height:30px; }
.index_news_list .date { position:absolute; top:0; left:0; width:100px; padding-left:10px; font-size:14px; color:#999999; box-sizing:border-box; }
.index_news_list .date::before { content:''; display:block; position:absolute; top:18px; left:0; width:78px; height:12px; background:url("../images/pattern1.png") repeat 0 0; }
.index_news_list .title { margin-left:105px; }
.index_news_list .title a, .index_news_list .title a::after {
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
	}
.index_news_list .title a { 
	display:block; padding-left:24px; width:100%; color:#555555; text-decoration:none; position:relative; box-sizing:border-box;
	}
.index_news_list .title a:hover, .index_news_list .title a:focus { color:#d42828; }
.index_news_list .title a::after { 
	content:''; display:block; position:absolute; top:10px; left:0; 
	border-left:12px solid #e75548; border-bottom:5px solid transparent; border-top:5px solid transparent; 
	}
.index_news_list .title a:hover::after, .index_news_list .title a:focus::after { left:10px; }

.IndexNews .btn_more { max-width:1280px; margin-left:auto; margin-right:auto; padding-top:20px; padding-left:10px; padding-right:10px; box-sizing:border-box; text-align:right; }
.IndexNews .btn_more a { display:inline-block; padding-right:16px; text-align:left; color:#000; line-height:40px; text-decoration:none; position:relative; }
.IndexNews .btn_more a::after { 
	content:''; display:block; position:absolute; right:0; top:16px; 
	width:6px; height:6px; border-width:1px 1px 0 0; border-style:solid; border-color:#000; 
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	transform: rotate(45deg);
	}
.IndexNews .btn_more a:hover, .IndexNews .btn_more a:focus { color:#d42828; }
.IndexNews .btn_more a:hover::after, .IndexNews .btn_more a:focus::after { border-color:#d42828; }


/*----------------------------------------------------------------------*/
/* 事業群 */
.IndexConglomerate { overflow:hidden; }
.index_conglomerate_block { position:relative; }
.index_conglomerate_block::after { content:''; display:block; clear:both; }
.index_conglomerate_block .img > div { padding-bottom:62%; background-repeat:no-repeat; background-position:center center; background-size:cover; }
	
.index_conglomerate_block .cont { max-width:1280px; margin-left:auto; margin-right:auto; box-sizing:border-box; }
.index_conglomerate_block .cont > div { overflow:hidden; }

.IndexConglomerate .block_title { max-width:none; margin-left:0; margin-right:0; }
.IndexConglomerate .block_title h2 span { display:block; margin-left:-80px; margin-top:10px; line-height:24px; }
.index_conglomerate_block .desc { padding-top:20px; color:#888888; line-height:220%; }
.index_conglomerate_block .btn_more { padding-top:20px; box-sizing:border-box; text-align:right; box-sizing:border-box; }
.index_conglomerate_block .btn_more a { display:inline-block; padding-right:16px; text-align:left; color:#000; line-height:40px; text-decoration:none; position:relative; }
.index_conglomerate_block .btn_more a::after { 
	content:'+'; display:block; position:absolute; right:0; top:0; font-family:Arial, Helvetica, sans-serif; font-size:14px; 
	}
.index_conglomerate_block .btn_more a:hover, .index_conglomerate_block .btn_more a:focus { color:#d42828; }

.index_conglomerate_block .companies { margin-top:30px; margin-bottom:30px; overflow:hidden; }
.index_conglomerate_block .companies > * { float:left; vertical-align:middle; }
.index_conglomerate_block .companies dt { max-width:160px; height:50px; margin-right:20px; }
	.index_conglomerate_block .companies dt + dd:not(:last-child) { clear:left; }
.index_conglomerate_block .companies dt::before { content:''; height:100%; display:inline-block; vertical-align:middle; }
.index_conglomerate_block .companies dt img { max-width:100%; max-height:100%; display:inline-block; vertical-align:middle; }
.index_conglomerate_block .companies dd { margin-right:10px; margin-top:5px; margin-bottom:5px; position:relative; }
.index_conglomerate_block .companies dd::after { 
	content:''; display:block; position:absolute; bottom:0; right:0;
	border-bottom:8px solid #dc2828; border-left:8px solid transparent;
	}
.index_conglomerate_block .companies dd a { 
	display:block; border:1px solid #dddddd; background-color:#fff; padding:0 15px; color:#333; font-size:15px; line-height:38px; text-decoration:none; 
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
	}
.index_conglomerate_block .companies dd a:hover { color:#fff; border:1px solid #dc2828; background-color:#dc2828 !important; }

/* block1 */
.IndexConglomerate .index_conglomerate_block:nth-child(1) { background:#f0f0f0 url("../images/index_conglomerate_bg_4_3.png") no-repeat center bottom; background-size:contain; }

/* block2 */
.IndexConglomerate .index_conglomerate_block:nth-child(2) { background:#fff url("../images/pattern1.png") repeat 0 0; }
.IndexConglomerate .index_conglomerate_block:nth-child(2) .cont::before { 
	content:''; display:block; position:absolute; 
	background:url("../images/index_conglomerate_bg_2_1.png") no-repeat 0 0; background-size:cover; 
	}
.IndexConglomerate .index_conglomerate_block:nth-child(2) .cont::after { 
	content:''; display:block; position:absolute; 
	background:url("../images/index_conglomerate_bg_2_2.png") no-repeat 0 0; background-size:cover; 
	}

/* block3 */
.IndexConglomerate .index_conglomerate_block:nth-child(3) { background-color:#fff; }
	
/* block4 */
.IndexConglomerate .index_conglomerate_block:nth-child(4) { background:#f0f0f0 url("../images/index_conglomerate_bg_4_3.png") no-repeat center bottom; background-size:contain; }
.IndexConglomerate .index_conglomerate_block:nth-child(4) .cont::before { 
	content:''; display:block; position:absolute; 
	background:url("../images/index_conglomerate_bg_4_1.png") no-repeat 0 0; background-size:cover; 
	}
.IndexConglomerate .index_conglomerate_block:nth-child(4) .cont::after { 
	content:''; display:block; position:absolute; 
	background:url("../images/index_conglomerate_bg_4_2.png") no-repeat 0 0; background-size:cover; 
	}
	
	/* 動畫效果 */
	.IndexConglomerate .index_conglomerate_block .img,
	.IndexConglomerate .index_conglomerate_block .block_title,
	.IndexConglomerate .index_conglomerate_block .desc,
	.IndexConglomerate .index_conglomerate_block .btn_more,
	.IndexConglomerate .index_conglomerate_block .companies dt,
	.IndexConglomerate .index_conglomerate_block .companies dd { opacity:0; }
	.IndexConglomerate .index_conglomerate_block .img.active,
	.IndexConglomerate .index_conglomerate_block .cont.active .block_title,
	.IndexConglomerate .index_conglomerate_block .cont.active .desc,
	.IndexConglomerate .index_conglomerate_block .btn_more.active,
	.IndexConglomerate .index_conglomerate_block .companies.active dt,
	.IndexConglomerate .index_conglomerate_block .companies.active dd { opacity:1; }
	
	.IndexConglomerate .index_conglomerate_block .img,
	.IndexConglomerate .index_conglomerate_block .block_title,
	.IndexConglomerate .index_conglomerate_block .desc {
		-webkit-transition:transform 1s ease, opacity 1s ease;
		-moz-transition:transform 1s ease, opacity 1s ease;
		transition:transform 1s ease, opacity 1s ease;
		}
		
	.IndexConglomerate .index_conglomerate_block .btn_more,
	.IndexConglomerate .index_conglomerate_block .companies dt,
	.IndexConglomerate .index_conglomerate_block .companies dd {
		-webkit-transition:transform 0.5s ease, opacity 0.5s ease;
		-moz-transition:transform 0.5s ease, opacity 0.5s ease;
		transition:transform 0.5s ease, opacity 0.5s ease;
		}
		
	.IndexConglomerate .index_conglomerate_block .companies dt { transform:translateY(-40px); }
	.IndexConglomerate .index_conglomerate_block .companies dd { transform:scale(0); transform-origin:center center; }
	.IndexConglomerate .index_conglomerate_block .companies dd:nth-child(1) { transition-delay:0.15s; }
	.IndexConglomerate .index_conglomerate_block .companies dd:nth-child(2) { transition-delay:0.3s; }
	.IndexConglomerate .index_conglomerate_block .companies dd:nth-child(3) { transition-delay:0.45s; }
	.IndexConglomerate .index_conglomerate_block .companies dd:nth-child(4) { transition-delay:0.6s; }
	.IndexConglomerate .index_conglomerate_block .companies dd:nth-child(5) { transition-delay:0.75s; }
	.IndexConglomerate .index_conglomerate_block .companies dd:nth-child(6) { transition-delay:0.9s; }
	.IndexConglomerate .index_conglomerate_block .companies dd:nth-child(7) { transition-delay:1.05s; }
	.IndexConglomerate .index_conglomerate_block .companies dd:nth-child(8) { transition-delay:1.2s; }
	.IndexConglomerate .index_conglomerate_block .companies dd:nth-child(9) { transition-delay:1.35s; }
	.IndexConglomerate .index_conglomerate_block .companies dd:nth-child(10) { transition-delay:1.5s; }
	.IndexConglomerate .index_conglomerate_block .companies.active dt { transform:translateY(0); }
	.IndexConglomerate .index_conglomerate_block .companies.active dd { transform:scale(1); }