@charset "utf-8";
/* CSS Document */

.insideWrap{padding:0;width:100%;}
/*background:#FF6801;*/

/*==case==*/
.caseWrap{ width:100%; box-sizing:border-box; position:relative;} 
.caseWrap .wrap{ padding:40px 20px;}

/*submenu*/
.submenuBox{float: right;width: 70%;box-sizing: border-box;text-align: right;color: #FFF;margin-top: 20px;margin-bottom: 10px;}
.submenuBox .title{width: 100%;border-bottom: 2px #1A264C solid;text-align: center;padding: 12px 0;font-weight: bold;}
.submenuBox .title h3{font-size: 22px;color: #fff;right top;}
.submenuBox ul li{ width:100%; box-sizing:border-box; padding:20px 0; border-bottom:1px #B9B9C8 dotted; text-align:center;}
.submenuBox ul li a{ display:block; font-size:19px; color:#1F1F2E; transition:all 0.4s ease;}
.submenuBox ul li a:hover{color: #1F1F2E;}
.submenuBox ul li a.active{color: #D83500;font-weight: bold;}


.insideWrap{ width:100%; box-sizing:border-box; position:relative; margin:0 auto; box-sizing: border-box;http://ega.com.tw/test/product-list.php}
.insideWrap .titleWrap{ width:100%; box-sizing:border-box;}
.insideWrap .TitleBox{ text-align:center; padding-top:20px;}

.insideWrap .proleft{width:30%;float:left;height:100%;}
.insideWrap .proleft .proleft1{margin: 0 auto;text-align:right;}
.insideWrap .proleft .proleft1 .proleft2{margin-right:20px;}

.insideWrap .proright{width:70%;float:left;}

.insideWrap .proright .breadBox{float: right;margin:20px 20px 10px 0px;}
.insideWrap .proright .breadBox p{ font-size:14px; color:#464652;}
.insideWrap .proright .breadBox p a{ display:inline-block; color:#464652; transition:all 0.4s ease;}
.insideWrap .proright .breadBox p a i{ padding-right:2px;}
.insideWrap .proright .breadBox p a:hover{ color:#464652;}
.insideWrap .proright .breadBox p span{ padding:0 7px;}
.insideWrap .proright .titleBox{ width:100%; text-align: center;}
.insideWrap .proright .titleBox h2{font-size:30px; color:#464652;}


/*content*/
.insideWrap .proright .caseBox{ float:left; width:100%; box-sizing:border-box; padding-left:40px;}
.insideWrap .proright .caseBox ul{ margin:0 -7px;}
.insideWrap .proright .caseBox ul li{ float:left; width:33.33%; box-sizing:border-box; padding:0 7px 20px;}
/*.insideWrap .proright .caseBox ul li .itemBox{ width:100%; background:#fff; box-sizing:border-box; box-shadow:0px 2px 5px rgba(20%,20%,40%,0.2);}*/
.insideWrap .proright .caseBox ul li .itemBox .imgBox{ width:100%;}
.insideWrap .proright .caseBox ul li .itemBox .imgBox img{display:block; width:40%; margin:0 auto;}
.insideWrap .proright .caseBox ul li .itemBox .imgBox a{ display:block; transition:all 0.4s ease;}
.insideWrap .proright .caseBox ul li .itemBox .imgBox a:hover{ opacity:0.8;}
.insideWrap .proright .caseBox ul li .itemBox .txtBox{ width:100%; box-sizing:border-box; padding:25px 15px;}
.insideWrap .proright .caseBox ul li .itemBox .txtBox h3{ font-size:18px; color:#1F1F2C; margin-bottom:8px; height:30px; overflow:hidden; text-align:center;}
.insideWrap .proright .caseBox ul li .itemBox .txtBox p{ font-size:14px; color:#464652; text-align:justify; line-height:1.6; height:90px; overflow:hidden;}
.insideWrap .proright .caseBox ul li .itemBox .txtBox .more{ text-align:center; margin-top:20px;}
.insideWrap .proright .caseBox ul li .itemBox .txtBox .more a{ display:inline-block; font-size:12px; color:#464652; border-radius:30px; border:1px #d2d2d2 solid; padding:5px 15px; margin-top:0; transition:all 0.4s ease;}
.insideWrap .proright .caseBox ul li .itemBox .txtBox .more a:hover{ background:#9ac901; color:#fff; border:1px #9ac901 solid;}




/*手機板選單*/
.submenu_m{ display:none; width:100%; cursor:pointer; position:relative;}
.submenu_m a.submain{ display:block; font-size:15px; color:#fff; background:#00238C; padding:10px 20px; border-radius:4px 4px 0 0; position: relative;}
.submenu_m a.submain b{ color:#fff; letter-spacing:2px;}
.submenu_m a.submain i{ display:block; color:#fff; font-size:15px; position:absolute; right:10px; top:50%; margin-top:-6px;}
.submenu_m ul{ display:none; width:100%; background:#fff; border:1px #ddd solid; position:absolute; left:0; top:100%; z-index:99; box-sizing:border-box; padding:5px 0; border-bottom:2px #ddd solid;}
.submenu_m ul li a{ display:block; font-size:15px; color:#1F1F2D; padding:8px 20px; border-top:1px #ddd solid; transition:all 0.4s ease;}
.submenu_m ul li a.active{color:#D83400; font-weight:bold;}
.submenu_m ul li:first-child a{ border-top:0;}
.submenu_m ul li a:hover{color:#00238C; padding:5px 25px;}


/* 產品圖 */
html, body {position: relative;height: 100%;}
.swiper-container {width: 100%;height: 300px;margin-left: auto;margin-right: auto;}
.swiper-slide {background-size: cover;background-position: center;}
.gallery-top {height: 80%;width: 100%;}
.gallery-thumbs {height: 20%;box-sizing: border-box;padding: 10px 0;}
.gallery-thumbs .swiper-slide {width: 25%;height: 100%;opacity: 0.4;}
.gallery-thumbs .swiper-slide-active {opacity: 1;}



/* 下方按鈕 */
.outerWrap .shareBox{ width:100%; text-align:right; margin-top:40px; border-top:1px #ddd solid; padding:20px 20px 0; box-sizing: border-box;}
.outerWrap .shareBox a{ display:inline-block; background:#65AB27; color:#fff; text-align:center; padding:10px 20px; font-size:13px; transition:all 0.4s ease;}
.outerWrap .shareBox a:hover{ background:#65AB27;}

@media (max-width:1034px){

}

@media (max-width:980px){
.insideWrap .proright .caseBox{ padding-left:25px;}
}

@media (max-width:768px){
.insideWrap .TitleBox{ text-align:center; padding-top:80px;}

.insideWrap .proright .submenu_m{ display:block;margin:70px 10px 0px 10px; }
/*.insideWrap .proright .caseBox ul li{ width:30%;}		*/
.submenuBox{ float:none; display:none;}
.insideWrap .proleft {display:none;}
.insideWrap .proleft .proleft1{float:none;margin: 0 auto;text-align:center;width:100%;}
/*.insideWrap .proleft .proleft1 .proleft2{margin-right:20px;}*/
.insideWrap .proright .breadBox{display:none;}
.insideWrap .proright{background:#FFf;width:100%;margin:0px;}
.insideWrap .proright .caseBox{ padding:0; margin-top:20px;margin-left:10px;}
.submenu_m{ width:96%; }
}

@media (max-width:640px){
.insideWrap .proright .caseBox{margin-left:10px;}
.insideWrap .proright .caseBox ul li{ width:50%;}	
.images {display:block; width:100%;}
}

@media (max-width:480px){
.insideWrap .proright .caseBox{margin-left:10px;}
.insideWrap .proright .caseBox ul li{ width:100%;}		
.caseWrap .wrap{ padding:40px 15px 20px;}
.insideWrap .proright .caseBox ul li .itemBox .txtBox p{ height:auto;}
.images {display:block; width:100%;}
}

@media (max-width:420px){
.caseWrap .wrap{ padding:30px 15px 15px;}	
.caseWrap .wrap .caseBox{ margin-top:15px;}	
.images {display:block; width:100%;}
}


@media (max-width:375px){
	.images {display:block; width:100%;}
}


@media (max-width:320px){
.caseWrap .wrap{ padding:20px 10px 10px;}	
.images {display:block; width:100%;}
}