body { background:#f9e7ce;}

.font-serif{ font-family: "Noto Serif TC", serif;}

.section-title{ font-weight: 600; font-size: 40px; line-height: 1.3; color: #640a11; }
.section-title span{ border-bottom: #640a11 solid 2px; display: inline-block; margin: 0 auto; }

.product-name{ text-align: left; margin-bottom: 20px;}
.product-name .subtitle{ color: #910c1d; font-size: 28px; font-weight: 700;}
.product-name .name{ color: #4b090a; font-size: 40px; font-weight: 700;}

.section-arena { }
.page-product-31 .section-arena { background: url("../images/arena/dye_202511.jpg") top center no-repeat; background-size: auto 100%;}
.page-product-32 .section-arena { background: url("../images/arena/dye_202605.jpg") top center no-repeat; background-size: auto 100%;}
.mobile .section-arena { background:none; }
.section-arena .arena{ }
.section-arena .arena .banner{ margin:0 auto; max-height: 500px; }
.section-arena .list{ margin-bottom: 30px;}
.section-arena .list .bg-1{ background: url("../images/arena/dye_202511.jpg") top center no-repeat; background-size: auto 100%;}
.section-arena .list .bg-2{ background: url("../images/arena/dye_202605.jpg") top center no-repeat; background-size: auto 100%;}
.section-arena .list .banner{ margin:0 auto; max-height: 500px; }
/*.section-arena .list .slick-dots{ z-index: 3; }*/

.section-showcase{ background-color: #f9e7ce; }
.section-showcase .container{ max-width:1000px; padding:70px 0;}
.section-showcase h2{ margin-bottom:50px;}
.section-showcase h2 img{ width:175px; margin:0 auto; }
.section-showcase .plist{ display: flex; flex-wrap: wrap; justify-content: space-between; }
.section-showcase .plist .item{ width:49%; background-color:#FFF; border:#e9d5ca solid 1px; border-radius:10px; overflow:hidden; text-align:left; padding:15px 0 15px 20px; position:relative;}
.desktop .section-showcase .plist .item:hover{ border:#910c1d solid 1px; box-shadow:rgba(204,204,204,0.9) 0 0 6px; }
.section-showcase .plist .item .info{ float:left; width:60%;}
.section-showcase .plist .item .info h4{ color:#910c1d; font-weight:500; margin-bottom:10px;}
.section-showcase .plist .item .info h5{ color:#910c1d; margin-bottom:5px; }
.section-showcase .plist .item .info p{ color:#313131; font-size:18px; padding-bottom:60px; text-align: justify; }
.section-showcase .plist .item .pic-box{ float:left; width:40%; padding: 0 10px;}
.section-showcase .plist .item .pic-box .pic{ /*width:175px;*/ width:145px; margin:0 auto;}
.section-showcase .plist .item .more{ position:absolute; width:150px; border:#000 solid 1px; background-color:#FFF; left:20px; bottom:20px; text-align:center; }
.section-showcase .plist .item .more span{ line-height:2; display:inline-block; color:#000; background:url(../images/ic_arr.png) right center no-repeat; background-size:18px auto; padding-right:18px; padding-left:5px;}
.desktop .section-showcase .plist .item:hover .more{ border:#910c1d solid 1px; background-color:#910c1d;}
.desktop .section-showcase .plist .item:hover .more span{ color:#FFF; background:url(../images/ic_arr_white.png) right center no-repeat; background-size:18px auto; padding-right:18px; padding-left:5px;}
.section-showcase .btn-watsons{ display:block; width:90%; max-width:500px; margin:20px auto;}
.desktop .section-showcase .btn-watsons:hover{ opacity:0.7;}


.section-about{ /*background:url(../images/bg-video.png) top center repeat-y;*/ background-color: #fff5e6; }
.section-about .container{ width:90%; max-width:1000px; padding:80px 0 50px 0; color:#5e0000;}
.section-about h2{ margin-bottom:50px;}
.section-about h2 img{ width:175px; margin:0 auto; }
.section-about h3{ margin-bottom:20px; text-align:left; background-color:#910c1d; color: #fff; border-radius:10px; padding:5px 0 5px 10px; }
.section-about h3 span{ background:url("../images/ic_dot_w.png") left center no-repeat; background-size:16px auto; padding-left:20px;}
.section-about p{ text-align:left; margin-bottom:50px; padding:0 30px;}
.section-about .all-products{ width: 600px; margin:0 auto;}


/*.section-video{ background:url(../images/bg-video.png) top center repeat-y; } 
.section-video .container{ max-width:1000px; padding:80px 0;}
.section-video h2{ margin-bottom:50px;}
.section-video h2 img{ width:175px; margin:0 auto; }
.section-video .info{ position:relative;}
.section-video .info p{ text-align:center; position:absolute; top:80px; right:10%; width:45%; line-height:2; padding:0 10px 0 15px; background:url(../images/video-underline.png); }
.section-video .info p .sign{ width:115px; position:absolute; bottom:-70px; right:0;}
.section-video .info .pic{ margin:0 auto 0 10%;}
.section-video h5{ text-align:center; font-size:24px; margin:10px auto 50px auto;}
.video-container {
	position:relative; 
	padding-bottom:52.6%;
	padding-top:30px;
	height:0;
	overflow:hidden;
	border:#FFF solid 0px;
}

.video-container iframe, .video-container object, .video-container embed {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}*/

.page-product-31 #content,
.page-product-32 #content{ background:#fbf2df url(../images/products/bg.png) top center no-repeat; /*background-size:100% auto;*/}


.section-product-info{ /*margin:90px 0 0 0;*/ padding: 90px 0 50px;}
.section-product-info .container{ width:90%; max-width:1200px;}
.section-product-info .product .pic-box{ float:left; width:45%; position:relative;}
.section-product-info .product .pic-box .pic{ width:80%; max-width:350px; margin:0 auto 0px auto;}
.page-product-32 .section-product-info .product .pic-box .pic{ width:80%; max-width:320px; margin:0 auto 0px auto;}
.section-product-info .product .pic-box .for{ width:75%; max-width:300px; margin:0 auto 10px auto;}
.section-product-info .product .pic-box .icon{ width:20%; max-width:100px; position:absolute; }

.page-product-31 .section-product-info .product .pic-box .icon{ top:-4%; left:20.5%; z-index:-1;}

.section-product-info .product .info-box{ float:left; width:55%;}
.section-product-info .product .info-box .title{ margin-bottom:20px;}
.section-product-info .product .info-box .desc{ margin-bottom:20px; word-break: break-all; text-align: justify;}
.section-product-info .product .info-box .for-p1{ margin-bottom:20px; width: 100%; max-width: 400px;}
.section-product-info .product .info-box .for{ height:48px; border:#000 solid 1px; border-radius:12px; margin-bottom:20px;}
.section-product-info .product .info-box .dot{ text-align: left; margin: 0 auto 20px 25px;  }
.section-product-info .product .info-box .dot li{ word-break: break-all; text-align: justify; list-style: initial;}
.section-product-info .product .info-box .btn-watsons{ display:block; margin-bottom:20px;}
.desktop .section-product-info .product .info-box .btn-watsons:hover{ opacity:0.7;}

.section-product-list{ background-color:#FFF; margin-top:50px;}
.section-product-list .container{ max-width:1000px; padding:10px 0;}
.section-product-list .all-list{ overflow:hidden;}
.section-product-list .all-list a{ float:left; display:block; width:25%; padding:20px 0;}
.section-product-list .all-list a .pic{}
.section-product-list .all-list a:hover .pic{ opacity:0.7;}

.section-faq{ background-color: #fff5e6; }
.section-faq .container{ width:90%; max-width:1000px; padding:80px 0;}
.section-faq h2{ margin-bottom:50px;}
.section-faq h2 img{ width:175px; margin:0 auto; }
.section-faq .faq-list{ text-align:left}
.section-faq .faq-list .faq-item{ padding:20px 0; border-bottom:#910c1d dotted 3px;}
.section-faq .faq-list .faq-item:last-child{ border-bottom:0;}
.section-faq .faq-list .faq-item .q{ color:#5e0000; font-weight: 500; background:url(../images/icon-Q-dry.png) left top no-repeat; background-size:auto 30px; padding-left:45px; margin-bottom:7px;}
.section-faq .faq-list .faq-item .a{ color:#313131; background:url(../images/icon-A-dry.png) left top no-repeat; background-size:auto 30px;padding-left:45px; }
.section-faq .faq-list .faq-item .watsons{ display:inline-block; width:200px; vertical-align:middle; margin:0 5px;}
.section-faq .faq-list .faq-item .inner-list{ display:table; margin-bottom:7px;}
.section-faq .faq-list .faq-item .inner-list .cell{ display:table-cell; }
.section-faq .faq-list .faq-item .inner-list .label{ text-align:center; padding-right:15px;}
.section-faq .faq-list .faq-item .inner-list .label span{ word-break:keep-all; color:#fff; background-color:#5e0000; border-radius:10px; display:inline-block; padding:0 20px;}
.section-faq .faq-list .faq-item .inner-list .txt{ }


.popon{ padding-bottom:10px; overflow:auto; position:relative;  }
.popon .pic{ vertical-align:top; margin:0 auto; width:100%; max-width:680px;}



.sec-block{ padding: 50px 0;}
.sec-block.bg-white{ background-color: #ffffff;}
.sec-block.bg-pink{ background-color: #faf4e8;}
.sec-block .container{ width: 90%; max-width: 1200px;}
.sec-block .container img{ width: 100%; height: auto;}
.sec-block .flex{ display: flex; justify-content: space-between;}
.sec-block .box{ width: 50%; }
.sec-block .flex.gap .box{ width: 49%; }
.sec-block .title{ color: #910c1d; font-size: 46px; font-weight: 900; line-height: 1.3; margin-bottom: 40px;}
.sec-block .subtitle{ color: #910c1d; font-size: 34px; font-weight: 900; line-height: 1.3; margin: 0 auto 20px;}
.sec-block .desc{ }

.for-pc{ display: block;}
span.for-pc{ display: inline;}
.for-mb{ display: none;}

.sec-01 figure:first-child{ margin-right: 60px;}
.sec-02 .container{ border-radius: 40px; overflow: hidden;}
.sec-05 .title{ width: 70%; max-width: 400px; margin: 0 auto 30px;}



.sec-p32-01 .container{ background-color: #000; color: #fff;  border-radius: 40px; /*max-width: 1100px;*/}
.sec-p32-01 .box{ position: relative;}
.sec-p32-01 .box.doctor{ background: url("../images/products/dye/p32/doctor_bg.jpg") 50% 50% no-repeat; background-size: cover; border-top-left-radius: 40px; border-bottom-left-radius: 40px; display: flex; flex-direction: column; justify-content: flex-end;}
.sec-p32-01 .box .pic{ border-top-left-radius: 40px; border-bottom-left-radius: 40px; }
.sec-p32-01 .box .pd{ position: absolute; width: 30%; bottom: -30px; right: -13%; z-index: 2;}
.sec-p32-01 .box.box-text{ display: flex; flex-direction: column; justify-content: center; padding: 20px 0; }
.sec-p32-01 .box.box-text .title{ margin-bottom: 50px;}
.sec-p32-01 .box.box-text .title span{ display: block; color: #fef574;}
.sec-p32-01 .box.box-text blockquote{ width: 75%; margin: 0 auto 50px; padding: 30px 0; text-align: justify; border-top: #fff solid 1px; border-bottom: #fff solid 1px; position: relative;}
.sec-p32-01 .box.box-text blockquote::before,
.sec-p32-01 .box.box-text blockquote::after{ content: ''; width: 50px; height: 30px; background: #000 url("../images/products/dye/p32/ic_blockquote.png") 0% 50% no-repeat; background-size: 30px auto; position: absolute; border: #fff solid 0px;}
.sec-p32-01 .box.box-text blockquote::before{ top: -15px; left: 0px;}
.sec-p32-01 .box.box-text blockquote::after{ bottom: -15px; right: 0px; transform: rotate(180deg);}
.sec-p32-01 .box.box-text .signature{ width: 60%; max-width: 300px; margin: 0 auto; position: relative; z-index: 1;}

.sec-p32-02{ background: url("../images/products/dye/p32/bg-02.jpg"); background-size: cover;}
.sec-p32-02 .container{ /*max-width: 1100px;*/}
.sec-p32-02 .box:nth-child(1){ display: flex; flex-direction: column; justify-content: center; padding: 40px 20px; border: #f9cd7f solid 2px; border-radius: 20px; background: rgba(255,255,255,0.6);}
.sec-p32-02 .box:nth-child(2){ display: flex; flex-direction: column; justify-content: center; }
.sec-p32-02 .box:nth-child(2) ul{ width: 90%; max-width: 480px; margin: 0 auto;}
.sec-p32-02 .box:nth-child(2) ul li{ background: linear-gradient(to bottom, #e0b361 0%,#d2834b 100%); border-radius: 20px; color: #fff; padding: 15px 30% 15px 30px; text-align: left; position: relative; line-height: 1.3;}
.sec-p32-02 .box:nth-child(2) ul li + li{ margin-top: 20px; }
.sec-p32-02 .box:nth-child(2) ul li .pic{ position: absolute; right: -25px; width: 30%; z-index: 3;}
.sec-p32-02 .box:nth-child(2) ul li span{ font-size: 16px; }
.sec-p32-02 .box:nth-child(2) ul li:nth-child(1) .pic{ top: 25%; }
.sec-p32-02 .box:nth-child(2) ul li:nth-child(2) .pic{ top: 55%; }

.sec-p32-03{ }
.sec-p32-03 .container{ /*max-width: 1100px;*/}
.sec-p32-03 .desc{ margin-bottom: 40px; }

.sec-p32-04{ }
.sec-p32-04 .container{ /*max-width: 1100px;*/}
.sec-p32-04 .subtitle{ position: relative; width: 90%; max-width: 600px; margin-top: 30px;}
.sec-p32-04 .subtitle::before{ background: #cb9119; content: ''; top: 49%; left: 0; width: 100%; height: 2px; position: absolute; z-index: 1;}
.sec-p32-04 .subtitle span{ color: #cb9119; background-color: #fff; padding: 0 20px; position: relative; z-index: 2;}

.sec-p32-05 .title{ margin-bottom: 20px; }
.sec-p32-05 .flex{ }
.sec-p32-05 .flex .pic{ width: 90%; max-width: 90%; margin: 0 auto;}
.sec-p32-05 .flex .pic.for-pc{ margin-top: -20px; margin-bottom: 30px;}
.sec-p32-05 .flex .pic.for-mb{ }
.sec-p32-05 .flex .desc{ margin-bottom: 30px;  }

.sec-p32-06 .container{ /*max-width: 1100px;*/}

.sec-p32-07 .container{ max-width: 1100px;}
.sec-p32-07 .box{ background-color: #fff; border-radius: 20px; overflow: hidden;}
.sec-p32-07 .box:nth-child(1){ border: #f6cb3f solid 2px; }
.sec-p32-07 .box:nth-child(1) .label{ background-color: #f6cb3f; }
.sec-p32-07 .box:nth-child(2){ border: #f48634 solid 2px; }
.sec-p32-07 .box:nth-child(2) .label{ background-color: #f48634; color: #fff; }
.sec-p32-07 .box .label{ padding: 10px 0; margin-bottom: 30px; letter-spacing: 2px;}
.sec-p32-07 .box .desc{ width: 90%; max-width: 330px; margin: 0 auto 30px;}
.sec-p32-07 .box .pic{ width: 50%; max-width: 200px; margin: 0 auto 10px;}

.sec-p32-08{ background-color: #f7f7f5; }
.sec-p32-08 .box:nth-child(2){ display: flex; flex-direction: column; justify-content: flex-end;}
.sec-p32-08 .desc{ margin-bottom: 20px; }
.sec-p32-08 .note{ color: #979797; font-size: 15px; }
.sec-p32-08 .note a{ color: #979797; }

/*	RESPONSIVE:  */
@media only screen and (max-width:1160px) {
/*.section-video .info{ }
.section-video .info p{ position:relative; top:auto; right:auto; line-height:2; width:90%; margin:0 auto; }
.section-video .info p br{ display:none;}
.section-video .info p .sign{ position:absolute; bottom:-35px; right:0;}
.section-video .info .pic{ margin:50px auto 0 40px; width:210px;}*/




.section-product-list .all-list{ max-width:500px; margin:0 auto;}
.section-product-list .all-list a{ width:50%; }
	

.sec-block .title{ font-size: 34px; margin-bottom: 30px; }
.sec-block .subtitle{ font-size: 26px; }

}


/*	RESPONSIVE:  */
@media only screen and (max-width:767px){
	
.section-product-info{ padding: 30px 0;}
.section-product-info .container{ max-width:500px;}
.section-product-info .product .pic-box{ width:100%; margin-bottom: 20px;}
.section-product-info .product .info-box{ width:100%;}
	
.section-showcase .plist{ display:block; border-spacing:0; width:95%; max-width:500px; margin:0 auto;}
.section-showcase .plist .item{ display:block; width:100%; padding:15px 0 15px 15px; margin-bottom:20px;}
.section-showcase .plist .item .more{ left:15px; bottom:20px; text-align:center; }

.product-name{ }
.product-name .subtitle{ font-size: 24px; }
.product-name .name{ font-size: 34px; }

.for-pc{ display: none;}
span.for-pc{ display: none;}	
.for-mb{ display: block;}


.section-arena .arena .banner{ max-height: 1000px; }
	
.sec-block .container{ max-width: 500px;}
.sec-block .flex{ display: block;}	
.sec-block .box{ width: 100%; }
.sec-block .flex.gap .box{ width: 100%; }
.sec-block .title{ font-size: 32px; margin-bottom: 30px; }
.sec-block .subtitle{ font-size: 24px; }

	
.sec-01 figure:first-child{ margin-right: 0; margin-bottom: 30px;}
.sec-01.sec-block{ padding-bottom: 0;}
.sec-02 .container{ border-radius: 30px; }
.sec-03.sec-block{ padding-top: 0;}
.sec-04 .container{ width: 98%;}
.sec-05 figure:first-child{ margin-bottom: 30px;}
.sec-06 figure:first-child{ margin-bottom: 30px;}
.sec-07 .container{ width: 100%;}
.sec-07.sec-block{ padding-top: 0;}
	
	
.sec-p32-01 .container{ border-radius: 20px; }
.sec-p32-01 .box.doctor{ background: none; border-top-right-radius: 20px;}	
.sec-p32-01 .box .pic{ border-top-left-radius: 20px; border-top-right-radius: 20px; border-bottom-left-radius: 0;}
.sec-p32-01 .box .pd{ width: 22%; bottom: -15px; right: 7%;}
.sec-p32-01 .box.box-text{ padding: 30px 0; }
.sec-p32-01 .box.box-text .title{ margin-bottom: 30px;}
.sec-p32-01 .box.box-text blockquote{ margin: 0 auto 30px; }
.sec-p32-01 .box.box-text .signature{ width: 200px; }

.sec-p32-02{ }
.sec-p32-02 .box:nth-child(1){ margin-bottom: 30px; padding: 30px 0;}
.sec-p32-02 .box:nth-child(2) ul{ }
.sec-p32-02 .box:nth-child(2) ul li{ padding: 15px 25% 15px 20px; }
.sec-p32-02 .box:nth-child(2) ul li .pic{ right: -25px; width: 33%; }
.sec-p32-02 .box:nth-child(2) ul li:nth-child(1) .pic{ top: 45%; }
.sec-p32-02 .box:nth-child(2) ul li:nth-child(2) .pic{ top: 55%; }

.sec-p32-03{ }
.sec-p32-03 .desc{ margin-bottom: 30px; }
.sec-p32-03 .flex.gap .box{ width: 90%; margin: 0 auto 30px;}
.sec-p32-03 .flex.gap .box + .box{ margin: 0 auto;}

.sec-p32-04{ }
.sec-p32-04 .for-mb{ margin-bottom: 30px;}

.sec-p32-05 .flex{ }
.sec-p32-05 .flex .pic{ width: 100%; margin: 0 auto 50px;}
.sec-p32-05 .flex .pic.for-mb{ margin-bottom: 0; }
	
.sec-p32-06 .box:nth-child(1){ margin-bottom: 50px;}
.sec-p32-06 .flex.gap .box{ width: 90%; margin: 0 auto 30px;}
.sec-p32-06 .flex.gap .box + .box{ margin: 0 auto;}

.sec-p32-07{ }
.sec-p32-07 .flex.gap .box{ width: 90%; margin: 0 auto 30px;}
.sec-p32-07 .flex.gap .box + .box{ margin: 0 auto;}
.sec-p32-07 .box .pic{ width: 150px; }

.sec-p32-08{ }
.sec-p32-08 .box:nth-child(1){ margin-bottom: 30px;}
}



/*	RESPONSIVE:  */
@media only screen and (max-width:480px) {
body{ font-size:18px;}
h1{ font-size:28px; }
h2{ font-size:26px; }
h3{ font-size:22px; }
h4{ font-size:20px; }
h5{ font-size:18px; }

.section-showcase .plist .item .pic-box .pic{ margin: 0 auto;}

/*
.section-video .info p{ background:url(../images/video-underline.png); background-size:36px auto;}
.section-video h5{ font-size:18px;}
*/


.section-faq .faq-list .faq-item .inner-list{ display:block; }
.section-faq .faq-list .faq-item .inner-list .cell{ display:block; }
.section-faq .faq-list .faq-item .inner-list .label{ text-align:left; padding-right:0px;}


}