body{margin: 0;}
/*Animations*/
[data-animate-in] { opacity: 0; transition: transform 0.8s ease, opacity 0.8s ease;}
[data-animate-in="up"] { transform: translate3d(0, 10%, 0);}/*由下往上*/
[data-animate-in="left"] { transform: translate3d(-5%, 0, 0);}/*由左往右*/
[data-animate-in="right"] { transform: translate3d(5%, 0, 0);}/*由右往左*/
[data-animate-in="down"] { transform: translate3d(0, -10%, 0);}/*由上往下*/
[data-animate-in="fadeIn"] { transform: translate3d(0, 0, 0);}/*淡入*/
[data-animate-in="scaleIn"] {transform: scale(.7);}/*放大淡入*/
[data-animate-in].in-view { opacity: 1; transform:translate3d(0,0,0); -webkit-transform:translate3d(0,0,0); transition: transform 0.6s ease, opacity 0.6s ease;}
.fade-in { opacity: 0; transition: opacity 1s ease; }

/*模組設定*/

/*keyword*/
.tag_label{position: absolute;}
.tag_label h2,.tag_label h3,.tag_label h4,.tag_label h5,.tag_label h6{
   font-size: 0px;
   margin: 0;
   padding: 0;
   opacity: 0;
   display: inline-block;
}

/*統一設定*/
.all * {box-sizing:border-box; max-width:100%;word-break: normal;}
.all {
  max-width: 2000px;
  width:100%;
  margin: 0 auto;
  overflow:hidden;
  /* background-color: #FFFFFF; */
  background: url(../img/all_bg.jpg) top center repeat;
  position: relative;
  z-index: 2;
  font-family: "Noto Sans TC", sans-serif;
  font-size: var(--f17);
  color: #444444;
}
.all img{width:auto; max-width:100%;vertical-align: middle;}
.all a{text-decoration:none;transition: .5s ease;}

.all li{list-style:none;}
.all ol{padding: 0;}
.all h6,.all h5,.all h4,.all h3,.all h2,.all figure,.all p{margin: 0;}
.all section{overflow: initial;}

/* font size */
.all{
   --f50:50px;
   --f34:34px;
   --f30:30px;
   --f24:24px;
   --f20:20px;
   --f18:18px;
   --f17:17px;
   --f15:15px;
   --f14:14px;
   --f12:12px;
}
@media screen and (max-width:768px) {
.all{
   --f50:48px;
   --f34:32px;
   --f30:28px;
   --f24:22px;
   --f20:18px;
   --f18:16px;
   --f17:15px;
   --f15:14px;
   --f14:13px;
}
}
@media screen and (max-width:600px) {
.all{
   --f50:46px;
   --f34:30px;
   --f30:26px;
   --f24:20px;
}
}
@media screen and (max-width:380px) {
.all{
   --f50:44px;
   --f34:28px;
   --f30:24px;
}
}
@media screen and (max-width:355px) {
.all{
   --f50:42px;
   --f34:25px;
   --f30:22px;
}
}

/* animation */
@keyframes leaf_bg{
0% {transform: rotate(-2deg);}
50% {transform: rotate(2deg);}
100% {transform: rotate(-2deg);}
}

