._fnctWrap {line-height:1.5;}

.wrap-visual {position: relative; background: url('../images/bg-visual.jpg') no-repeat center top; background-size: cover;}
.wrap-visual .container {position: relative; z-index: 100; padding: 0 70px 0 0;}
.wrap-visual::after {content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url('../images/pattern.png');}
.wrap-visual .slider li {width: 100%; padding: 90px 0 110px 0; table-layout: fixed;}
.wrap-visual .slider li::after {content: ""; display: block; clear: both;}
.wrap-visual .slider .title {position: absolute; left: 0; vertical-align: top; width: 52%; color: #fff; z-index: 1;}
.wrap-visual .slider .title .small {display: block; margin: 40px 0 0 0; font-family: 'Mont Regular'; font-size: 18px;}
.wrap-visual .slider .title .small i {position: relative;}
.wrap-visual .slider .title .small i::after {content: ''; position: absolute; left: 109%; top: 11px; z-index: 1; width: 183%; height: 1px; background: #23a3b9;}
.wrap-visual .slider .title .big {display: inline-block; margin: 25px 0 85px 0; padding: 0 20px 0 0; font-family: 'Mont Medium'; font-size: 70px; line-height: 1; letter-spacing: 0px;}
.wrap-visual .slider .title .desc {padding: 0 150px 0 0; font-family: 'Mont Light'; font-size: 24px; line-height: 1.5;}
.wrap-visual .slider .title .link {position: relative; display: inline-block; margin: 35px 0 0 0; padding: 12px 65px 12px 15px; border: 1px solid #dbd7d3; font-family: 'Mont Light'; font-size: 16px; color: #fff;}
.wrap-visual .slider .title .link:hover {background-color: #0786a0; border-color: rgb(8, 160, 190); transition: .4s;}
.wrap-visual .slider .title .link::after {content: ''; position: absolute; right: 15px; top: 18px; width: 10px; height: 10px; background: url('../images/more-visual.png') no-repeat center center; transform: rotate(0deg); transition: .65s;}
.wrap-visual .slider .title .link:hover::after {transform: rotate(180deg);}
.wrap-visual .slider .thumb {float: right; width: 56%; overflow: hidden; vertical-align: top; text-align: right;}
.wrap-visual .slider .thumb img {display: inline-block; /*max-height:968px;*/ height: 100%; position:relative; left:50%; transform:translate(-50%,0); max-width:none;}
.wrap-visual .control {position: absolute; right: 0; bottom: 0; z-index: 300;}
.wrap-visual .control .paging,
.wrap-visual .control .auto,
.wrap-visual .control .arrow {display: inline-block; vertical-align: middle; font-size: 0;}
.wrap-visual .control .paging li {display: inline-block; margin: 0 0 0 15px;}
.wrap-visual .control .paging button {display: inline-block; font-family: 'Mont Regular'; font-size: 16px; color: #fff;}
.wrap-visual .control .paging button::before {content: '0';}
.wrap-visual .control .paging .slick-active button {position: relative; padding: 0 165px 0 0;}
.wrap-visual .control .paging .slick-active button::after {content: ''; position: absolute; left: 31px; top: 7px; width: 145px; height: 4px; background: #006276; border-radius: 50px;}
.wrap-visual .control .arrow button {width: 105px; height: 110px; text-indent: -9999px;}
.wrap-visual .control .arrow .prev {background: #006276 url('../images/btn-visual-prev-on.png') no-repeat center center;}
.wrap-visual .control .arrow .next {background: #fff url('../images/btn-visual-next.png') no-repeat center center;}
.wrap-visual .control .auto {margin: 0 67px 0 16px;}
.wrap-visual .control .auto button {display: none; width: 11px; height: 11px; text-indent: -9999px;}
.wrap-visual .control .auto button.on {display: inline-block; vertical-align: middle;}
.wrap-visual .control .auto .stop {background: url('../images/btn-visual-stop.png') no-repeat center center;}
.wrap-visual .control .auto .play {background: url('../images/btn-visual-play.png') no-repeat center center;}

@media all and (max-width: 1750px) {
    .wrap-visual .container {padding: 0 30px;}
    .wrap-visual .slider .thumb img {max-height: 454px;}
}

@media all and (max-width: 1600px) {

    .wrap-visual .slider .title .big {font-size: 55px;}
    .wrap-visual .slider .title .desc {font-size: 20px;}
}

@media all and (max-width: 1400px) {
    .wrap-visual .slider .thumb img {max-height: 400px;}
}

@media all and (max-width: 1240px) {
    .wrap-visual .slider .title .small i::after {width: 120%;}
    .wrap-visual .slider li {padding: 75px 0;}
    .wrap-visual .slider .title .small {margin: 0; font-size: 18px;}
    .wrap-visual .slider .title .big {margin: 5px 0 11px 0; font-size: 40px;}
    .wrap-visual .slider .title .desc {font-size: 16px;}
    .wrap-visual .slider .title .link {margin: 14px 0 0 0; padding: 8px 65px 8px 15px;}
    .wrap-visual .slider .thumb img {max-height: 320px;}
    .wrap-visual .control .arrow button {width: 75px; height: 75px;}
    .wrap-visual .control .auto {margin: 0 35px 0 16px;}
}

@media all and (max-width: 1000px) {
    .wrap-visual .slider li {padding: 50px 0 75px 0;}
}

@media all and (max-width: 920px) {
    .wrap-visual .slider .thumb img {max-height: 260px;}
}

@media all and (max-width: 768px) {
    .wrap-visual .container {padding: 0 20px;}
    .wrap-visual .slider li {padding: 30px 0 130px 0;}
    .wrap-visual .slider .title,
    .wrap-visual .slider .thumb {display: block; width: 100%;}
    .wrap-visual .slider .title {position: absolute; left: 0; bottom: 30px; padding: 0 0 0 40px;}
    .wrap-visual .slider .title .desc {display: none;}
    .wrap-visual .slider .title .link {position: absolute; right: 0; bottom: 12px; padding: 8px 30px 8px 15px; font-size: 14px;}
    .wrap-visual .slider .title .link::after {top: 14px; right: 10px;}
    .wrap-visual .slider .title .small {font-size: 16px;}
    .wrap-visual .slider .title .small i::after {left: -20px; top: auto; bottom: -50px; width: 1px; height: 190px;}
    .wrap-visual .slider .title .big {width: 67%; font-size: 20px; letter-spacing: 0;}
    .wrap-visual .slider .thumb img {width: 100%; max-height: none;}
    .wrap-visual .control {right: 20px; bottom: 130px;}
    .wrap-visual .control .paging,
    .wrap-visual .control .auto {display: none;}
    .wrap-visual .control .arrow button {width: 45px; height: 45px;}
    .wrap-visual .control .arrow .prev {background: #006276 url(../images/btn-visual-prev-on-m.png) no-repeat center center;}
    .wrap-visual .control .arrow .next {background: #fff url(../images/btn-visual-next-m.png) no-repeat center center;}
}
