@charset "UTF-8";
/* CSS Document */
body {
  font-family: "Libre Bodoni", "Noto Serif TC", serif;
  font-size: 16px;
  line-height: 1.8;
  letter-spacing: 0.05rem;
  color: var(--black);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /*padding-top: var(--headerH)*/
}
body::after {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #fff;
  z-index: 9999;
  pointer-events: none;
  opacity: 0;
  -webkit-transition: 1s cubic-bezier(0.42, 0, 0.58, 1);
  -o-transition: 1s cubic-bezier(0.42, 0, 0.58, 1);
  transition: 1s cubic-bezier(0.42, 0, 0.58, 1);
}
body.page-fade::after {
  opacity: 1;
}
body.js--animateReady .wow {
  opacity: 1;
  visibility: visible;
  -webkit-transition: opacity 0.6s ease;
  -o-transition: opacity 0.6s ease;
  transition: opacity 0.6s ease;
}

.wow {
  opacity: 0;
  visibility: hidden;
}

/*--------------------------------------------------*/
a {
  color: var(--black);
  text-decoration: none;
  -o-transition: var(--transition);
  -webkit-transition: var(--transition);
  transition: var(--transition);
}
* {
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
}

p, figure {
  margin: 0;
}

img {
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}

/* color */
:root {
  --mjColor: #187FC4;
  /* 主色 */
  --mjColor-l: #8FB4CD;
  --mjColor-d: #003B63;
  --subColor: #00AEBB;
  /* 副色 */
  --black: #3f3f3f;
  --gray: #999;
  --gray-d: #777;
  --gray-l: #ccc;
  --gray-lx2: #eee;
  --red: #d40023;
}

/* font */
:root {
  /* font-size */
  --titleBN-L: clamp(2rem, 3.5vw, 3.5rem);
  --titleBN-S: clamp(1.75rem, 2.25vw, 2.25rem);
  --titleL: clamp(1.75rem, 2.5vw, 2.5rem);
  --titleM: clamp(1.5rem, 2vw, 2rem);
  --titleS: clamp(1.15rem, 1.75vw, 1.75rem);
  --text: clamp(.9rem, 1.15vw, 1.15rem);
  --textS: clamp(.85rem, .9vw, .9rem);
  /* font-weight */
  --light: 400;
  --normal: 500;
  --bold: 600;
  --heavy: 700;
  /* line-height */
  --lineHeight--title: 1.2;
  --lineHeight--txt--inner: 1.5;
}

/* image */
:root {
  /*radius*/
  --imgRadiusM: clamp(3rem, 5.5vw, 5.5rem);
  --imgRadiusS: clamp(1rem, 2vw, 2rem);
}

/* space */
:root {
  --hd--space: clamp(1.25rem, 3vw, 3rem);
  --blockHeight: clamp(2rem, 4vw, 4rem);
  --container: clamp(5rem, 15vw, 15rem);
  --lineWidth: clamp(.5rem, 1vw, 1rem);
  /* 線條與圖片的距離 */
}

/* transition */
:root {
  --transition: all 1s;
  --transition-ease: all .5s ease-out;
}

/*反白設定
::selection { background: #666; color: #FFF; }
::-moz-selection { background: #666; color: #FFF; }
*/
.alertLine, .red {
  --cl: var(--red);
}

.alertLine {
  border-color: var(--cl);
}

.red {
  color: var(--cl);
}

/* !====連結底線 */
.aLink {
  text-decoration: underline;
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}
.aLink:hover {
  opacity: 0.5;
}

/* !====回頂端 */
#goTop {
  display: none;
  cursor: pointer;
  position: fixed;
  bottom: 1.125rem;
  right: 1.25rem;
  width: clamp(2.75rem, 3vw, 3rem);
  aspect-ratio: 4/5;
  text-align: center;
  -webkit-transition: 0.3s all;
  -o-transition: 0.3s all;
  transition: 0.3s all;
  background: url(../images/all/gotop.png) center/cover;
  z-index: 9999;
}
#goTop:hover {
  -webkit-transform: translateY(-1rem);
      -ms-transform: translateY(-1rem);
          transform: translateY(-1rem);
  padding-bottom: 1rem;
}
#goTop:after {
  content: "";
  position: absolute;
  width: 0.5rem;
  height: 0.5rem;
  background: var(--mjColor-d);
  border-radius: 100%;
  -webkit-filter: blur(2px);
          filter: blur(2px);
  bottom: 0;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
      -ms-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
  opacity: 0;
  -webkit-transition: 0.3s all;
  -o-transition: 0.3s all;
  transition: 0.3s all;
}
#goTop:hover:after {
  -webkit-transform: translate(-50%, 1rem);
      -ms-transform: translate(-50%, 1rem);
          transform: translate(-50%, 1rem);
  opacity: 0.65;
  width: 2rem;
}

