html,body{ overflow-x:hidden; }

/* wrapperbox */
.wrapper_box{ overflow:hidden; background-size:cover; background-attachment: fixed; background: linear-gradient(to right, #f6bfb8 0%,#f6bfb8 50%,#f6bfb8 100%);}
.bg_2601, .bg_2601 .wrapper {
    background: linear-gradient(to right, #f6bfb8 0%, #f6bfb8 50%, #f6bfb8 0%);
    background-color: #f6bfb8;
}

/* wrapper01 */
.wrapper{ 
    max-width:900px; margin:0 auto; position:relative; 
    background: linear-gradient(to right, #f6bfb8 0%,#f6bfb8 50%,#f6bfb8 100%);
}
.wrapper *{ font-family:'Noto Sans TC',sans-serif;}

@media screen and (max-width: 900px) {
	.wrapper{ max-width:100%;}
}

.TitleWordBox {
    font-size: 80px;
    font-weight: 900;
    line-height: 1.6;
    color: #10326b;
    text-align: center;margin-block: 30px;
    position: relative;
    z-index: 1;
}
.TitleWordBox span {
    display: block;
}
.TitleWordBox span::before {
    content: attr(data-storke);
    position: absolute;
    color: #000;
    -webkit-text-stroke: 0.16em #fff;
    text-stroke: 0.16em #fff;
    z-index: -1;
}


/* 療癒舒心系列-圖轉文 ======================================= */
.banners img{width: 100%;}
.Dis{position: relative;}
.Dis img{width: 100%;}
.Dis.tx01 .Pos01 {
    font-size: 33px;
    position: absolute;
    top: 82%;
    left: 0;right: 0;
    color: #7c4f24;
    font-weight: 900;
    text-align: center;
    width: 100%;
}
.Dis.tx02 .Pos01,
.Dis.tx03 .Pos01,
.Dis.tx04 .Pos01,
.Dis.tx05 .Pos01,
.Dis.tx08 .Pos01 {
    position: absolute;
    left: 0;right: 0;text-align: center;
    color: #b06956;
    font-weight: 900;
    text-shadow: 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 0 10px #fff, 0 5px 15px #ff0000;
}
.Dis.tx02 .Pos01{font-size: 50px;top: 2%;}
.Dis.tx03 .Pos01{font-size: 54px;top: 3.5%;}
.Dis.tx04 .Pos01{font-size: 48px;top: 4.5%;}
.Dis.tx05 .Pos01{font-size: 53px;top: 4.5%;}
.Dis.tx08 .Pos01{font-size: 58px;top: 8.5%;}
.Dis.tx02 .Note{
    position: absolute;left: 31%;text-align: center;
}
.Dis.tx02 .Pos02{
    top: 51.6%;
}
.Dis.tx02 .Pos03{
    top: 73.5%;
}
.Dis.tx02 .Note span{
    display: block;position: relative;z-index: 0;
    text-align: center;
    font-size: 42px;
    font-weight: 900;
    color: #b66957;
}
.Dis.tx02 .Note span::before{
    content: attr(data-storke);
    position: absolute;
    color: #000;
    -webkit-text-stroke: 6px #fff;
    text-stroke: 6px #fff;
    z-index: -1;
    text-shadow: 0px 0px 10px #ff0000;
}
.Dis.tx02 .general{position: absolute;left: 19%;text-align: left;font-weight: 600;font-size: 33px;color: #b66957;line-height: 1.7;}
.Dis.tx02 .general.ge01 {top: 57%;}
.Dis.tx02 .general.ge02 {top: 79.5%;}
.Dis.tx02 .general.ge03 {top: 85.5%;font-size: 25px;line-height: 1.5;}
.Dis.tx02 .general.ge04 {top: 92.2%;font-size: 17px;line-height: 1.3;}




.Dis.tx03 .Note{position: absolute;}
.Dis.tx03 .Pos02{top: 43%;left: 13.5%;}
.Dis.tx03 .Pos03{top: 43%;left: 42.5%;}
.Dis.tx03 .Pos04{top: 43%;left: 67.5%;}
.Dis.tx03 .Pos05{top: 70%;left: 14.5%;}
.Dis.tx03 .Pos06{top: 70%;left: 42.5%;}
.Dis.tx03 .Pos07{top: 70%;left: 65.5%;}
.Dis.tx03 .Note span{
    display: block;position: relative;z-index: 0;
    font-size: 20px;
    font-weight: 900;
    color: #b66957;
}
.Dis.tx03 .Note span::before{
    content: attr(data-storke);
    position: absolute;
    color: #000;
    -webkit-text-stroke: 5px #fff;
    text-stroke: 5px #fff;
    z-index: -1;
    text-shadow: 0px 3px 5px #652e1f;
}
.Dis.tx03 .general{position: absolute;left: 16%;text-align: left;font-weight: 600;font-size: 16px;color: #b66957;line-height: 1.2;top: 83%;}



.Dis.tx04 .Note{position: absolute;left: 40%;text-align: center;}
.Dis.tx04 .Pos02{top: 25%;}
.Dis.tx04 .Pos03{top: 59%;}
.Dis.tx04 .Note span{
    display: block;position: relative;z-index: 0;
    font-size: 29px;
    font-weight: 900;
    color: #7a4d29;
}
.Dis.tx04 .Note span::before{
    content: attr(data-storke);
    position: absolute;
    color: #000;
    -webkit-text-stroke: 5px #fff;
    text-stroke: 5px #fff;
    z-index: -1;
}
.Dis.tx04 .general{position: absolute;left: 40%;text-align: left;font-weight: 600;font-size: 29px;color: #7a4d29;line-height: 1.5;}
.Dis.tx04 .general.ge01{top: 34%;}
.Dis.tx04 .general.ge02{top: 69%;}
.Dis.tx04 .general.ge03{top: 90%;font-size: 17px;left: 0;right: 0;text-align: center;color: #b66957;}



.Dis.tx05 .Pos02{
	position: absolute;top:21%;
    left: 0;right: 0;text-align: center;
    color: #7a4c26;font-size: 28px;
    font-weight: 900;
}

.Dis.tx07 .Note{position: absolute;}
.Dis.tx07 .Pos02{top:4%;left: 38%;}
.Dis.tx07 .Pos03{top: 33%;left: 38%;}
.Dis.tx07 .Note.Pos04{top:63.5%;left: 22%;}
.Dis.tx07 .Note.Pos05{top:63.5%;left: 61%;}
.Dis.tx07 .Note span{
    display: block;position: relative;z-index: 0;
    font-size: 38px;
    font-weight: 900;
    color: #013282;
}
.Dis.tx07 .Note span::before{
    content: attr(data-storke);
    position: absolute;
    color: #000;
    -webkit-text-stroke: 0.15em #fff;
    text-stroke: 0.15em #fff;
    z-index: -1;
    text-shadow: 0 0 0.4em rgb(0 0 0 / 60%);
}
/* .Dis.tx07 .Note span::after{
    content: attr(data-storke);
    inset: 0;
    position: absolute;
    color: #000;
    -webkit-text-stroke: 16px #429de3;
    text-stroke: 16px #15519b;
    z-index: -2;
    text-shadow: 6px 8px 8px #000000;
} */
/* .Dis.tx07 .Pos02.Note span::after{
	-webkit-text-stroke: 16px #e898a3;
	text-stroke: 16px #e898a3;
} */
.Dis.tx07 .Pos04.Note span::before,
.Dis.tx07 .Pos05.Note span::before{
	-webkit-text-stroke: 0.15em #fff;
    text-stroke: 0.15em #fff;
}
/* .Dis.tx07 .Pos04.Note span::after{
	-webkit-text-stroke: 10px #dab56a;
    text-stroke: 10px #dab56a;
    text-shadow: 6px 8px 8px #000000;
}
.Dis.tx07 .Pos05.Note span::after{
	-webkit-text-stroke: 10px #51beef;
    text-stroke: 10px #51beef;
    text-shadow: 6px 8px 8px #000000;
} */

.Dis.tx07 .Note.Pos04-1{top:69%;left: 14%;}
.Dis.tx07 .Note.Pos05-1{top:69%;left: 60%;}
.Dis.tx07 .Note.Pos04-1 span,
.Dis.tx07 .Note.Pos05-1 span{
    font-size: 25px;font-style: italic;color: #fff;
}
.Dis.tx07 .Note.Pos04-1 span::before,
.Dis.tx07 .Note.Pos05-1 span::before {
    -webkit-text-stroke: 0.15em #013282;
    text-stroke: 0.15em #15519b;
}
/* .Dis.tx07 .Note.Pos04-1 span::after,.Dis.tx07 .Note.Pos05-1 span::after{content:none} */


@media only screen and (max-device-width: 939px), only screen and (max-width: 939px) {
    .TitleWordBox{font-size: 8vw;}
    .Dis.tx01 .Pos01 {font-size: 4vw;}
    .Dis.tx02 .Pos01 {font-size: 6vw;}
	.Dis.tx02 .Pos02 span,
	.Dis.tx02 .Pos03 span{font-size: 4.5vw;}
	.Dis.tx02 .Pos02{top: 52%;}
	.Dis.tx02 .Pos03{top: 74%;}
	.Dis.tx02 .Pos02 span::before,
	.Dis.tx02 .Pos03 span::before{
		-webkit-text-stroke: 0.8vw #fff;
    	text-stroke: 0.8vw #fff;
        text-shadow: 0px 0px 0.4em hsla(0, 100%, 50%, 0.3);
	}
    .Dis.tx02 .general{font-size: 3.5vw;}
    .Dis.tx02 .general.ge03{font-size: 2.8vw;}
    .Dis.tx02 .general.ge04{font-size: 1.86vw;}
	.Dis.tx03 .Pos01 {font-size: 6.5vw;top: 4%;}
	.Dis.tx03 .Note span{font-size: 2.6vw;}
	.Dis.tx03 .Note span::before{-webkit-text-stroke: 0.5vw #fff;text-stroke: 0.5vw #fff;}
    .Dis.tx03 .general{font-size: 1.8vw;}
    .Dis.tx04 .general.ge03{font-size: 1.8vw;}
	.Dis.tx04 .Pos01 {font-size: 6.3vw;}
	.Dis.tx04 .Note span{font-size: 3.7vw;}
    .Dis.tx04 .general{font-size: 3.4vw;}
	.Dis.tx05 .Pos01 {font-size: 7vw;}
	.Dis.tx05 .Pos02{font-size: 3.6vw;}
	.Dis.tx07 .Note span{font-size: 5vw;}
	.Dis.tx07 .Note.Pos04-1 span, .Dis.tx07 .Note.Pos05-1 span{font-size: 3.1vw;}
    .Dis.tx07 .Note span::before{text-shadow: 0 0 0.2em rgb(0 0 0 / 20%);}
	.Dis.tx08 .Pos01 {font-size: 7vw;}
}