/* Video */
.hero { width: 100%; position: relative; }

.hero__banner { display: block; margin: 0 auto; }

.hero__caption { display: flex; flex-direction: column; align-items: center; position: absolute; top: 80%; left: 50%; transform: translate(-50%, -50%); }

.hero__play { max-width: 5.8333333333vw; margin: 1.6666666667vw 0 3.4722222222vw; }

.hero__roll { max-width: 1.4583333333vw; position: absolute; bottom: 10.4166666667vw; left: 50%; transform: translate(-50%, 0%); }

.hero .mouseIcon__dot { transform: translate(0, 0); animation: dotAni .8s forwards infinite; }

@media (max-width: 768px) { .hero .mouseIcon { display: none; } }

@keyframes dotAni { 0% { transform: translate(0, 0); }
  50% { transform: translate(0, -10%); }
  100% { transform: translate(0, 0); } }

.idxNewsSection { padding: 7.6388888889vw 0 0.888889vw; background: url(../images/news/newsSection_bg.jpg) no-repeat center 0; background-size: cover; }

.idxBSection { display: flex; justify-content: center; position: relative; }

.idxBSection__left, .idxBSection__right { position: relative; }

.idxBSection__left img, .idxBSection__right img { display: block; }

.idxBSection__dec { max-width: 49.0277777778vw; position: absolute; top: 0; left: 50%; z-index: 1; transform: translate(-51%, -36%); transition: all .5s; }

@media (max-width: 599px) { .idxBSection__dec { opacity: 0; } }

.idxBSection__more { max-width: 33.8194444444vw; display: block; position: absolute; top: 50%; left: 50%; transform: translate(-51%, -36%); z-index: 1; transition: all .5s; }

.idxBSection__more:hover { opacity: 1 !important; }

@media (max-width: 599px) { .idxBSection__more { transform: translate(-44%, -36%); opacity: 0; } }

.idxBSection .bG1 { display: none; }

@media (max-width: 599px) { .idxBSection .bG1 { width: 38%; display: flex; flex-direction: row-reverse; position: absolute; right: 37%; top: 35%; transition: all .5s; }
  .idxBSection .bG1 .bt1, .idxBSection .bG1 .bt2 { opacity: 0; }
  .idxBSection .bG1 .bt1 { transform: translate(50%, 0%); }
  .idxBSection .bG1 .bt2 { margin: 0 5px; transform: translate(-50%, 0%); } }

.idxBSection .bG2 { display: none; }

@media (max-width: 599px) { .idxBSection .bG2 { width: 36%; display: flex; flex-direction: column; position: absolute; left: 47%; top: 31%; transition: all .5s; }
  .idxBSection .bG2 .bt3 { width: 72%; margin-bottom: 41%; }
  .idxBSection .bG2 .bt3, .idxBSection .bG2 .bt4 { opacity: 0; }
  .idxBSection .bG2 .bt3 { transform: translate(0%, -50%); }
  .idxBSection .bG2 .bt4 { margin: 0 5px; transform: translate(0%, -50%); } }

@media (max-width: 599px) { .idxBSection.isAni .idxBSection__dec { transform: translate(-51%, -66%); animation: dect2b 1s forwards; }
  @keyframes dect2b { 0% { opacity: 0;
      transform: translate(-51%, -66%); }
    100% { opacity: 1;
      transform: translate(-51%, -36%); } }
  .idxBSection.isAni .idxBSection__more { transform: translate(-44%, -66%); animation: moret2b 1s 5s forwards; }
  @keyframes moret2b { 0% { opacity: 0;
      transform: translate(-51%, -66%); }
    100% { opacity: 1;
      transform: translate(-51%, -36%); } }
  .idxBSection.isAni .bt1 { animation: r2l 1s 1s forwards; }
  .idxBSection.isAni .bt2 { animation: l2r 1s 2s forwards; }
  .idxBSection.isAni .bt3 { animation: t2b 1s 3s forwards; }
  .idxBSection.isAni .bt4 { animation: t2b 1s 4s forwards; } }

@keyframes r2l { 0% { opacity: 0;
    transform: translate(50%, 0%); }
  100% { opacity: 1;
    transform: translate(0%, 0%); } }

@keyframes l2r { 0% { opacity: 0;
    transform: translate(-50%, 0%); }
  100% { opacity: 1;
    transform: translate(0%, 0%); } }

@keyframes t2b { 0% { opacity: 0;
    transform: translate(0%, -50%); }
  100% { opacity: 1;
    transform: translate(0%, 0%); } }

.idxPro { width: 100%; padding: 70px 0 100px; clear: both; overflow: hidden; background: url(../images/index/idxPro_bg.jpg) no-repeat center 0; background-size: cover; }

.idxPro__in { max-width: 1920px; margin: 0 auto; }

.idxPro__in.mobile { display: none; position: relative; }