/* !===側欄按鈕 */
.sideBtn {
  position: fixed;
  right: -100%;
  bottom: 15%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  margin: 0 1rem;
  z-index: 999;
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}
.sideBtn.scroll {
  right: 0;
}
.sideBtn__item {
  background: var(--subColor);
  --w: clamp(3rem, 3.5vw, 3.5rem);
  width: var(--w);
  height: var(--w);
  border-radius: 50%;
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: clamp(0.15rem, 0.5vw, 0.5rem) 0;
}
.sideBtn__item + .sideBtn__item {
  margin-top: 0.5rem;
}
.sideBtn__item .--fb,
.sideBtn__item .--ig,
.sideBtn__item .--line,
.sideBtn__item .--phone,
.sideBtn__item .--reservation {
  background: var(--subColor);
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}
.sideBtn__item:hover {
  -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
          transform: scale(1.1);
}
.sideBtn__item:hover .--fb {
  background: -o-linear-gradient(135deg, #174A98 0%, #4A7DCC 100%);
  background: linear-gradient(-45deg, #174A98 0%, #4A7DCC 100%);
}
.sideBtn__item:hover .--ig {
  background: -o-linear-gradient(45deg, #FFA612 0%, #E23A6D 25%, #E23A6D 65%, #A33F99 100%);
  background: linear-gradient(45deg, #FFA612 0%, #E23A6D 25%, #E23A6D 65%, #A33F99 100%);
}
.sideBtn__item:hover .--line {
  background: -o-linear-gradient(135deg, #10AA11 0%, #4DD34E 100%);
  background: linear-gradient(-45deg, #10AA11 0%, #4DD34E 100%);
}
.sideBtn__item:hover .--phone {
  background: var(--mjColor-d);
}
.sideBtn__item:hover .--reservation {
  background: var(--mjColor-d);
}

/* !====按鈕 */
.btnWrap {
  margin: clamp(1em, 2vw, 2em) 0;
  text-align: center;
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}
.btnWrap:hover {
  -webkit-transform: scale(1.15);
      -ms-transform: scale(1.15);
          transform: scale(1.15);
}

.btnStyle {
  --btnW: clamp(5rem, 8vw, 8rem);
  width: var(--btnW);
  height: var(--btnW);
  aspect-ratio: 1;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}
.btnStyle::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  background-image: url(../images/all/read-more-circle.svg);
  background-size: cover;
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
  -webkit-animation: circleRotate 8s linear infinite;
          animation: circleRotate 8s linear infinite;
}
.btnStyle .bi {
  font-size: clamp(1.25rem, 2vw, 2rem);
  color: var(--subColor);
}
.btnStyle--w::before {
  background-image: url(../images/all/read-more-circle-w.svg);
}
.btnStyle--w .bi {
  color: white;
}

.circleAnimate {
  -webkit-animation-name: circleAnimate;
  animation-name: circleAnimate;
}

@-webkit-keyframes circleRotate {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@keyframes circleRotate {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@-webkit-keyframes circleAnimate {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes circleAnimate {
  0% {
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
/* !====submit-loading */
.load-wrapp {
  position: fixed;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.65);
  top: 0;
  left: 0;
  z-index: 99999;
}

.loading {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.loading span {
  color: #fff;
  font-size: 25px;
  margin-top: 40px;
  display: table;
}
.loading .spinner {
  -webkit-animation: loadingI 2s linear infinite;
          animation: loadingI 2s linear infinite;
}
.loading .bubble-1,
.loading .bubble-2 {
  -webkit-animation: bubble 2s ease-in-out infinite;
  animation: bubble 2s ease-in-out infinite;
  -moz-animation: bubble 2s ease-in-out infinite;
  -o-animation: bubble 2s ease-in-out infinite;
}
.loading .bubble-2 {
  -webkit-animation-delay: -1s;
          animation-delay: -1s;
}

.spinner {
  position: relative;
  width: 60px;
  height: 60px;
  margin: 0 auto;
}

.bubble-1,
.bubble-2 {
  position: absolute;
  top: 0;
  width: 30px;
  height: 30px;
  border-radius: 100%;
  background-color: #fff;
}

.bubble-2 {
  top: auto;
  bottom: 0;
}

/* animation:loadingI */
@-webkit-keyframes loadingI {
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
@keyframes loadingI {
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}
/* bubble */
@-webkit-keyframes bubble {
  0%, 100% {
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  50% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes bubble {
  0%, 100% {
    -webkit-transform: scale(0);
            transform: scale(0);
  }
  50% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
/* !====全頁佈局 */
.wrapper {
  padding: 2rem 0;
}

.blockHeight {
  padding: var(--blockHeight) 0;
}
.blockHeight--ixCase {
  padding-top: 0;
  margin-bottom: clamp(2rem, 4vw, 4rem);
  overflow: hidden;
}
.blockHeight--ixDoc {
  background-image: url(../images/index/doctor-bg.jpg?var2025);
  background-size: cover;
  background-position: top center;
  padding: calc(var(--blockHeight) * 2) 0;
}
@media screen and (max-width: 768px) {
  .blockHeight--ixDoc .txtBox {
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: end;
  }
}
.blockHeight--ixBranch {
  padding-bottom: 0;
  position: relative;
}
.blockHeight--ixTreat {
  background-image: url(../images/index/treatment-blueBg.png?);
  background-size: cover;
  background-position: bottom;
  padding: calc(var(--blockHeight) * 2) 0;
}
.blockHeight--ixTreat.--bottom--left.decoCircle:before {
  bottom: calc(-1 * var(--decoCircle) / 2 + var(--space));
}
.blockHeight--ixFea {
  padding-bottom: 0;
  overflow: hidden;
}
.blockHeight--ixComm {
  background-image: url(../images/index/comment-bg.png);
  background-size: cover;
  background-position: top center;
  padding: calc(var(--blockHeight) * 2);
  position: relative;
  overflow: hidden;
  margin-top: calc(-1 * var(--blockHeight) * 2);
}
.blockHeight--ixComm:before, .blockHeight--ixComm:after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background-image: url(../images/index/comment-bg.png);
  background-size: cover;
  background-position: top center;
  position: absolute;
  bottom: 0;
  z-index: 10;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: cover;
  mask-repeat: no-repeat;
  mask-size: cover;
  pointer-events: none;
}
.blockHeight--ixComm:before {
  left: 0;
  -webkit-mask-image: -webkit-gradient(linear, left top, right top, color-stop(10%, black), color-stop(15%, transparent));
  -webkit-mask-image: linear-gradient(to right, black 10%, transparent 15%);
  mask-image: -webkit-gradient(linear, left top, right top, color-stop(10%, black), color-stop(15%, transparent));
  mask-image: linear-gradient(to right, black 10%, transparent 15%);
}
.blockHeight--ixComm:after {
  right: 0;
  -webkit-mask-image: -webkit-gradient(linear, right top, left top, color-stop(10%, black), color-stop(15%, transparent));
  -webkit-mask-image: linear-gradient(to left, black 10%, transparent 15%);
  mask-image: -webkit-gradient(linear, right top, left top, color-stop(10%, black), color-stop(15%, transparent));
  mask-image: linear-gradient(to left, black 10%, transparent 15%);
}
.blockHeight--ixComm .mainTitle__mj {
  color: white;
}
@media screen and (max-width: 991px) {
  .blockHeight--ixComm:before {
    -webkit-mask-image: -webkit-gradient(linear, left top, right top, color-stop(5%, black), color-stop(15%, transparent));
    -webkit-mask-image: linear-gradient(to right, black 5%, transparent 15%);
    mask-image: -webkit-gradient(linear, left top, right top, color-stop(5%, black), color-stop(15%, transparent));
    mask-image: linear-gradient(to right, black 5%, transparent 15%);
  }
  .blockHeight--ixComm:after {
    -webkit-mask-image: -webkit-gradient(linear, right top, left top, color-stop(5%, black), color-stop(15%, transparent));
    -webkit-mask-image: linear-gradient(to left, black 5%, transparent 15%);
    mask-image: -webkit-gradient(linear, right top, left top, color-stop(5%, black), color-stop(15%, transparent));
    mask-image: linear-gradient(to left, black 5%, transparent 15%);
  }
}
@media screen and (max-width: 768px) {
  .blockHeight--ixComm {
    padding: calc(var(--blockHeight));
  }
}
.blockHeight--about {
  padding: 0;
  overflow: hidden;
}
.blockHeight--team {
  padding: 0;
}
.blockHeight--treat {
  background-image: url(../images/index/treatment-bg.png);
  background-size: cover;
  background-position: bottom;
}
.blockHeight--treat:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: -webkit-gradient(linear, left top, left bottom, from(white), color-stop(25%, transparent));
  background: -o-linear-gradient(top, white, transparent 25%);
  background: linear-gradient(to bottom, white, transparent 25%);
}
.blockHeight--treat.--bottom--left.decoCircle:before {
  bottom: calc(-1 * var(--decoCircle) / 2 + var(--space));
}
.blockHeight--case {
  padding: 0;
}
.blockHeight--faq {
  padding: 0;
}
.blockHeight--con {
  background-image: url(../images/all/contact-bg.jpg);
  background-size: cover;
  padding: calc(var(--blockHeight) * 2) 0;
}
.blockHeight--con .container {
  padding: 0 calc(var(--container) * 1.5);
}
@media screen and (max-width: 1440px) {
  .blockHeight--con .container {
    padding: 0 calc(var(--container));
  }
}
@media screen and (max-width: 768px) {
  .blockHeight--con .container {
    padding: 0 var(--container);
  }
}
.blockHeight--contact {
  background-image: url(../images/all/contact-pg.jpg);
  background-size: contain;
  background-repeat: no-repeat;
}
.blockHeight--contact:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: -webkit-gradient(linear, left top, left bottom, from(white), color-stop(25%, transparent));
  background: -o-linear-gradient(top, white, transparent 25%);
  background: linear-gradient(to bottom, white, transparent 25%);
}
.blockHeight--treatment {
  padding: 0;
}
.blockHeight--contactPage {
  padding: 0;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

/* 全站卷軸 */
::-webkit-scrollbar {
  width: 0.5rem;
  height: 0.5rem;
}

::-webkit-scrollbar-track {
  background: var(--lightGray);
}

::-webkit-scrollbar-thumb {
  background: var(--mjColor-l);
  border-radius: 0.5rem;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--mjColor-l);
  opacity: 0.8;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}

::-webkit-scrollbar-button {
  display: none;
}
/* !====編輯器 */
.tx01 img {
  max-width: 100%;
  height: auto !important;
}

/* !====RWD編輯器表格(X捲軸) */
.tableContainer table td {
  min-width: 100px;
  padding: 5px;
  border: 1px solid #ccc;
  white-space: inherit;
}
@media screen and (max-width: 768px) {
  .tableContainer {
    width: 100%;
    overflow-x: scroll;
    overflow-y: auto;
    _overflow: auto;
    margin: 0 0 1em;
  }
}

/* !====標題 */
.mainTitle {
  line-height: var(--lineHeight--title);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: clamp(1rem, 2vw, 2rem);
}
.mainTitle__mj {
  font-size: var(--titleM);
  font-weight: var(--heavy);
  letter-spacing: 0.25rem;
  color: var(--mjColor-d);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: clamp(0.5rem, 1vw, 1rem);
}
.mainTitle__mj:before, .mainTitle__mj:after {
  content: "";
  display: block;
  --starW: clamp(1rem, 1.5vw, 1.5rem);
  width: var(--starW);
  height: var(--starW);
  background: url(../images/all/titleStar-B.svg);
  background-size: cover;
}
.mainTitle__mj__en {
  font-size: var(--text);
  font-weight: var(--bold);
  font-style: italic;
  color: var(--mjColor-l);
}
.mainTitle__sub {
  font-size: 1.125rem;
  font-weight: 500;
}
.mainTitle--ixBranch {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
  width: 100%;
  gap: clamp(0.5rem, 0.75vw, 0.75rem);
}
.mainTitle--ixBranch .mainTitle__mj:before, .mainTitle--ixBranch .mainTitle__mj:after {
  content: none;
}
@media screen and (max-width: 991px) {
  .mainTitle {
    width: 100%;
  }
}
@media screen and (max-width: 768px) {
  .mainTitle {
    width: 100%;
  }
}

.color-w {
  color: white;
}

.titleSpace {
  text-indent: 1em;
}

.titleAnimate {
  -webkit-animation-name: titleAnimate;
  animation-name: titleAnimate;
}

@-webkit-keyframes titleAnimate {
  0% {
    -webkit-clip-path: polygon(0 0, 0% 0, 0% 100%, 0% 100%);
            clip-path: polygon(0 0, 0% 0, 0% 100%, 0% 100%);
  }
  100% {
    -webkit-clip-path: polygon(0 0, 100% 0%, 100% 100%, 0% 100%);
            clip-path: polygon(0 0, 100% 0%, 100% 100%, 0% 100%);
  }
}

@keyframes titleAnimate {
  0% {
    -webkit-clip-path: polygon(0 0, 0% 0, 0% 100%, 0% 100%);
            clip-path: polygon(0 0, 0% 0, 0% 100%, 0% 100%);
  }
  100% {
    -webkit-clip-path: polygon(0 0, 100% 0%, 100% 100%, 0% 100%);
            clip-path: polygon(0 0, 100% 0%, 100% 100%, 0% 100%);
  }
}
/* !====banner */
.topBg {
  background: url(../images/banner/top-bg.jpg);
  background-size: cover;
}

.bannerWrap {
  width: 100%;
  position: relative;
  padding: clamp(2rem, 8vw, 8rem) 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
}
@media screen and (max-width: 991px) {
  .bannerWrap {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
  }
}

.banner {
  width: 57%;
  padding: var(--lineWidth);
  margin-right: var(--hd--space);
}
.banner.slick-dotted.slick-slider {
  margin-bottom: 0;
}
.banner .slick-dots {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
}
.banner .slick-track {
  background: rgba(0, 0, 0, 0.8);
}
.banner .slick-active {
  -webkit-animation: bnPicMove 8s linear;
          animation: bnPicMove 8s linear;
}
.banner img {
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.banner__box {
  position: relative;
  aspect-ratio: 1080/768;
}
@media screen and (max-width: 1680px) {
  .banner {
    width: 53%;
  }
}
@media screen and (max-width: 991px) {
  .banner {
    width: 100%;
    padding: 0;
    padding-top: calc(var(--headerH) / 2);
    border: 0;
  }
}

@-webkit-keyframes bnPicMove {
  0% {
    -webkit-transform: translateX(0) scale(1.05);
            transform: translateX(0) scale(1.05);
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  70% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-1.5rem) scale(1.05);
            transform: translateX(-1.5rem) scale(1.05);
    opacity: 0;
  }
}

@keyframes bnPicMove {
  0% {
    -webkit-transform: translateX(0) scale(1.05);
            transform: translateX(0) scale(1.05);
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  70% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-1.5rem) scale(1.05);
            transform: translateX(-1.5rem) scale(1.05);
    opacity: 0;
  }
}
.bannerTitleBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: end;
  color: white;
  --bnTitleSpace: clamp(1.5rem, 4vw, 4rem);
  padding: var(--bnTitleSpace);
  padding-left: calc(var(--container) / 1.5);
  position: relative;
}

.bannerTitle {
  width: 100%;
  font-weight: var(--bold);
  line-height: var(--lineHeight--title);
  -webkit-transform: skewX(-10deg);
      -ms-transform: skewX(-10deg);
          transform: skewX(-10deg);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: clamp(0.5rem, 1vw, 1rem);
  --bnTitX: clamp(2rem, 4vw, 4rem);
}

.starLine {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  margin-bottom: clamp(0.5rem, 1vw, 1rem);
  --starWidth: clamp(2rem, 4vw, 4rem);
  z-index: 5;
}
.starLine:before {
  content: "";
  display: block;
  width: var(--starWidth);
  height: var(--starWidth);
  background: url(../images/all/bnStar.svg);
  background-size: cover;
  position: relative;
  bottom: 0;
}
.starLine:after {
  content: "";
  display: block;
  width: 90%;
  height: 1px;
  border-bottom: 1px solid var(--mjColor-l);
  position: absolute;
  z-index: -1;
  left: calc(var(--starWidth) / 2);
  bottom: calc(var(--starWidth) / 2);
}

.bnTit {
  font-size: var(--titleBN-S);
  font-weight: var(--heavy);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0.5rem;
}
.bnTit--L {
  font-size: var(--titleBN-L);
}
.bnTit:last-child {
  -webkit-transform: translateX(var(--bnTitX));
      -ms-transform: translateX(var(--bnTitX));
          transform: translateX(var(--bnTitX));
}

.bnTxt {
  font-size: var(--text);
  font-weight: var(--normal);
  text-indent: 2em;
}

/* bn文字動態 */
.animated .splitting .char {
  -webkit-animation: vague-in 1500ms calc(75ms * var(--char-index)) cubic-bezier(0.5, 0, 0.5, 1) both;
  animation: vague-in 1800ms calc(75ms * var(--char-index)) cubic-bezier(0.5, 0, 0.5, 1) both;
}

@-webkit-keyframes vague-in {
  0% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-filter: blur(1em);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-filter: blur(0);
    opacity: 1;
  }
}
@keyframes vague-in {
  0% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-filter: blur(1em);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -webkit-filter: blur(0);
    opacity: 1;
  }
}
.pgBanner {
  background-size: cover;
  min-height: clamp(160px, 15vw, 240px);
  overflow: hidden;
}
.pgBanner .mainTitle {
  width: 100%;
  margin: 0;
  position: absolute;
  bottom: 0;
  left: 0;
}

/* !====共用排版 */
.container--half {
  padding: 0 calc(var(--container) / 2);
}

.pgContent {
  overflow: hidden;
}

.contentBox {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  gap: clamp(3rem, 6vw, 6rem);
}
.contentBox--branch {
  background: url(../images/index/branch-bg.jpg);
  background-size: cover;
  gap: 0;
  position: relative;
}
.contentBox--branch .txtBox {
  background: url(../images/index/texture-bg.jpg);
  background-size: cover;
  padding: calc(var(--blockHeight) / 1.5);
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: end;
}
.contentBox--branch:first-child .txtBox {
  margin-left: calc(var(--container) / 3);
}
.contentBox--branch:last-child .txtBox {
  margin-right: calc(var(--container) / 3);
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}
.contentBox--branch .picBox {
  position: relative;
}
.contentBox--branch .picBox:before {
  text-transform: uppercase;
  font-style: italic;
  font-size: clamp(0.8rem, 1vw, 1rem);
  text-wrap: nowrap;
  letter-spacing: 0.35rem;
  color: white;
  position: absolute;
  --space: clamp(1rem, 1.5vw, 1.5rem);
}
.contentBox--branch:first-child .picBox:before {
  content: "Professional Aesthetic Center";
  bottom: var(--space);
  right: 25%;
}
.contentBox--branch:last-child .picBox:before {
  content: "Pediatric & Orthodontic Center";
  top: var(--space);
  left: 25%;
}
.contentBox--branch .desc {
  margin-bottom: clamp(1rem, 2.5vw, 2.5rem);
  text-indent: 2em;
}
@media screen and (max-width: 991px) {
  .contentBox--branch:last-child .picBox {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}

.--grid-1-1 {
  -ms-grid-columns: 1fr 1fr;
  grid-template-columns: 1fr 1fr;
}
@media screen and (max-width: 991px) {
  .--grid-1-1 {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
}

.--grid-3-2 {
  -ms-grid-columns: 3fr 2fr;
  grid-template-columns: 3fr 2fr;
}
@media screen and (max-width: 991px) {
  .--grid-3-2 {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
}

.txtBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
  font-size: var(--text);
  font-weight: var(--normal);
}

.picBox {
  overflow: hidden;
}

.videoBox {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -webkit-transform: scale(1.01);
      -ms-transform: scale(1.01);
          transform: scale(1.01);
}

/* !====裝飾文字 */
.decoTxt {
  position: relative;
}
.decoTxt:before {
  content: "";
  display: block;
  width: auto;
  height: auto;
  font-size: var(--textS);
  font-weight: var(--normal);
  text-wrap: nowrap;
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
  text-transform: uppercase;
  letter-spacing: 1.75rem;
  position: absolute;
  left: var(--hd--space);
  top: calc(var(--headerH) + clamp(1rem, 4vw, 4rem));
}
.decoTxt--bn:before {
  content: "Forever Young";
  color: white;
}
.decoTxt--case:before {
  content: "Case Sharing";
  color: var(--mjColor-l);
}
.decoTxt--doc:before {
  content: "Dental Team";
  color: var(--mjColor-l);
}
.decoTxt.wow:before {
  -webkit-animation: slideInRight 1s ease-out forwards;
          animation: slideInRight 1s ease-out forwards;
}
@media screen and (max-width: 768px) {
  .decoTxt:before {
    content: none;
  }
}

@-webkit-keyframes slideInRight {
  0% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}

@keyframes slideInRight {
  0% {
    -webkit-transform: translateX(100%);
            transform: translateX(100%);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
.slide-in {
  -webkit-animation: slideInRight 1s ease-out forwards;
          animation: slideInRight 1s ease-out forwards;
}

/* !====裝飾圖片 */
.decoImage {
  max-width: clamp(220px, 30vw, 360px);
  min-width: 200px;
  position: absolute;
}
.decoImage--bn {
  left: 10%;
  top: 55%;
}
@media screen and (max-width: 991px) {
  .decoImage--bn {
    left: 65%;
    top: -30%;
    z-index: 5;
  }
}
.decoImage--branch--top {
  right: 0;
  top: -15%;
  border-radius: 0 0 var(--imgRadiusM) 0;
}
.decoImage--branch--bottom {
  left: 0;
  bottom: -15%;
  border-radius: 0 var(--imgRadiusM) 0 0;
}

.imgBox {
  overflow: hidden;
}
.imgBox--line {
  margin: var(--lineWidth);
}
.imgBox--lineL {
  margin: var(--lineWidth);
  margin-left: 0;
}
.imgBox--lineR {
  margin: var(--lineWidth);
  margin-right: 0;
}

.decoCircle {
  position: relative;
  --decoCircle: clamp(10rem, 26vw, 26rem);
  --space: clamp(1.5rem, 3.5vw, 3.5rem);
}
.decoCircle:before {
  content: "";
  display: block;
  width: var(--decoCircle);
  height: var(--decoCircle);
  background: url(../images/all/decoCircle-b.svg);
  background-size: cover;
  position: absolute;
  z-index: 1;
  -webkit-animation: circleRotate 30s linear infinite;
          animation: circleRotate 30s linear infinite;
}
.decoCircle.--top--right:before {
  top: calc(-1 * var(--decoCircle) / 2 + var(--space));
  right: calc(-1 * var(--decoCircle) / 2);
}
.decoCircle.--top--left:before {
  top: calc(-1 * var(--decoCircle) / 2 + var(--space));
  left: calc(-1 * var(--decoCircle) / 2);
}
.decoCircle.--bottom--right:before {
  bottom: calc(-1 * var(--decoCircle) / 2 - var(--space));
  right: calc(-1 * var(--decoCircle) / 2);
}
.decoCircle.--bottom--left:before {
  bottom: calc(-1 * var(--decoCircle) / 2 - var(--space));
  left: calc(-1 * var(--decoCircle) / 2);
}

.decoCircleW {
  position: relative;
}
.decoCircleW:after, .decoCircleW:before {
  content: "";
  display: block;
  --decoCircle: clamp(12rem, 26vw, 26rem);
  width: var(--decoCircle);
  height: var(--decoCircle);
  background: url(../images/all/decoCircle-w.svg);
  background-size: cover;
  position: absolute;
  z-index: 1;
  -webkit-animation: circleRotate 30s linear infinite;
          animation: circleRotate 30s linear infinite;
}
.decoCircleW.--top--left:before {
  top: 0;
  left: calc(-1 * var(--decoCircle) / 2);
}
.decoCircleW.--bottom--right:after {
  bottom: calc(-1 * var(--decoCircle) + var(--blockHeight));
  right: calc(-1 * var(--decoCircle) / 2);
}

/* !====側欄錨點 */
.anchor {
  position: absolute;
  top: -100px;
}

.sideTabWrap {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr clamp(2rem, 4vw, 4rem) 4fr;
  grid-template-columns: 1fr 4fr;
  gap: clamp(2rem, 4vw, 4rem);
  position: relative;
}

.sideTabList {
  position: -webkit-sticky;
  position: sticky;
  top: 3rem;
  -ms-flex-item-align: start;
      -ms-grid-row-align: start;
      align-self: start;
}
.sideTabList__inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: clamp(0.5rem, 1vw, 1rem);
}
.sideTabList__item {
  font-size: var(--text);
  line-height: 1;
  padding: 1rem 1.5rem;
  border: 1px solid var(--mjColor-d);
  color: var(--mjColor-d);
  border-radius: 99rem;
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}
.sideTabList__item:hover {
  background: var(--mjColor-d);
  color: white;
}

/* 美學案例 */
.caseList {
  position: relative;
  z-index: 5;
  counter-reset: Num;
}
.caseList__item:hover img {
  -webkit-transform: scale(1.05);
      -ms-transform: scale(1.05);
          transform: scale(1.05);
}
.caseList .slick-dots {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: clamp(1rem, 2vw, 2rem);
}
.caseList .slick-dots li {
  margin: 0;
}
.caseList .slick-dots li button {
  counter-increment: Num;
}
.caseList .slick-dots li button:before {
  content: counter(Num);
  font-size: var(--text);
}

/* 醫師團隊 */
.docList {
  min-height: 320px;
  position: relative;
}
.docList__item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: clamp(0.5rem, 1vw, 1rem);
  margin-bottom: 10%;
}
.docList__item .picBox {
  background: -webkit-gradient(linear, left bottom, left top, from(var(--gray)), to(var(--gray-lx2)));
  background: -o-linear-gradient(bottom, var(--gray), var(--gray-lx2));
  background: linear-gradient(to top, var(--gray), var(--gray-lx2));
  border-radius: var(--imgRadiusS) 0 var(--imgRadiusS) 0;
}
.docList__item .docTxt {
  text-align: center;
}
.docList__item .name {
  font-size: var(--text);
  font-weight: var(--bold);
}
.docList__item .title {
  font-style: italic;
  color: var(--mjColor-d);
  font-size: var(--text);
  font-weight: var(--bold);
}
.docList__item:first-child {
  -webkit-transform: translateY(-10%);
      -ms-transform: translateY(-10%);
          transform: translateY(-10%);
}
.docList__item:last-child {
  -webkit-transform: translateY(10%);
      -ms-transform: translateY(10%);
          transform: translateY(10%);
}

.docGroup {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  visibility: visible;
  opacity: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: clamp(1.5rem, 3.5vw, 3.5rem);
  -webkit-transition: opacity 2s ease-in-out, visibility 2s ease-in-out;
  -o-transition: opacity 2s ease-in-out, visibility 2s ease-in-out;
  transition: opacity 2s ease-in-out, visibility 2s ease-in-out;
}
.docGroup.active {
  position: relative;
  z-index: 1;
  opacity: 1;
}

/* 診所館別 */
.branchList {
  width: 100%;
}
.branchList__item {
  border-bottom: 1px dashed var(--gray);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: clamp(0.25rem, 0.5vw, 0.5rem);
}
.branchList__item .tit {
  text-wrap: nowrap;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  --gap: clamp(.5rem, 1vw, 1rem);
  gap: var(--gap);
  margin-right: var(--gap);
}
.branchList__item .tit:before {
  content: "";
  display: block;
  --starW: clamp(1rem, 1.25vw, 1.25rem);
  width: var(--starW);
  height: var(--starW);
  background: url(../images/all/titleStar-B.svg);
  background-size: cover;
}
.branchList__item .tit:after {
  content: "";
  display: block;
  width: 1px;
  height: 1rem;
  border-right: 1px solid var(--black);
}

/* 治療項目 */
.ixTreatList {
  width: 90%;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr clamp(0.75rem, 1.5vw, 1.5rem) 1fr;
  grid-template-columns: 1fr 1fr;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
  gap: clamp(0.75rem, 1.5vw, 1.5rem);
  padding: clamp(2rem, 4vw, 4rem) calc(var(--container));
  margin: auto;
  --treat-ic: clamp(3.5rem, 4vw, 3.75rem);
  --txtGap: clamp(.75rem, 1vw, 1rem);
  --treat__header__p: clamp(.5rem, 1vw, .75rem);
}
.ixTreatList__item {
  background: white;
  border-radius: calc(var(--imgRadiusS) / 2) 0 calc(var(--imgRadiusS) / 2) 0;
  -webkit-box-shadow: 0 0 1rem rgba(0, 59, 99, 0.3);
          box-shadow: 0 0 1rem rgba(0, 59, 99, 0.3);
  overflow: hidden;
}
.ixTreatList__item:hover .ixTreat__body {
  opacity: 1;
  max-height: 20rem;
}
.ixTreatList__item:hover .ixTreatBtnWrap {
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
}
.ixTreatList__item:hover .treatBtn {
  opacity: 1;
}
@media screen and (max-width: 640px) {
  .ixTreatList__item:hover .ixTreat__body {
    opacity: 0;
    max-height: 0;
  }
  .ixTreatList__item:hover .treatBtn {
    opacity: 0;
  }
  .ixTreatList__item.open .ixTreat__header {
    -webkit-box-shadow: 0 0 1rem rgba(0, 59, 99, 0.3);
            box-shadow: 0 0 1rem rgba(0, 59, 99, 0.3);
  }
  .ixTreatList__item.open .ixTreat__header::after {
    -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
            transform: rotate(45deg);
  }
  .ixTreatList__item.open .ixTreat__body {
    opacity: 1;
    max-height: 20rem;
  }
  .ixTreatList__item.open .ixTreatBtnWrap {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
  }
  .ixTreatList__item.open .treatBtn {
    opacity: 1;
  }
}
@media screen and (max-width: 1200px) {
  .ixTreatList {
    padding: clamp(2rem, 4vw, 4rem);
  }
}
@media screen and (max-width: 991px) {
  .ixTreatList {
    width: 90%;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
}
@media screen and (max-width: 640px) {
  .ixTreatList {
    width: 100%;
  }
}

.ixTreat__header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--txtGap);
  padding: var(--treat__header__p);
  overflow: hidden;
  -webkit-box-shadow: 0 0 1rem rgba(0, 59, 99, 0.3);
          box-shadow: 0 0 1rem rgba(0, 59, 99, 0.3);
}
@media screen and (max-width: 640px) {
  .ixTreat__header {
    -webkit-box-shadow: none;
            box-shadow: none;
    -webkit-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);
  }
  .ixTreat__header::after {
    content: "";
    font-family: bootstrap-icons !important;
    font-size: clamp(1rem, 1.5vw, 1.5rem);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    color: var(--mjColor-d);
    width: clamp(2rem, 4vw, 4rem);
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
  }
}

.treat-ic {
  width: var(--treat-ic);
  height: var(--treat-ic);
  aspect-ratio: 1;
  border-radius: 100%;
  border: 1px solid var(--mjColor-d);
}

.ixTreatTxt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--txtGap);
  margin-right: auto;
}
.ixTreatTxt .tit {
  font-size: var(--text);
  color: var(--mjColor-d);
  font-weight: var(--bold);
  line-height: var(--lineHeight--title);
  margin-bottom: clamp(0.25rem, 0.5vw, 0.5rem);
}
.ixTreatTxt .tit__en {
  font-size: var(--textS);
  line-height: 1;
  letter-spacing: 0;
  color: var(--mjColor);
}

.ixTreatBtnWrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: clamp(0.25rem, 0.5vw, 0.5rem);
  height: 0;
  overflow: hidden;
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}

.ixTreatBtn {
  padding: clamp(0.35rem, 0.5vw, 0.5rem) clamp(0.5rem, 1vw, 1rem);
  border-radius: 99rem;
  line-height: 1;
  font-size: var(--textS);
  text-wrap: nowrap;
  color: white;
  opacity: 0;
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}
.ixTreatBtn--more {
  background: var(--mjColor);
}
.ixTreatBtn--case {
  background: var(--subColor);
}
.ixTreatBtn:hover {
  background: var(--mjColor-d);
}

.ixTreat__body {
  opacity: 0;
  max-height: 0;
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}
.ixTreat__body .txt {
  padding: var(--txtGap);
  font-size: var(--text);
  font-weight: var(--bold);
}

.ixTeatBtnWrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: clamp(0.25rem, 0.5vw, 0.5rem);
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}
@media screen and (max-width: 640px) {
  .ixTeatBtnWrap {
    margin-bottom: var(--txtGap);
  }
}

.treatBtn {
  padding: clamp(0.5rem, 0.5vw, 0.5rem) clamp(0.75rem, 1vw, 1rem);
  border-radius: 99rem;
  line-height: 1;
  font-size: var(--textS);
  text-wrap: nowrap;
  color: white;
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}
.treatBtn--more {
  background: var(--mjColor);
}
.treatBtn--case {
  background: var(--subColor);
}

.--pc {
  display: block;
}
@media screen and (max-width: 640px) {
  .--pc {
    display: none;
  }
}

.--mb {
  display: none;
}
@media screen and (max-width: 640px) {
  .--mb {
    display: block;
  }
}

/* 整合醫療 (醫師) */
.specList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.specList__item {
  background-size: cover;
  position: relative;
  background-image: url(../images/index/doctorGroup-bg.jpg?);
  background-size: contain;
  background-repeat: no-repeat;
}
.specList__item .txtBox {
  padding: 0 calc(var(--container));
  margin-bottom: calc(-1 * clamp(2rem, 10vw, 10rem));
}
.specList__item .specTit {
  width: 100%;
  font-size: var(--titleL);
  font-weight: var(--heavy);
  line-height: var(--lineHeight--title);
  color: var(--mjColor-d);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  margin-bottom: clamp(1rem, 3vw, 3rem);
  text-align: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.specList__item .specTit__en {
  font-size: var(--titleS);
  font-weight: var(--bold);
  color: var(--mjColor);
  letter-spacing: 0;
}
.specList__item__inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: calc(var(--blockHeight) * 2) 0;
  padding-bottom: 0;
}

.specTxt {
  text-indent: 2em;
}

.specBottom {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: var(--subColor);
  position: relative;
  z-index: 5;
}
.specBottom .txt {
  margin-right: clamp(1rem, 1.5vw, 1.5rem);
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}
.specBottom:hover .txt {
  margin-right: clamp(1.25rem, 2vw, 2rem);
}

/* 好評專區 Comment */
.commList {
  height: 400px;
}
.commList__item {
  background: white;
  border-radius: clamp(0.5rem, 1vw, 0.75rem);
  padding: clamp(1rem, 1.75vw, 1.75rem);
  margin: clamp(0.75rem, 1.25vw, 1.25rem);
  opacity: 0.75;
  -webkit-transform: scale(0.85);
      -ms-transform: scale(0.85);
          transform: scale(0.85);
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}
.commList__item .txt {
  min-height: clamp(4rem, 6vw, 6rem);
  font-size: var(--text);
  font-weight: var(--bold);
  letter-spacing: 0.05rem;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -o-text-overflow: ellipsis;
     text-overflow: ellipsis;
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}
@media screen and (max-width: 991px) {
  .commList__item {
    margin: clamp(1rem, 6vw, 6rem) clamp(2rem, 8vw, 8rem);
  }
}
.commList .slick-dots {
  bottom: calc(-1 * clamp(2rem, 4vw, 4rem));
}
.commList .slick-current.commList__item {
  opacity: 1;
  -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
          transform: scale(1.1);
}
.commList .slick-current.commList__item .txt {
  max-height: 15rem;
  -webkit-line-clamp: inherit;
  overflow-y: scroll;
  padding-right: 0.25rem;
}
.commList .slick-current.commList__item .txt::-webkit-scrollbar {
  width: 0.375rem;
  background-color: #fff;
  border-radius: 100rem;
}
.commList .slick-current.commList__item .txt::-webkit-scrollbar-thumb {
  background-color: var(--mjColor-l);
  border-radius: 100rem;
}

.commTop {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: clamp(0.75rem, 1vw, 1rem);
  margin-bottom: clamp(0.5rem, 1vw, 1rem);
}
.commTop .name {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  font-size: var(--text);
  font-weight: var(--heavy);
  color: var(--mjColor-d);
  margin-bottom: 0.25rem;
}
.commTop .starBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-left: auto;
  gap: clamp(0.15rem, 0.25vw, 0.25rem);
}
.commTop .starBox img {
  --starW: clamp(.9rem, 1.325vw, 1.325rem);
  width: var(--starW);
  height: var(--starW);
}
.commTop .source {
  color: var(--mjColor-l);
  font-size: calc(var(--textS));
  text-wrap: nowrap;
}

.nameBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  line-height: var(--lineHeight--title);
}

.slick-counter {
  text-align: center;
  color: white;
  margin: clamp(1rem, 1.5vw, 1.5rem) 0;
}
.slick-counter .current {
  color: var(--subColor);
}

.commSlick .slick-prev,
.commSlick .slick-next {
  --w: clamp(2rem, 2.5vw, 2.5rem);
  width: var(--w);
  height: var(--w);
  aspect-ratio: 1;
  top: calc(100% + (clamp(1rem, 1.5vw, 1.5rem) * 1.5));
}
.commSlick .slick-prev:before,
.commSlick .slick-next:before {
  font-family: "bootstrap-icons";
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-radius: 99rem;
  border: 1px solid white;
  width: var(--w);
  height: var(--w);
  aspect-ratio: 1;
}
.commSlick .slick-prev {
  left: 30%;
}
.commSlick .slick-prev:before {
  content: "";
}
.commSlick .slick-next {
  right: 30%;
}
.commSlick .slick-next:before {
  content: "";
}

.feaList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.feaList__item {
  background-size: cover;
  position: relative;
}
.feaList__item:first-child {
  background-image: url(../images/about/fea-bgShadow1.jpg);
}
.feaList__item:first-child .feaList__item__inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: calc(var(--blockHeight) * 2) 0;
}
.feaList__item:first-child .feaList__item__inner:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: -webkit-gradient(linear, left top, left bottom, from(white), color-stop(25%, transparent));
  background: -o-linear-gradient(top, white, transparent 25%);
  background: linear-gradient(to bottom, white, transparent 25%);
}
.feaList__item:first-child .outline {
  display: none;
}
.feaList__item:first-child .feaTit {
  text-align: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.feaList__item:first-child .txtBox {
  padding: 0 calc(var(--container));
  margin-bottom: calc(-1 * clamp(4rem, 10vw, 10rem));
}
.feaList__item:nth-child(odd) {
  background-image: url(../images/about/fea-bgShadow2.jpg);
}
.feaList__item:nth-child(odd) .picBox {
  border-radius: 0 var(--imgRadiusM) var(--imgRadiusM) 0;
}
.feaList__item:nth-child(odd) .outline {
  border-radius: 0 var(--outlineRadius) var(--outlineRadius) 0;
  padding-left: 0;
}
@media screen and (max-width: 768px) {
  .feaList__item:nth-child(odd) .outline {
    margin-right: calc(var(--container) / 2);
  }
}
.feaList__item:nth-child(even) {
  background-image: url(../images/about/fea-bgBlue1.png);
}
.feaList__item:nth-child(even) .picBox {
  border-radius: var(--imgRadiusM) 0 0 var(--imgRadiusM);
}
.feaList__item:nth-child(even) .outline {
  border-radius: var(--outlineRadius) 0 0 var(--outlineRadius);
  padding-right: 0;
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}
@media screen and (max-width: 768px) {
  .feaList__item:nth-child(even) .outline {
    margin-left: calc(var(--container) / 2);
  }
}
.feaList__item:nth-child(even) .txtBox {
  color: white;
}
@media screen and (max-width: 768px) {
  .feaList__item:nth-child(even) .txtBox {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
  }
}
.feaList__item:nth-child(even) .feaTit {
  color: white;
}
.feaList__item:nth-child(even) .feaTit__en {
  color: white;
}
.feaList__item:nth-child(4) {
  background-image: url(../images/about/fea-bgBlue2.png);
}
.feaList__item:last-child {
  background-image: url(../images/index/doctorGroup-bg.jpg?);
  background-size: contain;
  background-repeat: no-repeat;
}
.feaList__item:last-child .feaList__item__inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: calc(var(--blockHeight) * 2) 0;
  padding-bottom: 0;
}
.feaList__item:last-child .outline {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
  outline: none;
  padding: 0;
}
@media screen and (max-width: 768px) {
  .feaList__item:last-child .outline {
    margin: 0;
  }
}
.feaList__item:last-child .picBox {
  border-radius: 0;
}
.feaList__item:last-child .feaTit {
  text-align: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.feaList__item:last-child .txtBox {
  padding: 0 calc(var(--container));
  margin-bottom: calc(-1 * clamp(4rem, 10vw, 10rem));
}
.feaList__item__inner {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 1fr;
  grid-template-columns: 1fr 1fr;
  padding: clamp(2rem, 4vw, 4rem) 0;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (max-width: 768px) {
  .feaList__item__inner {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    gap: clamp(1.25rem, 1.5vw, 1.5rem);
  }
}
.feaList__item .txtBox {
  padding: 0 calc(var(--container) / 2);
  font-weight: var(--bold);
}
.feaList__item .txtBox p {
  text-indent: 2em;
}
@media screen and (max-width: 768px) {
  .feaList__item .txtBox {
    padding: calc(var(--container) / 2);
  }
}
.feaList__item .feaTit {
  width: 100%;
  font-size: var(--titleM);
  font-weight: var(--heavy);
  line-height: var(--lineHeight--title);
  color: var(--mjColor-d);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  margin-bottom: clamp(1rem, 1.5vw, 1.5rem);
}
.feaList__item .feaTit__en {
  font-size: var(--text);
  font-weight: var(--bold);
  color: var(--mjColor);
  letter-spacing: 0;
  margin-top: clamp(0.25rem, 0.5vw, 0.5rem);
}
.feaList__item .outline {
  outline: 1px solid white;
  padding: clamp(0.5rem, 1vw, 1rem);
  --outlineRadius: calc(var(--imgRadiusM) * 1.15);
}
.feaList__item .numList {
  counter-reset: Num;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr clamp(1rem, 4vw, 4rem) 1fr clamp(1rem, 4vw, 4rem) 1fr;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(1rem, 4vw, 4rem);
  margin-top: clamp(1rem, 2vw, 2rem);
  margin-bottom: clamp(1rem, 8vw, 8rem);
  position: relative;
  font-size: var(--text);
}
.feaList__item .numList__item .txt {
  counter-increment: Num;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.feaList__item .numList__item .txt:before {
  content: counter(Num);
  --numW: clamp(1rem, 1.25vw, 1.5rem);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: var(--numW);
  height: var(--numW);
  font-size: var(--textS);
  aspect-ratio: 1;
  border-radius: 100%;
  background: var(--mjColor-d);
  color: white;
  --space: clamp(.225rem, .3vw, .325rem);
  padding-top: 0.15rem;
  margin-top: var(--space);
  margin-right: var(--space);
}
@media screen and (max-width: 768px) {
  .feaList__item .numList {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
}

.advList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: clamp(1rem, 3vw, 3rem) clamp(2rem, 5vw, 5rem);
  padding: 0 clamp(2rem, 12vw, 12rem);
  margin: calc(var(--blockHeight) * 2) 0;
}
.advList .feaTit {
  font-style: italic;
  text-align: center;
  position: relative;
  --advTit: clamp(1.75rem, 4vw, 4rem);
  font-size: var(--advTit);
}
.advList .feaTit:before {
  content: "";
  width: 100%;
  height: 100%;
  background-image: url(../images/index/title-deco.png);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transform: scale(1.5) translate(0.5rem, 0.5rem);
      -ms-transform: scale(1.5) translate(0.5rem, 0.5rem);
          transform: scale(1.5) translate(0.5rem, 0.5rem);
}
.advList .feaTit .num {
  font-family: "Noto Serif TC";
  font-size: calc(var(--advTit) * 1.5);
  margin: 0.25rem;
}
.advList__item {
  --circleW: clamp(240px, 20vw, 360px);
  --space: clamp(.5rem, 1vw, 1rem);
  width: var(--circleW);
  height: var(--circleW);
  aspect-ratio: 1;
  background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#BADBF0));
  background: -o-linear-gradient(top, #FFF 0%, #BADBF0 100%);
  background: linear-gradient(to bottom, #FFF 0%, #BADBF0 100%);
  border-radius: 100%;
  -webkit-box-shadow: 0 0 1rem rgba(0, 0, 0, 0.5);
          box-shadow: 0 0 1rem rgba(0, 0, 0, 0.5);
  padding: var(--space);
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}
.advList__item__inner {
  --innerCircleW: var(--circleW) - var(--space);
  width: var(--innerCircleW);
  height: var(--innerCircleW);
  aspect-ratio: 1;
  border: 1px solid var(--subColor);
  border-radius: 100%;
  color: var(--mjColor-d);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: calc(var(--space) * 1.5);
}
.advList__item .tit {
  text-wrap: nowrap;
  font-size: var(--titleS);
  font-weight: var(--heavy);
  line-height: var(--lineHeight--title);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: clamp(0.25rem, 0.5vw, 0.5rem);
  margin-bottom: clamp(0.5rem, 1vw, 1rem);
}
.advList__item .tit:before, .advList__item .tit:after {
  content: "";
  --starW: clamp(1rem, 1.5vw, 1.5rem);
  width: var(--starW);
  height: var(--starW);
  background: url(../images/all/titleStar-sub.svg);
  background-size: cover;
}
.advList__item:hover {
  -webkit-transform: scale(1.05);
      -ms-transform: scale(1.05);
          transform: scale(1.05);
}

.docTabList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: clamp(0.5rem, 1vw, 1rem);
  margin-bottom: clamp(2rem, 4vw, 4rem);
}
.docTabList__item {
  width: 100%;
  font-size: var(--text);
  line-height: 1;
  text-align: center;
  border-radius: 99rem;
  background: var(--subColor);
  color: white;
  padding: clamp(0.5rem, 1vw, 1rem);
}

.docCardList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.docCardList__item {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 2fr var(--gap) 5fr;
  grid-template-columns: 2fr 5fr;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
  --gap: clamp(1rem, 2vw, 2rem);
  gap: var(--gap);
  padding: clamp(2rem, 6vw, 6rem) var(--container);
}
.docCardList__item:nth-child(even) {
  background: #f3f8fb;
}
.docCardList__item .infoBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: calc(var(--gap));
}
.docCardList__item .picBox {
  border-radius: var(--imgRadiusS) 0 var(--imgRadiusS) 0;
}
.docCardList__item .picBox:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: var(--subColor);
}
@media screen and (max-width: 1680px) {
  .docCardList__item {
    padding: clamp(1rem, 4vw, 4rem) calc(var(--container) / 2);
  }
}
@media screen and (max-width: 768px) {
  .docCardList__item {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
}

.docName {
  font-size: var(--titleM);
  font-weight: var(--heavy);
  line-height: var(--lineHeight--title);
  color: var(--mjColor-d);
}
.docName .title {
  margin: clamp(0.25rem, 0.75vw, 0.75rem);
  font-size: var(--text);
}

.itemList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: clamp(0.25rem, 0.5vw, 0.5rem);
}
.itemList__item {
  line-height: 1;
  font-size: var(--textS);
  border-radius: 99rem;
  border: 1px solid var(--subColor);
  color: var(--subColor);
  padding: clamp(0.25rem, 0.5vw, 0.5rem) clamp(0.5rem, 1vw, 1rem);
}

.itemTit {
  font-size: var(--text);
  font-weight: var(--heavy);
  color: var(--mjColor-d);
  width: 100%;
  -webkit-column-span: all;
     -moz-column-span: all;
          column-span: all;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 0.5rem;
}
.itemTit:after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background: var(--mjColor-d);
  opacity: 0.25;
}
.itemTit__en {
  letter-spacing: 0;
}

.expList {
  -webkit-column-count: 2;
     -moz-column-count: 2;
          column-count: 2;
  -webkit-column-gap: clamp(0.5rem, 0.75vw, 0.75rem);
     -moz-column-gap: clamp(0.5rem, 0.75vw, 0.75rem);
          column-gap: clamp(0.5rem, 0.75vw, 0.75rem);
}
.expList__item {
  border-bottom: 1px dashed var(--gray);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: clamp(0.25rem, 0.5vw, 0.5rem);
  margin-bottom: clamp(0.25rem, 0.5vw, 0.5rem);
  -webkit-column-break-inside: avoid;
     -moz-column-break-inside: avoid;
          break-inside: avoid;
  font-size: var(--text);
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
}
.expList__item:before {
  content: "";
  display: block;
  --starW: clamp(1rem, 1.25vw, 1.25rem);
  width: var(--starW);
  height: var(--starW);
  aspect-ratio: 1;
  margin: clamp(0.25rem, 0.4vw, 0.4rem);
  background: url(../images/all/titleStar-B.svg);
  background-size: cover;
}
@media screen and (max-width: 991px) {
  .expList {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
}

.picWrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.webBtn {
  display: block;
  font-size: var(--text);
  line-height: 1;
  background: var(--mjColor-d);
  color: white;
  border-radius: 99rem;
  margin-top: 1rem;
  position: relative;
  overflow: hidden;
}
.webBtn .txt {
  text-wrap: nowrap;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border: 1px solid white;
  padding: clamp(0.5rem, 0.5vw, 0.5rem) clamp(1.5rem, 1.5vw, 1.5rem);
  padding-top: clamp(0.75rem, 0.75vw, 0.75rem);
  border-radius: 99rem;
  margin: clamp(0.25rem, 0.25vw, 0.25rem);
  position: relative;
}
.webBtn .txt:before, .webBtn .txt:after {
  content: "";
  display: block;
  width: var(--text);
  height: var(--text);
  background: url(../images/all/bnStar.svg);
  position: relative;
  z-index: 5;
}
.webBtn:before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  background: var(--subColor);
  position: absolute;
  top: 0;
  left: -100%;
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}
.webBtn:hover:before {
  left: 0;
}

a.webBtn[href=""] {
  display: none;
}

.treatList {
  width: 90%;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr;
  grid-template-columns: 1fr;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
  gap: clamp(1rem, 2vw, 2rem);
  padding-bottom: clamp(2rem, 4vw, 4rem);
  margin: auto;
  --treat-ic: clamp(3.5rem, 4vw, 4rem);
  --txtGap: clamp(.5rem, 1vw, 1rem);
  --treat__header__p: clamp(.75rem, 1vw, 1rem);
}
.treatList__item {
  background: white;
  border-radius: calc(var(--imgRadiusS) / 2) 0 calc(var(--imgRadiusS) / 2) 0;
  -webkit-box-shadow: 0 0 1rem rgba(0, 59, 99, 0.3);
          box-shadow: 0 0 1rem rgba(0, 59, 99, 0.3);
  overflow: hidden;
}
@media screen and (max-width: 1200px) {
  .treatList {
    width: 100%;
  }
}
@media screen and (max-width: 991px) {
  .treatList {
    width: 90%;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    width: 100%;
  }
}

.treat__header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: var(--treat__header__p);
  overflow: hidden;
  -webkit-box-shadow: 0 0 1rem rgba(0, 59, 99, 0.3);
          box-shadow: 0 0 1rem rgba(0, 59, 99, 0.3);
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
@media screen and (max-width: 991px) {
  .treat__header {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

.treatTxt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--txtGap);
  margin-right: auto;
}
.treatTxt .tit {
  font-size: clamp(1rem, 1.5vw, 1.5rem);
  color: var(--mjColor-d);
  font-weight: var(--bold);
  line-height: var(--lineHeight--title);
}
.treatTxt .tit__en {
  font-size: var(--textS);
  line-height: 1;
  letter-spacing: 0;
  color: var(--mjColor);
}

.treat__body {
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}
.treat__body .txt {
  padding: var(--txtGap);
  padding-left: calc(var(--treat__header__p) + var(--treat-ic) + var(--txtGap));
  font-size: var(--text);
  font-weight: var(--bold);
}

.treatBtnWrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: clamp(0.25rem, 0.5vw, 0.5rem);
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}

