@charset "UTF-8";
/*------------------------------------------
  mainslider-01
------------------------------------------*/
.mainslider-01 {position:relative; max-width: 1920px; width: 100vw; overflow: hidden; top: 0; left: 50%; transform: translate(-50%, 0%); -webkit-transform: translate(-50%, 0%); -ms-transform: translate(-50%, 0%); margin-bottom: -1px;}
.mainslider-01 .main-catch {color: #fff; z-index: 2;}
.mainslider-01 .main-catch p:first-child {text-shadow: 2px 2px 4px rgba(0, 0, 0, .6);}
.mainslider-01 .main-catch p:last-child {text-shadow: 2px 2px 4px rgba(0, 0, 0, .6); font-size: 20px; font-size: 2rem; margin-top: 40px;}
.mainslider-01 .main-catch {font-size: 50px; font-size: 5rem; line-height: 1.5; position: absolute; text-align: center; width: 100%; top: 50%; left: 15%; -webkit-transform: translateY(-50%); transform: translateY(-50%); font-weight: 400; font-style: italic; text-shadow: 1px 1px 2px rgba(0, 0, 0, .8);}

@media only screen and (max-width: 1024px) {
  .mainslider-01 .main-catch p:last-child {font-size: 16px; font-size: 1.6rem; margin-top: 20px; line-height: 1.4;}
  .mainslider-01 .main-catch {font-size: 30px;font-size: 3rem;}
}
@media only screen and (max-width: 768px) {
  .mainslider-01 .main-catch {left: 5%; font-size: 24px; font-size: 2.4rem; position: relative; top: 0; left: 0; transform: initial; padding: 20px; color: #333;}
  .mainslider-01 .main-catch p:first-child {text-shadow: none;}
  .mainslider-01 .main-catch p:last-child {text-shadow: none;}
  .new-arrivals {position: static;}
  .new-arrivals .title {font-size: 16px; font-size: 1.6rem;}
  .new-arrivals .contents p {font-size: 14px; font-size: 1.4rem;}
}
@media only screen and (max-width: 440px) {
  .mainslider-01 .main-catch p:first-child {font-size: 18px;}
  .mainslider-01 .main-catch p:last-child {font-size: 14px; margin-top: 10px;}
}

/*------------------------------------------
  mainslider-02
------------------------------------------*/
.mainslider-02 {position:relative; max-width: 1920px; width: 100vw; overflow: hidden; top: 0; left: 50%; transform: translate(-50%, 0%); -webkit-transform: translate(-50%, 0%); -ms-transform: translate(-50%, 0%);}
.mainslider-02 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet::before, .mainslider-02 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, .mainslider-02 [class^=swiper-button-] {transition: all 0.3s ease;}
.mainslider-02 .swiper-container {width: 100%; height: 28vw; transition: opacity 0.6s ease;}
.mainslider-02 .swiper-container.swiper-container-coverflow {padding-top: 2%;}
.acf-block-preview .mainslider-02 .swiper-container.loading-01 {opacity: 1; visibility: initial;}
.mainslider-02 .swiper-container.loading-01 {opacity: 0; visibility: hidden;}
.mainslider-02 .swiper-container:hover .swiper-button-prev, .mainslider-02 .swiper-container:hover .swiper-button-next {transform: translateX(0); opacity: 1; visibility: visible;}
.mainslider-02 .swiper-slide {background-position: center; background-size: cover;}
.mainslider-02 .swiper-slide a {display: block; width: 100%; height: 100%;}
.mainslider-02 .swiper-slide .entity-img {display: none;}
.mainslider-02 .swiper-slide .content {position: absolute; top: 35%; left: 0; width: 50%; padding-left: 5%; color: #fff;}
.mainslider-02 .swiper-slide .content .title {font-size: 2.2em; font-weight: bold; margin-bottom: 30px; text-shadow: 2px 2px 2px #333; line-height: 1.5;}
.mainslider-02 .swiper-slide .content .caption {display: block; font-size: 1.6rem; line-height: 1.4; text-shadow: 2px 2px 2px #333;}
.mainslider-02 [class^=swiper-button-] {width: 44px; opacity: 0; visibility: hidden;}
.mainslider-02 .swiper-button-prev {transform: translateX(50px);}
.mainslider-02 .swiper-button-next {transform: translateX(-50px);}
.mainslider-02 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {margin: 0 9px; position: relative; width: 12px; height: 12px; background-color: #fff; opacity: 0.4;}
.mainslider-02 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet::before {content: ""; position: absolute; top: 50%; left: 50%; width: 18px; height: 18px; transform: translate(-50%, -50%); border: 0px solid #fff; border-radius: 50%;}
.mainslider-02 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet:hover, .mainslider-02 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active {opacity: 1;}
.mainslider-02 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active::before {border-width: 1px;}

@media (max-width: 1180px) {
  .mainslider-02 .swiper-slide .content .title {font-size: 25px;}
  .mainslider-02 .swiper-slide .content .caption {font-size: 12px;}
}
@media (max-width: 1023px) {
  .mainslider-02 .swiper-container {height: 60vw;}
  .mainslider-02 .swiper-container.swiper-container-coverflow {padding-top: 0;}
}
@media (max-width: 960px) {
  .mainslider-02 .swiper-slide .content {width: 90%;}
  .mainslider-02 .swiper-slide .content .caption {font-size: 16px;}
}
@media only screen and (max-width: 768px) {
  .mainslider-02 .swiper-slide .content {top: 10%; width: 85%;}
  .mainslider-02 .swiper-slide .content .title {margin-bottom: 5px;}
}
@media only screen and (max-width: 440px) {
  .mainslider-02 .swiper-slide .content .title {font-size: 18px;}
  .mainslider-02 .swiper-slide .content .caption {font-size: 14px;}
}

/*------------------------------------------
  mainslider-03
------------------------------------------*/
.mainslider-03 {position:relative; max-width: 1920px; width: 100vw; top: 0; left: 50%; transform: translate(-50%, 0%); -webkit-transform: translate(-50%, 0%); -ms-transform: translate(-50%, 0%);}
.mainslider-03 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet::before, .mainslider-03 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, .mainslider-03 [class^=swiper-button-] {transition: all 0.3s ease;}
.mainslider-03 [class^=swiper-slide-shadow-] {backface-visibility: hidden; -webkit-backface-visibility: hidden;}
.mainslider-03 .swiper-container {width: 100%; height: 34vw; transition: opacity 0.6s ease, transform 0.3s ease;}
.mainslider-03 .swiper-container:hover .swiper-button-prev, .mainslider-03 .swiper-container:hover .swiper-button-next {transform: translateX(0); opacity: 1; visibility: visible;}
.acf-block-preview .mainslider-03 .swiper-container.loading-02 {opacity: 1; visibility: initial;}
.mainslider-03 .swiper-container.loading-02 {opacity: 0;}
.mainslider-03 .swiper-container.scale-out {transform: scale(0.7);}
.mainslider-03 .swiper-container.scale-in {transform: scale(1);}
.mainslider-03 .swiper-slide {background-position: center; background-size: cover; perspective: 1600px;}
.mainslider-03 .swiper-slide.swiper-slide-active {z-index: 2;}
.mainslider-03 .swiper-slide .entity-img {display: none;}
.mainslider-03 .swiper-slide .content {position: absolute; top: 40%; left: 0; width: 50%; padding-left: 5%; color: #fff; transform: translateZ(100px) translateX(100px);}
.mainslider-03 .swiper-slide .content .title {font-size: 2.6em; font-weight: bold; margin-bottom: 30px; text-shadow: 2px 2px 2px #333;}
.mainslider-03 .swiper-slide .content .caption {display: block; font-size: 1.6rem; line-height: 1.4; text-shadow: 2px 2px 2px #333;}
.mainslider-03 [class^=swiper-button-] {width: 44px; opacity: 0; visibility: hidden;}
.mainslider-03 .swiper-button-prev {transform: translateX(50px);}
.mainslider-03 .swiper-button-next {transform: translateX(-50px);}
.mainslider-03 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {margin: 0 9px; position: relative; width: 12px; height: 12px; background-color: #fff; opacity: 0.4;}
.mainslider-03 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet::before {content: ""; position: absolute; top: 50%; left: 50%; width: 18px; height: 18px; transform: translate(-50%, -50%); border: 0px solid #fff; border-radius: 50%;}
.mainslider-03 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet:hover, .mainslider-03 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active {opacity: 1;}
.mainslider-03 .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active::before {border-width: 1px;}

@media (max-width: 1180px) {
  .mainslider-03 .swiper-slide .content .title {font-size: 25px;}
  .mainslider-03 .swiper-slide .content .caption {font-size: 12px;}
}
@media (max-width: 1023px) {
  .mainslider-03 .swiper-container {height: 60vw;}
}
@media only screen and (max-width: 768px) {
  .mainslider-03 .swiper-slide .content {width: 82%;}
  .mainslider-03 .swiper-slide .content .title {margin-bottom: 5px;}
}
@media only screen and (max-width: 440px) {
  .mainslider-03 .swiper-slide .content .title {font-size: 18px;}
  .mainslider-03 .swiper-slide .content .caption {font-size: 14px;}
  .mainslider-03 .swiper-slide .content {left: -20%;}
}

/*------------------------------------------
  mainvisual-accessory
------------------------------------------*/
.new-arrivals {width: 100%; position: absolute; z-index: 1; bottom: 0;}
.new-arrivals .title, .new-arrivals .contents {display: table-cell; vertical-align: middle; box-sizing: border-box;}
.new-arrivals .title {background: #333; color: #fff; text-align: center; width: 20%; font-size: 20px; font-size: 2rem;}
.new-arrivals .contents {width: 80%; padding: 0 2em; line-height: 1.5;}
.new-arrivals .contents a {display: block;}
.new-arrivals .contents a:hover {opacity: 1;}
.new-arrivals .contents p {display: inline-block; vertical-align: middle; font-size: 15px; font-size: 1.5rem; margin-left: 1em;}
.new-arrivals .contents .date {line-height: 1.2;}
.new-arrivals-inner {width: 100%; max-width: 1080px; height: 54px; margin: auto; display: table;}

@media only screen and (max-width: 768px) {
  .new-arrivals {position: static;}
  .new-arrivals .title {font-size: 16px; font-size: 1.6rem;}
  .new-arrivals .contents p {font-size: 14px; font-size: 1.4rem;}
  .swiper-button-prev, .swiper-container-rtl .swiper-button-next, .swiper-button-next, .swiper-container-rtl .swiper-button-prev {display: none !important;}
}