@media (max-width: 599px) { .idxPro { padding: 30px 0; background: url(../images/index/idxProSlider_m_bg.jpg) no-repeat center 0 !important; }
  .idxPro__in.mobile { display: block; }
  .idxPro__in.mobile .idxProSlider { max-width: 85%; margin: 0 auto; padding: 0 30px; }
  .idxPro__in.mobile .swiper-pagination { width: 100%; }
  .idxPro__in.mobile .swiper-pagination .swiper-pagination-bullet { background: #fff; margin: 0 5px; }
  .idxPro__in.mobile .swiper-pagination .swiper-pagination-bullet-active { background: #a47741; }
  .idxPro__in.pc { display: none; } }

.idxProSlider { position: relative; padding: 0 6.25vw; }

.idxProSlider img, .idxProSlider picture { display: block; }

.idxProSlider__item:focus { outline: none; }

.idxProSlider .slick-prev, .idxProSlider .slick-next { opacity: 1; width: 40px; height: 85px; }

.idxProSlider .slick-prev:before, .idxProSlider .slick-next:before { content: " " !important; display: block; width: 100%; height: 100%; }

.idxProSlider .slick-prev { left: 2.5vw; }

.idxProSlider .slick-prev:before { background: url(../images/comm/slick_prev.png) no-repeat 0 0; background-size: cover; }

.idxProSlider .slick-next { right: 2.5vw; }

.idxProSlider .slick-next:before { background: url(../images/comm/slick_next.png) no-repeat 0 0; background-size: cover; }

@media (max-width: 599px) { .idxProSlider .slick-prev, .idxProSlider .slick-next { width: 20px; height: 43px; } }

.idxProSliderS { padding: 0 6.25vw; display: flex; }

.idxProSliderS img { display: block; }

.idxProSliderS .slick-slide:not(.slick-current) img { opacity: .3; }

.idxProSliderS .slick-slide { background-color: #7f5c33; }

.idxProSliderS .slick-slide > div { display: flex; }

.idxProSliderS__item:focus { outline: none; }

@media (max-width: 599px) { .idxProSliderS { display: none; } }

.idxMap { text-align: center; color: #fff; background-color: #1d1d1d; position: relative; }

.idxMap__in { padding: 7.9861111111vw 2.7777777778vw; }

.idxMap__hd { position: relative; z-index: 3; }

.idxMap .subTitle + p { padding-top: 1.0416666667vw; }

@media (max-width: 599px) { .idxMap__in { position: relative; }
  .idxMap__hd { padding: 0 10%; }
  .idxMap__hd p { margin-top: 15px; margin-bottom: 10px; } }

.loaddingSvg { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); opacity: 0; transition: opacity .3s; z-index: 9; }

.loaddingSvg.is-open { opacity: 1; }

.mapArea { margin-top: 50px; position: relative; min-height: 480px; }

@media (max-width: 599px) { .mapArea { position: initial; min-height: 340px; }
  .mapArea__map { width: 100%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -30%); margin: auto; z-index: 1; } }

.mapAreaLightBox { width: 100%; padding-top: 5px; max-width: 1280px; position: absolute; left: 0; right: 0; margin: auto; z-index: 3; visibility: hidden; opacity: 0; transition: visibility .3s .1s, opacity .3s; }

.is-open .mapAreaLightBox { visibility: visible; opacity: 1; transition: visibility .2s .1s, opacity .2s .3s; }

.mapAreaLightBox .slick-list { width: 100%; }

.mapAreaLightBox .slick-dots { bottom: -25px !important; }

.mapAreaLightBox .slick-dots li.slick-active button:before { color: #a47741; }

.mapAreaLightBox .slick-slide:focus { outline: none; }

.mapAreaLightBox__hd { padding-bottom: 13px; display: flex; align-items: center; justify-content: center; border-bottom: 1px solid #6c6969; }

.mapAreaLightBox .title { font-size: 24px; margin-left: 20px; margin-right: 30px; font-family: "DFLiHei"; color: white; text-align: center; }

@media (min-width: 480px) { .mapAreaLightBox .title { font-size: calc(24px + ((36 - 24) * (100vw - 480px) / (1200 - 480))); } }

@media (min-width: 1200px) { .mapAreaLightBox .title { font-size: 36px; } }

.mapAreaLightBox .link { padding: 8px 15px; font-size: 1rem; font-family: "Adobe Fan Heiti Std"; color: white; text-align: center; border-radius: 5px; background-color: #a47741; }

.mapAreaLightBox__bd { padding: 1.3888888889vw 0; display: flex; align-items: center; }

.mapAreaLightBox__item { width: 25%; max-width: 255px; margin: 2.0833333333vw 15px; text-align: left; color: white; }

.mapAreaLightBox__item h3 { font-size: 16px; padding: 14px 0; font-family: "Adobe Fan Heiti Std"; line-height: 1.333; border-bottom: 1px solid #6c6969; }

@media (min-width: 480px) { .mapAreaLightBox__item h3 { font-size: calc(16px + ((18 - 16) * (100vw - 480px) / (1200 - 480))); } }

@media (min-width: 1200px) { .mapAreaLightBox__item h3 { font-size: 18px; } }

.mapAreaLightBox__item .tel { font-size: 14px; padding: 14px 0; font-family: "Adobe Fan Heiti Std"; border-bottom: 1px solid #6c6969; }

@media (min-width: 480px) { .mapAreaLightBox__item .tel { font-size: calc(14px + ((16 - 14) * (100vw - 480px) / (1200 - 480))); } }

@media (min-width: 1200px) { .mapAreaLightBox__item .tel { font-size: 16px; } }

.mapAreaLightBox__item .addr { font-size: 14px; padding: 14px 0; font-family: "Adobe Fan Heiti Std"; color: #a47741; }

@media (min-width: 480px) { .mapAreaLightBox__item .addr { font-size: calc(14px + ((16 - 14) * (100vw - 480px) / (1200 - 480))); } }

@media (min-width: 1200px) { .mapAreaLightBox__item .addr { font-size: 16px; } }

.mapAreaLightBox__item + .mapAreaLightBox { margin-left: 90px; }

.mapAreaLightBox__close { position: absolute; top: 0; right: 0; }

@media (max-width: 599px) { .mapAreaLightBox { position: relative; width: 100%; padding: 0 10%; }
  .mapAreaLightBox .link { font-size: .75rem; }
  .mapAreaLightBox__bd { flex-direction: column; }
  .mapAreaLightBox__item { width: 100%; max-width: initial; }
  .mapAreaLightBox__close { right: 5%; } }

.mapMask { width: 100%; height: 100%; position: absolute; top: 0; left: 0; margin: auto; z-index: 2; background-color: rgba(0, 0, 0, 0.95); visibility: hidden; opacity: 0; transition: visibility .5s .1s, opacity .2s; }



.mapMask.is-open { visibility: visible; opacity: 1; transition: visibility 0s .1s, opacity .2s; }

.idxFranchise { width: 100%; clear: both; background-color: #1d1d1d; }

.idxFranchise__in { max-width: 1275px; margin: 0 auto; padding: 70px 0; display: flex; justify-content: center; flex-direction: column; align-items: center; }

.idxFranchise .thirdTitle { margin-top: 50px; margin-bottom: 50px; }
@media (max-width: 599px) { .thirdTitle { z-index: 1; }

.idxFranchise__map { margin-bottom: 10.4166666667vw; }

@media (max-width: 599px) { .idxFranchise { padding: 0 5%; } }

.idxAnimation { width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 99; }

.idxAnimation__mask { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-color: #fff; z-index: 1; transform: scale(0); transform-origin: center center; transition: transform .3s; }

.idxAnimation__con { width: 100%; height: 100%; position: absolute; z-index: 2; display: flex; justify-content: center; align-items: center; }

.idxAnimation__logo { padding: 0px; position: absolute; left: 50%;  transform: translate(-50%, -60%) scale(1); transition: transform 1s, top 1s, left 1s, opacity 1s; opacity: 0; }

@media (max-width: 1200px) { .idxAnimation__logo { top: 65%; } }

@media (min-width: 1200px) { .idxAnimation__logo { top: 85%; } }

.idxAnimation__logo img { display: block; }

@media (max-width: 599px) { .idxAnimation__logo img { max-width: 190px; } }

.idxAnimation__logo--1 { transform: translate(-50%, -160%); transition-delay: .5s; }

.idxAnimation__logo--2 { transition-delay: .7s; }

.idxAnimation__logo--3 { transform: translate(-50%, 40%); transition-delay: .9s; }

.idxAnimation.enter { visibility: visible; }

.idxAnimation.enter .idxAnimation__mask { transform: scale(1); }

.idxAnimation.enter .idxAnimation__logo { opacity: 1; transition: transform 1s, top 1s, left 1s, opacity 1s; }

.idxAnimation.enter .idxAnimation__logo--1 { transform: translate(-50%, -150%); transition-delay: .3s; }

.idxAnimation.enter .idxAnimation__logo--2 { transform: translate(-50%, -50%); transition-delay: .4s; }

.idxAnimation.enter .idxAnimation__logo--3 { transform: translate(-50%, 50%); transition-delay: .5s; }

.idxAnimation.leave { visibility: hidden; transition: transform .5s, top .5s, left .5s, opacity .5s .5s, visibility 1s .1s; }

.idxAnimation.leave .idxAnimation__mask { transition: opacity .3s .6s; }

.idxAnimation.leave .idxAnimation__mask { opacity: 0; }

.idxAnimation.leave .idxAnimation__logo { transition: transform .6s, top .6s, left .6s, opacity 1s; left: 0; top: 0; transform: translate(0%, 0%) scale(0); opacity: 0; }

.idxAnimation.leave .idxAnimation__logo--1 { transition-delay: .3s; }

.idxAnimation.leave .idxAnimation__logo--2 { transition-delay: .4s; }

.idxAnimation.leave .idxAnimation__logo--3 { transition-delay: .5s; }