@charset "utf-8";

/* Visual */
._fnctWrap ._fnctAdmin.fnct-visual {bottom:64px !important;}
.wrap-visual {position: relative; font-size: 0; opacity: 0;}
.wrap-visual .slider img {display:block; position:relative; left:50%; max-width:none; max-height:960px; height: 100%; transform:translate(-50%,0);}

.visual-util {position: absolute; left: 0; top: 32.5%; width: 100%;}

.visual-text strong {position: relative; left: -50px; opacity: 0; font-family: "FontAwesome", "微软雅黑", "Microsoft Yahei", "黑体", Arial; font-size: 70px; line-height: 1.1; letter-spacing: -3.5px; color: #fff;}
.visual-text p {position: relative; left: -50px; opacity: 0; margin: 30px 0 0 0; font-family: "FontAwesome", "微软雅黑", "Microsoft Yahei", "黑体", Arial; font-size: 25px; color: #fff;}
.visual-text a {position: relative; left: -50px; opacity: 0; display: inline-block; margin-top: 47px; padding: 15px 28px; border: 1px solid #fff; font-family: "FontAwesome", "微软雅黑", "Microsoft Yahei", "黑体", Arial; font-size: 18px; color: #fff !important;}
.visual-text a:hover {background: #fff; color: #016365 !important;}
.visual-text a::after {content: ''; display: inline-block; width: 36px; height: 11px; margin-left: 55px; background: url('../images/btn-visual-more.png') no-repeat right center; vertical-align: middle; transition: .35s;}
.visual-text a:hover::after {background-position: left center;}

.visual-control {position: relative; left: -50px; opacity: 0; display: flex; align-items: center; margin-left: 33.5%; margin-top: 100px;}
.visual-control::after {content: ''; position: absolute; right: calc(100% + 10px); top: 50%; width: 300%; height: 1px; background: #fff;}
.visual-control .paging ul {display: flex; align-items: center; font-size: 0;}
.visual-control .paging li {display: flex; align-items: center; margin-right: 5px;}
.visual-control .paging button {width: 11px; height: 11px; border: 1px solid #fff; border-radius: 100%; text-indent: -99999px;}
.visual-control .paging .slick-active button {width: 15px; height: 15px; background: #fff;}
.visual-control .switch {margin-left: 5px;}
.visual-control .switch .stop,
.visual-control .switch .play {display: none; width: 8px; height: 11px; text-indent: -99999px;}
.visual-control .switch .stop.on,
.visual-control .switch .play.on {display: block;}
.visual-control .switch .stop {background: url('../images/btn-visual-pause.png') no-repeat center;}
.visual-control .switch .play {background: url('../images/btn-visual-play.png') no-repeat center;}

@media (max-width: 1480px) {
  .wrap-visual .slider img {max-height: 900px}
  .visual-text strong {font-size: 60px; line-height: 1.2;}
  .visual-text p {font-size: 22px;}
  .visual-text a {font-size: 16px;}
}

@media (max-width: 1250px) {
  .wrap-visual .slider img {max-height: 850px}
  .visual-text strong {font-size: 50px;}
  .visual-text p {font-size: 20px;}
  .visual-text a {font-size: 14px;}
}

@media (max-width: 1000px) {
  .wrap-visual {opacity: 1 !important;}
  /* .wrap-visual .slider img {max-height: 490px} */
  .wrap-visual .slider img {max-height: 500px}
  .visual-util {top: 35.5%; padding-left: 50px;}
  .visual-text strong {left: 0 !important; opacity: 1 !important; font-size: 40px;}
  .visual-text p {left: 0 !important; opacity: 1 !important; margin-top: 14px; font-size: 20px;}
  .visual-text a {left: 0 !important; opacity: 1 !important; margin-top: 21px;}
  .visual-text a::after {margin-left: 25px;}
  .visual-control {left: 0 !important; opacity: 1 !important; margin-top: 40px; margin-left: 57.5%;}
}

@media (max-width: 840px) {
  .visual-util {top: 33.5%; padding-left: 20px;}
  .visual-text strong {font-size: 30px;}
  .visual-text p {font-size: 16px;}
  .visual-text a {padding: 8px 17px;}
}

@media (max-width: 660px) {
  /* #multipleDiv_guide_46 {height: 100vh !important;} */
  #menu969_obj3,
  .wrap-visual,
  .wrap-visual .slider,
  .wrap-visual .slider .slick-list,
  .wrap-visual .slider .slick-track,
  .wrap-visual .slider .slick-slide,
  .wrap-visual .slider div,
  .wrap-visual .slider li {overflow: hidden; height: auto;}
  .wrap-visual .slider li img {max-height: 500px;}
  .wrap-visual .slider img {left: 30%;}

  .visual-util {top: 0%; height: 100%; padding-left: 20px;}
  .visual-text {position: absolute; top: 45%; width: 100%; transform: translate(0, -50%);}
  .visual-text strong {font-size: 30px; letter-spacing: -2px;}
  .visual-text p {margin-top: 5px; font-size: 16px;}
  .visual-text a {margin-top: 19px;}
  .visual-control {position: absolute; left: 0; bottom: 40px}
  .visual-control::after {width: 750%;}
}
@media (max-width:550px) {
  .wrap-visual .slider li img {max-height: 380px;}

}