/* all style */
.ginn_title_01{
   font-family: "Josefin Sans", sans-serif;
   font-size: var(--f15);
   font-weight: 300;
   color: #AC855E;
}
.ginn_title_02{
   font-family: "Noto Serif TC", serif;
   font-size: var(--f34);
   font-weight: 400;
   line-height: 150%;
   letter-spacing: 0.12em;
}
.ginn_title_03{
   font-family: "Noto Serif TC", serif;
   font-size: var(--f17);
   font-weight: 400;
   letter-spacing: 0.12em;
}
.ginn_title_04{
   font-family: "Noto Serif TC", serif;
   font-size: var(--f20);
   font-weight: 400;
   letter-spacing: 0.07em;
}
.ginn_title_04 b{
   font-size: var(--f30);
   font-weight: 400;
   letter-spacing: 0.12em;
   padding-right: 5px;
}
.ginn_text{
   font-weight: 400;
   letter-spacing: 0.25em;
   line-height: 200%;
}
.link_button{
   display: flex;
   align-items: center;
   justify-content: space-between;
   max-width: 160px;
   padding-bottom: 10px;
   position: relative;
   overflow: hidden;
   font-size: var(--f14);
   font-weight: 400;
   letter-spacing: 0.2em;
   color: #545454;
}
.link_button:hover{
   color: #111111;
}
.link_button::before{
   content: '';
   display: block;
   width: 300%;
   min-height: 1px;
   background: linear-gradient(to left,#CCCCCC,#CCCCCC 33%,transparent 33%,transparent 66%,#444444 66%,#444444);
   position: absolute;
   bottom: 0;
   right: 0;
   transition: 1s ease;
}
.link_button:hover::before{
   right: -200%;
}
.link_button u{
   text-decoration: none;
}
.link_button i{
   display: flex;
   align-items: center;
   justify-content: center;
   max-width: 10px;
   width: 100%;
   min-height: 10px;
   position: relative;
}
.link_button i::before,.link_button i::after{
   content: '';
   display: block;
   width: 100%;
   min-height: 1px;
   background: #444444;
   position: absolute;
   transition: .5s ease;
}
.link_button i::after{
   transform: rotate(90deg);
}
.link_button:hover i::before,.link_button:hover i::after{
   background: #111111;
}

/* index */
.index_01{
   display: flex;
   align-items: center;
   justify-content: space-between;
   flex-flow: row-reverse;
   padding: 100px 0;
   position: relative;
}
.index_01 section{
   max-width: 670px;
   width: 100%;
   padding: 0 20px;
   position: relative;
   z-index: 1;
}
.index_01 section::after{
   content: '';
   display: block;
   background: url(../img/index_bg01.png) no-repeat;
   width: 439px;
   height: 602px;
   animation: leaf_bg 5s infinite;
   transform-origin: top right;
   position: absolute;
   z-index: -1;
   right: -15px;
   bottom: 0;
}
.index_01 p{
   padding: 50px 0 70px;
}
.index_01 span{
   display: block;
   padding-top: 20px;
}
.index_01 > figure img{
   min-height: 950px;
   object-fit: cover;
}
.index_01 figure{
   max-width: 1200px;
   width: 100%;
}
.index_02{
   padding: 0 5%;
   position: relative;
}
.index_02 section{
   max-width: 1200px;
   margin: 0 auto;
   padding: 200px 0 100px;
}
.index_02 h5{
   padding: 5px 0 35px;
}
.index_02 h4 br{
   display: none;
}
.index_02 p{
   max-width: 620px;
   padding-top: 10px;
   font-size: var(--f15);
}
.index_02 figure{
   max-width: 650px;
   width: 100%;
   position: absolute;
   right: 0;
   top: -200px;
   /* bottom: -600px; */
}
.index_03{
   padding: 0 5%;
}
.index_03 ul{
   max-width: 1680px;
   margin: 0 auto;
   padding: 0 0 170px;
   position: relative;
   z-index: 1;
}
.index_03 ul:nth-of-type(1)::after{
   content: '';
   display: block;
   background: url(../img/index_bg02.png) no-repeat;
   width: 478px;
   height: 913px;
   animation: leaf_bg 3s infinite;
   transform-origin: left center;
   position: absolute;
   z-index: -1;
   left: -120px;
   top: 100px;
}
.index_03 ul+ul{
   padding-top: 100px;
   border-top: 1px solid #DDDDDD;
}
.index_03 li{
   display: flex;
   align-items: flex-start;
   justify-content: space-between;
   max-width: 1440px;
}
.index_03 ul:nth-of-type(odd) li{
   flex-flow: row-reverse;
}
.index_03 ul:nth-of-type(even) li{
   margin: 0 0 0 auto;
}
.index_03 div{
   max-width: 1000px;
   width: 100%;
   position: relative;
}
.index_03 figure:nth-of-type(2){
   max-width: calc(400px + 10%);
   width: 100%;
   padding: 5%;
   background: url(../img/all_bg.jpg) repeat;
   position: absolute;
   bottom: -135px;
}
.index_03 ul:nth-of-type(odd) figure:nth-of-type(2){
   right: -220px;
}
.index_03 ul:nth-of-type(even) figure:nth-of-type(2){
   left: -220px;
}
.index_03 section{
   position: relative;
   z-index: 10;
   padding-top: 100px;
}
.index_03 ul:nth-of-type(odd) section{
   text-align: right;
}
.index_03 p{
   padding: 40px 0 30px;
}
.index_03 a{
   max-width: 120px;
}
.index_03 ul:nth-of-type(odd) a{
   margin: 0 0 0 auto;
}
.index_04{
   padding: 0 50px;
}
.index_04 ul{
   max-width: 1900px;
   margin: 0 auto;
   padding: 100px 0;
}
.index_04 li{
   display: flex;
   align-items: center;
   justify-content: space-between;
   flex-flow: row-reverse;
   max-width: 1550px;
}
.index_04 section{
   max-width: 355px;
   width: 100%;
   padding-left: 20px;
}
.index_04 p{
   font-size: var(--f15);
}
.index_04 span{
   display: block;
   padding-top: 30px;
}
.index_04 figure{
   max-width: 1030px;
   width: 100%;
}
.index_04 figure img{
   min-height: 500px;
   object-fit: cover;
}
.index_05{
   display: flex;
   align-items: center;
   justify-content: center;
   background: url(../img/index_bg03.jpg) center no-repeat fixed;
   min-height: 1000px;
   padding: 0 5%;
}
.index_05 section{
   color: #FFFFFF;
   text-align: center;
}
.index_05 h6{
   font-size: var(--f20);
   font-weight: 700;
   letter-spacing: 0.07em;
   padding-bottom: 10px;
}
.index_05 h5{
   font-family: "Josefin Sans", sans-serif;
   font-size: var(--f18);
   font-weight: 400;
   letter-spacing: 0.07em;
}
.index_05 h5::after{
   content: '';
   display: block;
   width: 1px;
   min-height: 30px;
   background: #FFFFFF;
   margin: 40px auto;
}
.index_05 p{
   display: flex;
   align-items: center;
   font-family: "Zen Old Mincho", serif;
   font-size: var(--f30);
   font-weight: 400;
   letter-spacing: 0.5em;
}
.index_05 span{
   font-family: "Noto Sans TC", sans-serif;
   font-size: var(--f20);
   font-weight: 400;
   padding: 0 15px;
}
.index_06{
   overflow: hidden;
   padding: 0 5%;
}
.index_06 section{
   max-width: 1200px;
   margin: 0 auto;
   padding: 120px 0;
   position: relative;
   z-index: 1;
}
.index_06 section::before{
   content: '';
   display: block;
   background: url(../img/index_bg04.png) no-repeat;
   width: 848px;
   height: 1296px;
   position: absolute;
   top: -300px;
   left: -400px;
   z-index: -1;
   animation: leaf_bg 3s infinite;
   transform-origin: top left;
}
.index_06 section::after{
   content: '';
   display: block;
   background: url(../img/index_bg05.png) no-repeat;
   width: 788px;
   height: 666px;
   position: absolute;
   top: -200px;
   right: -400px;
   z-index: -1;
   animation: leaf_bg 3s infinite;
   transform-origin: top right;
}
.index_06 h6{
   text-align: center;
}
.index_06 h5{
   padding-top: 10px;
   text-align: center;
}
.index_06 figure{
   display: grid;
   grid-template-columns: repeat(3,1fr);
   gap: 45px;
   padding-top: 80px;
}
.index_06 a{
   display: block;
   position: relative;
   overflow: hidden;
}
.index_06 a > img{
   transition: .5s ease;
}
.index_06 a:hover img{
   transform: scale(1.1);
}
.index_06 div{
   width: 100%;
   padding: 40px;
   position: absolute;
   left: 0;
   bottom: 0;
   color: #FFFFFF;
}
.index_06 dl{
   display: flex;
   align-items: flex-end;
   margin: 0;
}
.index_06 dt{
   font-family: "Noto Serif TC", serif;
   font-size: var(--f30);
   font-weight: 400;
   letter-spacing: 0.12em;
   line-height: 1;
   writing-mode: vertical-rl;
}
.index_06 dd{
   font-size: var(--f12);
   font-weight: 400;
   letter-spacing: 0.07em;
   margin: 0;
   padding-left: 5px;
}
.index_06 p{
   padding: 20px 0;
   letter-spacing: 0.25em;
   line-height: 160%;
}
.index_06 span{
   display: flex;
   align-items: center;
   justify-content: space-between;
   max-width: 130px;
   padding-bottom: 10px;
   position: relative;
   overflow: hidden;
   font-size: var(--f14);
   font-weight: 400;
   letter-spacing: 0.2em;
   color: #FFFFFF;
}
.index_06 span::before{
   content: '';
   display: block;
   width: 300%;
   min-height: 1px;
   background: linear-gradient(to left,#CCCCCC,#CCCCCC 33%,transparent 33%,transparent 66%,#FFFFFF 66%,#FFFFFF);
   position: absolute;
   bottom: 0;
   right: 0;
   transition: 1s ease;
}
.index_06 a:hover span::before{
   right: -200%;
}
.index_06 u{
   text-decoration: none;
}
.index_06 i{
   display: flex;
   align-items: center;
   justify-content: center;
   max-width: 10px;
   width: 100%;
   min-height: 10px;
   position: relative;
}
.index_06 i::before,.index_06 i::after{
   content: '';
   display: block;
   width: 100%;
   min-height: 1px;
   background: #FFFFFF;
   position: absolute;
   transition: .5s ease;
}
.index_06 i::after{
   transform: rotate(90deg);
}
@media screen and (max-width:1440px) {
.index_01{align-items: stretch;}
.index_01 section{max-width: 450px;padding-top: 100px;}
.index_01 section figure{bottom: -200px;width: calc(100% - 20px);}
.index_01 > figure img{min-height: 800px;}
.index_02 section{padding-top: 50px;}
.index_02 figure{max-width: 430px;top: -150px;}
.index_03 div{max-width: 800px;}
.index_03 figure:nth-of-type(2){max-width: calc(300px + 5%);padding: 2.5%;bottom: -80px;}
.index_03 ul:nth-of-type(odd) figure:nth-of-type(2){right: -5%;}
.index_03 ul:nth-of-type(even) figure:nth-of-type(2) {left: -5%;}
.index_05{min-height: 65vw;}
}
@media screen and (max-width:1200px) {
.index_03 ul{padding-bottom: 140px;}
.index_03 ul:nth-of-type(n) li{flex-flow: wrap;justify-content: center;}
.index_03 div{max-width: 1000px;}
.index_03 section{padding: 0 0 50px;}
.index_03 ul:nth-of-type(n) section{text-align: center;}
.index_03 ul:nth-of-type(n) a{margin: 0 auto;}
.index_03 p{padding: 30px 0;}
}
@media screen and (max-width:1024px) {
.index_01{flex-flow: wrap;justify-content: center;}
.index_01 section{max-width: 690px;padding: 0 20px 50px;}
.index_01 section::after{right: -27%;bottom: auto;top: -100px;}
.index_01 section figure{position: initial;padding: 50px 0;}
.index_01 > figure img{min-height: auto;}
.index_02{display: flex;align-items: center;justify-content: space-between;}
.index_02 section{padding: 0 20px 0 0;margin: 0;}
.index_02 figure{position: initial;max-width: 400px;width: calc(100% - 380px);}
.index_03 ul{padding: 100px 0;}
.index_06 section{padding: 100px 0;}
.index_06 section::before{background-size: contain;width: 45vw;height: 38vw;left: -7%;top: 0;}
.index_06 section::after{background-size: contain;width: 25vw;height: 40vw;right: -7%;top: -5vw;}
.index_06 figure{gap: 20px;padding-top: 50px;}
.index_06 div{padding: 20px;}
}
@media screen and (max-width:850px) {
.index_02{flex-flow: wrap;justify-content: center;}
.index_02 section{padding: 0 0 30px;}
.index_02 figure{max-width: 650px;width: 100%;}
.index_03 ul:nth-of-type(odd) div figure:nth-of-type(1){padding-right: 5%;}
.index_03 ul:nth-of-type(even) div figure:nth-of-type(1){padding-left: 5%;}
.index_03 figure:nth-of-type(2){max-width: 35vw;}
.index_06 figure{grid-template-columns: repeat(2,1fr);}
}
@media screen and (max-width:768px) {
.index_01,.index_03 ul:nth-of-type(n),.index_05 section{padding: 80px 0;}
.index_01 section::after {right: -10%;top: -100px;width: 40vw;height: 51vw;background-size: contain;animation-duration: 3s;}
.index_01 p{padding: 0 0 50px;}
.index_03 figure:nth-of-type(2){bottom: -50px;}
.index_04{padding: 0;}
.index_04 ul{padding: 0;}
.index_04 li{flex-flow: wrap;justify-content: center;}
.index_04 section{padding: 50px 20px;max-width: 700px;}
.index_04 figure img{min-height: auto;}
.index_05{min-height: auto;}
.index_05 h5::after{margin: 20px auto;}
.index_05 p{flex-flow: wrap;justify-content: center;}
.index_05 span{display: block;width: 100%;padding: 5px 0;letter-spacing: normal;}
.index_06 section::after{width: 45vw;}
.index_06 section::before{width: 35vw;height: 55vw;}
}
@media screen and (max-width:600px) {
.index_01,.index_03 ul:nth-of-type(n),.index_05 section,.index_06 section{padding: 50px 0;}
.index_01 p{padding-bottom: 30px;}
.index_02 h5{padding-bottom: 20px;}
.index_03 ul:nth-of-type(1)::after{left: -7%;}
.index_03 ul:nth-of-type(n) section{padding-bottom: 30px;}
.index_03 p{padding: 20px 0;}
.index_04 span{padding-top: 20px;}
.index_06 figure{padding-top: 20px;}
}
@media screen and (max-width:500px) {
.index_06 h5{max-width: 300px;margin: 0 auto;}
.index_06 figure{grid-template-columns: 1fr;max-width: 370px;margin: 0 auto;}
}
@media screen and (max-width:450px) {
.index_02 h4 br{display: block;}
}

/* about */
.ab_01{
   padding: 0 5%;
}
.ab_01 ul{
   max-width: 1680px;
   margin: 0 auto;
   padding: 150px 0 0;
}
.ab_01 li{
   display: flex;
   align-items: center;
   justify-content: space-between;
   flex-flow: row-reverse;
   max-width: 1440px;
}
.ab_01 section{
   max-width: 515px;
   width: 100%;
   position: relative;
   padding-left: 20px;
}
.ab_01 h4{
   padding: 10px 0 30px;
}
.ab_01 p{
   font-size: var(--f15);
}
.ab_01 > figure{
   position: absolute;
   top: 50px;
   right: 50px;
}
.ab_02{
   background: url(../img/ab_bg02.jpg) center no-repeat fixed;
   min-height: 800px;
   margin-top: -150px;
}
.ab_03{
   padding: 100px 0;
}
.ab_03 section{
   display: flex;
   align-items: stretch;
   justify-content: space-between;
   max-width: 1840px;
   width: calc(100% - 50px);
   margin: 0 0 0 auto;
}
.ab_03 section+section ul{
   border-top: 1px solid #DEDEDE;
}
.ab_03 ul{
   max-width: 840px;
   width: 100%;
   margin: 0;
   padding: 0 20px;
   display: flex;
   align-items: center;
   justify-content: flex-end;
}
.ab_03 li{
   max-width: 600px;
   width: 100%;
}
.ab_03 h6{
   font-family: "Noto Serif TC", serif;
   font-size: var(--f50);
   font-weight: 400;
   letter-spacing: 0.16em;
   padding-bottom: 20px;
}
.ab_03 span{
   font-family: "Josefin Sans", sans-serif;
   font-size: var(--f15);
   font-weight: 300;
   color: #AC855E;
   letter-spacing: normal;
}
.ab_03 p{
   max-width: 320px;
   font-family: "Noto Serif TC", serif;
   font-weight: 400;
   letter-spacing: 0.12em;
   line-height: 200%;
}
.ab_03 figure{
   max-width: 1000px;
   width: 100%;
}
.ab_04{
   padding: 0 5%;
}
.ab_04 section{
   display: flex;
   align-items: center;
   justify-content: space-between;
   flex-flow: row-reverse;
   max-width: 1680px;
   margin: 0 auto;
   padding-bottom: 100px;
}
.ab_04 div{
   max-width: 510px;
   width: 100%;
   padding-left: 20px;
}
.ab_04 dl{
   display: flex;
   align-items: flex-end;
   margin: 0;
}
.ab_04 dt{
   font-family: "Noto Serif TC", serif;
   font-size: var(--f50);
   font-weight: 400;
   writing-mode: vertical-rl;
   letter-spacing: 0.16em;
   line-height: 1;
}
.ab_04 dd{
   margin: 0;
   font-family: "Josefin Sans", sans-serif;
   font-size: var(--f15);
   font-weight: 300;
   color: #AC855E;
   padding: 0 0 10px 10px;
}
.ab_04 p{
   font-family: "Noto Serif TC", serif;
   font-weight: 400;
   line-height: 200%;
   letter-spacing: 0.12em;
   padding-top: 40px;
}
@media screen and (max-width:1440px) {
.ab_01 section{max-width: 455px;}
.ab_01 > figure{right: 20px;max-width: fit-content;width: 35%;}
.ab_02{min-height: 50vw;background-size: cover;}
.ab_03 ul{max-width: 400px;}
.ab_03 li{max-width: 300px;}
.ab_04 div{max-width: 350px;}
}
@media screen and (max-width:1200px) {
.ab_02{margin-top: -100px;}
.ab_03 ul{max-width: 350px;}
}
@media screen and (max-width:1024px) {
.ab_01 ul{padding-top: 100px;}
.ab_01 li{flex-flow: wrap;justify-content: center;}
.ab_01 > figure{width: 40%;top: 20px;right: 10px;}
.ab_01 section{max-width: 800px;padding: 0 0 30px;}
}
@media screen and (max-width:768px) {
.ab_01 > figure{top: 0;right: 0;width: 50%;}
.ab_01 ul{padding-top: 80px;}
.ab_03{padding: 0;}
.ab_03 section{width: 100%;flex-flow: wrap;}
.ab_03 ul{max-width: 100%;margin: 0;padding: 50px 20px;}
.ab_03 section+section ul{border: none;}
.ab_03 li{max-width: 100%;}
.ab_03 p{max-width: 100%;}
.ab_04{padding: 0;}
.ab_04 section{padding: 0;flex-flow: wrap;}
.ab_04 div{max-width: 100%;padding: 50px 20px;}
}
@media screen and (max-width:600px) {
.ab_01 ul{padding-top: 50px;}
.ab_01 > figure{width: 35%;}
.ab_01 h4{padding-bottom: 20px;}
.ab_03 h6{padding-bottom: 10px;}
.ab_04 p{padding-top: 20px;}
}
@media screen and (max-width:425px) {
.ab_01 > figure{width: 40%;}
}

/* introduce */
.introduce_01{
   padding: 0 50px;
   position: relative;
}
.introduce_01::before{
   content: '';
   display: block;
   background: url(../img/introduce_bg01.png) no-repeat;
   width: 450px;
   height: 912px;
   position: absolute;
   top: -200px;
   right: -25px;
   transform-origin: top right;
   animation: leaf_bg 3s infinite;
}
.introduce_01 ul{
   max-width: 1600px;
   padding: 100px 0;
   margin: 0;
}
.introduce_01 li{
   display: flex;
   align-items: center;
   justify-content: space-between;
   flex-flow: row-reverse;
}
.introduce_01 section{
   max-width: 420px;
   width: 100%;
   padding-left: 20px;
}
.introduce_01 h4{
   padding: 30px 0;
}
.introduce_01 p{
   font-size: var(--f15);
}
.introduce_01 figure{
   max-width: 1077px;
   width: 100%;
}
.introduce_01 figure img{
   min-height: 500px;
   object-fit: cover;
}
.introduce_02{
   padding: 0 50px;
   position: relative;
}
.introduce_02::before{
   content: '';
   display: block;
   background: url(../img/introduce_bg02.png) no-repeat;
   width: 632px;
   height: 904px;
   position: absolute;
   top: 400px;
   left: -10px;
   transform-origin: center left;
   animation: leaf_bg 3s infinite;
}
.introduce_02 ul{
   max-width: 1680px;
   margin: 0 auto;
   padding: 0 0 100px;
}
.introduce_02 li{
   display: flex;
   align-items: center;
   justify-content: space-between;
   max-width: 1440px;
   margin: 0;
}
.introduce_02 ul:nth-of-type(odd) li{
   margin: 0 0 0 auto;
}
.introduce_02 ul:nth-of-type(even) li{
   flex-flow: row-reverse;
}
.introduce_02 ul:nth-of-type(odd) li div{
   padding-right: 20px;
}
.introduce_02 ul:nth-of-type(even) li div{
   padding-left: 20px;
}
.introduce_02 dl{
   display: flex;
   align-items: flex-end;
   margin: 0;
   padding-bottom: 20px;
}
.introduce_02 dt{
   font-family: "Noto Serif TC", serif;
   font-size: var(--f50);
   font-weight: 400;
   writing-mode: vertical-rl;
   letter-spacing: 0.16em;
   line-height: 1;
}
.introduce_02 dd{
   margin: 0;
   font-family: "Josefin Sans", sans-serif;
   font-size: var(--f15);
   font-weight: 300;
   color: #AC855E;
   padding: 0 0 10px 10px;
}
.introduce_02 p{
   max-width: 440px;
   font-family: "Noto Serif TC", serif;
   font-weight: 400;
   line-height: 200%;
   letter-spacing: 0.12em;
}
.introduce_02 ul:nth-of-type(1) p{
   max-width: 350px;
}
.introduce_02 span{
   display: block;
}
.introduce_02 u{
   display: block;
   width: fit-content;
   border: 1px solid #CCCCCC;
   padding: 5px 10px;
   margin: 30px 0 15px;
   line-height: 1;
   text-decoration: none;
}
@media screen and (max-width:1220px) {
.introduce_01 section{max-width: 400px;}
.introduce_02 div{max-width: 350px;width: 100%;}
}
@media screen and (max-width:1024px) {
.introduce_01{padding: 0;}
.introduce_01 li{flex-flow: wrap;}
.introduce_01 section{padding: 0 20px 50px;max-width: 100%;}
.introduce_01 h4{padding: 20px 0;}
.introduce_01 figure img{min-height: auto;}
.introduce_02 li{max-width: 840px;}
.introduce_02 ul:nth-of-type(n) li{flex-flow: wrap;margin: 0 auto;}
.introduce_02 ul:nth-of-type(n) li div{padding: 0 0 30px;}
}
@media screen and (max-width:768px) {
.introduce_01 ul{padding: 0;}
.introduce_01 section{padding: 50px 20px;}
.introduce_01::before{background-size: contain;width: 30vw;height: 70vw;right: -20px;top: -30vw;}
.introduce_02{padding: 0 5%;}
.introduce_02 ul:nth-of-type(n) li div{padding: 50px 0;}
.introduce_02 ul{padding: 0;}
.introduce_02 ul:nth-last-of-type(1){padding-bottom: 50px;}
}
@media screen and (max-width:600px) {
.introduce_01 section{padding: 30px 20px;}
.introduce_02{padding: 0;}
.introduce_02 ul:nth-last-of-type(1){padding: 0;}
.introduce_02 ul:nth-of-type(n) li div{padding: 30px 20px;max-width: 100%;}
.introduce_02 u{margin: 15px 0;}
}

/* access */
.access_01{
   padding: 0 5%;
   position: relative;
}
.access_01::before{
   content: '';
   display: block;
   background: url(../img/access_bg01.png) top left no-repeat;
   width: 450px;
   height: 912px;
   position: absolute;
   top: -200px;
   right: -25px;
   transform-origin: top right;
   animation: leaf_bg 3s infinite;
}
.access_01 section{
   max-width: 1200px;
   margin: 0 auto;
   padding: 100px 0;
}
.access_01 h6{
   text-align: center;
}
.access_01 h5{
   font-family: "Noto Serif TC", serif;
   font-size: var(--f24);
   font-weight: 400;
   text-align: center;
}
.access_01 h4{
   font-size: var(--f18);
   font-weight: 400;
   letter-spacing: 0.25em;
   text-align: center;
   padding: 30px 0 50px;
   border-bottom: 1px solid #CCCCCC;
}
.access_01 h4 br{
   display: none;
}
.access_01 dl{
   display: flex;
   align-items: flex-start;
   justify-content: space-around;
   max-width: 1050px;
   margin: 0 auto;
   padding: 100px 0;
}
.access_01 dl+dl{
   border-top: 1px solid #CCCCCC;
}
.access_01 dt{
   font-family: "Noto Serif TC", serif;
   font-weight: 400;
   font-size: var(--f20);
   letter-spacing: 0.12em;
}
.access_01 dd{
   max-width: 530px;
   width: 100%;
   margin: 0;
}
.access_01 div+div{
   padding-top: 50px;
}
.access_01 h3{
   font-size: var(--f18);
   font-weight: 400;
   letter-spacing: 0.07em;
   color: #000000;
   padding-bottom: 20px;
}
.access_01 p{
   display: flex;
   align-items: flex-start;
   position: relative;
   padding-bottom: 25px;
   line-height: 180%;
}
.access_01 p:nth-last-of-type(1){
   padding: 0;
}
.access_01 p::after{
   content: '';
   display: block;
   width: 1px;
   min-height: calc(100% - 30px);
   background: #CCCCCC;
   position: absolute;
   bottom: 0;
   left: 9px;
}
.access_01 p:nth-last-of-type(1)::after{
   display: none;
}
.access_01 i{
   display: flex;
   align-items: center;
   justify-content: center;
   max-width: 20px;
   width: 100%;
   min-height: 20px;
   border-radius: 50%;
   border: 1px solid #CCCCCC;
   position: relative;
   margin: 5px 10px 0 0;
}
.access_01 i::before{
   content: '';
   max-width: 4px;
   width: 100%;
   min-height: 4px;
   border-radius: 50%;
   background: #444444;
   position: absolute;
}
.access_01 article{
   max-width: 1050px;
   margin: 0 auto;
   filter: grayscale(20);
   transition: .5s ease;
}
.access_01 article:hover{
   filter: none;
}
.access_01 iframe{
   width: 100%;
   min-height: 400px;
}
@media screen and (max-width:768px) {
.access_01::before{background-size: contain;width: 30vw;height: 70vw;right: -20px;top: -30vw;}
.access_01 section,.access_01 dl{padding: 80px 0;}
.access_01 h4{padding: 10px 0 30px;}
.access_01 dl{justify-content: space-between;}
.access_01 iframe{min-height: 350px;}
}
@media screen and (max-width:740px) {
.access_01 dd{width: calc(100% - 130px);}
}
@media screen and (max-width:600px) {
.access_01 section,.access_01 dl{padding: 50px 0;}
.access_01 div+div{padding-top: 30px;}
.access_01 iframe{min-height: 300px;}
}
@media screen and (max-width:480px) {
.access_01 dl{flex-flow: wrap;padding: 30px 0;}
.access_01 dd{width: 100%;padding-top: 20px;}
.access_01 iframe{min-height: 250px;}
}
@media screen and (max-width:400px) {
.access_01 h4 br{display: block;}
}

/* map */
.map_01{
   padding: 0 5%;
}
.map_01 figure{
   width: fit-content;
   margin: 0 auto;
   padding: 100px 0;
}
@media screen and (max-width:768px) {
.map_01 figure{padding: 80px 0;}
}
@media screen and (max-width:600px) {
.map_01 figure{padding: 50px 0;}
}

/* stay */
.stay_notice_01{
   /* width: 90%;
   margin: 0 auto; */
   padding: 50px 0;
}
.stay_notice_01 section{
   max-width: 1300px;
   margin: 0 auto;
   background: #F2F2F2;
   padding: 30px 50px;
}
.stay_notice_01 h6{
   font-family: "Josefin Sans", sans-serif;
   font-size: var(--f15);
   font-weight: 700;
   color: #AC855E;
   letter-spacing: 0.07em;
   padding-bottom: 5px;
}
.stay_notice_01 h5{
   font-size: var(--f24);
   font-weight: 400;
   letter-spacing: 0.07em;
}
/* .stay_notice_02,.stay_notice_03{
   width: 90%;
   margin: 0 auto;
} */
.stay_notice_02 section{
   max-width: 1300px;
   margin: 0 auto;
}
.stay_notice_02 h6,.stay_notice_03 h6{
   font-size: var(--f20);
   font-weight: 500;
   padding: 0 50px 20px;
   border-bottom: 2px solid #545454;
}
.stay_notice_02 dl{
   display: flex;
   align-items: flex-start;
   justify-content: space-between;
   border-bottom: 1px solid rgba(0,0,0,0.1);
   margin: 0;
   padding: 25px 50px;
}
.stay_notice_02 dt{
   max-width: 100px;
   width: 100%;
}
.stay_notice_02 dd{
   max-width: 1000px;
   width: calc(100% - 120px);
   margin: 0;
   padding: 0 10px;
}
.stay_notice_02 dl:nth-of-type(1) dd{
   padding: 0;
}
.stay_notice_02 span{
   display: inline-block;
   padding: 0 10px 5px;
}
.stay_notice_03 section{
   max-width: 1300px;
   margin: 0 auto;
   padding-top: 80px;
}
.stay_notice_03 ul{
   padding: 20px 50px 0;
   margin: 0;
}
.stay_notice_03 li{
   font-size: var(--f15);
   line-height: 200%;
   letter-spacing: 0.07em;
   position: relative;
   padding-left: 15px;
}
.stay_notice_03 li+li{
   margin-top: 15px;
}
.stay_notice_03 li::before{
   content: '';
   display: block;
   max-width: 7px;
   width: 100%;
   min-height: 7px;
   border-radius: 50%;
   background: #545454;
   position: absolute;
   left: 0;
   top: 12px;
}
.stay_notice_03 p{
   display: flex;
   align-items: flex-start;
}
.stay_notice_03 p::before{
   content: '-';
   margin-right: 10px;
}
.stay_notice_04 section{
   padding: 100px 0;
}
@media screen and (max-width:768px) {
.stay_notice_04 section{padding: 80px 0 0;}
}
@media screen and (max-width:600px) {
.stay_notice_01{padding: 20px 0;}
.stay_notice_01 section{padding: 20px;}
.stay_notice_02 h6,.stay_notice_03 h6{padding: 0 20px 20px;}
.stay_notice_02 dl{flex-flow: wrap;padding: 20px 10px;}
.stay_notice_02 dt{padding: 0 10px 20px;}
.stay_notice_02 dd{width: 100%;}
.stay_notice_03 section{padding-top: 50px;}
.stay_notice_03 ul{padding: 20px 20px 0;}
.stay_notice_04 section{padding: 50px 0 0;}
}

/* 20250630 修改 */
.stay_top_button{
   padding: 60px 5% 20px;
}
.stay_top_button a{
   justify-content: center;
   max-width: 100px;
   margin: 0 0 0 auto;
   color: #444444;
}