123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619 |
- body {
- margin: 0;
- padding: 0;
- max-width:100%;
- margin:0 auto;
- }
- /* line 8, ../sass/inc/_base.scss */
- * {
- box-sizing: border-box;
- }
- .icon-right-open-big:before { content: "\e766"; } /* '\e766' */
- .o-slider-header-mobile{ height: 100%; width: 100%; text-align: center; }
- /* line 9, ../sass/inc/_base.scss */
- a {
- color: #fff;
- font-size: 14px;
- letter-spacing: 0.125em;
- text-decoration: none;
- text-transform: uppercase;
- }
- /* line 16, ../sass/inc/_base.scss */
- h1 {
- text-transform: uppercase;
- margin: 0;
- padding: 0;
- font-size: 2.5rem;
- }
- /* line 22, ../sass/inc/_base.scss */
- .pre {
- display: inline-block;
- padding: 20px;
- background: #f1f1f1;
- box-shadow: 3px 3px 0 1px rgba(0, 0, 0, 0.1);
- width: 100%;
- }
- @-webkit-keyframes ball-scale-multiple {
- 0% {
- transform: scale(0) rotate(-90deg);
- opacity: 0;
- }
- 5% {
- opacity: 1;
- }
- 100% {
- transform: scale(1.2) rotate(90deg);
- opacity: 0;
- }
- }
- @keyframes ball-scale-multiple {
- 0% {
- transform: scale(0) rotate(-90deg);
- opacity: 0;
- }
- 5% {
- opacity: 1;
- }
- 100% {
- transform: scale(1.2) rotate(90deg);
- opacity: 0;
- }
- }
- /* line 1, ../sass/inc/_loader.scss */
- .loaderWrap {
- position: absolute;
- left: 0;
- top: 0;
- right: 0;
- bottom: 0;
- background: rgba(0, 0, 0, 0.2);
- z-index: 123333333;
- }
- /* line 10, ../sass/inc/_loader.scss */
- .ball-scale-multiple {
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, 50%);
- }
- /* line 15, ../sass/inc/_loader.scss */
- .ball-scale-multiple > div {
- background-color: #fff;
- border-radius: 0;
- animation-fill-mode: both;
- position: absolute;
- left: -60px;
- top: -60px;
- opacity: 0;
- margin: 0;
- width: 120px;
- height: 120px;
- animation: ball-scale-multiple 1s 0s linear infinite;
- box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2);
- }
- /* line 28, ../sass/inc/_loader.scss */
- .ball-scale-multiple > div:nth-child(1) {
- animation-delay: -1s;
- }
- /* line 31, ../sass/inc/_loader.scss */
- .ball-scale-multiple > div:nth-child(2) {
- animation-delay: -0.8s;
- }
- /* line 34, ../sass/inc/_loader.scss */
- .ball-scale-multiple > div:nth-child(3) {
- animation-delay: -0.6s;
- }
- /* line 37, ../sass/inc/_loader.scss */
- .ball-scale-multiple > div:nth-child(4) {
- animation-delay: -0.4s;
- }
- /* line 40, ../sass/inc/_loader.scss */
- .ball-scale-multiple > div:nth-child(5) {
- animation-delay: -0.2s;
- }
- /* line 7, ../sass/style.scss */
- .a-container {
- width: 1170px;
- margin: 20px auto;
- }
- /* line 12, ../sass/style.scss */
- .a-1_2 {
- width: 48%;
- display: inline-block;
- margin: 0 1%;
- }
- /* line 17, ../sass/style.scss */
- .o-sliderContainer {
- overflow: hidden;
- position: relative;
- width: 100%;
- min-height: 200px;
- float: left;
- height: auto;
- }
- /* line 27, ../sass/style.scss */
- .o-sliderContainer.hasShadow {
- box-shadow: 0 39px 22px -29px rgba(0, 0, 0, 0.2);
- }
- /* line 39, ../sass/style.scss */
- .o-slider--item {
- height: auto;
- width: 0;
- background-position: center center;
- background-repeat: no-repeat;
- background-size: cover;
- position: relative;
- float: left;
- transition: all 0.2s cubic-bezier(0.7, 0.18, 0.53, 0.75);
- opacity: 0.6;
- transform: scale(0.95, 0.95);
- transform-origin: center center;
- z-index: 99;
- background-size: 40%;
- background-position: 95% 106%;
- }
- .o-slider-header{ height: 100%; width: 100%; position: relative; }
- .o-slider-bg{ position: absolute; height: 100%; width: 100%; display: flex; align-items: center; }
- .o-slider-bg .o-slider-header > img{ max-width: 100%; max-height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
- .o-slider-bg .o-slider-header > video{ width: 100%; height: 100%;}
- .o-slider-header iframe{ width: 100%; height: 100%;}
- .content-top{height: 15%;text-align: center;padding-left: 30px;display: flex;align-items: center;}
- .content-top img{ max-width: 86%; }
- .content-content{height: 45%;width: 100%;text-align: center;}
- .content-content img{height: 90%;/* margin: auto 0; */}
- .content-footer{padding-left: 30px; height:20%;}
- .content-footer img{ max-width: 60%; max-height: 100%; }
- .pinch-zoom-container{ width: 100%; max-height: 100%; }
- /* line 52, ../sass/style.scss */
- /* .o-slider--item::after {
- content: '';
- position: absolute;
- top: 0;
- right: 0;
- bottom: 0;
- left: 0;
- background: rgba(0, 0, 0, 0.3);
- background: -moz-linear-gradient(45deg, rgba(0, 0, 0, 0.6) 0%, transparent 70%);
- background: -webkit-gradient(left bottom, right top, color-stop(0%, rgba(0, 0, 0, 0.6)), color-stop(70%, transparent));
- background: -webkit-linear-gradient(45deg, rgba(0, 0, 0, 0.6) 0%, transparent 70%);
- background: -o-linear-gradient(45deg, rgba(0, 0, 0, 0.6) 0%, transparent 70%);
- background: -ms-linear-gradient(45deg, rgba(0, 0, 0, 0.6) 0%, transparent 70%);
- background: linear-gradient(45deg, rgba(0, 0, 0, 0.6) 0%, transparent 70%);
- z-index: 0;
- } */
- /* line 65, ../sass/style.scss */
- .o-slider--item.isActive {
- opacity: 1;
- transform: scale(1, 1);
- }
- /* line 69, ../sass/style.scss */
- .o-slider--item.isMoving {
- opacity: 0.6;
- transform: scale(0.95, 0.95);
- z-index: 100;
- }
- /* line 76, ../sass/style.scss */
- .o-slider {
- width: auto;
- position: relative;
- display: none;
- transition: all 0.2s cubic-bezier(0.7, 0.18, 0.53, 0.75);
- }
- /* line 81, ../sass/style.scss */
- .o-slider.isVisible {
- display: table;
- }
- /* line 86, ../sass/style.scss */
- .o-slider.isDraggable {
- cursor: move;
- }
- /* line 91, ../sass/style.scss */
- .o-slider-textWrap {
- left: 2%;
- bottom: 45px;
- height: auto;
- position: absolute;
- text-align: left;
- padding: 0 0 20px 0;
- width: 96%;
- transition: all 0.4s;
- opacity: 1;
- overflow: visible;
- perspective: 1000px;
- z-index: 2;
- }
- /* line 107, ../sass/style.scss */
- .isActive .o-slider-textWrap::after {
- width: 100%;
- left: 0;
- }
- /* line 112, ../sass/style.scss */
- .isActive .o-slider-paragraph {
- opacity: 1;
- transform: perspective(0) rotateY(0) translate(0, 0);
- transform-origin: 0 0;
- transition-delay: 1s;
- }
- /* line 119, ../sass/style.scss */
- .isActive .o-slider-title {
- opacity: 1;
- transform: perspective(0) rotateY(0) translate(0, 0);
- transform-origin: 0 0;
- transition-delay: 0.2s;
- }
- /* line 126, ../sass/style.scss */
- .isActive .o-slider-subTitle {
- opacity: 1;
- transform: perspective(0) rotateY(0) translate(0, 0);
- transform-origin: 0 0;
- transition-delay: 0.6s;
- }
- /* line 155, ../sass/style.scss */
- .o-slider-title {
- width: auto;
- margin: 0 0 5px 0;
- height: auto;
- color: #fff;
- text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
- font-size: 1.4rem;
- display: inline-block;
- padding: 0;
- transition: all 0.4s;
- transform-origin: 0 0;
- transform: perspective(1000px) rotateY(120deg) translate(100px, -100px);
- opacity: 0;
- position: relative;
- z-index: 1;
- }
- /* line 172, ../sass/style.scss */
- .o-slider-subTitle {
- width: auto;
- margin: 0 0 5px 0;
- height: auto;
- color: #fff;
- text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
- font-size: 1.4rem;
- display: inline-block;
- padding: 0;
- transition: all 0.4s;
- transform-origin: 0 0;
- transform: perspective(1000px) rotateY(120deg) translate(100px, -100px);
- opacity: 0;
- position: relative;
- z-index: 1;
- font-size: 1.2rem;
- }
- /* line 190, ../sass/style.scss */
- .o-slider-paragraph {
- width: auto;
- margin: 0 0 5px 0;
- height: auto;
- color: #fff;
- text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
- font-size: 1.4rem;
- display: inline-block;
- padding: 0;
- transition: all 0.4s;
- transform-origin: 0 0;
- transform: perspective(1000px) rotateY(120deg) translate(100px, -100px);
- opacity: 0;
- position: relative;
- z-index: 1;
- font-size: 0.8rem;
- max-width: 100%;
- display: none;
- }
- @media screen and (min-width: 768px) {
- /* line 211, ../sass/style.scss */
- .o-slider-textWrap {
- left: 5%;
- width: 90%;
- }
- /* line 216, ../sass/style.scss */
- .o-slider-title {
- font-size: 1.8rem;
- }
- /* line 220, ../sass/style.scss */
- .o-slider-subTitle {
- font-size: 1.4rem;
- }
- /* line 224, ../sass/style.scss */
- .o-slider-paragraph {
- max-width: 60%;
- font-size: 1rem;
- display: block;
- }
- }
- @media screen and (min-width: 1024px) {
- /* line 232, ../sass/style.scss */
- .o-slider-pagination {
- bottom: 6%;
- }
- /* line 234, ../sass/style.scss */
- .o-slider-textWrap {
- left: 70px;
- width: 80%;
- bottom: 50px;
- }
- /* line 240, ../sass/style.scss */
- .o-slider-title {
- font-size: 2rem;
- }
- /* line 244, ../sass/style.scss */
- .o-slider-subTitle {
- font-size: 1.6rem;
- }
- /* line 248, ../sass/style.scss */
- .o-slider-paragraph {
- max-width: 40%;
- font-size: 1.2rem;
- }
- }
- /* line 299, ../sass/style.scss */
- .a-divider {
- display: block;
- width: 100%;
- height: 1px;
- margin: 2px 0;
- }
- /* line 306, ../sass/style.scss */
- .o-slider-controls {
- display: none;
- }
- /* line 309, ../sass/style.scss */
- .o-slider-controls.isVisible {
- display: block;
- }
- /* line 314, ../sass/style.scss */
- .o-slider-pagination {
- bottom: 20px;
- left: 0;
- position: absolute;
- text-align: center;
- width: 100%;
- z-index: 1444000;
- margin: 0;
- padding: 0;
- }
- /* line 324, ../sass/style.scss */
- .o-slider-pagination > li {
- border-radius: 50%;
- /* box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.9), 0 0 2px 0 rgba(0, 0, 0, 0.4) inset; */
- display: inline-block;
- position: relative;
- top: 0;
- right: 0;
- bottom: 0;
- left: 0;
- height: 8px;
- width: 8px;
- margin-left: 4px;
- margin-right: 4px;
- transition: all 250ms;
- cursor: pointer;
- /* background-clip: padding-box; */
- z-index: 100;
- background: #fff;
- }
- /* line 340, ../sass/style.scss */
- .o-slider-pagination > li.isActive {
- background-color: #19bbed;
- transform: scale(1.3, 1.3);
- }
- /* line 347, ../sass/style.scss */
- .o-slider--preview {
- position: absolute;
- top: -70px;
- right: auto;
- bottom: auto;
- left: -65px;
- opacity: 0;
- width: 140px;
- height: 60px;
- background-size: cover;
- background-position: center center;
- transition: all 250ms;
- z-index: -1;
- border: 3px solid #000;
- transform: scale(0.2, 0.2);
- transform-origin: center bottom;
- display: none;
- }
- /* line 362, ../sass/style.scss */
- .o-slider--preview::before {
- content: "";
- position: absolute;
- top: auto;
- right: auto;
- bottom: -13px;
- left: 50%;
- margin: 0 0 0 -5px;
- height: 0;
- width: 0;
- border-left: 10px solid transparent;
- border-right: 10px solid transparent;
- border-top: 10px solid #000;
- }
- /* line 374, ../sass/style.scss */
- .o-slider--preview.isActive,
- .o-slider-pagination li:hover .o-slider--preview {
- opacity: 1;
- position: absolute;
- top: -76px;
- right: auto;
- bottom: auto;
- left: -65px;
- transform: scale(1, 1);
- }
- @media screen and (min-width: 768px) {
- /* line 384, ../sass/style.scss */
- .o-slider--preview {
- display: block;
- }
- }
- /* line 389, ../sass/style.scss */
- .o-slider-arrows {
- margin: 0;
- list-style: none;
- display: block;
- }
- /* line 395, ../sass/style.scss */
- .o-slider-next,
- .o-slider-prev {
- position: fixed;
- top: 0;
- left: 0px;
- margin: -12px 0 0;
- width: 60px;
- z-index: 99;
- padding: 0;
- margin: 0;
- height: 60px;
- list-style: none;
- cursor: pointer;
- text-align: center;
- padding: 10px 25px;
- background: rgba(0, 0, 0, 0.4);
- display: inline-block;
- vertical-align: middle;
- line-height: 100%;
- transition: all 0.4s;
- top: 50%;
- transform: translateY(-50%);
- }
- /* line 416, ../sass/style.scss */
- .o-slider-next i,
- .o-slider-prev i {
- position: absolute;
- top: 50%;
- left: 0;
- /* margin: -12px 0 0; */
- text-align: center;
- width: 100%;
- font-size: 2.8rem;
- color: #fff;
- transform: translateY(-50%);
- }
- /* line 428, ../sass/style.scss */
- .o-slider-next {
- left: auto;
- right: 0px;
- }
- /* line 433, ../sass/style.scss */
- .isDisabled {
- opacity: 1;
- cursor: auto;
- }
- @media screen and (max-width: 1280px) {
- /* line 439, ../sass/style.scss */
- .a-container {
- width: 970px;
- }
- }
- @media screen and (max-width: 1024px) {
- /* line 445, ../sass/style.scss */
- .o-slider-arrows {
- display: none;
- }
- /* line 449, ../sass/style.scss */
- .o-sliderContainer {
- height: 450px;
- width: 100%;
- }
- /* line 455, ../sass/style.scss */
- .o-slider--item {
- height: 450px;
- }
- }
- @media screen and (max-width: 768px) {
- /* line 461, ../sass/style.scss */
- .a-container {
- width: 90%;
- margin: 20px auto;
- }
- /* line 466, ../sass/style.scss */
- .a-1_2 {
- width: 100%;
- display: block;
- margin: 0;
- }
- /* line 472, ../sass/style.scss */
- .o-slider-arrows {
- display: none;
- }
- /* line 476, ../sass/style.scss */
- .o-sliderContainer {
- height: 350px;
- }
- /* line 480, ../sass/style.scss */
- .o-slider--item {
- height: 350px;
- }
- /* line 484, ../sass/style.scss */
- .o-slider-panel img {
- left: -15%;
- width: 130%;
- }
- }
- @media screen and (max-width: 480px) {
- /* line 491, ../sass/style.scss */
- .o-slider--item {
- height: 270px;
- }
- /* line 494, ../sass/style.scss */
-
- /* line 500, ../sass/style.scss */
- .o-sliderContainer {
- height: 270px;
- }
- }
- /* line 505, ../sass/style.scss */
- .slider-pagination > li:hover {
- background-color: rgba(255, 255, 255, 0.9);
- transform: scale(1.3, 1.3);
- }
|