.conInfoBox {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr clamp(1rem, 4vw, 4rem) 1fr;
  grid-template-columns: 1fr 1fr;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: clamp(2rem, 8vw, 8rem) clamp(1rem, 4vw, 4rem);
  margin-bottom: 2rem;
}
.conInfoBox:last-child {
  margin-top: calc(var(--blockHeight) * 2);
}
.conInfoBox__item {
  --gap: clamp(.25rem, .5vw, .5rem);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: var(--gap);
}
.conInfoBox--btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 2rem;
}
.conInfoBox--tit {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media screen and (max-width: 768px) {
  .conInfoBox--tit {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
@media screen and (max-width: 768px) {
  .conInfoBox {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
}

.conSocialList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: clamp(1rem, 1.5vw, 1.5rem);
}
.conSocialList__item {
  border-radius: 99rem;
  background: rgba(255, 255, 255, 0.75);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: clamp(0.5rem, 0.5vw, 0.5rem);
  padding-right: clamp(1.5rem, 3vw, 3rem);
  -webkit-box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.15);
          box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.15);
  position: relative;
}
.conSocialList__item .social-ic {
  border-radius: 99rem;
  aspect-ratio: 1;
  overflow: hidden;
  --socialW: clamp(2.5rem, 4vw, 4rem);
  width: var(--socialW);
  height: var(--socialW);
}
.conSocialList__item .txt {
  text-wrap: nowrap;
  font-size: calc(var(--titleS) * .85);
  font-weight: var(--heavy);
  color: var(--mjColor-d);
  padding: clamp(0.25rem, 0.5vw, 0.5rem) clamp(0.5rem, 0.75vw, 0.75rem);
  font-family: "Noto Serif TC", serif;
}
.conSocialList__item:hover {
  -webkit-transform: scale(1.05);
      -ms-transform: scale(1.05);
          transform: scale(1.05);
}
@media screen and (max-width: 991px) {
  .conSocialList {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

.--fb {
  background: -o-linear-gradient(135deg, #174A98 0%, #4A7DCC 100%);
  background: linear-gradient(-45deg, #174A98 0%, #4A7DCC 100%);
}

.--ig {
  background: -o-linear-gradient(45deg, #FFA612 0%, #E23A6D 25%, #E23A6D 65%, #A33F99 100%);
  background: linear-gradient(45deg, #FFA612 0%, #E23A6D 25%, #E23A6D 65%, #A33F99 100%);
}

.--line {
  background: -o-linear-gradient(135deg, #10AA11 0%, #4DD34E 100%);
  background: linear-gradient(-45deg, #10AA11 0%, #4DD34E 100%);
}

.--phone {
  background: var(--mjColor-d);
}

.--reservation {
  background: var(--subColor);
}

.conTitleBox {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  line-height: var(--lineHeight--title);
  gap: calc(var(--gap) / 2);
}
.conTitleBox--branch:after {
  content: "";
  width: 100%;
  height: 0.05rem;
  background: -webkit-gradient(linear, right top, left top, from(rgba(255, 255, 255, 0)), color-stop(20%, var(--mjColor-l)), color-stop(80%, var(--mjColor-l)), to(rgba(255, 255, 255, 0)));
  background: -o-linear-gradient(right, rgba(255, 255, 255, 0) 0%, var(--mjColor-l) 20%, var(--mjColor-l) 80%, rgba(255, 255, 255, 0) 100%);
  background: linear-gradient(to left, rgba(255, 255, 255, 0) 0%, var(--mjColor-l) 20%, var(--mjColor-l) 80%, rgba(255, 255, 255, 0) 100%);
  opacity: 0.75;
  margin-top: calc(var(--gap) / 2);
}
.conTitleBox .tit {
  font-size: calc(var(--titleS));
  font-weight: var(--heavy);
  color: var(--mjColor-d);
}
.conTitleBox .tit__en {
  font-weight: var(--bold);
  color: var(--mjColor);
}

.fTop__time__box {
  --weekly-timeW: clamp(5rem, 6.25vw, 6.25rem);
  --p: clamp(.5rem, 1.25vw, 1.25rem);
  width: 100%;
  font-size: var(--textS);
  background: rgba(255, 255, 255, 0.15);
  color: var(--mjColor-d);
  border: 1px solid var(--mjColor-l);
  padding: 0.125rem 1.125rem;
}

.fTopTimeTit {
  list-style: none;
  padding: 0;
  margin: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: var(--p) 0;
  border-bottom: 1px dashed var(--mjColor-l);
}

.fTopTimeContent {
  list-style: none;
  padding: 0;
  margin: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 0.5rem;
  padding: var(--p) 0;
}
.fTopTimeContent li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.weekly-time {
  width: var(--weekly-timeW);
  font-family: "Noto Serif TC", serif;
  font-weight: 600;
}

.weekly-date {
  width: calc((100% - var(--weekly-timeW)) / 7);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.iconCircle,
.iconNone {
  --w: clamp(1rem, 2vw, 2rem);
  width: var(--w);
  height: var(--w);
}

.iconCircle {
  background: url(../images/all/circle.svg);
  background-size: cover;
}

.iconNone {
  background: url(../images/all/none.svg);
  background-size: cover;
}

.faqCategory {
  margin-bottom: var(--blockHeight);
  position: relative;
}
.faqCategory__title {
  font-size: var(--titleS);
  font-weight: var(--bold);
  color: var(--mjColor-d);
  position: relative;
}
.faqCategory__title:after {
  content: "";
  width: 100%;
  height: 1px;
  border-bottom: 1px solid var(--gray);
  position: absolute;
  bottom: 0;
  left: 0;
}

.faqListGroup {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.faqList {
  --circleSize--l: clamp(3.25rem, 5vw, 5rem);
  --circleSize--s: clamp(2rem, 3vw, 3rem);
  --circleTxt: clamp(1rem, 2vw, 2rem);
  --bodySpace: clamp(1rem, 1.5vw, 1.5rem) clamp(1.5rem, 2.5vw, 2.5rem);
  --headerSpace: clamp(.75rem, 1vw, 1rem);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.faqList__box {
  position: relative;
  border-bottom: solid 1px var(--gray);
}
.faqList__box::before {
  content: "";
  position: absolute;
  z-index: -1;
  -o-transition: all 0.3s linear;
  -webkit-transition: all 0.3s linear;
  transition: all 0.3s linear;
}
.faqList__box.open .faqHeader {
  position: relative;
  z-index: 1;
  -webkit-box-shadow: 0 0.5rem 1.5rem -1rem rgba(0, 0, 0, 0.15);
          box-shadow: 0 0.5rem 1.5rem -1rem rgba(0, 0, 0, 0.15);
}
.faqList__box.open .faqHeader::before {
  background: var(--subColor);
}
.faqList__box.open .faqHeader::after {
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
}

.faqHeader {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: pointer;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}
.faqHeader::before {
  content: "Q";
  color: white;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-family: "Noto Sans Serif";
  font-size: var(--circleTxt);
  font-weight: 400;
  letter-spacing: 0;
  background: var(--mjColor-d);
  width: var(--circleSize--s);
  height: var(--circleSize--s);
  border-radius: 99rem;
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
}
.faqHeader::after {
  content: "";
  font-family: bootstrap-icons !important;
  font-size: clamp(1rem, 1.5vw, 1.5rem);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: clamp(2rem, 4vw, 4rem);
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}
.faqHeader .tit {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0 auto 0 0;
  font-size: clamp(1rem, 1.2vw, 1.2rem);
  font-weight: 500;
  padding: var(--headerSpace);
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}
.faqHeader:hover {
  background: var(--lightGray);
}

.faqBody {
  position: relative;
  padding: var(--bodySpace);
  padding-left: var(--circleSize--l);
  background: var(--lightGray);
  display: block;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
  font-size: var(--text);
}
.faqBody::before {
  content: "A";
  position: absolute;
  left: calc(var(--circleSize--s) / 2);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: var(--circleTxt);
  font-weight: 500;
  width: var(--circleSize--s);
  height: var(--circleSize--s);
  color: var(--mainColorD);
}
.faqBody::after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  width: 100%;
  height: 2px;
}
.faqBody__inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding-left: clamp(0.5rem, 0.75vw, 0.75rem);
}
.faqBody__inner .picBox {
  gap: clamp(0.5rem, 1vw, 1rem);
}

.conWrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  border-radius: var(--radiusS);
  -webkit-box-shadow: 0 0 1rem rgba(0, 0, 0, 0.2);
          box-shadow: 0 0 1rem rgba(0, 0, 0, 0.2);
  overflow: hidden;
}
.conWrap .conPic {
  width: 40%;
  overflow: hidden;
}
.conWrap .txtBox {
  margin-bottom: clamp(1rem, 2vw, 2rem);
}

.formGroupWrap {
  width: 80%;
  margin: auto;
  overflow: hidden;
  padding: clamp(1rem, 3vw, 3rem) clamp(1rem, 4vw, 4rem);
  position: relative;
  z-index: 5;
}

.formGroup {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: var(--gap);
  --gap: clamp(1rem, 2vw, 2rem);
}
.formGroup__item {
  width: 100%;
}
.formGroup__item--half {
  width: calc(50% - (var(--gap) / 2));
}
.formGroup__item--bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: end;
  gap: var(--gap);
}

.form-control {
  width: 100%;
  border-radius: 0;
  border: 1px solid var(--gray);
  padding: 0.5rem;
  background: rgba(255, 255, 255, 0.3);
}
.form-control:focus {
  border-color: var(--gray);
  -webkit-box-shadow: 0 0 0 0.25rem rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 0 0.25rem rgba(0, 0, 0, 0.1);
}

textarea {
  resize: none;
}

footer {
  position: relative;
}
footer a {
  color: var(--mjColor-d);
}
footer a:hover {
  opacity: 0.8;
  text-decoration: none;
}

.copyright {
  background: white;
  padding: clamp(0.75rem, 1vw, 1rem);
  font-family: "Noto Serif TC", serif;
  font-weight: var(--bold);
  color: var(--mjColor-d);
  text-align: center;
}

.treatmentNav {
  padding: 0 calc(var(--container) / 4);
}
@media screen and (max-width: 991px) {
  .treatmentNav {
    padding: 0;
  }
}
.treatmentNav__wrap {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr clamp(9px, 2vw, 20px) 1fr clamp(9px, 2vw, 20px) 1fr clamp(9px, 2vw, 20px) 1fr;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(9px, 2vw, 20px);
  padding: clamp(1rem, 4vw, 4rem) calc(var(--container) / 2);
  border-bottom: 1px dotted #003B63;
  margin: 0 auto;
}
@media screen and (max-width: 991px) {
  .treatmentNav__wrap {
    -ms-grid-columns: (1fr)[2];
    grid-template-columns: repeat(2, 1fr);
    padding: clamp(1rem, 4vw, 4rem) calc(var(--container) / 6);
  }
}
.treatmentNav .item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: clamp(0.8rem, 1rem, 27px);
  border: 1px solid #003B63;
  padding: 13px 15px;
  border-radius: clamp(18px, 2vw, 40px);
}
@media screen and (max-width: 991px) {
  .treatmentNav .item {
    padding: 6px 7px;
  }
}
.treatmentNav .item:hover {
  background: var(--mjColor-d);
  -webkit-transform: scale(1.05);
      -ms-transform: scale(1.05);
          transform: scale(1.05);
}
.treatmentNav .item:hover .txt .tit {
  color: white;
}
.treatmentNav .item:hover .txt .en {
  color: white;
}
.treatmentNav .item .img {
  width: 64px;
  height: 64px;
  border-radius: 100%;
  background: white;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (max-width: 991px) {
  .treatmentNav .item .img {
    width: 29px;
    height: 29px;
  }
}
.treatmentNav .item .txt {
  text-align: center;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  color: var(--mjColor-d);
}
.treatmentNav .item .txt .tit {
  font-size: var(--text);
  font-weight: var(--bold);
  line-height: var(--lineHeight--title);
  margin-bottom: clamp(0.25rem, 0.5vw, 0.5rem);
  -webkit-transition-duration: 0.3s;
       -o-transition-duration: 0.3s;
          transition-duration: 0.3s;
}
.treatmentNav .item .txt .en {
  font-size: clamp(0.5rem, 0.9vw, 0.9rem);
  line-height: 1;
  letter-spacing: 0;
  -webkit-transition-duration: 0.3s;
       -o-transition-duration: 0.3s;
          transition-duration: 0.3s;
}

.treatmentList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.treatmentList .item:nth-child(even) {
  background: #f3f8fb;
}
.treatmentList .item .inner {
  padding: clamp(1rem, 4rem, 4rem) calc(var(--container));
}
@media screen and (max-width: 991px) {
  .treatmentList .item .inner {
    padding: clamp(1rem, 4rem, 53px) calc(var(--container) / 6);
  }
}
.treatmentList .item .header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 30px;
}
.treatmentList .item .header .img {
  width: 64px;
  height: 64px;
}
@media screen and (max-width: 991px) {
  .treatmentList .item .header .img {
    width: 58px;
    height: 58px;
  }
}
.treatmentList .item .header .img img {
  display: block;
  border-radius: 100%;
  border: 1px solid #000;
}
.treatmentList .item .header .txt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-left: 30px;
}
@media screen and (max-width: 991px) {
  .treatmentList .item .header .txt {
    margin-left: 11px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
.treatmentList .item .header .txt .tit {
  font-size: var(--titleL);
  font-weight: var(--heavy);
  line-height: var(--lineHeight--title);
  color: var(--mjColor-d);
}
@media screen and (max-width: 991px) {
  .treatmentList .item .header .txt .tit {
    font-size: 26px;
  }
}
.treatmentList .item .header .txt .en {
  font-size: 24px;
  font-weight: var(--bold);
  color: var(--mjColor);
  letter-spacing: 0;
  margin-left: 20px;
}
@media screen and (max-width: 991px) {
  .treatmentList .item .header .txt .en {
    font-size: 16px;
    line-height: 1;
    margin-left: 0;
  }
}
.treatmentList .item .content p {
  font-size: var(--text);
  font-weight: var(--bold);
}
.treatmentList .item .content > * + * {
  margin-top: 30px;
}
.treatmentList .item .content .row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 10px;
}
@media screen and (max-width: 991px) {
  .treatmentList .item .content .row {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
.treatmentList .item .content .row .col {
  width: 50%;
}
@media screen and (max-width: 991px) {
  .treatmentList .item .content .row .col {
    width: 100%;
  }
}
.treatmentList .item .content .row .col img {
  display: block;
}
.treatmentList .item .content .sq_title {
  padding: 8px 20px;
  border: 1px solid #003B63;
  display: inline-block;
  color: #003B63;
  font-weight: var(--bold);
  font-size: var(--text);
}
.treatmentList .item .content .points {
  margin-top: 10px;
}
.treatmentList .item .content .points .point {
  padding: 10px 20px;
  font-size: var(--text);
  font-weight: var(--bold);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.treatmentList .item .content .points .point .dot {
  display: inline-block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 22px;
          flex: 0 0 22px;
  width: 22px;
  height: 22px;
  background: url(../images/treatment/point_dot.svg) 0 0 no-repeat;
  background-size: cover;
  margin-right: 10px;
}
.treatmentList .item .content .question .q {
  font-size: var(--titleM);
  font-weight: var(--normal);
  font-family: "Noto Sans Serif";
}
.treatmentList .item .content .pros {
  font-size: var(--titleS);
  font-weight: var(--bold);
  background: #003B63;
  color: white;
  padding: 7.5px 0;
  text-align: center;
}
.treatmentList .item .content .cons {
  font-size: var(--titleS);
  font-weight: var(--bold);
  background: #BFBFBF;
  color: white;
  padding: 7.5px 0;
  text-align: center;
}
.treatmentList .item .content .heart_note {
  font-size: var(--text);
  font-weight: var(--bold);
  color: var(--subColor);
  text-align: center;
  margin-top: 10px;
  padding: 8px 20px;
  border-radius: 30px;
  border: 1px solid var(--subColor);
}

.caseNav {
  padding: 0 calc(var(--container) / 4);
}
@media screen and (max-width: 991px) {
  .caseNav {
    padding: 0;
  }
}
.caseNav__wrap {
  padding: clamp(1rem, 4vw, 4rem) calc(var(--container) / 2);
  padding-top: 80px;
  border-bottom: 1px dotted #003B63;
  margin: 0 auto;
}
@media screen and (max-width: 991px) {
  .caseNav__wrap {
    padding: 50px calc(var(--container) / 6);
  }
}
.caseNav__title {
  font-weight: var(--heavy);
  font-size: 24px;
  color: var(--black);
  margin-bottom: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.caseNav__title .clearBtn {
  background: white;
  color: #7FABC7;
  padding: 0;
  border: 0;
  margin-left: 20px;
  font-weight: var(--heavy);
  font-size: 24px;
}
@media screen and (max-width: 991px) {
  .caseNav__title {
    display: none;
  }
}
.caseNav__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  gap: 10px;
}
.caseNav__list .item {
  font-size: var(--text);
  padding: 10px 20px;
  border: 1px solid #003B63;
  border-radius: 30px;
  font-family: "Noto Sans Serif";
  line-height: 120%;
}
.caseNav__list .item.active {
  background: var(--black);
  color: white;
}
@media screen and (max-width: 991px) {
  .caseNav__list .item {
    padding: 10px 15px;
  }
}

.caseCategory {
  line-height: var(--lineHeight--title);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: clamp(1rem, 2vw, 2rem);
}
@media screen and (max-width: 991px) {
  .caseCategory {
    margin-bottom: 30px;
  }
}
.caseCategory__mj {
  font-size: var(--titleL);
  font-weight: var(--heavy);
  letter-spacing: 0.25rem;
  color: var(--mjColor-d);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: clamp(0.5rem, 1vw, 1rem);
}
@media screen and (max-width: 991px) {
  .caseCategory__mj {
    font-size: 26px;
  }
}
.caseCategory__mj__en {
  font-size: 24px;
  font-weight: var(--bold);
  color: var(--mjColor);
  letter-spacing: 0;
}
@media screen and (max-width: 991px) {
  .caseCategory__mj__en {
    font-size: 16px;
  }
}

.caseListWrap {
  padding: 0 calc(var(--container) / 4);
  background: #f0f6f8;
}
@media screen and (max-width: 991px) {
  .caseListWrap {
    padding: 0;
  }
}
.caseListWrap .inner {
  padding: clamp(1rem, 4rem, 4rem) calc(var(--container));
}
@media screen and (max-width: 991px) {
  .caseListWrap .inner {
    padding: 30px calc(var(--container) / 6);
  }
}

.caseActions {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-top: 80px;
}
.caseActions .moreBtn {
  background: #14669d;
  color: white;
  border-radius: 50px;
  font-size: 20px;
  font-weight: 500;
  padding: 15px 50px;
  font-family: "Noto Sans Serif";
}

.doctorList {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  padding: 20px 30px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-radius: 10px;
  background: white;
  font-size: 20px;
  font-weight: 700;
  color: #BFBFBF;
  line-height: 38px;
}
.doctorList .spacer {
  display: inline-block;
  margin: 0 5px;
}
.doctorList .item {
  color: #BFBFBF;
}
.doctorList .item.active {
  color: var(--black);
}

.caseList {
  margin-top: 80px;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 30px 1fr 30px 1fr;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}
@media screen and (max-width: 1680px) {
  .caseList {
    -ms-grid-columns: (1fr)[2];
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (max-width: 768px) {
  .caseList {
    margin-top: 30px;
    -ms-grid-columns: (1fr)[1];
    grid-template-columns: repeat(1, 1fr);
  }
}
.caseList .item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  background: white;
  border-radius: 10px;
  overflow: hidden;
}
.caseList .item:hover {
  background: #E6E6E6;
}
.caseList .item:hover .docName {
  background: white;
}
.caseList .item .caseInfo {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 15px;
  padding: 30px;
}
@media screen and (max-width: 768px) {
  .caseList .item .caseInfo {
    gap: 10px;
    padding: 20px;
  }
}
.caseList .item .docName {
  font-size: 15px;
  font-weight: 500;
  color: var(--black);
  padding: 5px 10px;
  border-radius: 5px;
  background: #E6E6E6;
}
.caseList .item .docName span {
  font-family: "Noto Sans Serif";
}
.caseList .item .caseName {
  font-size: 24px;
  font-weight: 700;
  color: var(--black);
  line-height: 120%;
}
@media screen and (max-width: 768px) {
  .caseList .item .caseName {
    font-size: 20px;
  }
}
.caseList .item .caseImg {
  background: white;
  height: 257px;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  .caseList .item .caseImg {
    height: 201px;
  }
}
.caseList .item .caseImg img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.caseModal {
  position: fixed;
  inset: 0;
  z-index: 99998;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: opacity 0.3s ease, visibility 0.3s ease;
  -o-transition: opacity 0.3s ease, visibility 0.3s ease;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
.caseModal.is-open {
  opacity: 1;
  visibility: visible;
}
.caseModal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.75);
}
.caseModal__inner {
  position: relative;
  width: 100%;
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 90px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (max-width: 768px) {
  .caseModal__inner {
    padding: 0 20px;
  }
}
.caseModal__figure {
  position: relative;
  max-width: 100%;
  margin: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.caseModal__img {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: calc(100vh - 120px);
  border: 10px solid white;
  border-radius: 20px;
}
@media screen and (max-width: 768px) {
  .caseModal__img {
    max-height: calc(100vh - 160px);
    border-width: 6px;
    border-radius: 14px;
  }
}
.caseModal__btn {
  position: absolute;
  padding: 0;
  border: 0;
  background: transparent;
  color: white;
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: var(--transition);
  -o-transition: var(--transition);
  transition: var(--transition);
  z-index: 99;
}
.caseModal__btn svg {
  width: 100%;
  height: 100%;
}
.caseModal__btn--prev, .caseModal__btn--next {
  top: 50%;
  width: 60px;
  height: 100px;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
  .caseModal__btn--prev, .caseModal__btn--next {
    width: 21px;
    height: 40px;
    -webkit-transform: none;
        -ms-transform: none;
            transform: none;
  }
}
.caseModal__btn--prev svg, .caseModal__btn--next svg {
  width: 30px;
  height: 62px;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
}
@media screen and (max-width: 768px) {
  .caseModal__btn--prev svg, .caseModal__btn--next svg {
    width: 21px;
    height: 40px;
  }
}
.caseModal__btn--prev {
  left: 0px;
}
@media screen and (max-width: 768px) {
  .caseModal__btn--prev {
    left: 30px;
  }
}
.caseModal__btn--next {
  right: 0px;
}
@media screen and (max-width: 768px) {
  .caseModal__btn--next {
    right: 30px;
  }
}
.caseModal__btn--close {
  top: -28px;
  right: -37px;
  width: 74px;
  height: 74px;
  border-radius: 50%;
  background: white;
  color: var(--black);
}
@media screen and (max-width: 768px) {
  .caseModal__btn--close {
    top: -20px;
    right: -20px;
    width: 40px;
    height: 40px;
  }
}
.caseModal__btn--close svg {
  width: 60%;
  height: 60%;
}

body.caseModal-open {
  overflow: hidden;
}

.caseList .item[hidden] {
  display: none;
}

.caseNav__list .item[hidden] {
  display: none;
}

.caseActions[hidden] {
  display: none;
}

.caseNav__list .item,
.doctorList .item {
  cursor: pointer;
}

.caseEmpty {
  margin-top: 80px;
  text-align: center;
  font-size: var(--text);
  color: #7FABC7;
}

.faqListWrap {
  padding: 0;
}
@media screen and (max-width: 991px) {
  .faqListWrap {
    padding: 0;
  }
}
.faqListWrap .inner {
  padding: clamp(1rem, 4rem, 4rem) calc(var(--container));
}
@media screen and (max-width: 991px) {
  .faqListWrap .inner {
    padding: 30px calc(var(--container) / 6);
  }
}
.faqListWrap .item {
  border-bottom: 2px solid #003B63;
  padding: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (max-width: 991px) {
  .faqListWrap .item {
    padding: 20px 0;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
.faqListWrap .item .question {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 40%;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  font-size: 28px;
  font-weight: 600;
  line-height: 160%;
  margin-right: 3%;
}
.faqListWrap .item .question span {
  font-size: 32px;
  font-style: italic;
  margin-right: 9px;
}
@media screen and (max-width: 991px) {
  .faqListWrap .item .question {
    font-size: 24px;
    margin-right: 0;
    margin-bottom: 20px;
    width: 100%;
  }
  .faqListWrap .item .question span {
    font-size: 28px;
    margin-right: 13px;
  }
}
.faqListWrap .item .answer {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  white-space: pre-line;
  padding-left: 3%;
  border-left: 1px dashed #003B63;
  font-size: 20px;
  line-height: 180%;
  font-weight: 600;
  letter-spacing: 5%;
}
@media screen and (max-width: 991px) {
  .faqListWrap .item .answer {
    padding-left: 0;
    padding-top: 20px;
    border-left: 0;
    border-top: 1px dashed #003B63;
  }
}
.faqListWrap .item:first-child {
  border-top: 2px solid #003B63;
}

.contactNoteWrap {
  padding: clamp(1rem, 4vw, 4rem) calc(var(--container) / 2);
}
@media screen and (max-width: 991px) {
  .contactNoteWrap {
    padding: 50px 15px 30px 15px;
  }
}

.contactNote {
  max-width: 850px;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.contactNote .sq_title {
  padding: 8px 20px;
  border: 1px solid #003B63;
  display: block;
  color: #003B63;
  font-weight: 600;
  font-size: 20px;
}
@media screen and (max-width: 991px) {
  .contactNote .sq_title {
    margin: 0 auto;
  }
}
.contactNote .points {
  margin-top: 10px;
}
.contactNote .points .point {
  padding: 5px 0 0 20px;
  font-size: 20px;
  font-weight: 600;
  line-height: 32px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  letter-spacing: 5%;
}
.contactNote .points .point .dot {
  display: inline-block;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 22px;
          flex: 0 0 22px;
  width: 22px;
  height: 22px;
  background: url(../images/treatment/point_dot.svg) 0 0 no-repeat;
  background-size: cover;
  margin-right: 10px;
}

.contactWrap {
  background: #EFF6F8;
}
.contactWrap .inner {
  max-width: 1440px;
  margin: 0 auto;
  padding: clamp(1rem, 4rem, 4rem) 32px;
}
@media screen and (max-width: 991px) {
  .contactWrap .inner {
    padding: 30px 15px;
  }
}
.contactWrap form {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: minmax(0, 1fr) 80px minmax(0, 1fr);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 80px;
}
@media screen and (max-width: 991px) {
  .contactWrap form {
    -ms-grid-columns: minmax(0, 1fr);
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 0;
  }
}
.contactWrap form .field {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  min-width: 0;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  padding: 10px 0;
}
@media screen and (max-width: 991px) {
  .contactWrap form .field {
    padding: 16px 0;
  }
}
.contactWrap form .field.captcha {
  grid-column: 1/-1;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.contactWrap form .field.captcha label {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  width: 100%;
}
.contactWrap form .field.captcha .cf-turnstile {
  margin-left: 30px;
}
.contactWrap form .field.captcha button {
  font-size: 15px;
  font-weight: 500;
  color: white;
  background: #14669d;
  padding: 8px 16px;
  margin-left: auto;
  border: 0;
  border-radius: 50px;
  line-height: normal;
  font-family: "Noto Sans Serif";
}
@media screen and (max-width: 991px) {
  .contactWrap form .field.captcha {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width: 100%;
  }
  .contactWrap form .field.captcha .cf-turnstile {
    margin-left: auto;
  }
  .contactWrap form .field.captcha button {
    margin-top: 30px;
    margin-left: 0;
  }
}
.contactWrap form .field .deco {
  position: absolute;
  display: block;
  height: 2px;
  width: 100%;
  background: var(--black);
  bottom: 10px;
  left: 0;
}
.contactWrap form .field input, .contactWrap form .field select {
  border: 0;
  border-radius: 0;
  padding: 0;
  font-size: 24px;
  font-weight: bold;
  text-align: right;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  background: transparent;
  width: 100%;
}
.contactWrap form .field input option, .contactWrap form .field select option {
  font-size: 24px;
}
.contactWrap form .field input:focus, .contactWrap form .field select:focus {
  outline: none;
}
.contactWrap form .field input:focus ~ label, .contactWrap form .field select:focus ~ label {
  color: #7FABC7;
}
.contactWrap form .field input:focus ~ .deco, .contactWrap form .field select:focus ~ .deco {
  background: #7FABC7;
}
.contactWrap form .field select:has(option[value=""]:checked) {
  color: #BFBFBF;
}
.contactWrap form .field select option {
  color: var(--black);
}
.contactWrap form .field select option[value=""] {
  color: #BFBFBF;
}
.contactWrap form .field label {
  font-size: 20px;
  line-height: 36px;
  font-weight: bold;
  color: var(--black);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 165px;
          flex: 0 0 165px;
}
.contactWrap form .field label span {
  font-family: "Noto Sans Serif";
  font-size: 16px;
  font-weight: normal;
  margin-left: 4px;
}