
@import url(../fonts/font-awesome/font-awesome.min.css);
@import url(../fonts/flaticon/flaticon.css);
@import url(revise.css);
@import url(header.css);
@import url(footer.css);
@import url(hover.css);
@import url(banner.css);


/*========================================================
                         經營項目
=========================================================*/

.items-wrap {
	background: url(../images/index/items-bg.jpg) no-repeat center top;
	background-size: 120%;
	color: #fff;
}
.items-wrap > h2 {
	width: 41%;
	text-align: center;
	padding-top: 40px;
	margin: 0;
	font-weight: bold;
	font-size: 2rem;
}
.items-wrap > p {
	width: 41%;
	font-size: 1.4rem;
	text-align: center;
}
.items-wrap [class*="col-"] {
	padding-left: 0;
	padding-right: 0;
}
.items-wrap .col-xl-5 {
	background: url(../images/index/items-btn-bg.jpg) no-repeat center top;
	background-size: cover;
	margin-top: 20px;
}
.items-wrap .col-xl-7 {
	margin-top: -110px;
}

.slider-nav {
	padding-top: 40px;
	font-size: 1.2rem;
}
.slider-nav .slick-slide {
	cursor: pointer;
}
.slider-nav .slick-active {
	text-align: center;
	padding: 15px 40px;
	border-bottom: 1px solid #fff;
	font-weight: bold;

}
.slider-nav .slick-active span {
	display: inline-block;
	padding-left: 40px;
	padding-right: 40px;
}
.slider-nav .slick-current {
	background: #c59022; /* Old browsers */
	background: -moz-linear-gradient(left,  #c59022 0%, #f2b434 50%, #c59022 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #c59022 0%,#f2b434 50%,#c59022 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #c59022 0%,#f2b434 50%,#c59022 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c59022', endColorstr='#c59022',GradientType=1 ); /* IE6-9 */
	color: #000;
}
.slider-nav .slick-current span {
	background: url(../images/index/items-icon.png) no-repeat left center;
}
.slider-for a {
	color: #fff;
}
.slider-for > div {
	position: relative;
	margin: 0;
}
.slider-for > div a:after {
	content: '';
	position: absolute;
	top: 10px;
	right: 10px;
	bottom: 10px;
	left: 10px;
}
.slider-for > div img {
	width: 100%;
	vertical-align: bottom;
	border-radius: 15% 0 0 0;
	position: relative;
	z-index: 1;
}
.slider-for > div .info {
	position: absolute;
	left: 15%;
	top: 10%;
	right: 10%;
	z-index: 9;
}
.slider-for > div .info h4 {
	font-size: 2rem;
	font-weight: bold;
	border-left: 1px solid #fff;
	border-bottom: 1px solid #fff;
	padding-left: 15px;
	padding-bottom: 10px;
}
.slider-for > div .info p {
	font-size: 1.4rem;
	font-weight: bold;
	padding-left: 20px;
}

/*  尺寸設定 */
@media (max-width: 991px) {
	.items-wrap {
		background: none;
	}
	.items-wrap > h2 {
		width: 100%;
		color: #222;
	}
	.items-wrap > p {
		width: 100%;
		color: #222;
	}
	.slider-nav {
		display: none;
	}
	.items-wrap .col-xl-7 {
		margin-top: 0px;
	}
}
@media (min-width: 1200px) {
	.slider-for > div .info h4 {
		font-size: 2.4rem;
	}
	.slider-for > div .info p {
		font-size: 1.6rem;
	}
}
@media (min-width: 1600px) {
	.items-wrap > h2 {
		padding-top: 80px;
		font-size: 3rem;
	}
	.items-wrap > p {
		font-size: 1.6rem;
	}
	.items-wrap .col-xl-5 {
		margin-top: 60px;
	}
	.items-wrap .col-xl-7 {
		margin-top: -100px;
	}
	.slider-nav {
		padding-top: 100px;
		font-size: 1.6rem;
	}
	.slider-nav .slick-active {
		padding: 20px 40px;
	}
	.slider-for > div .info h4 {
		font-size: 3rem;
	}
	.slider-for > div .info p {
		font-size: 2rem;
	}
}


/*========================================================
                         市場動態
=========================================================*/

.news-wrap {
	background: url(../images/index/news-bg.jpg) no-repeat center top;
	background-size: cover;
	padding: 60px 8% 60px;
}
.news-wrap img {
	width: 100%;
    vertical-align: bottom;
}
.news-wrap [class*="col-"]:nth-of-type(1) {	
	background: url(../images/index/news-a02.jpg) no-repeat center center;
	background-size: cover;
}
.news-content h2 {
    font-weight: bold;
}
.news-content h2 span {
    display: inline-block;
    color: #2177c1;
    font-size: 1.5rem;
}
.news-content h2 span:before {
    content: '';
    display: inline-block;
    width: 2px;
    height: 24px;
    background-color: #2177c1;
    margin-left: 20px;
    margin-right: 20px;
}
.news-content dl,.news-content dl dt, .news-content dl dd {
    margin: 0;
}
.news-content dl {
    padding-top: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #adadad;
    overflow: hidden;
}
.news-content dl dt {
    float: left;
    margin-right: 20px;
    background-color: #2177c1;
    color: #fff;
    text-align: center;
    padding: 5px 15px 10px 15px;
}
.news-content dl dt span {
    display: block;
    font-size: 1rem;
}
.news-content dl dt b {
    display: block;
    font-size: 2rem;
}
.news-content dl dd {
    overflow: hidden;
    font-size: 1rem;
    line-height: 1.6rem;
}
.news-content dl dd h3 {
    margin: 0 0 5px;
    font-size: 1.4rem;
    font-weight: bold;
}
.news-content dl dd h3 span {
    display: inline-block;
    color: #000;
    margin-right: 10px;
}
.news-content dl dd h3 a {
    color: #111;
}
.news-content dl dd h3 a:hover {
    color: #2177c1;
}
.news-content dl dd p {
    margin: 0;
    color: #333;
}
.news-wrap .more {
    margin-top: 20px;
    text-align: right;
}
.news-wrap .more a {
    display: inline-block;
    background: #083658 url('https://api.iconify.design/dashicons:arrow-right-alt2.svg?color=%23fff&width=24px&height=24px') no-repeat 10px center;
    color: #fff;
    padding: 3px 14px 3px 34px;
}
.news-wrap .more a:hover {
    background: #2177c1 url('https://api.iconify.design/dashicons:arrow-right-alt2.svg?color=%23fff&width=24px&height=24px') no-repeat 10px center;

}

/*  尺寸設定 */
@media (min-width: 1200px) {
    .news-content {
        padding-left: 50px;
    }    
}



/*========================================================
                         實績案例
=========================================================*/

.case-wrap {
	padding: 40px 5% 40px; 
}
.case-wrap h1 {
	text-align: center;
	color: #181818;
	font-size: 2.4rem;
	position: relative;
	margin: 0;
	font-weight: bold;
	padding-bottom: 30px;
	border-bottom: 1px solid #bfbfbf;
}
.case-wrap [class*="col-"] {

}
.case-wrap .image-box .image-pic {
    overflow: hidden;
	position: relative;
}
.case-wrap .image-box .image-pic > img {
	width: 100%;
	vertical-align: bottom;
}
.case-wrap .image-box .image-pic a {
	display: block;
	color: #273152;
}
.case-wrap .image-box .image-pic:before {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 5;
	width: 100%;
	height: 10%;
	opacity: 0;
	transition: all 0.3s;
}
.case-wrap .image-box .image-pic:before {
	background: rgba(255, 255, 255, 0);
	opacity: 1;
	height: 100%;
}
.case-wrap .image-box .image-pic:hover:before {
	background: url(../images/index/case-img-bg.png) repeat center center;
/*	background-size: cover;*/
}

.case-wrap .thumb-inner {
/*	display: none;*/
	position: absolute;
	left: 0;
	top: 50%;
	z-index: 6;
	transform: translateY(-50%);
	width: 100%;
	text-align: center;
}
.case-wrap .thumb-inner span {
	display: inline-block;
	color: #273152;
	font-size: 2rem;
    font-weight: bold;
    background-color: rgba(255,255,255,1);
    padding: 15px 20%;
	border-radius: 30px;
	border: 2px solid #fff;
}
.case-wrap .image-box .image-pic:hover > .thumb-inner span  {
    background-color: rgba(70,90,160,0.77);
	color: #fff;
}


/*  尺寸設定 */
@media (min-width: 992px) {
    .case-wrap .thumb-inner span {
        font-size: 1.6rem;
        padding: 10px 15%;
        border-radius: 25px;
    }
}

@media (min-width: 1600px) {
    .case-wrap .thumb-inner span {
        font-size: 2rem;
        padding: 15px 20%;
        border-radius: 30px;
    }
}


/*========================================================
                         關於旭晨
=========================================================*/

.about-wrap {
    color: #fff;
    background-color: #325490;
    font-size: 20px;
    line-height: 36px;
}
.about-wrap [class*="col-"] {	
    padding-left: 0;
    padding-right: 0;
}
.about-wrap [class*="col-"] h3 {	
    text-align: left;
    font-size: 2.4rem;
	border-bottom: 1px solid #fff;
	padding-bottom: 20px;
	margin: 0 0 20px 0;
}
.about-wrap [class*="col-"]:nth-of-type(1) {	
	background: url(../images/index/about-bg.jpg) no-repeat center center;
	background-size: cover;
}
.about-wrap [class*="col-"]:nth-of-type(2) > div {	
	padding: 80px 60px;
}
.about-wrap a.more {	
	color: #ffd131;
}
.about-wrap a.more:hover {	
	color: #fff;
}


/*  尺寸設定 */
@media (min-width: 992px) {
	.about-wrap .triangle {
		position: absolute;
		top: 50%;
		right: 0;
		transform: translateY(-50%);
		z-index: 9;
		border-color: transparent #325490 transparent transparent;
		border-style: solid solid solid solid;
		border-width: 30px;
		height: 0px;
		width: 0px;
	}
    .about-wrap [class*="col-"]:nth-of-type(2) > div {	
        padding: 60px 60px;
    }
}
@media (min-width: 1200px) {
    .about-wrap [class*="col-"]:nth-of-type(2) > div {	
        padding: 60px 120px;
    }
}
@media (min-width: 1600px) {
    .about-wrap [class*="col-"]:nth-of-type(2) > div {	
        padding: 80px 150px;
    }
}


/*========================================================
                      	 相關連結
=========================================================*/

.link-wrap {
	position: relative;
}
.link-wrap p {
	font-size: 1.8rem;
	margin: 0 0 0 5px;
}
.link-wrap img {
    width: 100%;
    vertical-align: bottom;
	padding: 5px;
}





/*========================================================
                         圖片效果
=========================================================*/

a.figure {
	display: block;
	position: relative;
	}
a.figure:hover:before {
    opacity: 0.3;
    -webkit-transform: scale(1);
    transform: scale(1);
}
a.figure:before {
    position: absolute;
    top: 6px;
    bottom: 6px;
    left: 6px;
    right: 6px;
    z-index: 10;
    content: '';
    display: inline-block;
    background-color: #fff;
    opacity: 0;
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    transition: .3s;
}


