@charset "utf-8";

.BannerHome02 { height: auto;}
.BannerHome02 .swiperBan02 { position: static; margin: 0;}
.BannerHome02 .swiperBan02 .swiper-slide img { height: auto;}
/* 2025.12.26 中間放大*/
.BannerHome02 .swiper-slide-active img { transform: scale(1);}
.BannerHome02 .swiperBan02 .swiper-slide img { transition: transform 5s ease-out; will-change: transform; transform: scale(1);}
.BannerHome02 .swiperBan02 .swiper-slide-active img { transform: scale(1.06);}
@media (max-width:1400px) { .BannerHome02 { height: auto;}}
@media (max-width:1024px) { .BannerHome02 { height: auto;}}
@media (max-width:768px) { 	.BannerHome02 { height: auto;}}

/*●●●●●●●●●●●●●●●●●●●●●●●●   隱藏內容   ●●●●●●●●●●●●●●●●●●●●●●●●*/
.box_link{display:none;}
.tp_links{display:none;}
.path p, .path p a { display: none;}
/*.me_tp_features {  display: none;}*/
.sb_marquee { display: none;}

/*●●●●●●●●●●●●●●●●●●●●●●●●   大範圍設定   ●●●●●●●●●●●●●●●●●●●●●●●●*/
*{letter-spacing: .1rem;}
*{font-family: /*"Kosugi Maru", sans-serif;*/}
:root{
	/*顏色*/
	
	--ColorMain: #929292 /*淺灰*/;
    --ColorMain2: #ccc7bc /*淺暖灰*/;
	
	--ColorSub:#f1f1f1 /*淺淺灰*/;
	--ColorSub2:#9f9388 /*深暖灰*/;
	
	--ColorSub3:#626952/*綠*/;
	--ColorSub3:#F6F3EE/*灰*/;
	
	--textColor: #333333; /*文字*/
	
	/* 字型 */
	--ffmain: "微軟正黑體"; --ffsub: "Gabarito", sans-serif;
}

#content_main, #content { margin-top: 0;background-color: var(--ColorSub);
    background-image: linear-gradient(to right, rgb(255 255 255 / 35%) 1px, transparent 1px), linear-gradient(to bottom, rgb(255 255 255 / 35%) 1px, transparent 1px);
    background-size: 20px 20px;}
@media screen and (max-width: 1024px){}  
@media screen and (max-width: 768px) {}         
@media screen and (max-width: 450px) {}

/*●●●●●●●●●●●●●●●●●●●●●●●●   方直型浮動按鈕浮動按鈕   ●●●●●●●●●●●●●●●●●●●●●●●●*/

.info_fix_links{ display:block !important; width: 30px;}/*保持展開*/
.info_fix>span { display: none;}/*隱藏展開鈕*/
.linksBtn, .info_fix:hover>.linksBtn{ background: #de8c66;}
.info_fix_links img{width: 25px;}

.info_fix { bottom: 140px; right: 0px;}
.info_fix_links a.info_fix_default { border-bottom: 1px solid var(--ColorSub2);}

.info_fix_links a {  border-radius: 0; margin-bottom: 0;}
.info_fix_links a {background:var(--ColorMain2);opacity: 0.8;}
.info_fix_links a:hover { background: var(--ColorSub2); opacity: 1;}
.info_fix_links a:nth-of-type(even):hover { background: var(--ColorSub);}

.info_fix_links a span::before{width: 22px;  margin: auto;}

#to_top{background: var(--ColorMain); left: auto; right: 0 ; bottom: 110px; box-shadow: none; color: var(--ColorSub3); border-radius: 0; width: 50px; height: 50px;  opacity: 0.8;}
#to_top i.top {height: 16px;}
#to_top i.top:before, #to_top i.top:after {background: #fff;}

@keyframes move2{ 0%{transform: rotateY(0deg);} 100%{transform:  rotateY(360deg);}}

/**********************************************************************************************/
/*●●●●●●●●●●●●●●●●●●●●●●●●   大圖設定   ●●●●●●●●●●●●●●●●●●●●●●●●*/
/*○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○//*首頁大圖*/
.bannerindex { position:static; height:auto;}
.bannerindex .swiper-banner { position:static; margin:0; height:auto;} 
.bannerindex .swiper-slide img { height:auto;}

.bannerindex .swiper-slide a { display: block; position: relative; width: 100%; height: 100%;}

.bannerindex:before, .bannerindex:after,
.bannerindex .swiper-slide:before, .bannerindex .swiper-slide:after,
.bannerindex .swiper-slide a:before, .bannerindex .swiper-slide a:after {
	content: ""; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 50; pointer-events: none;
	background-size: contain; background-repeat: repeat-x; background-position-x: center;
}

.bannerindex .swiper-slide.swiper-slide-active:after    { animation: center_pop 3s ease;}/*小圖*/
.bannerindex .swiper-slide.swiper-slide-active:before   { animation: left_in 3s ease; }/*大標*/

.bannerindex .swiper-slide.swiper-slide-active:nth-child(1):after    { background-image: url(https://pic03.eapple.com.tw/darenmaterial/BNA2.png); }
.bannerindex .swiper-slide.swiper-slide-active:nth-child(1):before  { background-image: url(https://pic03.eapple.com.tw/darenmaterial/BNA1.png); }

.bannerindex .swiper-slide.swiper-slide-active:nth-child(2):after    { background-image: url(https://pic03.eapple.com.tw/darenmaterial/BNB2.png);}
.bannerindex .swiper-slide.swiper-slide-active:nth-child(2):before  { background-image: url(https://pic03.eapple.com.tw/darenmaterial/BNB1.png);  animation: right_in 3s ease;}

.bannerindex .swiper-slide.swiper-slide-active:nth-child(3):after    { background-image: url(https://pic03.eapple.com.tw/darenmaterial/BNC2.png); }
.bannerindex .swiper-slide.swiper-slide-active:nth-child(3):before  { background-image: url(https://pic03.eapple.com.tw/darenmaterial/BNC1.png); animation: op 3s ease;}
    
@keyframes down_in {
 0% { transform: translateY(10%); opacity: 0;  }
 20% { opacity: 0;}
 90% { transform: translateY(0); opacity: 1;}
 100% {opacity: 1;}
}
@keyframes up_in {
 0% { transform: translateY(-10%); opacity: 0;}
 20% { opacity: 0;}
 80% { transform: translateY(0);}
 100% {opacity: 1;}
}
@keyframes left_in {
 0% { transform: translateX(-10%); opacity: 0;}
 20% { opacity: 0;}
 80% { transform: translateX(0);}
 100% {opacity: 1;}
}
@keyframes right_in {
 0% { transform: translateX(10%); opacity: 0;}
 20% { opacity: 0;}
 80% { transform: translateX(0);}
 100% {opacity: 1;}
}
@keyframes center_pop {
  0% { opacity: 0; transform: scale(1, 0);}
50% { opacity: 1; transform: scale(1, 1);} 
100% { opacity: 1; transform: scale(1, 1);} 
}

@keyframes op {
 0% { opacity: 0;  transform: scale(1.5);}
 90% { opacity: 1; transform: scale(1);}
 100% {opacity: 1;}
}


/*切換圓點*/
.swiper-pagination-bullets.swiper-pagination-horizontal{display: none;}


/*○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○○//*內頁大圖*/
.banner{background-image: url(https://pic03.eapple.com.tw/darenmaterial/ban.jpg);background-repeat: repeat;background-size: cover;
        padding: 70px 50px 0;  height: 70px;  justify-content: flex-end;}
.banner h5 {color: #ffffff; display: flex; flex-direction: column; font-family: var(--ffsub2);}
.banner h5:before {content:'FUCHENG SCULPT';font-weight: normal; letter-spacing: 0; margin-bottom: -6px; font-size: 18px; color: var(--ColorMain);font-family: var(--ffsub);}

.banner.banblog h5:before {content:'ARTICLE';}
.banner.banE h5:before {content:'ALBUM';}

.projects_detaild_page .banner h5{  margin-top: 90px; font-size: 50px;}


@media screen and (max-width: 1024px) {
.bannerindex {background: var(--ColorMain);}
.banner h5 {}
}

@media screen and (max-width: 768px) {
.bannerindex {  padding: 0;}
.banner {  justify-content: space-evenly;}
.projects_detaild_page .banner h5 { margin-top: 65px;  font-size: 36px;}
}
@media screen and (max-width: 600px) {
.banner {  min-height: 200px;}
}


/*●●●●●●●●●●●●●●●●●●●●●●●●   header   ●●●●●●●●●●●●●●●●●●●●●●●●*/
