@keyframes plyr-progress{to{background-position:25px 0}}@keyframes plyr-popup{0%{opacity:.5;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes plyr-fade-in{from{opacity:0}to{opacity:1}}.plyr{-moz-osx-font-smoothing:auto;-webkit-font-smoothing:subpixel-antialiased;align-items:center;direction:ltr;display:flex;flex-direction:column;font-family:Avenir,"Avenir Next","Helvetica Neue","Segoe UI",Helvetica,Arial,sans-serif;font-variant-numeric:tabular-nums;font-weight:500;height:100%;line-height:1.7;max-width:100%;min-width:200px;position:relative;text-shadow:none;transition:box-shadow .3s ease;z-index:0}.plyr audio,.plyr iframe,.plyr video{display:block;height:100%;width:100%}.plyr button{font:inherit;line-height:inherit;width:auto}.plyr:focus{outline:0}.plyr--full-ui{box-sizing:border-box}.plyr--full-ui *,.plyr--full-ui ::after,.plyr--full-ui ::before{box-sizing:inherit}.plyr--full-ui a,.plyr--full-ui button,.plyr--full-ui input,.plyr--full-ui label{touch-action:manipulation}.plyr__badge{background:#4a5764;border-radius:2px;color:#fff;font-size:9px;line-height:1;padding:3px 4px}.plyr--full-ui ::-webkit-media-text-track-container{display:none}.plyr__captions{animation:plyr-fade-in .3s ease;bottom:0;color:#fff;display:none;font-size:14px;left:0;padding:10px;position:absolute;text-align:center;transition:transform .4s ease-in-out;width:100%}.plyr__captions .plyr__caption{background:rgba(0,0,0,.8);border-radius:2px;-webkit-box-decoration-break:clone;box-decoration-break:clone;line-height:185%;padding:.2em .5em;white-space:pre-wrap}.plyr__captions .plyr__caption div{display:inline}.plyr__captions span:empty{display:none}@media (min-width:480px){.plyr__captions{font-size:16px;padding:20px}}@media (min-width:768px){.plyr__captions{font-size:18px}}.plyr--captions-active .plyr__captions{display:block}.plyr:not(.plyr--hide-controls) .plyr__controls:not(:empty)~.plyr__captions{transform:translateY(-40px)}.plyr__control{background:0 0;border:0;border-radius:3px;color:inherit;cursor:pointer;flex-shrink:0;overflow:visible;padding:7px;position:relative;transition:all .3s ease}.plyr__control svg{display:block;fill:currentColor;height:18px;pointer-events:none;width:18px}.plyr__control:focus{outline:0}.plyr__control.plyr__tab-focus{box-shadow:0 0 0 5px rgba(0,179,255,.5);outline:0}a.plyr__control{text-decoration:none}a.plyr__control::after,a.plyr__control::before{display:none}.plyr__control.plyr__control--pressed .icon--not-pressed,.plyr__control.plyr__control--pressed .label--not-pressed,.plyr__control:not(.plyr__control--pressed) .icon--pressed,.plyr__control:not(.plyr__control--pressed) .label--pressed{display:none}.plyr--full-ui ::-webkit-media-controls{display:none}.plyr__controls{align-items:center;display:flex;justify-content:flex-end;text-align:center}.plyr__controls .plyr__progress__container{flex:1;min-width:0}.plyr__controls .plyr__controls__item{margin-left:2.5px}.plyr__controls .plyr__controls__item:first-child{margin-left:0;margin-right:auto}.plyr__controls .plyr__controls__item.plyr__progress__container{padding-left:2.5px}.plyr__controls .plyr__controls__item.plyr__time{padding:0 5px}.plyr__controls .plyr__controls__item.plyr__progress__container:first-child,.plyr__controls .plyr__controls__item.plyr__time+.plyr__time,.plyr__controls .plyr__controls__item.plyr__time:first-child{padding-left:0}.plyr__controls:empty{display:none}.plyr [data-plyr=airplay],.plyr [data-plyr=captions],.plyr [data-plyr=fullscreen],.plyr [data-plyr=pip]{display:none}.plyr--airplay-supported [data-plyr=airplay],.plyr--captions-enabled [data-plyr=captions],.plyr--fullscreen-enabled [data-plyr=fullscreen],.plyr--pip-supported [data-plyr=pip]{display:inline-block}.plyr__menu{display:flex;position:relative}.plyr__menu .plyr__control svg{transition:transform .3s ease}.plyr__menu .plyr__control[aria-expanded=true] svg{transform:rotate(90deg)}.plyr__menu .plyr__control[aria-expanded=true] .plyr__tooltip{display:none}.plyr__menu__container{animation:plyr-popup .2s ease;background:rgba(255,255,255,.9);border-radius:4px;bottom:100%;box-shadow:0 1px 2px rgba(0,0,0,.15);color:#4a5764;font-size:16px;margin-bottom:10px;position:absolute;right:-3px;text-align:left;white-space:nowrap;z-index:3}.plyr__menu__container>div{overflow:hidden;transition:height .35s cubic-bezier(.4,0,.2,1),width .35s cubic-bezier(.4,0,.2,1)}.plyr__menu__container::after{border:4px solid transparent;border-top-color:rgba(255,255,255,.9);content:'';height:0;position:absolute;right:15px;top:100%;width:0}.plyr__menu__container [role=menu]{padding:7px}.plyr__menu__container [role=menuitem],.plyr__menu__container [role=menuitemradio]{margin-top:2px}.plyr__menu__container [role=menuitem]:first-child,.plyr__menu__container [role=menuitemradio]:first-child{margin-top:0}.plyr__menu__container .plyr__control{align-items:center;color:#4a5764;display:flex;font-size:14px;padding:4px 11px;-webkit-user-select:none;-ms-user-select:none;user-select:none;width:100%}.plyr__menu__container .plyr__control>span{align-items:inherit;display:flex;width:100%}.plyr__menu__container .plyr__control::after{border:4px solid transparent;content:'';position:absolute;top:50%;transform:translateY(-50%)}.plyr__menu__container .plyr__control--forward{padding-right:28px}.plyr__menu__container .plyr__control--forward::after{border-left-color:rgba(74,87,100,.8);right:5px}.plyr__menu__container .plyr__control--forward.plyr__tab-focus::after,.plyr__menu__container .plyr__control--forward:hover::after{border-left-color:currentColor}.plyr__menu__container .plyr__control--back{font-weight:500;margin:7px;margin-bottom:3px;padding-left:28px;position:relative;width:calc(100% - 14px)}.plyr__menu__container .plyr__control--back::after{border-right-color:rgba(74,87,100,.8);left:7px}.plyr__menu__container .plyr__control--back::before{background:rgba(114,133,151,.2);box-shadow:0 1px 0 #fff;content:'';height:1px;left:0;margin-top:4px;overflow:hidden;position:absolute;right:0;top:100%}.plyr__menu__container .plyr__control--back.plyr__tab-focus::after,.plyr__menu__container .plyr__control--back:hover::after{border-right-color:currentColor}.plyr__menu__container .plyr__control[role=menuitemradio]{padding-left:7px}.plyr__menu__container .plyr__control[role=menuitemradio]::after,.plyr__menu__container .plyr__control[role=menuitemradio]::before{border-radius:100%}.plyr__menu__container .plyr__control[role=menuitemradio]::before{background:rgba(0,0,0,.1);content:'';display:block;flex-shrink:0;height:16px;margin-right:10px;transition:all .3s ease;width:16px}.plyr__menu__container .plyr__control[role=menuitemradio]::after{background:#fff;border:0;height:6px;left:12px;opacity:0;top:50%;transform:translateY(-50%) scale(0);transition:transform .3s ease,opacity .3s ease;width:6px}.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]::before{background:#00b3ff}.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]::after{opacity:1;transform:translateY(-50%) scale(1)}.plyr__menu__container .plyr__control[role=menuitemradio].plyr__tab-focus::before,.plyr__menu__container .plyr__control[role=menuitemradio]:hover::before{background:rgba(0,0,0,.1)}.plyr__menu__container .plyr__menu__value{align-items:center;display:flex;margin-left:auto;margin-right:-5px;overflow:hidden;padding-left:25px;pointer-events:none}.plyr--full-ui input[type=range]{-webkit-appearance:none;background:0 0;border:0;border-radius:26px;color:#00b3ff;display:block;height:19px;margin:0;padding:0;transition:box-shadow .3s ease;width:100%}.plyr--full-ui input[type=range]::-webkit-slider-runnable-track{background:0 0;border:0;border-radius:2.5px;height:5px;-webkit-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-webkit-user-select:none;user-select:none;background-image:linear-gradient(to right,currentColor var(--value,0),transparent var(--value,0))}.plyr--full-ui input[type=range]::-webkit-slider-thumb{background:#fff;border:0;border-radius:100%;box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(35,41,47,.2);height:13px;position:relative;-webkit-transition:all .2s ease;transition:all .2s ease;width:13px;-webkit-appearance:none;margin-top:-4px}.plyr--full-ui input[type=range]::-moz-range-track{background:0 0;border:0;border-radius:2.5px;height:5px;-moz-transition:box-shadow .3s ease;transition:box-shadow .3s ease;user-select:none}.plyr--full-ui input[type=range]::-moz-range-thumb{background:#fff;border:0;border-radius:100%;box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(35,41,47,.2);height:13px;position:relative;-moz-transition:all .2s ease;transition:all .2s ease;width:13px}.plyr--full-ui input[type=range]::-moz-range-progress{background:currentColor;border-radius:2.5px;height:5px}.plyr--full-ui input[type=range]::-ms-track{background:0 0;border:0;border-radius:2.5px;height:5px;-ms-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-ms-user-select:none;user-select:none;color:transparent}.plyr--full-ui input[type=range]::-ms-fill-upper{background:0 0;border:0;border-radius:2.5px;height:5px;-ms-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-ms-user-select:none;user-select:none}.plyr--full-ui input[type=range]::-ms-fill-lower{background:0 0;border:0;border-radius:2.5px;height:5px;-ms-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-ms-user-select:none;user-select:none;background:currentColor}.plyr--full-ui input[type=range]::-ms-thumb{background:#fff;border:0;border-radius:100%;box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(35,41,47,.2);height:13px;position:relative;-ms-transition:all .2s ease;transition:all .2s ease;width:13px;margin-top:0}.plyr--full-ui input[type=range]::-ms-tooltip{display:none}.plyr--full-ui input[type=range]:focus{outline:0}.plyr--full-ui input[type=range]::-moz-focus-outer{border:0}.plyr--full-ui input[type=range].plyr__tab-focus::-webkit-slider-runnable-track{box-shadow:0 0 0 5px rgba(0,179,255,.5);outline:0}.plyr--full-ui input[type=range].plyr__tab-focus::-moz-range-track{box-shadow:0 0 0 5px rgba(0,179,255,.5);outline:0}.plyr--full-ui input[type=range].plyr__tab-focus::-ms-track{box-shadow:0 0 0 5px rgba(0,179,255,.5);outline:0}.plyr__poster{background-color:#000;background-position:50% 50%;background-repeat:no-repeat;background-size:contain;height:100%;left:0;opacity:0;position:absolute;top:0;transition:opacity .2s ease;width:100%;z-index:1}.plyr--stopped.plyr__poster-enabled .plyr__poster{opacity:1}.plyr__time{font-size:14px}.plyr__time+.plyr__time::before{content:'\2044';margin-right:10px}@media (max-width:767px){.plyr__time+.plyr__time{display:none}}.plyr__tooltip{background:rgba(255,255,255,.9);border-radius:3px;bottom:100%;box-shadow:0 1px 2px rgba(0,0,0,.15);color:#4a5764;font-size:14px;font-weight:500;left:50%;line-height:1.3;margin-bottom:10px;opacity:0;padding:5px 7.5px;pointer-events:none;position:absolute;transform:translate(-50%,10px) scale(.8);transform-origin:50% 100%;transition:transform .2s .1s ease,opacity .2s .1s ease;white-space:nowrap;z-index:2}.plyr__tooltip::before{border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid rgba(255,255,255,.9);bottom:-4px;content:'';height:0;left:50%;position:absolute;transform:translateX(-50%);width:0;z-index:2}.plyr .plyr__control.plyr__tab-focus .plyr__tooltip,.plyr .plyr__control:hover .plyr__tooltip,.plyr__tooltip--visible{opacity:1;transform:translate(-50%,0) scale(1)}.plyr .plyr__control:hover .plyr__tooltip{z-index:3}.plyr__controls>.plyr__control:first-child .plyr__tooltip,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip{left:0;transform:translate(0,10px) scale(.8);transform-origin:0 100%}.plyr__controls>.plyr__control:first-child .plyr__tooltip::before,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip::before{left:16px}.plyr__controls>.plyr__control:last-child .plyr__tooltip{left:auto;right:0;transform:translate(0,10px) scale(.8);transform-origin:100% 100%}.plyr__controls>.plyr__control:last-child .plyr__tooltip::before{left:auto;right:16px;transform:translateX(50%)}.plyr__controls>.plyr__control:first-child .plyr__tooltip--visible,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip--visible,.plyr__controls>.plyr__control:first-child+.plyr__control.plyr__tab-focus .plyr__tooltip,.plyr__controls>.plyr__control:first-child+.plyr__control:hover .plyr__tooltip,.plyr__controls>.plyr__control:first-child.plyr__tab-focus .plyr__tooltip,.plyr__controls>.plyr__control:first-child:hover .plyr__tooltip,.plyr__controls>.plyr__control:last-child .plyr__tooltip--visible,.plyr__controls>.plyr__control:last-child.plyr__tab-focus .plyr__tooltip,.plyr__controls>.plyr__control:last-child:hover .plyr__tooltip{transform:translate(0,0) scale(1)}.plyr__progress{left:6.5px;margin-right:13px;position:relative}.plyr__progress input[type=range],.plyr__progress__buffer{margin-left:-6.5px;margin-right:-6.5px;width:calc(100% + 13px)}.plyr__progress input[type=range]{position:relative;z-index:2}.plyr__progress .plyr__tooltip{font-size:14px;left:0}.plyr__progress__buffer{-webkit-appearance:none;background:0 0;border:0;border-radius:100px;height:5px;left:0;margin-top:-2.5px;padding:0;position:absolute;top:50%}.plyr__progress__buffer::-webkit-progress-bar{background:0 0}.plyr__progress__buffer::-webkit-progress-value{background:currentColor;border-radius:100px;min-width:5px;-webkit-transition:width .2s ease;transition:width .2s ease}.plyr__progress__buffer::-moz-progress-bar{background:currentColor;border-radius:100px;min-width:5px;-moz-transition:width .2s ease;transition:width .2s ease}.plyr__progress__buffer::-ms-fill{border-radius:100px;-ms-transition:width .2s ease;transition:width .2s ease}.plyr--video .plyr__progress__buffer{box-shadow:0 1px 1px rgba(0,0,0,.15);color:rgba(255,255,255,.25)}.plyr--audio .plyr__progress__buffer{color:rgba(193,201,209,.66)}.plyr--loading .plyr__progress__buffer{animation:plyr-progress 1s linear infinite;background-image:linear-gradient(-45deg,rgba(35,41,47,.6) 25%,transparent 25%,transparent 50%,rgba(35,41,47,.6) 50%,rgba(35,41,47,.6) 75%,transparent 75%,transparent);background-repeat:repeat-x;background-size:25px 25px;color:transparent}.plyr--video.plyr--loading .plyr__progress__buffer{background-color:rgba(255,255,255,.25)}.plyr--audio.plyr--loading .plyr__progress__buffer{background-color:rgba(193,201,209,.66)}.plyr__volume{align-items:center;display:flex;position:relative}.plyr__volume input[type=range]{margin-left:5px;margin-right:5px;position:relative;z-index:2}@media (min-width:480px){.plyr__volume{max-width:90px}}@media (min-width:768px){.plyr__volume{max-width:110px}}.plyr--audio{display:block}.plyr--audio .plyr__controls{background:#fff;border-radius:inherit;color:#4a5764;padding:10px}.plyr--audio .plyr__control.plyr__tab-focus,.plyr--audio .plyr__control:hover,.plyr--audio .plyr__control[aria-expanded=true]{background:#00b3ff;color:#fff}.plyr--full-ui.plyr--audio input[type=range]::-webkit-slider-runnable-track{background-color:rgba(193,201,209,.66)}.plyr--full-ui.plyr--audio input[type=range]::-moz-range-track{background-color:rgba(193,201,209,.66)}.plyr--full-ui.plyr--audio input[type=range]::-ms-track{background-color:rgba(193,201,209,.66)}.plyr--full-ui.plyr--audio input[type=range]:active::-webkit-slider-thumb{box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(35,41,47,.2),0 0 0 3px rgba(0,0,0,.1)}.plyr--full-ui.plyr--audio input[type=range]:active::-moz-range-thumb{box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(35,41,47,.2),0 0 0 3px rgba(0,0,0,.1)}.plyr--full-ui.plyr--audio input[type=range]:active::-ms-thumb{box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(35,41,47,.2),0 0 0 3px rgba(0,0,0,.1)}.plyr--video{background:#000;overflow:hidden}.plyr--video.plyr--menu-open{overflow:visible}.plyr__video-wrapper{background:#000;height:100%;margin:auto;overflow:hidden;width:100%}.plyr__video-embed,.plyr__video-wrapper--fixed-ratio{height:0;padding-bottom:56.25%}.plyr__video-embed iframe,.plyr__video-wrapper--fixed-ratio video{border:0;left:0;position:absolute;top:0}.plyr--full-ui .plyr__video-embed>.plyr__video-embed__container{padding-bottom:240%;position:relative;transform:translateY(-38.28125%)}.plyr--video .plyr__controls{background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.7));border-bottom-left-radius:inherit;border-bottom-right-radius:inherit;bottom:0;color:#fff;left:0;padding:20px 5px 5px;position:absolute;right:0;transition:opacity .4s ease-in-out,transform .4s ease-in-out;z-index:3}@media (min-width:480px){.plyr--video .plyr__controls{padding:35px 10px 10px}}.plyr--video.plyr--hide-controls .plyr__controls{opacity:0;pointer-events:none;transform:translateY(100%)}.plyr--video .plyr__control.plyr__tab-focus,.plyr--video .plyr__control:hover,.plyr--video .plyr__control[aria-expanded=true]{background:#00b3ff;color:#fff}.plyr__control--overlaid{background:rgba(0,179,255,.8);border:0;border-radius:100%;color:#fff;display:none;left:50%;padding:15px;position:absolute;top:50%;transform:translate(-50%,-50%);z-index:2}.plyr__control--overlaid svg{left:2px;position:relative}.plyr__control--overlaid:focus,.plyr__control--overlaid:hover{background:#00b3ff}.plyr--playing .plyr__control--overlaid{opacity:0;visibility:hidden}.plyr--full-ui.plyr--video .plyr__control--overlaid{display:block}.plyr--full-ui.plyr--video input[type=range]::-webkit-slider-runnable-track{background-color:rgba(255,255,255,.25)}.plyr--full-ui.plyr--video input[type=range]::-moz-range-track{background-color:rgba(255,255,255,.25)}.plyr--full-ui.plyr--video input[type=range]::-ms-track{background-color:rgba(255,255,255,.25)}.plyr--full-ui.plyr--video input[type=range]:active::-webkit-slider-thumb{box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(35,41,47,.2),0 0 0 3px rgba(255,255,255,.5)}.plyr--full-ui.plyr--video input[type=range]:active::-moz-range-thumb{box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(35,41,47,.2),0 0 0 3px rgba(255,255,255,.5)}.plyr--full-ui.plyr--video input[type=range]:active::-ms-thumb{box-shadow:0 1px 1px rgba(0,0,0,.15),0 0 0 1px rgba(35,41,47,.2),0 0 0 3px rgba(255,255,255,.5)}.plyr--video .plyr__time{text-shadow:0 1px 1px rgba(0,0,0,.15)}.plyr:-webkit-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-ms-fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-webkit-full-screen video{height:100%}.plyr:-ms-fullscreen video{height:100%}.plyr:fullscreen video{height:100%}.plyr:-webkit-full-screen .plyr__video-wrapper{height:100%;position:static}.plyr:-ms-fullscreen .plyr__video-wrapper{height:100%;position:static}.plyr:fullscreen .plyr__video-wrapper{height:100%;position:static}.plyr:-webkit-full-screen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative;top:50%;transform:translateY(-50%)}.plyr:-ms-fullscreen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative;top:50%;transform:translateY(-50%)}.plyr:fullscreen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative;top:50%;transform:translateY(-50%)}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen{display:block}.plyr:fullscreen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-webkit-full-screen.plyr--hide-controls{cursor:none}.plyr:-ms-fullscreen.plyr--hide-controls{cursor:none}.plyr:fullscreen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-webkit-full-screen .plyr__captions{font-size:21px}.plyr:-ms-fullscreen .plyr__captions{font-size:21px}.plyr:fullscreen .plyr__captions{font-size:21px}}.plyr:-webkit-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-webkit-full-screen video{height:100%}.plyr:-webkit-full-screen .plyr__video-wrapper{height:100%;position:static}.plyr:-webkit-full-screen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative;top:50%;transform:translateY(-50%)}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-webkit-full-screen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-webkit-full-screen .plyr__captions{font-size:21px}}.plyr:-moz-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-moz-full-screen video{height:100%}.plyr:-moz-full-screen .plyr__video-wrapper{height:100%;position:static}.plyr:-moz-full-screen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative;top:50%;transform:translateY(-50%)}.plyr:-moz-full-screen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-moz-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-moz-full-screen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-moz-full-screen .plyr__captions{font-size:21px}}.plyr:-ms-fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-ms-fullscreen video{height:100%}.plyr:-ms-fullscreen .plyr__video-wrapper{height:100%;position:static}.plyr:-ms-fullscreen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative;top:50%;transform:translateY(-50%)}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-ms-fullscreen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-ms-fullscreen .plyr__captions{font-size:21px}}.plyr--fullscreen-fallback{background:#000;border-radius:0!important;height:100%;margin:0;width:100%;bottom:0;display:block;left:0;position:fixed;right:0;top:0;z-index:10000000}.plyr--fullscreen-fallback video{height:100%}.plyr--fullscreen-fallback .plyr__video-wrapper{height:100%;position:static}.plyr--fullscreen-fallback.plyr--vimeo .plyr__video-wrapper{height:0;position:relative;top:50%;transform:translateY(-50%)}.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen{display:block}.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr--fullscreen-fallback.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr--fullscreen-fallback .plyr__captions{font-size:21px}}.plyr__ads{border-radius:inherit;bottom:0;cursor:pointer;left:0;overflow:hidden;position:absolute;right:0;top:0;z-index:-1}.plyr__ads>div,.plyr__ads>div iframe{height:100%;position:absolute;width:100%}.plyr__ads::after{background:rgba(35,41,47,.8);border-radius:2px;bottom:10px;color:#fff;content:attr(data-badge-text);font-size:11px;padding:2px 6px;pointer-events:none;position:absolute;right:10px;z-index:3}.plyr__ads::after:empty{display:none}.plyr__cues{background:currentColor;display:block;height:5px;left:0;margin:-2.5px 0 0;opacity:.8;position:absolute;top:50%;width:3px;z-index:3}.plyr__preview-thumb{background-color:rgba(255,255,255,.9);border-radius:3px;bottom:100%;box-shadow:0 1px 2px rgba(0,0,0,.15);margin-bottom:10px;opacity:0;padding:3px;pointer-events:none;position:absolute;transform:translate(0,10px) scale(.8);transform-origin:50% 100%;transition:transform .2s .1s ease,opacity .2s .1s ease;z-index:2}.plyr__preview-thumb--is-shown{opacity:1;transform:translate(0,0) scale(1)}.plyr__preview-thumb::before{border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid rgba(255,255,255,.9);bottom:-4px;content:'';height:0;left:50%;position:absolute;transform:translateX(-50%);width:0;z-index:2}.plyr__preview-thumb__image-container{background:#c1c9d1;border-radius:2px;overflow:hidden;position:relative;z-index:0}.plyr__preview-thumb__image-container img{height:100%;left:0;max-height:none;max-width:none;position:absolute;top:0;width:100%}.plyr__preview-thumb__time-container{bottom:6px;left:0;position:absolute;right:0;white-space:nowrap;z-index:3}.plyr__preview-thumb__time-container span{background-color:rgba(0,0,0,.55);border-radius:2px;color:#fff;font-size:14px;padding:3px 6px}.plyr__preview-scrubbing{bottom:0;filter:blur(1px);height:100%;left:0;margin:auto;opacity:0;overflow:hidden;position:absolute;right:0;top:0;transition:opacity .3s ease;width:100%;z-index:1}.plyr__preview-scrubbing--is-shown{opacity:1}.plyr__preview-scrubbing img{height:100%;left:0;max-height:none;max-width:none;-o-object-fit:contain;object-fit:contain;position:absolute;top:0;width:100%}.plyr--no-transition{transition:none!important}.plyr__sr-only{clip:rect(1px,1px,1px,1px);overflow:hidden;border:0!important;height:1px!important;padding:0!important;position:absolute!important;width:1px!important}.plyr [hidden]{display:none!important} body { margin: 0; box-sizing: border-box; } /* html { scroll-behavior: smooth; } */ * { box-sizing: border-box; font-family: 'Sarabun'; } a { text-decoration: none; } @font-face { font-family: 'Roboto'; src: url('/static/fonts/Roboto/Roboto-Regular.woff'); font-display: swap; } @font-face { font-family: 'Sarabun'; font-weight: 400; src: url('/static/fonts/Sarabun/Sarabun-Light.ttf'); } @font-face { font-family: 'Sarabun'; font-weight: 300; src: url('/static/fonts/Sarabun/Sarabun-Light.ttf'); } @font-face { font-family: 'FS PF BeauSans Pro'; font-weight: 300; src: url('/static/fonts/FS-PF-BeauSans-Pro/FS PFBeauSansPro-Light.otf'); } @font-face { font-family: 'FS Magistral'; font-weight:400; src: url('/static/fonts/FS-Magistral/FS Magistral-Light.ttf'); } @font-face { font-family: 'FS Magistral'; font-weight: 500; src: url('/static/fonts/FS-Magistral/FS Magistral-Medium.ttf'); } @font-face { font-family: 'SF UI Display'; font-weight: 500; src: url('/static/fonts/sf-ui-display/sf-ui-display-medium-58646be638f96.otf'); font-display: swap; } @font-face { font-family: 'Manrope'; font-weight: 200; font-style: normal; src: url('/static/fonts/Manrope/Manrope-ExtraLight.ttf'); font-display: swap; } @font-face { font-family: 'Manrope'; font-weight: 300; font-style: normal; src: url('/static/fonts/Manrope/Manrope-Light.ttf'); font-display: swap; } @font-face { font-family: 'Manrope'; font-weight: 400; font-style: normal; src: url('/static/fonts/Manrope/Manrope-Regular.ttf'); font-display: swap; } @font-face { font-family: 'Manrope'; font-weight: 500; font-style: normal; src: url('/static/fonts/Manrope/Manrope-Medium.ttf'); font-display: swap; } @font-face { font-family: 'Manrope'; font-weight: 600; font-style: normal; src: url('/static/fonts/Manrope/Manrope-SemiBold.ttf'); font-display: swap; } @font-face { font-family: 'Manrope'; font-weight: 700; font-style: normal; src: url('/static/fonts/Manrope/Manrope-Bold.ttf'); font-display: swap; } @font-face { font-family: 'Manrope'; font-weight: 800; font-style: normal; src: url('/static/fonts/Manrope/Manrope-ExtraBold.ttf'); font-display: swap; } .header-container { width: 100%; height: 64px; position: fixed; top: 0; left: 0; z-index: 99; opacity: 0; transition: all 1s; -webkit-transition: all 0.5s; background-color: #ffffff; } .header-container .header-content { width: 1140px; margin: auto; } .header-container .header-content .header-flex-conten { display: flex; align-items: center; justify-content: space-between; } .header-container .header-content .header-flex-conten .header-item-flex { display: flex; align-items: center; } .header-container .header-content .header-flex-conten .header-item-flex .hc-boxlogo { width: 105px; height: 46px; margin: 0 15px; } .header-container .header-content .header-flex-conten .header-item-flex .hc-boxlogo img { object-fit: contain; } .header-container .header-content .header-flex-conten .header-item-flex .hc-listmenu { height: 100%; margin-right: 35px; display: flex; } .header-container .header-content .header-flex-conten .header-item-flex .hc-listmenu .hc-listmenu-flex { display: flex; align-items: center; } .header-container .header-content .header-flex-conten .header-item-flex .hc-listmenu .hc-listmenu-flex .header-link-smooth { text-decoration: none; } .header-container .header-content .header-flex-conten .header-item-flex .hc-listmenu .hc-listmenu-flex .hc-listmenu-item-box { position: relative; cursor: pointer; padding: 23px 12px; } .header-container .header-content .header-flex-conten .header-item-flex .hc-listmenu .hc-listmenu-flex .hc-listmenu-item-box:hover .hc-item-listmenu-image-position { display: block; } .header-container .header-content .header-flex-conten .header-item-flex .hc-listmenu .hc-listmenu-flex .hc-listmenu-item-box:hover .hc-listmenu-item-name { font-size: 14px; color: #ec1b2e; } .header-container .header-content .header-flex-conten .header-item-flex .hc-listmenu .hc-listmenu-flex .hc-listmenu-item-box .hc-listmenu-item-name { display: block; font-size: 14px; line-height: 17px; color: #5e5e60; text-align: center; transition: all 75ms; -webkit-transition: all 75ms; padding: 0 20px; font-family: 'FS PF BeauSans Pro'; font-weight: 300; } .header-container .header-content .header-flex-conten .header-item-flex .hc-listmenu .hc-listmenu-flex .hc-listmenu-item-box .hc-item-listmenu-image-position { display: none; position: absolute; bottom: -1px; left: 50%; transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); width: 115px; height: 3px; background: #ec1b2e; border-radius: 2px 2px 0px 0px; } .header-container .header-content .header-flex-conten .hc-flex-item-search { position: relative; display: flex; } .header-container .header-content .header-flex-conten .hc-flex-item-search svg { margin-right: 6px; } .header-container .header-content .header-flex-conten .hc-flex-item-search .header__contact { font-size: 14px; line-height: 17px; color: #BFBFBF; font-weight: 500; border-radius: 4px; cursor: pointer; padding: 0 4px; } .header-container .header-content .header-flex-conten .hc-flex-item-search .active-n { font-weight: 600; color: #ec1b2e; } .header-container .header-content .header-flex-conten .hc-flex-item-search .header-search { background: #f5f5f7; border: 1px solid #dfdfdf; box-sizing: border-box; border-radius: 4px; width: 173px; height: 32px; padding: 9px 30px 9px 6px; outline: none; font-size: 12px; line-height: 14px; color: #a3a3a3; } .header-container .header-content .header-flex-conten .hc-flex-item-search .header-icon-search { position: absolute; top: 5px; right: 5px; } @media screen and (min-width: 992px) { .header-container .header-content .header-flex-conten .header-item-flex .hc-listmenu { height: 100%; margin-right: 25px; } .header-container .header-content .header-flex-conten .header-item-flex .hc-listmenu .hc-listmenu-flex .hc-listmenu-item-box { padding: 23px 0; } .header-container .header-content .header-flex-conten .header-item-flex .hc-listmenu .hc-listmenu-flex .hc-listmenu-item-box .hc-item-listmenu-image-position { width: 95px; } .header-container .header-content .header-flex-conten .header-item-flex .hc-listmenu .hc-listmenu-flex .hc-listmenu-item-box .hc-listmenu-item-name { padding: 0 18px; } .header-container .header-content .header-flex-conten .hc-flex-item-search .header-search { width: 140px; } } @media screen and (min-width: 1200px) { .header-container .header-content .header-flex-conten .header-item-flex .hc-listmenu { height: 100%; margin-right: 35px; } .header-container .header-content .header-flex-conten .header-item-flex .hc-listmenu .hc-listmenu-flex .hc-listmenu-item-box { padding: 23px 0px; } .header-container .header-content .header-flex-conten .header-item-flex .hc-listmenu .hc-listmenu-flex .hc-listmenu-item-box .hc-item-listmenu-image-position { width: 91px; } .header-container .header-content .header-flex-conten .header-item-flex .hc-listmenu .hc-listmenu-flex .hc-listmenu-item-box .hc-listmenu-item-name { padding: 0 20px; } .header-container .header-content .header-flex-conten .hc-flex-item-search .header-search { width: 173px; } } .company-footer-back { background: #FDFDFD; padding: 40px 0 15px 0; } .company-footer { width: 1140px; margin-left: auto; margin-right: auto; } .company-footer .company-conten-footer { margin-bottom: 40px; width: 995px; margin-left: auto; margin-right: auto; display: flex; justify-content: center; } .company-footer .company-conten-footer .company-logo { width: 161px; height: 108px; margin-right: 21px; } .company-footer .company-conten-footer .company-logo img { width: 100%; height: 100%; } .company-footer .company-conten-footer .company-logo .bo-quoc-phong { display: flex; margin-top: 10px; gap: 5px; } .company-footer .company-conten-footer .company-logo .bo-quoc-phong img { width: 78px; height: auto; } .company-footer .company-conten-footer .company-footer-info .company-name { font-weight: 600; font-size: 16px; line-height: 19px; color: #1f1f1f; display: block; margin-bottom: 14px; } .company-footer .company-conten-footer .company-footer-info .company-box-info { display: flex; margin-bottom: 14px; } .company-footer .company-conten-footer .company-footer-info .company-box-info .company-headquarters { color: #878787; font-size: 14px; line-height: 16px; } .company-footer .company-conten-footer .company-footer-info .company-box-info .company-headquarters-name { color: #1f1f1f; font-size: 14px; line-height: 16px; } .company-footer .company-conten-footer .company-footer-info .company-box-localtion .company-footer-localtion { font-size: 14px; line-height: 16px; color: #878787; } .company-footer .company-conten-footer .company-footer-info .company-box-localtion a { text-decoration: none; } .company-footer .company-conten-footer .company-footer-info .company-box-localtion a .company-footer-localtion-name { color: #3d89fc; } .company-footer .company-line-copyright { width: 100%; height: 1px; border-bottom: 1px solid #eaeaea; display: block; margin-bottom: 15px; } .company-footer .company-copyright { font-size: 14px; line-height: 16px; color: #979797; text-align: center; display: block; margin-bottom: 15px; } @media screen and (min-width: 992px) { .company-footer { width: 960px; } .company-footer .company-conten-footer { margin-bottom: 60px; width: 960px; } } @media screen and (min-width: 1200px) { .company-footer { width: 1140px; } .company-footer .company-conten-footer { width: 995px; } } .up_button_container { position: fixed; right: -100px; bottom: 20px; transition: right 0.75s; cursor: pointer; font-size: 20px; padding: 10px; outline: none; z-index: 100; } .up_button_transition { right: 20px; } .news-curve { width: 100%; overflow: hidden; padding-top: 64px; background: #fff; } .news-curve .news-curve-box-conten .news-curve-ellipse .news-curve-image-top { width: 100%; } .news-curve .news-curve-box-conten .news-curve-ellipse .news-curve-image-top img { height: 100%; width: 100%; object-fit: cover; } .news-curve .news-curve-box-conten .news-curve-ellipse .news-curve-box-center { height: 100vh; width: 100%; background-color: #ffffff; } .news-curve .news-curve-box-conten .news-curve-ellipse .news-curve-image-bottom { height: 41vh; width: 100%; } .news-curve .news-curve-box-conten .news-curve-ellipse .news-curve-image-bottom img { height: 100%; width: 100%; object-fit: cover; } .news-curve .news-curve-box-conten .news-curve-detail-discover { width: 100%; min-height: 100vh; padding-top: 60px; background: linear-gradient(181.23deg, rgba(245, 245, 247, 0.3) 1.05%, #f5f5f7 75.74%); } .news-curve .news-curve-box-conten .news-curve-detail-discover .news__title { font-family: 'FS PF BeauSans Pro'; font-weight: bold; font-size: 100px; line-height: 119px; color: #000000; display: block; text-align: center; margin-bottom: 15px; } .news-curve .news-curve-box-conten .news-curve-detail-discover .news__desc { font-size: 20px; line-height: 150%; color: #000000; display: block; width: 760px; margin: auto; margin-bottom: 80px; text-align: center; } .news-curve .news-curve-box-conten .news-curve-detail-discover .news__content { width: 1140px; margin: auto; } .news-curve .news-curve-box-conten .news-curve-detail-discover .news__content .news__flex__list { display: flex; align-items: flex-start; flex-wrap: wrap; margin-left: -10px; margin-right: -10px; } .news-curve .news-curve-box-conten .news-curve-detail-discover .news__content .news__flex__list .news__flex__item { padding: 0 10px; width: 33.33%; } .news-curve .news-curve-box-conten .news-curve-detail-discover .news__content .news__flex__list .news__flex__item .news__item__conten .news__image { width: 100%; margin-bottom: 15px; cursor: pointer; } .news-curve .news-curve-box-conten .news-curve-detail-discover .news__content .news__flex__list .news__flex__item .news__item__conten .news__image img { width: 100%; height: 100%; object-fit: cover; border-radius: 4px; } .news-curve .news-curve-box-conten .news-curve-detail-discover .news__content .news__flex__list .news__flex__item .news__item__conten .news__item__name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-weight: 600; font-size: 20px; line-height: 150%; color: #000000; margin-bottom: 10px; cursor: pointer; } .news-curve .news-curve-box-conten .news-curve-detail-discover .news__content .news__flex__list .news__flex__item .news__item__conten .news__item_desc { font-size: 16px; line-height: 150%; color: #5e5e60; margin-bottom: 50px; display: block; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; height: 96px; overflow: hidden; cursor: pointer; } @media screen and (min-width: 992px) { .news-curve .news-curve-box-conten .news-curve-detail-discover .news__content { width: 960px; } } @media screen and (min-width: 1200px) { .news-curve .news-curve-box-conten .news-curve-detail-discover .news__content { width: 1140px; } } .recruitment-container { padding-top: 88px; position: relative; background: #f5f5f7; min-height: 100vh; } .recruitment-container .detail-icon-back { position: absolute; top: 84px; left: 20px; width: 42px; height: 42px; padding: 10px; background: rgba(255, 255, 255, 0.4); box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.1); backdrop-filter: blur(80px); border-radius: 50%; cursor: pointer; } .recruitment-container .detail-icon-back img { height: 100%; width: 100%; object-fit: cover; } .recruitment-container .recruitment-conten { display: flex; width: 1140px; margin: auto; } .recruitment-container .recruitment-conten .recruitment-sidebar { width: 290px; padding-right: 20px; } .recruitment-container .recruitment-conten .recruitment-sidebar .recruitment-sidebar-title { font-weight: 600; font-size: 16px; line-height: 19px; color: #000000; display: block; margin-bottom: 15px; } .recruitment-container .recruitment-conten .recruitment-sidebar .recruitment-sidebar-item { display: flex; align-items: center; justify-content: space-between; margin-bottom: 15px; cursor: pointer; } .recruitment-container .recruitment-conten .recruitment-sidebar .recruitment-sidebar-item .recruitment-position-name { font-size: 14px; line-height: 17px; color: #13151f; } .recruitment-container .recruitment-conten .recruitment-sidebar .recruitment-sidebar-item .recruitment-position-number { font-size: 14px; line-height: 17px; color: #5e5e60; } .recruitment-container .recruitment-conten .recruitment-list-conten { width: 850px; } .recruitment-container .recruitment-conten .recruitment-list-conten .recruitment-flex { display: flex; margin-bottom: 20px; padding: 20px; background: #ffffff; border-radius: 4px; } .recruitment-container .recruitment-conten .recruitment-list-conten .recruitment-flex .recruitment-item-position { border-right: 1px solid #e1e1ea; padding-right: 20px; width: 70%; } .recruitment-container .recruitment-conten .recruitment-list-conten .recruitment-flex .recruitment-item-position .recruitment-item-name { font-weight: 600; font-size: 20px; line-height: 24px; color: #13151f; display: block; margin-bottom: 15px; } .recruitment-container .recruitment-conten .recruitment-list-conten .recruitment-flex .recruitment-item-position .recruitment-item-text-note { font-size: 14px; line-height: 150%; color: #5e5e60; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; word-break: break-word; } .recruitment-container .recruitment-conten .recruitment-list-conten .recruitment-flex .recruitment-item-deal { padding-left: 20px; width: 30%; } .recruitment-container .recruitment-conten .recruitment-list-conten .recruitment-flex .recruitment-item-deal .recruitment-item-deal-number { font-weight: 600; font-size: 20px; line-height: 150%; color: #13151f; text-align: center; display: block; margin-bottom: 10px; } .recruitment-container .recruitment-conten .recruitment-list-conten .recruitment-flex .recruitment-item-deal .recruitment-item-date { font-size: 12px; line-height: 150%; color: #5e5e60; display: block; margin-bottom: 4px; text-align: center; } .recruitment-container .recruitment-conten .recruitment-list-conten .recruitment-flex .recruitment-item-deal .recruitment-group-action { margin-top: 20px; display: flex; align-items: center; } .recruitment-container .recruitment-conten .recruitment-list-conten .recruitment-flex .recruitment-item-deal .recruitment-group-action .recruitment-view-detail { width: 186px; height: 38px; border: 1px solid #EA0029; box-sizing: border-box; border-radius: 4px; padding: 11px 38px; text-align: center; font-weight: 500; font-size: 14px; line-height: 150%; color: #EA0029; margin-right: 10px; transition: all 75ms; -webkit-transition: all 75ms; } .recruitment-container .recruitment-conten .recruitment-list-conten .recruitment-flex .recruitment-item-deal .recruitment-group-action .recruitment-view-detail:hover { background: #EA0029; color: #ffffff; } .recruitment-container .recruitment-conten .recruitment-list-conten .recruitment-flex .recruitment-item-deal .recruitment-group-action .recruitment-send-email { width: 44px; height: 38px; background: #ffffff; border: 1px solid #e3e3e6; border-radius: 4px; padding: 11px; } .recruitment-container .recruitment-conten .recruitment-list-conten .recruitment-flex .recruitment-item-deal .recruitment-group-action .recruitment-send-email:hover { background: #e3e3e5; } .recruitment-container .recruitment-conten .recruitment-list-conten .pagination__container .pagination { display: flex; list-style: none; width: 100%; justify-content: center; align-items: center; } .recruitment-container .recruitment-conten .recruitment-list-conten .pagination__container .pagination li { width: 28px; height: 32px; background: #ffffff; border: 1px solid #e6e6e6; font-size: 14px; line-height: 17px; color: #3874e8; } .recruitment-container .recruitment-conten .recruitment-list-conten .pagination__container .pagination li:hover { background: #3874e8; color: #ffffff; } .recruitment-container .recruitment-conten .recruitment-list-conten .pagination__container .pagination li a { width: 100%; height: 100%; display: block; display: flex; align-items: center; justify-content: center; cursor: pointer; } .recruitment-container .recruitment-conten .recruitment-list-conten .pagination__container .pagination .active { background: #f5f5f7 !important; color: #3874e8 !important; } .recruitment-container .recruitment-conten .recruitment-list-conten .pagination__container .previous { background: #ffffff !important; border-radius: 4px 0px 0px 4px; } .recruitment-container .recruitment-conten .recruitment-list-conten .pagination__container .previous a { background-image: url("/images/global/prev.png"); background-repeat: no-repeat; background-position: center; } .recruitment-container .recruitment-conten .recruitment-list-conten .pagination__container .next { background: #ffffff !important; border-radius: 0px 4px 4px 0px; } .recruitment-container .recruitment-conten .recruitment-list-conten .pagination__container .next a { background-image: url("/images/global/next.png"); background-repeat: no-repeat; background-position: center; } .detail-news-container { padding-top: 64px; position: relative; background: #f5f5f7; } .detail-news-container .detail-icon-back { position: absolute; top: 84px; left: 20px; width: 42px; height: 42px; padding: 10px; background: rgba(255, 255, 255, 0.4); box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.1); backdrop-filter: blur(80px); border-radius: 50%; cursor: pointer; } .detail-news-container .detail-icon-back img { height: 100%; width: 100%; object-fit: cover; } .detail-news-container .detail-news-conten { width: 754px; margin: auto; margin-top: 20px; padding: 20px; background-color: #ffffff; border-radius: 4px; } .detail-news-container .detail-news-conten .detail-news__title { font-weight: 600; font-size: 24px; line-height: 150%; color: #13151f; display: block; margin-bottom: 20px; word-break: break-word; } .detail-news-container .detail-news-conten .detail-news__title h1 { font-size: inherit; font-weight: inherit; margin-block-start: 0; margin-block-end: 0; font-family: 'FS PF BeauSans Pro'; } .detail-news-container .detail-news-conten .detain-news__note { font-weight: 500; font-size: 16px; line-height: 150%; color: #5e5e60; display: block; margin-bottom: 20px; } .detail-news-container .detail-news-conten .box-paragraph-news p { font-size: 16px; line-height: 30px; word-break: break-word; margin: 0 !important; } .detail-news-container .detail-news-conten .box-paragraph-news p img { width: 100% !important; } .detail-news-container .detail-news-more { width: 1140px; margin: auto; border-top: 1px solid #dddddd; padding: 20px 0 65px 0; margin-top: 40px; } .detail-news-container .detail-news-more .detail-news-more-title { font-size: 20px; line-height: 150%; color: #000000; display: block; margin-bottom: 15px; } .detail-news-container .detail-news-more .detail-news-flex { display: flex; margin-left: -10px; margin-right: -10px; } .detail-news-container .detail-news-more .detail-news-flex .detail-news-item-flex { width: 33.33%; padding: 0 10px; } .detail-news-container .detail-news-more .detail-news-flex .detail-news-item-flex .detail-news-item-conten .detail-news-box-img { width: 100%; height: 206px; margin-bottom: 15px; cursor: pointer; } .detail-news-container .detail-news-more .detail-news-flex .detail-news-item-flex .detail-news-item-conten .detail-news-box-img img { width: 100%; height: 100%; object-fit: cover; } .detail-news-container .detail-news-more .detail-news-flex .detail-news-item-flex .detail-news-item-conten .detail-news-item-title { font-weight: 600; font-size: 16px; line-height: 150%; color: #13151f; margin-bottom: 10px; display: block; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; cursor: pointer; height: 46px; } .detail-news-container .detail-news-more .detail-news-flex .detail-news-item-flex .detail-news-item-conten .detain-news-item-text-more { font-size: 14px; line-height: 150%; color: #5e5e60; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; cursor: pointer; } @media screen and (min-width: 992px) { .detail-news-container .detail-news-more { width: 960px; } } @media screen and (min-width: 1200px) { .detail-news-container .detail-news-more { width: 1140px; } } .recruitment-detail-container { padding-top: 84px; position: relative; background: #f5f5f7; min-height: 100vh; } .recruitment-detail-container .detail-icon-back { position: fixed; top: 84px; left: 20px; width: 42px; height: 42px; padding: 10px; background: rgba(255, 255, 255, 0.4); box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.1); backdrop-filter: blur(80px); border-radius: 50%; cursor: pointer; } .recruitment-detail-container .detail-icon-back img { height: 100%; width: 100%; object-fit: cover; } .recruitment-detail-container .recruitment-detail-conten { display: flex; width: 1140px; margin: auto; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-list-conten { width: 773px; padding-right: 20px; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-list-conten .recruitment-detail-box-detail-conten { padding: 20px; background-color: #ffffff; border-radius: 4px; margin-bottom: 35px; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-list-conten .recruitment-detail-box-detail-conten .recruitment-detail-flex { display: flex; align-items: center; padding-bottom: 15px; margin-bottom: 15px; border-radius: 4px; border-bottom: 1px solid #dddddd; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-list-conten .recruitment-detail-box-detail-conten .recruitment-detail-flex .recruitment-detail-item-position { border-right: 1px solid #e1e1ea; padding-right: 20px; width: 70%; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-list-conten .recruitment-detail-box-detail-conten .recruitment-detail-flex .recruitment-detail-item-position .recruitment-detail-item-name { font-weight: 600; font-size: 20px; line-height: 24px; color: #13151f; display: block; margin-bottom: 14px; word-break: break-word; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-list-conten .recruitment-detail-box-detail-conten .recruitment-detail-flex .recruitment-detail-item-position .recruitment-detail-item-date { font-size: 12px; line-height: 150%; color: #5e5e60; display: block; margin-bottom: 4px; text-align: left; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-list-conten .recruitment-detail-box-detail-conten .recruitment-detail-flex .recruitment-detail-item-deal { padding-left: 20px; width: 30%; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-list-conten .recruitment-detail-box-detail-conten .recruitment-detail-flex .recruitment-detail-item-deal .recruitment-detail-item-deal-number { font-weight: 600; font-size: 20px; line-height: 150%; color: #13151f; text-align: center; display: block; margin-bottom: 10px; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-list-conten .recruitment-detail-box-detail-conten .recruitment-detail-flex .recruitment-detail-item-deal .recruitment-detail-group-action { display: flex; align-items: center; width: 206px; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-list-conten .recruitment-detail-box-detail-conten .recruitment-detail-flex .recruitment-detail-item-deal .recruitment-detail-group-action .recruitment-detail-view-detail { width: 152px; height: 38px; border: 1px solid #EA0029; box-sizing: border-box; border-radius: 4px; padding: 7px 37px; text-align: center; background: #ffffff; font-weight: 500; font-size: 14px; line-height: 150%; color: #EA0029; margin-right: 10px; cursor: pointer; transition: all 75ms; -webkit-transition: all 75ms; display: block; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-list-conten .recruitment-detail-box-detail-conten .recruitment-detail-flex .recruitment-detail-item-deal .recruitment-detail-group-action .recruitment-detail-view-detail:hover { background: #EA0029; color: #ffffff; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-list-conten .recruitment-detail-box-detail-conten .recruitment-detail-flex .recruitment-detail-item-deal .recruitment-detail-group-action .recruitment-detail-send-email { width: 44px; height: 38px; background: #ffffff; border-radius: 4px; border: 1px solid #e3e3e6; padding: 11px; cursor: pointer; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-list-conten .recruitment-detail-box-detail-conten .recruitment-detail-flex .recruitment-detail-item-deal .recruitment-detail-group-action .recruitment-detail-send-email img { width: 100%; height: 100%; object-fit: cover; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-list-conten .recruitment-detail-box-detail-conten .box-paragraph-recruitment p { font-size: 16px; line-height: 30px; word-break: break-word; margin: 0 !important; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-list-conten .recruitment-detail-box-detail-conten .box-paragraph-recruitment p img { width: 100% !important; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-sidebar { width: 367px; margin-bottom: 35px; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-sidebar .recruitment-detail-sidebar-title { font-weight: 600; font-size: 16px; line-height: 34px; color: #000000; display: block; margin-bottom: 8px; width: 100%; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-sidebar .rs-item { background: #ffffff; border-radius: 4px; padding: 15px; margin-bottom: 10px; cursor: pointer; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-sidebar .rs-item .rs-item-title { font-weight: 600; font-size: 16px; line-height: 19px; color: #13151f; display: block; margin-bottom: 10px; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-sidebar .rs-item .rs-item-text-note { font-size: 14px; line-height: 150%; color: #5e5e60; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } @media screen and (min-width: 992px) { .recruitment-detail-container .recruitment-detail-conten { width: 960px; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-list-conten { width: 70%; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-list-conten .recruitment-detail-box-detail-conten .recruitment-detail-flex .recruitment-detail-item-position { width: 63%; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-sidebar { width: 30%; } } @media screen and (min-width: 1200px) { .recruitment-detail-container .recruitment-detail-conten { width: 1140px; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-list-conten { width: 773px; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-list-conten .recruitment-detail-box-detail-conten .recruitment-detail-flex .recruitment-detail-item-position { width: 68%; } .recruitment-detail-container .recruitment-detail-conten .recruitment-detail-sidebar { width: 367px; } } .share-popup-container { background: rgba(0, 0, 0, 0.8); height: 100%; left: 0; position: fixed; top: 0; width: 100%; z-index: 99999; animation-name: share; animation-duration: 0.25s; } @keyframes share { 0% { background: rgba(0, 0, 0, 0.1); } 100% { background: rgba(0, 0, 0, 0.8); } } .share-popup-container .share-popup-conten { width: 393px; top: 0; left: 50%; transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); position: absolute; z-index: 9999; } .share-popup-container .share-popup-conten .share-popup-flex-conten { width: 100%; background: #ffffff; border-radius: 4px; margin: auto; margin-top: 90px; padding: 15px; } .share-popup-container .share-popup-conten .share-popup-flex-conten .share-popup-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; } .share-popup-container .share-popup-conten .share-popup-flex-conten .share-popup-header .share-popup-title { font-weight: 600; font-size: 16px; line-height: 150%; color: #000000; } .share-popup-container .share-popup-conten .share-popup-flex-conten .share-popup-header img { width: 24px; height: 24px; object-fit: cover; cursor: pointer; } .share-popup-container .share-popup-conten .share-popup-flex-conten .share-poup-flex { display: flex; align-items: center; } .share-popup-container .share-popup-conten .share-popup-flex-conten .share-poup-flex .share-fb { width: 38px; height: 38px; background: #ffffff; box-sizing: border-box; margin-right: 10px; } .share-popup-container .share-popup-conten .share-popup-flex-conten .share-poup-flex .share-fb img { object-fit: contain; width: 20px; height: 20px; } .share-popup-container .share-popup-conten .share-popup-flex-conten .share-poup-flex .share-poup-link { position: relative; } .share-popup-container .share-popup-conten .share-popup-flex-conten .share-poup-flex .share-poup-link .__react_component_tooltip { top: 109px !important; width: 104px !important; padding: 8px 0px !important; text-align: center !important; } .share-popup-container .share-popup-conten .share-popup-flex-conten .share-poup-flex .share-poup-link .share-poup-input { width: 296px; height: 38px; background: #f5f5f7; border-radius: 4px; padding: 8px 48px 8px 10px; font-size: 14px; line-height: 150%; color: #3874e8; border: none; outline: none; } .share-popup-container .share-popup-conten .share-popup-flex-conten .share-poup-flex .share-poup-link .share-poup-input::selection { background: #f5f5f7; } .share-popup-container .share-popup-conten .share-popup-flex-conten .share-poup-flex .share-poup-link img { width: 24px; height: 24px; object-fit: cover; position: absolute; top: 8px; right: 8px; cursor: pointer; } .share-popup-container .share-popup-close-out { width: 100%; height: 100%; } .bg-popupcv { position: fixed; width: 100%; height: 100%; background: black; opacity: 0.4; z-index: 5; top: 0; } .popupCv { position: fixed; width: 100%; height: 100%; z-index: 10; } .popupCv .popup_cv { background: white; width: 446px; height: 292px; margin: auto; border-radius: 12px; box-shadow: 0px 4px 16px rgba(9, 11, 57, 0.1); padding-bottom: 24px; margin-top: 200px; } .popupCv .popup_cv .body_popup { width: 100%; border-top-left-radius: 12px; border-bottom-left-radius: 12px; padding: 24px 25px; } .popupCv .popup_cv .body_popup .popup_title { display: flex; } .popupCv .popup_cv .body_popup .popup_title .title { width: 90%; font-family: 'SF Pro Display'; font-style: normal; font-weight: 600; font-size: 16px; line-height: 150%; margin: 0px !important; } .popupCv .popup_cv .body_popup .popup_title .img-close { width: 10%; text-align: center; margin: 0px !important; } .popupCv .popup_cv .body_popup .contact { margin-top: 18.51px; } .popupCv .popup_cv .body_popup .contact p { font-family: 'SF Pro Display'; font-style: normal; font-weight: 600; font-size: 16px; line-height: 19px; } .popupCv .popup_cv .body_popup .contact .phone-number { margin-bottom: 31px; } .popupCv .popup_cv .body_popup .contact .phone-number span { margin-left: 13px; font-family: 'SF Pro Display'; font-style: normal; font-weight: 500; font-size: 16px; line-height: 19px; color: #7A7A8F; } .popupCv .popup_cv .body_popup .contact .phone-number p { font-family: 'SF Pro Display'; font-style: normal; font-weight: 500; font-size: 14px; line-height: 19px; color: #7A7A8F; margin-top: 8px; margin-left: 29px; cursor: pointer; } .popupCv .popup_cv .body_popup .contact .phone-number .phone_ { margin: 0px; margin-left: 29px; margin-top: 8px; } .popupCv .popup_cv .body_popup .contact .email { margin-bottom: 20px; } .popupCv .popup_cv .body_popup .contact .email p a { color: #7A7A8F; } .popupCv .popup_cv .body_popup .contact .submit-form input { width: 100%; height: 38px; background: #EA0029; border-radius: 4px; cursor: pointer; color: white; font-family: 'SF Pro Display'; font-style: normal; font-weight: 500; font-size: 14px; line-height: 17px; border: none; } .Toastify__toast--success { background: white !important; color: black !important; border-left: 4px solid #2ECC71 !important; border-radius: 15px 0px 0px 15px !important; min-height: 43px !important; } .Toastify__close-button { color: #8F94A5 !important; padding: 14px 0px !important; } .img_toast { margin-right: 25px; margin-left: -18px; } .Toastify__toast { padding: 0px 8px !important; border-radius: 6px !important; } .Toastify__toast--error { background: white !important; color: black !important; border-left: 4px solid #ED1B2F !important; border-radius: 15px 0px 0px 15px !important; min-height: 43px !important; border-radius: 6px !important; } .loading-home-container { width: 100%; background: #f5f5f7; height: auto; padding-top: 0px; overflow: hidden; } .loading-home-container .loading-home-conten { position: relative; overflow: hidden; width: 100%; } .loading-home-container .loading-home-conten .lh-box-image-top { margin-left: -1146px; } .loading-home-container .loading-home-conten .lh-box-image-top .lh-text-top { font-weight: 800; font-size: 300px; line-height: 100%; text-transform: uppercase; color: #f5f5f7; display: block; -webkit-text-fill-color: #f5f5f7; -webkit-text-stroke-width: 2px; -webkit-text-stroke-color: #e8e8e8; } .loading-home-container .loading-home-conten .lh-box-image-logo-flex { display: flex; justify-content: center; } .loading-home-container .loading-home-conten .lh-box-image-logo-flex .lh-box-image-logo { height: auto; width: 480px; } .loading-home-container .loading-home-conten .lh-box-image-logo-flex .lh-box-image-logo img { object-fit: contain; width: 100%; height: 100%; } .loading-home-container .loading-home-conten .lh-box-buttom { display: flex; justify-content: flex-end; } .loading-home-container .loading-home-conten .lh-box-buttom .lh-box-image-b { margin-right: -1146px; } .loading-home-container .loading-home-conten .lh-box-buttom .lh-box-image-b .lh-text-bottom { font-weight: 800; font-size: 350px; line-height: 80%; text-transform: uppercase; color: #ffffff; opacity: 0.8; display: block; -webkit-text-fill-color: #ffffff; -webkit-text-stroke-width: 2px; -webkit-text-stroke-color: #ececec; } .loading-home-container .loading-home-conten .lh-box-scroll-down { margin: auto; position: absolute; bottom: 15%; left: 50%; transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); } .loading-home-container .loading-home-conten .lh-box-scroll-down .lh-text-scroll { font-weight: 600; font-size: 14px; line-height: 150%; letter-spacing: 0.05em; text-transform: uppercase; color: #F79443; margin-bottom: 15px; } .loading-home-container .loading-home-conten .lh-box-scroll-down .lh-img-scroll { position: absolute; top: 25px; left: 50%; transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); width: 24px; height: 24px; display: block; margin: auto; animation-name: scrollDown; animation-timing-function: linear; animation-duration: 1.25s; animation-iteration-count: infinite; } @keyframes scrollDown { 0% { top: 35px; } 50% { top: 55px; } 100% { top: 35px; } } .loading-home-container .ff { height: 800px; width: 100%; background: #f5f5f7; } @media screen and (min-width: 992px) { .loading-home-container .loading-home-conten .lh-box-image-top .lh-text-top { font-size: 180px; } .loading-home-container .loading-home-conten .lh-box-buttom .lh-box-image-b .lh-text-bottom { font-size: 220px; } } @media screen and (min-width: 1200px) { .loading-home-container .loading-home-conten .lh-box-image-top .lh-text-top { font-size: 170px; } .loading-home-container .loading-home-conten .lh-box-buttom .lh-box-image-b .lh-text-bottom { font-size: 190px; } } @media screen and (min-width: 1600px) { .loading-home-container .loading-home-conten .lh-box-image-top .lh-text-top { font-size: 250px; } .loading-home-container .loading-home-conten .lh-box-buttom .lh-box-image-b .lh-text-bottom { font-size: 300px; } } @media screen and (min-width: 1800px) { .loading-home-container .loading-home-conten .lh-box-image-top .lh-text-top { font-size: 300px; } .loading-home-container .loading-home-conten .lh-box-buttom .lh-box-image-b .lh-text-bottom { font-size: 350px; } } .news-curve__homepage { width: 100%; overflow: hidden; background: #f5f5f7; } .news-curve__homepage .news-curve-box-conten .news-curve-ellipse .news-curve-image-top { width: 100%; } .news-curve__homepage .news-curve-box-conten .news-curve-ellipse .news-curve-image-top img { height: 100%; width: 100%; object-fit: cover; } .news-curve__homepage .news-curve-box-conten .news-curve-ellipse .news-curve-box-center { height: 100vh; width: 100%; background-color: #ffffff; } .news-curve__homepage .news-curve-box-conten .news-curve-ellipse .news-curve-image-bottom { height: 41vh; width: 100%; } .news-curve__homepage .news-curve-box-conten .news-curve-ellipse .news-curve-image-bottom img { height: 100%; width: 100%; object-fit: cover; } .news-curve__homepage .news-curve-box-conten .news-curve-detail-discover { width: 100%; padding-top: 140px; padding-bottom: 55px; background: linear-gradient(181.23deg, rgba(245, 245, 247, 0.3) 1.05%, #f5f5f7 75.74%); } .news-curve__homepage .news-curve-box-conten .news-curve-detail-discover .group-title-desc { opacity: 0; } .news-curve__homepage .news-curve-box-conten .news-curve-detail-discover .news__title { font-weight: bold; font-size: 100px; line-height: 119px; color: #000000; display: block; text-align: center; margin-bottom: 15px; font-family: 'FS PF BeauSans Pro'; } .news-curve__homepage .news-curve-box-conten .news-curve-detail-discover .news__title span { color: #EA0029; font-family: 'FS PF BeauSans Pro'; } .news-curve__homepage .news-curve-box-conten .news-curve-detail-discover .news__desc { font-size: 20px; line-height: 30px; color: #000000; display: block; width: 972px; margin: auto; margin-bottom: 60px; text-align: center; font-family: 'FS PF BeauSans Pro'; } .news-curve__homepage .news-curve-box-conten .news-curve-detail-discover .news__desc .news__desc2 { color: #ea0029; font-family: 'FS PF BeauSans Pro'; } .news-curve__homepage .news-curve-box-conten .news-curve-detail-discover .news__item__name_date { font-size: 14px; line-height: 17px; color: #a3a3a3; margin-bottom: 10px; display: block; } .news-curve__homepage .news-curve-box-conten .news-curve-detail-discover .news__discover__mover { font-size: 16px; line-height: 19px; color: #3874e8; margin-bottom: 0px; margin-top: 20px; text-align: center; cursor: pointer; display: flex; justify-content: center; align-items: center; align-content: center; justify-items: center; } .news-curve__homepage .news-curve-box-conten .news-curve-detail-discover .news__content { width: 960px; margin: auto; } .news-curve__homepage .news-curve-box-conten .news-curve-detail-discover .news__content .news__flex__list { display: flex; margin-left: -10px; margin-right: -10px; } .news-curve__homepage .news-curve-box-conten .news-curve-detail-discover .news__content .news__flex__list .news__flex__item { padding: 0 10px; width: 33.33%; } .news-curve__homepage .news-curve-box-conten .news-curve-detail-discover .news__content .news__flex__list .news__flex__item .news__item__conten .news__image { width: 100%; margin-bottom: 15px; cursor: pointer; } .news-curve__homepage .news-curve-box-conten .news-curve-detail-discover .news__content .news__flex__list .news__flex__item .news__item__conten .news__image img { width: 100%; height: 100%; object-fit: cover; border-radius: 4px; cursor: pointer; transition: all 0.25s ease-in-out; } .news-curve__homepage .news-curve-box-conten .news-curve-detail-discover .news__content .news__flex__list .news__flex__item .news__item__conten .news__image img:hover { transform: scale(1.04); } .news-curve__homepage .news-curve-box-conten .news-curve-detail-discover .news__content .news__flex__list .news__flex__item .news__item__conten .news__item__name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-weight: 600; font-size: 20px; line-height: 150%; color: #13151f; margin-bottom: 10px; cursor: pointer; } .news-curve__homepage .news-curve-box-conten .news-curve-detail-discover .news__content .news__flex__list .news__flex__item .news__item__conten .news__item__name:hover { color: #353846; } .news-curve__homepage .news-curve-box-conten .news-curve-detail-discover .news__content .news__flex__list .news__flex__item .news__item__conten .news__item_desc { font-size: 16px; line-height: 150%; color: #5e5e60; display: block; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; height: 70px; overflow: hidden; cursor: pointer; } @media screen and (min-width: 992px) { .news-curve__homepage .news-curve-box-conten .news-curve-detail-discover .news__content { width: 960px; } } @media screen and (min-width: 1200px) { .news-curve__homepage .news-curve-box-conten .news-curve-detail-discover .news__content { width: 1140px; } } .bg-popup { position: fixed; width: 100%; height: 100%; background: black; opacity: 0.4; z-index: 5; top: 0; } input::-webkit-input-placeholder { color: #CBCBCB; } textarea::-webkit-input-placeholder { color: #CBCBCB; } .digital-Popup { position: fixed; width: 100%; height: 100%; z-index: 10; } .digital-Popup .CompanionpPopups { background: white; width: 749px; height: 470px; margin: auto; border-radius: 12px; box-shadow: 0px 4px 16px rgba(9, 11, 57, 0.1); padding-bottom: 50px; margin-top: 200px; } .digital-Popup .CompanionpPopups .row { z-index: 11; display: flex; } .digital-Popup .CompanionpPopups .row .box-left { width: 40%; background-color: #F5F5F7; border-top-left-radius: 12px; border-bottom-left-radius: 12px; } .digital-Popup .CompanionpPopups .row .box-left .title { font-family: 'SF Pro Display'; font-style: normal; font-weight: 500; font-size: 24px; line-height: 150%; margin: 23px 14px 0px 25px; max-height: 178px !important; } .digital-Popup .CompanionpPopups .row .box-left .contact { margin-top: 53px; } .digital-Popup .CompanionpPopups .row .box-left .contact p { font-family: 'SF Pro Display'; font-style: normal; font-weight: 600; font-size: 16px; line-height: 19px; } .digital-Popup .CompanionpPopups .row .box-left .contact .phone-number { margin: 23px 14px 0px 25px; } .digital-Popup .CompanionpPopups .row .box-left .contact .phone-number span { margin-left: 13px; font-family: 'SF Pro Display'; font-style: normal; font-weight: 500; font-size: 16px; line-height: 19px; color: #7A7A8F; } .digital-Popup .CompanionpPopups .row .box-left .contact .phone-number p { font-family: 'SF Pro Display'; font-style: normal; font-weight: 500; font-size: 16px; line-height: 19px; color: #7A7A8F; margin-top: 8px; margin-left: 29px; cursor: pointer; } .digital-Popup .CompanionpPopups .row .box-left .contact .phone-number .phone_ { margin-left: 29px; } .digital-Popup .CompanionpPopups .row .box-left .contact .email { margin-bottom: 18px; } .digital-Popup .CompanionpPopups .row .box-left .contact .email p a { color: #7A7A8F; } .digital-Popup .CompanionpPopups .row .box-right { width: 60%; } .digital-Popup .CompanionpPopups .row .box-right .infor-title { display: flex; } .digital-Popup .CompanionpPopups .row .box-right .infor-title .title { width: 80%; } .digital-Popup .CompanionpPopups .row .box-right .infor-title .title p { margin: 23px 14px 0px 25px; font-family: 'SF Pro Display'; font-style: normal; font-weight: 600; font-size: 16px; line-height: 19px; color: #13151F; width: 80%; } .digital-Popup .CompanionpPopups .row .box-right .infor-title .img-close { width: 20%; } .digital-Popup .CompanionpPopups .row .box-right .infor-title .img-close img { margin: 25px 30px 0px 44px; cursor: pointer; } .digital-Popup .CompanionpPopups .row .box-right form .form-infor { margin: 15px 25px 0px 25px; } .digital-Popup .CompanionpPopups .row .box-right form .form-infor p { margin-bottom: 10px; font-family: 'SF Pro Display'; font-style: normal; font-weight: 500; font-size: 14px; line-height: 17px; color: #585B67; margin-top: 25px; } .digital-Popup .CompanionpPopups .row .box-right form .form-infor .mess-err { margin-bottom: 0px; margin-top: 0px; color: red; } .digital-Popup .CompanionpPopups .row .box-right form .form-infor .full-name { height: 100%; max-height: 65px; } .digital-Popup .CompanionpPopups .row .box-right form .form-infor input { background: #FFFFFF; border: 1px solid #DADADA; border-radius: 4px; width: 394px; height: 38px; padding-left: 11px; } .digital-Popup .CompanionpPopups .row .box-right form .form-infor .email-phone { display: flex; height: 100%; max-height: 90px; } .digital-Popup .CompanionpPopups .row .box-right form .form-infor .email-phone .email { width: 50%; margin-right: 10px; } .digital-Popup .CompanionpPopups .row .box-right form .form-infor .email-phone .email input { width: 192px; } .digital-Popup .CompanionpPopups .row .box-right form .form-infor .email-phone .phone { width: 50%; } .digital-Popup .CompanionpPopups .row .box-right form .form-infor .email-phone .phone input { width: 192px; } .digital-Popup .CompanionpPopups .row .box-right form .form-infor .text-arena { height: 100%; max-height: 134px; } .digital-Popup .CompanionpPopups .row .box-right form .form-infor .text-arena textarea { height: 107px; width: 100%; resize: none; border: 1px solid #DADADA; border-radius: 4px; padding-left: 11px; } .digital-Popup .CompanionpPopups .row .box-right form .form-infor .submit-form input { width: 100%; height: 38px; background: #EA0029; border-radius: 4px; cursor: pointer; color: white; font-family: 'SF Pro Display'; font-style: normal; font-weight: 500; font-size: 14px; line-height: 17px; margin-top: 22px !important; } .Toastify__toast--success { background: white !important; color: black !important; border-left: 4px solid #2ECC71 !important; border-radius: 15px 0px 0px 15px !important; min-height: 43px !important; } .Toastify__close-button { color: #8F94A5 !important; padding: 14px 0px !important; } .img_toast { margin-right: 25px; margin-left: -18px; } .Toastify__toast { padding: 0px 8px !important; border-radius: 6px !important; } .Toastify__toast--error { background: white !important; color: black !important; border-left: 4px solid #ED1B2F !important; border-radius: 15px 0px 0px 15px !important; min-height: 43px !important; border-radius: 6px !important; } .Toastify__toast-container { z-index: 9999; -webkit-transform: translate3d(0, 0, 9999px); position: fixed; padding: 4px; width: 320px; box-sizing: border-box; color: #fff; } .Toastify__toast-container--top-left { top: 1em; left: 1em; } .Toastify__toast-container--top-center { top: 1em; left: 50%; transform: translateX(-50%); } .Toastify__toast-container--top-right { top: 1em; right: 1em; } .Toastify__toast-container--bottom-left { bottom: 1em; left: 1em; } .Toastify__toast-container--bottom-center { bottom: 1em; left: 50%; transform: translateX(-50%); } .Toastify__toast-container--bottom-right { bottom: 1em; right: 1em; } @media only screen and (max-width : 480px) { .Toastify__toast-container { width: 100vw; padding: 0; left: 0; margin: 0; } .Toastify__toast-container--top-left, .Toastify__toast-container--top-center, .Toastify__toast-container--top-right { top: 0; transform: translateX(0); } .Toastify__toast-container--bottom-left, .Toastify__toast-container--bottom-center, .Toastify__toast-container--bottom-right { bottom: 0; transform: translateX(0); } .Toastify__toast-container--rtl { right: 0; left: initial; } } .Toastify__toast { position: relative; min-height: 64px; box-sizing: border-box; margin-bottom: 1rem; padding: 8px; border-radius: 4px; box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.1), 0 2px 15px 0 rgba(0, 0, 0, 0.05); display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; max-height: 800px; overflow: hidden; font-family: sans-serif; cursor: pointer; direction: ltr; } .Toastify__toast--rtl { direction: rtl; } .Toastify__toast--dark { background: #121212; color: #fff; } .Toastify__toast--default { background: #fff; color: #aaa; } .Toastify__toast--info { background: #3498db; } .Toastify__toast--success { background: #07bc0c; } .Toastify__toast--warning { background: #f1c40f; } .Toastify__toast--error { background: #e74c3c; } .Toastify__toast-body { margin: auto 0; -ms-flex: 1 1 auto; flex: 1 1 auto; padding: 6px; } .Toastify--animate { animation-fill-mode: both; animation-duration: 0.7s; } @media only screen and (max-width : 480px) { .Toastify__toast { margin-bottom: 0; border-radius: 0; } } .Toastify__close-button { color: #fff; background: transparent; outline: none; border: none; padding: 0; cursor: pointer; opacity: 0.7; transition: 0.3s ease; -ms-flex-item-align: start; align-self: flex-start; } .Toastify__close-button--default { color: #000; opacity: 0.3; } .Toastify__close-button > svg { fill: currentColor; height: 16px; width: 14px; } .Toastify__close-button:hover, .Toastify__close-button:focus { opacity: 1; } @keyframes Toastify__trackProgress { 0% { transform: scaleX(1); } 100% { transform: scaleX(0); } } .Toastify__progress-bar { position: absolute; bottom: 0; left: 0; width: 100%; height: 5px; z-index: 9999; opacity: 0.7; background-color: rgba(255, 255, 255, 0.7); transform-origin: left; } .Toastify__progress-bar--animated { animation: Toastify__trackProgress linear 1 forwards; } .Toastify__progress-bar--controlled { transition: transform 0.2s; } .Toastify__progress-bar--rtl { right: 0; left: initial; transform-origin: right; } .Toastify__progress-bar--default { background: linear-gradient(to right, #4cd964, #5ac8fa, #007aff, #34aadc, #5856d6, #ff2d55); } .Toastify__progress-bar--dark { background: #bb86fc; } @keyframes Toastify__bounceInRight { from, 60%, 75%, 90%, to { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; transform: translate3d(3000px, 0, 0); } 60% { opacity: 1; transform: translate3d(-25px, 0, 0); } 75% { transform: translate3d(10px, 0, 0); } 90% { transform: translate3d(-5px, 0, 0); } to { transform: none; } } @keyframes Toastify__bounceOutRight { 20% { opacity: 1; transform: translate3d(-20px, 0, 0); } to { opacity: 0; transform: translate3d(2000px, 0, 0); } } @keyframes Toastify__bounceInLeft { from, 60%, 75%, 90%, to { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; transform: translate3d(25px, 0, 0); } 75% { transform: translate3d(-10px, 0, 0); } 90% { transform: translate3d(5px, 0, 0); } to { transform: none; } } @keyframes Toastify__bounceOutLeft { 20% { opacity: 1; transform: translate3d(20px, 0, 0); } to { opacity: 0; transform: translate3d(-2000px, 0, 0); } } @keyframes Toastify__bounceInUp { from, 60%, 75%, 90%, to { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } from { opacity: 0; transform: translate3d(0, 3000px, 0); } 60% { opacity: 1; transform: translate3d(0, -20px, 0); } 75% { transform: translate3d(0, 10px, 0); } 90% { transform: translate3d(0, -5px, 0); } to { transform: translate3d(0, 0, 0); } } @keyframes Toastify__bounceOutUp { 20% { transform: translate3d(0, -10px, 0); } 40%, 45% { opacity: 1; transform: translate3d(0, 20px, 0); } to { opacity: 0; transform: translate3d(0, -2000px, 0); } } @keyframes Toastify__bounceInDown { from, 60%, 75%, 90%, to { animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } 0% { opacity: 0; transform: translate3d(0, -3000px, 0); } 60% { opacity: 1; transform: translate3d(0, 25px, 0); } 75% { transform: translate3d(0, -10px, 0); } 90% { transform: translate3d(0, 5px, 0); } to { transform: none; } } @keyframes Toastify__bounceOutDown { 20% { transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; transform: translate3d(0, -20px, 0); } to { opacity: 0; transform: translate3d(0, 2000px, 0); } } .Toastify__bounce-enter--top-left, .Toastify__bounce-enter--bottom-left { animation-name: Toastify__bounceInLeft; } .Toastify__bounce-enter--top-right, .Toastify__bounce-enter--bottom-right { animation-name: Toastify__bounceInRight; } .Toastify__bounce-enter--top-center { animation-name: Toastify__bounceInDown; } .Toastify__bounce-enter--bottom-center { animation-name: Toastify__bounceInUp; } .Toastify__bounce-exit--top-left, .Toastify__bounce-exit--bottom-left { animation-name: Toastify__bounceOutLeft; } .Toastify__bounce-exit--top-right, .Toastify__bounce-exit--bottom-right { animation-name: Toastify__bounceOutRight; } .Toastify__bounce-exit--top-center { animation-name: Toastify__bounceOutUp; } .Toastify__bounce-exit--bottom-center { animation-name: Toastify__bounceOutDown; } @keyframes Toastify__zoomIn { from { opacity: 0; transform: scale3d(0.3, 0.3, 0.3); } 50% { opacity: 1; } } @keyframes Toastify__zoomOut { from { opacity: 1; } 50% { opacity: 0; transform: scale3d(0.3, 0.3, 0.3); } to { opacity: 0; } } .Toastify__zoom-enter { animation-name: Toastify__zoomIn; } .Toastify__zoom-exit { animation-name: Toastify__zoomOut; } @keyframes Toastify__flipIn { from { transform: perspective(400px) rotate3d(1, 0, 0, 90deg); animation-timing-function: ease-in; opacity: 0; } 40% { transform: perspective(400px) rotate3d(1, 0, 0, -20deg); animation-timing-function: ease-in; } 60% { transform: perspective(400px) rotate3d(1, 0, 0, 10deg); opacity: 1; } 80% { transform: perspective(400px) rotate3d(1, 0, 0, -5deg); } to { transform: perspective(400px); } } @keyframes Toastify__flipOut { from { transform: perspective(400px); } 30% { transform: perspective(400px) rotate3d(1, 0, 0, -20deg); opacity: 1; } to { transform: perspective(400px) rotate3d(1, 0, 0, 90deg); opacity: 0; } } .Toastify__flip-enter { animation-name: Toastify__flipIn; } .Toastify__flip-exit { animation-name: Toastify__flipOut; } @keyframes Toastify__slideInRight { from { transform: translate3d(110%, 0, 0); visibility: visible; } to { transform: translate3d(0, 0, 0); } } @keyframes Toastify__slideInLeft { from { transform: translate3d(-110%, 0, 0); visibility: visible; } to { transform: translate3d(0, 0, 0); } } @keyframes Toastify__slideInUp { from { transform: translate3d(0, 110%, 0); visibility: visible; } to { transform: translate3d(0, 0, 0); } } @keyframes Toastify__slideInDown { from { transform: translate3d(0, -110%, 0); visibility: visible; } to { transform: translate3d(0, 0, 0); } } @keyframes Toastify__slideOutRight { from { transform: translate3d(0, 0, 0); } to { visibility: hidden; transform: translate3d(110%, 0, 0); } } @keyframes Toastify__slideOutLeft { from { transform: translate3d(0, 0, 0); } to { visibility: hidden; transform: translate3d(-110%, 0, 0); } } @keyframes Toastify__slideOutDown { from { transform: translate3d(0, 0, 0); } to { visibility: hidden; transform: translate3d(0, 500px, 0); } } @keyframes Toastify__slideOutUp { from { transform: translate3d(0, 0, 0); } to { visibility: hidden; transform: translate3d(0, -500px, 0); } } .Toastify__slide-enter--top-left, .Toastify__slide-enter--bottom-left { animation-name: Toastify__slideInLeft; } .Toastify__slide-enter--top-right, .Toastify__slide-enter--bottom-right { animation-name: Toastify__slideInRight; } .Toastify__slide-enter--top-center { animation-name: Toastify__slideInDown; } .Toastify__slide-enter--bottom-center { animation-name: Toastify__slideInUp; } .Toastify__slide-exit--top-left, .Toastify__slide-exit--bottom-left { animation-name: Toastify__slideOutLeft; } .Toastify__slide-exit--top-right, .Toastify__slide-exit--bottom-right { animation-name: Toastify__slideOutRight; } .Toastify__slide-exit--top-center { animation-name: Toastify__slideOutUp; } .Toastify__slide-exit--bottom-center { animation-name: Toastify__slideOutDown; } .tv-show { width: 100%; } .tv-show .film-box-imag-banner { position: relative; background-image: url("/images/news/banner-film.png"); background-repeat: no-repeat; background-size: cover; background-position-x: center; background-position-y: top; -ms-background-size: cover; -o-background-size: cover; -moz-background-size: cover; -webkit-background-size: cover; } .tv-show .film-box-imag-banner .film-fixed { width: 100%; height: 100%; position: absolute; background: rgba(0, 0, 0, 0.6); z-index: 2; } .tv-show .film-box-imag-banner .bg-linear { border-radius: 6px; position: absolute; width: 100%; height: 305px; z-index: 1; background: linear-gradient(181.23deg, rgba(0, 0, 0, 0) 1.05%, #000000 72.16%); bottom: 0; } .tv-show .tvshow-container { width: 1160px; margin: 0 auto; padding-bottom: 196px; position: relative; z-index: 2; } .tv-show .tvshow-container .d-flex { opacity: 0; } .tv-show .tvshow-container .d-flex .tvshow-box-title { padding-top: 66px; color: #ffffff; } .tv-show .tvshow-container .d-flex .tvshow-box-title .tvshow-text-top { font-family: 'FS PF BeauSans Pro'; font-weight: bold; font-size: 60px; line-height: 130%; letter-spacing: 0.07em; margin-bottom: 40px; } .tv-show .tvshow-container .d-flex .tvshow-box-title .tvshow-text-bottom { font-size: 20px; } .tv-show .tvshow-container .d-flex .film-box-title .text-banner-top { font-family: 'FS PF BeauSans Pro'; font-weight: bold; display: block; font-weight: 700; font-size: 65px; line-height: 78px; letter-spacing: 0.02em; color: #ffffff; text-align: center; padding-top: 110px; font-style: normal; } .tv-show .tvshow-container .d-flex .film-box-title .text-banner-top span { color: #EC1B2E; font-family: 'FS PF BeauSans Pro'; } .tv-show .tvshow-container .d-flex .film-box-title .text-banner-bottom { display: block; font-size: 18px; font-weight: 400; color: #ffffff; line-height: 170%; width: 98%; margin: auto; text-align: center; margin-top: 12px; font-family: 'FS PF BeauSans Pro'; } .tv-show .tvshow-container .d-flex .film-box-title .text-banner-bottom span { color: #EC1B2E; font-size: 18px; font-weight: 600; font-family: 'FS PF BeauSans Pro'; } .tv-show .tvshow-container .d-flex .film-box-title .text-btn-tvshow { font-family: 'FS PF BeauSans Pro'; font-style: normal; font-weight: 400; font-size: 18px; line-height: 130%; color: white; margin-top: 4px; text-align: center; } .tv-show .tvshow-container .d-flex .film-box-title .text-btn-tvshow span { color: #0A84FF; cursor: pointer; font-family: 'FS PF BeauSans Pro'; } .tv-show .tvshow-container .tvshow-info { margin-top: 50px; } .tv-show .tvshow-container .tvshow-info .tvshow__slide__title { font-weight: 600; font-size: 20px; line-height: 130%; letter-spacing: 0.02em; color: #ffffff; display: block; margin-bottom: 15px; } .tv-show .tvshow-container .tvshow-info .tvshow-image-banner { display: flex; } .tv-show .tvshow-container .tvshow-info .tvshow-image-banner .tvshow__slide__item { width: 33.33%; padding: 0 10px; } .tv-show .tvshow-container .tvshow-info .tvshow-image-banner .tvshow-list-image { height: 228px; } .tv-show .tvshow-container .tvshow-info .tvshow-image-banner .tvshow-list-image a { text-decoration: none; } .tv-show .tvshow-container .tvshow-info .tvshow-image-banner .tvshow-list-image img { width: 100%; height: 100%; object-fit: cover; border-radius: 4px; transition: all 0.25s ease-in-out; } .tv-show .tvshow-container .tvshow-info .tvshow-image-banner .tvshow-list-image img:hover { transform: scale(1.04); } .tv-show .tvshow-container .tvshow-info .tvshow-image-banner .text-list__tvshow { margin-top: 23px; } .tv-show .tvshow-container .tvshow-info .tvshow-image-banner .text-list__tvshow .text-top__tvshow { font-weight: 600; font-size: 20px; line-height: 130%; color: #ffffff; display: block; margin-bottom: 10px; width: 95%; overflow: hidden; text-overflow: ellipsis; cursor: pointer; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-word; } .tv-show .tvshow-container .tvshow-info .tvshow-image-banner .text-list__tvshow .text-top__tvshow:hover { color: #d6d6d6; } .tv-show .tvshow-container .tvshow-info .tvshow-image-banner .text-list__tvshow .text-middle__tvshow { font-size: 14px; line-height: 130%; color: #ffffff; display: block; margin-bottom: 15px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; } .tv-show .tvshow-container .tvshow-info .tvshow-image-banner .text-list__tvshow a { text-decoration: none; } .tv-show .tvshow-container .tvshow-info .tvshow-image-banner .text-list__tvshow a .film-link-more__tvshow { display: flex; align-items: center; cursor: pointer; } .tv-show .tvshow-container .tvshow-info .tvshow-image-banner .text-list__tvshow a .film-link-more__tvshow:hover .film-text-more__tvshow:hover { color: #77aeff; } .tv-show .tvshow-container .tvshow-info .tvshow-image-banner .text-list__tvshow a .film-link-more__tvshow:hover img { filter: brightness(120%); } .tv-show .tvshow-container .tvshow-info .tvshow-image-banner .text-list__tvshow a .film-link-more__tvshow .film-text-more__tvshow { line-height: 130%; font-size: 16px; color: #3d89fc; display: block; margin-right: 7px; } .tv-show .tvshow-container .tvshow-info .tvshow-image-banner .text-list__tvshow a .film-link-more__tvshow img { width: 18px; object-fit: cover; } @media screen and (min-width: 992px) { .tv-show .tvshow-container { width: 960px; } } @media screen and (min-width: 1200px) { .tv-show .tvshow-container { width: 1160px; } } .text-white { color: white; background-color: green; } .film__banner { width: 100%; height: 800px; } .film__banner .film-box-imag-banner { position: relative; background-image: url("/images/news/banner-film.png"); background-repeat: no-repeat; background-size: cover; background-position-x: center; background-position-y: top; -ms-background-size: cover; -o-background-size: cover; -moz-background-size: cover; -webkit-background-size: cover; height: 800px; } .film__banner .film-box-imag-banner .bg-linear { border-radius: 6px; position: absolute; width: 100%; height: 210px; z-index: 1; background: linear-gradient(160.23deg, rgba(0, 0, 0, 0) 56.05%, #000000 87.16%); transform: rotate(180deg); top: 0; } .film__banner .film-box-imag-banner .film-fixed { width: 100%; height: 100%; position: absolute; background: rgba(0, 0, 0, 0.6); z-index: 2; } .film__banner .film-box-imag-banner .fil-banner-content { margin: auto; position: relative; z-index: 2; } .film__banner .film-box-imag-banner .fil-banner-content .d-flex { display: flex; justify-content: center; } .film__banner .film-box-imag-banner .fil-banner-content .film-box-title { margin: 269px 0px 105px 0px; opacity: 0; } .film__banner .film-box-imag-banner .fil-banner-content .film-box-title .text-banner-top { font-family: 'FS PF BeauSans Pro'; display: block; font-size: 70px; line-height: 130%; letter-spacing: 0.02em; color: #ffffff; margin-bottom: 26px; text-align: center; padding-top: 100%; } .film__banner .film-box-imag-banner .fil-banner-content .film-box-title .text-banner-top span { color: #EC1B2E; } .film__banner .film-box-imag-banner .fil-banner-content .film-box-title .text-banner-bottom { display: block; font-size: 24px; font-weight: 400; color: #ffffff; line-height: 130%; width: 92%; margin: auto; text-align: center; } .film__banner .film-box-imag-banner .fil-banner-content .film-box-title .text-banner-bottom span { color: #EC1B2E; font-size: 24px; font-weight: 600; } .film__banner .film-box-imag-banner .fil-banner-content .film-conten-slide { padding-top: 180px; padding-bottom: 120px; } .film__banner .film-box-imag-banner .fil-banner-content .film-conten-slide .text-film { font-weight: 600; font-size: 60px; line-height: 130%; letter-spacing: 0.02em; color: #ffffff; display: block; width: 1140px; margin-left: 45px; margin-bottom: 40px; font-family: 'FS PF BeauSans Pro'; } .film__banner .film-box-imag-banner .fil-banner-content .film-conten-slide .film-slick-image { display: flex; margin-left: 45px; } .film__banner .film-box-imag-banner .fil-banner-content .film-conten-slide .film-slick-image .film__slide__item { padding: 0 10px; width: 33.33%; } .film__banner .film-box-imag-banner .fil-banner-content .film-conten-slide .film-slick-image .list-film img { width: 97.7%; height: 228px; object-fit: cover; cursor: pointer; border-radius: 4px; transition: all 0.25s ease-in-out; } .film__banner .film-box-imag-banner .fil-banner-content .film-conten-slide .film-slick-image .list-film img:hover { transform: scale(1.04); } .film__banner .film-box-imag-banner .fil-banner-content .film-conten-slide .film-slick-image .list-film .text-list-film { margin-top: 23px; } .film__banner .film-box-imag-banner .fil-banner-content .film-conten-slide .film-slick-image .list-film .text-list-film .text-top { font-weight: 600; font-size: 20px; color: #ffffff; display: block; margin-bottom: 10px; width: 95%; overflow: hidden; text-overflow: ellipsis; cursor: pointer; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-word; } .film__banner .film-box-imag-banner .fil-banner-content .film-conten-slide .film-slick-image .list-film .text-list-film .text-top:hover { color: #d6d6d6; } .film__banner .film-box-imag-banner .fil-banner-content .film-conten-slide .film-slick-image .list-film .text-list-film .text-middle { font-size: 14px; line-height: 21.2px; color: #ffffff; display: block; margin-bottom: 10px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; } .film__banner .film-box-imag-banner .fil-banner-content .film-conten-slide .film-slick-image .list-film .text-list-film a { text-decoration: none; } .film__banner .film-box-imag-banner .fil-banner-content .film-conten-slide .film-slick-image .list-film .text-list-film a .film-link-more { display: flex; align-items: center; cursor: pointer; } .film__banner .film-box-imag-banner .fil-banner-content .film-conten-slide .film-slick-image .list-film .text-list-film a .film-link-more .film-text-more { line-height: 130%; font-size: 16px; color: #3d89fc; display: block; margin-right: 7px; } .film__banner .film-box-imag-banner .fil-banner-content .film-conten-slide .film-slick-image .list-film .text-list-film a .film-link-more .film-text-more:hover { color: #77aeff; } .film__banner .film-box-imag-banner .fil-banner-content .film-conten-slide .film-slick-image .list-film .text-list-film a .film-link-more img { width: 18px; height: 18px; object-fit: cover; } @media screen and (min-width: 992px) { .film__banner .fil-banner-content { width: 960px; margin: auto; } } @media screen and (min-width: 1200px) { .film__banner .fil-banner-content { width: 1231px; } } .game-release { position: relative; width: 100%; height: 59em; background-image: url("/images/release/background.png"); background-repeat: no-repeat; background-position-x: center; background-position-y: top; background-size: cover; -ms-background-size: cover; -o-background-size: cover; -moz-background-size: cover; -webkit-background-size: cover; } .game-release .bg-overlay { position: absolute; width: 101%; height: 101%; top: 50%; left: 50%; transform: translate(-50%, -50%); background: linear-gradient(181.23deg, rgba(245, 245, 247, 0.3) 1.05%, #f5f5f7 75.74%); } .game-release .game-release-box-content { width: 1140px; height: auto; margin: 0 auto; position: relative; z-index: 1; } .game-release .game-release-box-content .game-release-content { opacity: 0; } .game-release .game-release-box-content .game-release-content .game-release-ellipse { height: 330px; margin-top: -64px; } .game-release .game-release-box-content .game-release-content .game-release-ellipse img { width: 100%; height: 330px; object-fit: cover; } .game-release .game-release-box-content .game-release-content .game-release-box-product .d-flex { display: flex; justify-content: center; } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title { margin: 150px 0 0 0; } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .game-release-title { font-weight: 600; font-size: 60px; line-height: 72px; text-align: center; color: #1D1D1D; display: block; margin-bottom: 30px; } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .game-release-title span { color: #EA0029; } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .game-release-text-note { font-size: 18px; line-height: 150%; text-align: center; color: #13151f; display: block; margin: auto; } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .game-release-text-note span { font-size: 20px; font-weight: 600; color: #EA0029; } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title p { font-family: 'SF Pro Display'; font-style: normal; font-weight: 400; font-size: 18px; line-height: 130%; color: #0D57E7; text-align: center; margin-bottom: 0px; cursor: pointer; } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-title-list-game { font-weight: 600; font-size: 20px; line-height: 130%; letter-spacing: 0.02em; color: #000000; display: block; margin-bottom: 24px; width: 1140px; margin-left: auto; margin-right: auto; } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide { display: flex; margin-right: -10px; margin-left: -10px; } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game__slide__item { width: 33.33%; padding: 0 10px; } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-box-image { margin-bottom: 18px; display: block; cursor: pointer; } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-box-image img { width: 100%; height: 228px; object-fit: cover; border-radius: 4px; cursor: pointer; transition: all 0.25s ease-in-out; } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-box-image img:hover { transform: scale(1.04); } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-item-game-name { font-weight: 600; font-size: 20px; letter-spacing: 0.02em; color: #13151f; margin-bottom: 10px; line-height: 130%; width: 96%; overflow: hidden; text-overflow: ellipsis; cursor: pointer; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-word; } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-item-game-name:hover { color: #353846; } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-game-note { font-size: 14px; line-height: 130%; color: #13151F; margin-bottom: 10px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game a { text-decoration: none; } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game a .game-release-box-more { display: flex; align-items: center; cursor: pointer; } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game a .game-release-box-more .game-release-text-more { font-size: 16px; line-height: 130%; color: #0d57e7; display: block; margin-right: 7px; } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game a .game-release-box-more .game-release-text-more:hover { color: #77aeff; } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game a .game-release-box-more img { width: 18px; height: 18px; object-fit: cover; } @media screen and (min-width: 992px) { .game-release .game-release-box-content { width: 1140px; } .game-release .game-release-box-content .game-release-content { margin: auto; } .game-release .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-box-image { height: 240px; } } @media screen and (min-width: 1200px) { .game-release-contaner .game-release-box-content .game-release-content { width: 1140px; } .game-release-contaner .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-box-image { height: 274px; } } @media screen and (min-width: 1600px) { .game-release-contaner .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-box-image { height: 280px; } } @media screen and (min-width: 1920px) { .game-release-contaner .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-box-image { height: 280px; } } @media screen and (min-width: 2100px) { .game-release-contaner .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game__slide__item { width: 636px !important; } .game-release-contaner .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-box-image { height: 380px; } } .aboutus-container { width: 1140px; margin: 0 auto; background-color: #f5f5f7; padding-bottom: 100px; } .aboutus-container .d-flex { display: flex; justify-content: center; } .aboutus-container .d-flex .aboutus-box-title { margin-top: 7em; margin-bottom: 77px; color: #13151f; text-align: center; opacity: 0; } .aboutus-container .d-flex .aboutus-box-title .aboutus-text-layer { font-weight: bold; font-size: 60px; letter-spacing: 0.07em; } .aboutus-container .d-flex .aboutus-box-title .aboutus-text-layer span { color: #EA0029; } .aboutus-container .d-flex .aboutus-box-title .aboutus-desc { font-size: 24px; margin-top: 1em; } .aboutus-container .aboutus__title__slide { font-weight: 600; font-size: 20px; line-height: 130%; letter-spacing: 0.02em; color: #000000; display: block; margin-bottom: 15px; margin-top: 80px; } .aboutus-container .aboutus-slide-info { display: flex; flex-wrap: wrap; margin-left: -10px; margin-right: -10px; } .aboutus-container .aboutus-slide-info .about__item__img { width: 33.33%; padding: 0 10px; margin-bottom: 25px; } .aboutus-container .aboutus-slide-info .aboutus-item-image { width: 100%; height: 228px; object-fit: cover; cursor: pointer; border-radius: 4px; } .aboutus-container .aboutus-slide-info .aboutus-item-name { font-weight: 600; font-size: 20px; line-height: 130%; color: #13151f; display: block; margin: 20px 0 10px 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-word; overflow: hidden; cursor: pointer; } .aboutus-container .aboutus-slide-info .aboutus-item-name:hover { color: #353846; } .aboutus-container .aboutus-slide-info .aboutus-item-note { font-size: 14px; line-height: 130%; color: #13151F; margin-bottom: 10px; display: block; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .aboutus-container .aboutus-slide-info a { text-decoration: none; } .aboutus-container .aboutus-slide-info a .aboutus-item-more { font-size: 16px; line-height: 130%; color: #0d57e7; cursor: pointer; } .aboutus-container .aboutus-slide-info a .aboutus-item-more:hover { color: #77aeff; } .aboutus-container .aboutus-slide-info img { transition: all 0.25s ease-in-out; } .aboutus-container .aboutus-slide-info img:hover { transform: scale(1.04); } @media screen and (min-width: 992px) { .aboutus-container { width: 960px; } } @media screen and (min-width: 1200px) { .aboutus-container { width: 1140px; } .aboutus-container .d-flex .aboutus-box-title { width: 80%; } } #chanel { background-color: #E5E5E5; } .channel-container { width: 1140px; margin: 0 auto; padding-bottom: 140px; background-color: #E5E5E5; position: relative; } .channel-container .d-flex { display: flex; justify-content: left; margin-bottom: 60px; margin-top: 6px; } .channel-container .channel-box-title { margin-top: 120px; font-family: 'SF Pro Display'; color: #13151f; opacity: 0; text-align: center; } .channel-container .channel-box-title .channel-title { font-weight: 600; font-size: 60px; letter-spacing: 0.02em; margin-bottom: 15px; text-align: center; font-family: 'FS PF BeauSans Pro'; } .channel-container .channel-box-title .channel-title span { color: #EA0029; font-family: 'FS PF BeauSans Pro'; } .channel-container .channel-box-title .channel-text-note { font-size: 24px; font-family: 'FS PF BeauSans Pro'; line-height: 1.5; text-align: center; } .channel-container .channel-box-title .channel-text-note span { color: #EA0029; font-weight: 600; font-family: 'FS PF BeauSans Pro'; } .channel-container .channel-box-title p { font-family: 'FS PF BeauSans Pro'; font-style: normal; font-weight: 400; font-size: 18px; line-height: 130%; color: #0D57E7; text-align: center; cursor: pointer; } .channel-container .channel-box-image { display: flex; align-items: center; margin-left: -10px; margin-right: -10px; transition: all 0.25s ease-in-out; } .channel-container .channel-box-image .channel-list-img { position: relative; width: 50%; padding: 0 10px; } .channel-container .channel-box-image .channel-list-img:hover { cursor: pointer; } .channel-container .channel-box-image .channel-list-img:hover .channel-image-box-text { transition-duration: 0.25s; transition-timing-function: cubic-bezier(0.17, 0.67, 0.67, 1.02); z-index: 7; opacity: 1; } .channel-container .channel-box-image .channel-list-img:hover .bg-black { opacity: 0.6; transition-duration: 0.2s; transition-timing-function: cubic-bezier(0.17, 0.67, 0.67, 1.02); z-index: 5; } .channel-container .channel-box-image .channel-list-img img { width: 100%; height: 585px; border-radius: 6px; } .channel-container .channel-box-image .channel-list-img .channel-image-box-text { position: absolute; transform: translate(-50%, -50%); top: 50%; left: 50%; width: 337px; height: 337px; opacity: 0; } .channel-container .channel-box-image .channel-list-img .channel-image-box-text .channnel-item-title { font-weight: bold; font-size: 30px; line-height: 130%; letter-spacing: 0.02em; color: #ffffff; display: block; margin-bottom: 22px; font-family: 'SF UI Text Bold'; } .channel-container .channel-box-image .channel-list-img .channel-image-box-text .channel-item-text-note { font-size: 24px; line-height: 130%; position: absolute; color: white; font-family: 'SF UI Text Medium'; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; } .channel-container .channel-box-image .channel-list-img .bg-black { position: absolute; top: 0; left: 50%; width: 97%; height: 585px; background-color: #000000; opacity: 0; transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); border-radius: 6px; } @media screen and (min-width: 992px) { .channel-container { width: 960px; } .channel-container .channel-box-title { width: 100%; } .channel-container .channel-box-image .channel-list-img img { width: 100%; height: 490px; } } @media screen and (min-width: 992px) and (max-width: 1199px) { .channel-container .channel-box-image .channel-list-img .bg-black { position: absolute; top: 0; left: 50%; width: 97%; height: 490px; background-color: #000000; opacity: 0; transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); border-radius: 6px; } } @media screen and (min-width: 1200px) { .channel-container { width: 1140px; } .channel-container .channel-box-title { width: 100%; } .channel-container .channel-box-image .channel-list-img img { height: 585px; } } .family { width: 100%; height: 990px; background-image: url("/images/channel/background_1.png"); background-size: cover; background-position: center; background-repeat: no-repeat; position: relative; z-index: 1; -ms-background-size: cover; -o-background-size: cover; -moz-background-size: cover; -webkit-background-size: cover; } .family .bg-blur { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); z-index: 2; } .family .family-container { position: relative; z-index: 3; margin: auto; } .family .family-container .d-flex { display: flex; justify-content: center; opacity: 0; } .family .family-container .d-flex .family-box-title { text-align: center; margin-top: 2em; color: #ffffff; font-family: 'SF UI Text Bold'; font-weight: bold; font-size: 80px; } .family .family-container .family-slide-info { height: 400px; width: 100%; top: 470px; margin-top: 5em; } .family .family-container .family-slide-info .family-flex-title-slide { display: flex; align-items: center; margin: auto; margin-bottom: 26px; } .family .family-container .family-slide-info .family-flex-title-slide .family-position-left { font-weight: 400; font-size: 20px; color: #ffffff; margin-right: 25px; font-family: 'SF UI Text Bold'; } .family .family-container .family-slide-info .family-flex-title-slide .family-position-flex-center { display: flex; align-items: center; cursor: pointer; opacity: 0.6; } .family .family-container .family-slide-info .family-flex-title-slide .family-position-flex-center:hover { opacity: 1; } .family .family-container .family-slide-info .family-flex-title-slide .family-position-flex-center .family-position-center { font-size: 20px; color: #e9e9e9; margin-right: 8px; font-family: 'SF UI Text Regular'; } .family .family-container .family-slide-info .family-flex-title-slide .family-position-flex-center img { height: 16px; width: 16px; object-fit: cover; } .family .family-container .family-slide-info .family__slide { display: flex; margin-left: -10px; margin-right: -10px; } .family .family-container .family-slide-info .family__blur__item { width: 33.33%; padding: 0 10px; cursor: pointer; } .family .family-container .family-slide-info .family-blur-list-img .family-list-img { background-size: cover; background-repeat: no-repeat; background-position-y: top; background-position-x: center; width: 100%; height: 367px; padding: 140px 0 60px 0; position: relative; border-radius: 4px; } .family .family-container .family-slide-info .family-blur-list-img .family-list-img:hover .overlay-black { opacity: 0.8; } .family .family-container .family-slide-info .family-blur-list-img .family-list-img:hover .family-list-conten { opacity: 1; } .family .family-container .family-slide-info .family-blur-list-img .family-list-img .overlay-black { background-color: black; opacity: 0; transition: 0.25; width: 100%; height: 100%; z-index: 6; position: absolute; top: 0; left: 0; } .family .family-container .family-slide-info .family-blur-list-img .family-list-img .family-list-conten { opacity: 0; position: absolute; transform: translate(-50%, -50%); top: 50%; left: 50%; z-index: 7; width: 100%; } .family .family-container .family-slide-info .family-blur-list-img .family-list-img .family-list-conten .family-item-title { font-weight: bold; font-size: 24px; line-height: 36px; text-align: center; color: #ffffff; display: block; margin-bottom: 17px; font-family: 'SF UI Text Bold'; height: 36px; width: 98%; overflow: hidden; padding: 0 16px; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; height: 70px; word-break: break-word; } .family .family-container .family-slide-info .family-blur-list-img .family-list-img .family-list-conten .family-item-text-note { font-size: 16px; line-height: 150%; text-align: center; color: #ffffff; margin-bottom: 42px; display: block; height: 72px; padding: 0 30px; width: 100%; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-break: break-word; font-family: 'SF UI Text Medium'; } .family .family-container .family-slide-info .family-blur-list-img .family-list-img .family-list-conten a { text-decoration: none; } .family .family-container .family-slide-info .family-blur-list-img .family-list-img .family-list-conten a .family-item-buttom { font-weight: 500; font-size: 16px; line-height: 19px; text-align: center; color: #ffffff; width: 173px; height: 45px; display: block; padding: 13px; text-align: center; border: 1px solid #ffffff; border-radius: 4px; margin: auto; cursor: pointer; transition: 0.3s ease-out; font-family: 'SF UI Text Medium'; } .family .family-container .family-slide-info .family-blur-list-img .family-list-img .family-list-conten a .family-item-buttom:hover { background-color: white; color: black; font-weight: bold; } .family .family-container .family-slide-info .family-blur-list-img .family-list-img .family-list-conten a .family-item-buttom:hover .btn.hover-filled-opacity::before { top: 0; bottom: 0; right: 0; height: 100%; width: 100%; opacity: 1; } @media screen and (min-width: 992px) { .family-container { width: 960px; } .family-container .family-box-title .family-box-title-top { font-size: 70px; } .family-container .family-box-title .family-text-title { font-size: 70px; } .family-container .family-slide-info .family-flex-title-slide { width: 966px; } .family-container .family-slide-info .family-blur-list-img .family-list-img { height: 280px; } } @media screen and (min-width: 1200px) { .family-container { width: 1140px; } .family-container .family-box-title .family-box-title-top { font-size: 80px; } .family-container .family-box-title .family-text-title { font-size: 80px; } .family-container .family-slide-info .family-flex-title-slide { width: 1140px; } .family-container .family-slide-info .family-blur-list-img .family-list-img { height: 280px; } } .sitcom-webdrama { width: 100%; } .sitcom-webdrama .film-box-imag-banner { position: relative; background-image: url("/images/news/banner-film.png"); background-repeat: no-repeat; background-size: cover; background-position-x: center; background-position-y: top; -ms-background-size: cover; -o-background-size: cover; -moz-background-size: cover; -webkit-background-size: cover; padding-bottom: 185px; } .sitcom-webdrama .film-box-imag-banner .film-fixed { width: 100%; height: 100%; position: absolute; background: rgba(0, 0, 0, 0.6); z-index: 2; } .sitcom-webdrama .sitcom-container { width: 1231px; margin: 0 auto; position: relative; z-index: 2; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-title { display: flex; opacity: 0; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-title .sitcom-box-title { margin: 120px 0 40px 0px; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-title .sitcom-box-title .sitcom-title { font-weight: 600; font-size: 60px; line-height: 130%; letter-spacing: 0.02em; color: #ffffff; display: block; font-family: 'FS PF BeauSans Pro'; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img { padding-bottom: 0em; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img { display: grid; grid-template-columns: 1fr 15px 1fr 15px 1fr; grid-template-rows: 306px 15px 280px; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img img { object-fit: cover; width: 100%; height: 100%; cursor: pointer; transition: all 0.25s ease-in-out; animation: fadein 2s; -moz-animation: fadein 2s; /* Firefox */ -webkit-animation: fadein 2s; /* Safari and Chrome */ -o-animation: fadein 2s; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img img:hover { transform: scale(1.04); } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img .hidden-scale { overflow: hidden; border-radius: 4px; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img .sitcom-img-one { grid-column: 1 / 2; grid-row: 1 / 4; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img .sitcom-img-two { grid-column: 3 / 4; grid-row: 1 / 2; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img .sitcom-img-three { grid-column: 5 / 6; grid-row: 1 / 2; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img .sitcom-img-four { grid-column: 3 / 6; grid-row: 3 / 4; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img .sitcom-item-flex-img-center { margin: 0 8px; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img .sitcom-item-flex-img-center .sitcom-item-img-top { display: flex; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img .sitcom-item-flex-img-center .sitcom-item-img-top .sitcom-img-lager { width: 100%; height: 312px; margin: 0 8px; cursor: pointer; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img .sitcom-item-flex-img-center .sitcom-item-img-top .sitcom-img-lager img { object-fit: cover; width: 100%; height: 100%; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img .sitcom-item-flex-img-center .sitcom-item-img-top:nth-child(1) { margin-bottom: 12px; } @media (min-width: 992px) { .sitcom-webdrama .sitcom-container { width: 960px; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img { display: grid; grid-template-columns: 1fr 10px 1fr; grid-template-rows: 15em 10px 15em 10px 15em; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img .sitcom-img-one { grid-column-start: 1; grid-column-end: 2; grid-row-start: 1; grid-row-end: 4; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img .sitcom-img-two { grid-column-start: 3; grid-column-end: 4; grid-row-start: 1; grid-row-end: 2; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img .sitcom-img-three { grid-column-start: 3; grid-column-end: 4; grid-row-start: 3; grid-row-end: 4; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img .sitcom-img-four { grid-column-start: 1; grid-column-end: 4; grid-row-start: 5; grid-row-end: 6; } } @media (min-width: 1200px) { .sitcom-webdrama .sitcom-container { width: 1140px; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img { display: grid; grid-template-columns: 370px 15px 370px 15px 370px; grid-template-rows: 270px 15px 270px; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img .sitcom-img-one { grid-column: 1 / 2; grid-row: 1 / 4; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img .sitcom-img-two { grid-column: 3 / 4; grid-row: 1 / 2; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img .sitcom-img-three { grid-column: 5 / 6; grid-row: 1 / 2; } .sitcom-webdrama .sitcom-container .sitcom-item-flex-img .sitcom-flex-box-img .sitcom-img-four { grid-column: 3 / 6; grid-row: 3 / 4; } } @keyframes fadein { from { opacity: 0; } to { opacity: 1; } } @-moz-keyframes fadein { /* Firefox */ from { opacity: 0; } to { opacity: 1; } } @-webkit-keyframes fadein { /* Safari and Chrome */ from { opacity: 0; } to { opacity: 1; } } @-o-keyframes fadein { /* Opera */ from { opacity: 0; } to { opacity: 1; } } .partner-container { width: 100%; height: auto; overflow: hidden; background-color: #F5F5F7; padding-bottom: 120px; padding-top: 30px; } .partner-container .partner-conten .partner-text-layer-bottom { font-weight: 600; font-size: 60px; line-height: 140%; text-align: center; color: #2d2d2d; margin-bottom: 73px; text-align: center; display: block; opacity: 0; } .partner-container .partner-conten .partner-text-layer-bottom span { color: #EA0029; } .partner-container .partner-conten .partner-flex-logo { display: flex; } .partner-container .partner-conten .partner-flex-logo .partner-position-animation .partner-item-flex { display: flex; width: 100%; } .partner-container .partner-conten .partner-flex-logo .partner-position-animation .partner-item-flex .partner-box-logo { margin: 10px; width: 264px !important; height: auto; } .partner-container .partner-conten .partner-flex-logo .partner-position-animation .partner-item-flex .partner-box-logo img { width: 100%; height: 100%; object-fit: inherit; border-radius: 12px; } .partner-container .partner-conten .company-text-note { font-size: 60px; line-height: 100%; text-align: center; color: black; display: block; margin: auto; margin-bottom: 25px; font-weight: 600; font-family: 'FS PF BeauSans Pro'; } .partner-container .partner-conten .company-text-note span { color: #EA0029; } .partner-container .partner-conten .company-line { width: 800px; height: 1px; border-bottom: 1px solid #ffffff8f; margin: auto; display: block; margin-bottom: 63px; margin-top: 34px; } .partner-container .partner-conten .company-localtion { font-weight: 500; font-size: 24px; line-height: 150%; text-align: center; color: #13151F; display: block; margin-left: auto; margin-right: auto; margin-bottom: 10px; font-family: 'FS PF BeauSans Pro'; } .partner-container .partner-conten .company-phonenumber { font-weight: 500; font-size: 24px; line-height: 19px; color: #13151F; display: block; font-family: 'FS PF BeauSans Pro'; text-align: center; display: block; padding-bottom: 100px; margin-top: 18px; display: flex; justify-content: center; } .partner-container .partner-conten .company-phonenumber span { margin: 0px 8px; } .partner-container .partner-conten a { color: #ea0029 !important; } .partner-container .partner-conten .contact__flex__link { padding-top: 0px !important; display: flex; align-items: center; justify-content: center; } .partner-container .partner-conten .contact__flex__link .contac__flex__content { display: flex; align-items: center; } .partner-container .partner-conten .contact__flex__link .contac__flex__content .company__link { font-weight: 500; font-size: 20px; line-height: 130%; color: #ff7979 !important; display: block; margin-right: 10px; } .partner-container .partner-conten .contact__flex__link .contac__flex__content img { width: 18px; height: 18px; object-fit: cover; } .company-container { width: 100%; background: #f5f5f7; overflow: hidden; } .company-container .company-conten .company-box-banner { position: relative; height: 935px; width: 100%; background-image: url("/images/news/banner-film.png"); background-repeat: no-repeat; background-size: cover; background-position-x: center; background-position-y: top; -ms-background-size: cover; -o-background-size: cover; -moz-background-size: cover; -webkit-background-size: cover; } .company-container .company-conten .company-box-banner .bg_linear { background: linear-gradient(178.56deg, rgba(14, 14, 14, 0.1) 1.23%, rgba(255, 255, 255, 0.15) 68.83%, rgba(245, 245, 247, 0.62) 75.29%, #F5F5F7 83.9%); height: 975px; width: 100%; position: absolute; } .company-container .company-conten .company-box-banner .company-blur { height: 110%; width: 100%; position: absolute; top: 0px; } .company-container .company-conten .company-box-banner .company-blur .family__slide { display: flex; margin: 0 auto; width: 1160px; justify-content: space-between; } .company-container .company-conten .company-box-banner .company-blur .family__blur__item { width: 31.82%; cursor: pointer; } .company-container .company-conten .company-box-banner .company-blur .family-blur-list-img .family-list-img { background-size: cover; background-repeat: no-repeat; background-position-y: top; background-position-x: center; width: 100%; height: 350px; padding: 140px 20px 15px 20px; position: relative; border-radius: 4px; } .company-container .company-conten .company-box-banner .company-blur .family-blur-list-img .family-list-img .overlay-black { background: linear-gradient(0deg, #000000 -61.83%, rgba(0, 0, 0, 0.862091) 14.7%, rgba(0, 0, 0, 0) 88.71%); opacity: 0.8; transition: 0.25; width: 100%; height: 100%; z-index: 6; position: absolute; top: 0; left: 0; border-radius: 4px; } .company-container .company-conten .company-box-banner .company-blur .family-blur-list-img .family-list-img .family-list-conten { opacity: 1; position: absolute; transform: translate(-50%, -50%); top: 78.6%; left: 50%; z-index: 7; width: 100%; } .company-container .company-conten .company-box-banner .company-blur .family-blur-list-img .family-list-img .family-list-conten .family-item-title { opacity: 1; font-weight: 600; font-size: 20px; line-height: 24px; color: #ffffff; display: block; margin-bottom: 15px; width: 98%; overflow: hidden; padding: 0 20px; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-break: break-word; } .company-container .company-conten .company-box-banner .company-blur .family-blur-list-img .family-list-img .family-list-conten .family-item-text-note { font-size: 16px; line-height: 150%; color: #ffffff; margin-bottom: 20px; display: block; padding: 0 20px; width: 100%; text-overflow: ellipsis; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .company-container .company-conten .company-box-banner .company-blur .family-blur-list-img .family-list-img .family-list-conten a { text-decoration: none; display: flex; } .company-container .company-conten .company-box-banner .company-blur .family-blur-list-img .family-list-img .family-list-conten a .family-item-buttom { font-weight: 500; font-size: 16px; line-height: 19px; color: #ffffff; display: block; padding: 0px 9px 0px 20px; cursor: pointer; } .company-container .company-conten .company-box-banner .company-blur .family-blur-list-img .family-list-img .family-list-conten a:hover .next_btn { -webkit-filter: invert(40%) grayscale(100%) brightness(39%) sepia(100%) hue-rotate(-50deg) saturate(507%) contrast(2); } .company-container .company-conten .company-box-banner .company-blur .family-blur-list-img .family-list-img .family-list-conten a:hover .family-item-buttom { color: #EA0029; } .company-container .company-conten .company-box-banner .company-blur .company-box-title { margin-bottom: 20px; } .company-container .company-conten .company-box-banner .company-blur .company-box-title .company-title { font-weight: bold; font-size: 70px; line-height: 72px; text-align: center; color: #ffffff; display: block; margin: auto; margin-top: 45px; font-family: 'FS PF BeauSans Pro'; } .company-container .company-conten .company-box-banner .company-blur .company-box-title .company-title span { color: #EA0029; font-family: 'FS PF BeauSans Pro'; } .company-container .company-conten .company-box-banner .company-blur .company-text-note { font-size: 60px; line-height: 150%; text-align: center; color: black; display: block; margin: auto; margin-bottom: 25px; font-weight: 600; margin-top: 250px; } .company-container .company-conten .company-box-banner .company-blur .company-line { width: 800px; height: 1px; border-bottom: 1px solid #ffffff8f; margin: auto; display: block; margin-bottom: 63px; margin-top: 34px; } .company-container .company-conten .company-box-banner .company-blur .company-localtion { font-weight: 500; font-size: 24px; line-height: 150%; text-align: center; color: #13151F; display: block; margin-left: auto; margin-right: auto; margin-bottom: 10px; } .company-container .company-conten .company-box-banner .company-blur .company-phonenumber { font-weight: 500; font-size: 24px; line-height: 19px; color: #13151F; display: block; text-align: center; display: block; padding-bottom: 20px; margin-top: 18px; display: flex; justify-content: center; } .company-container .company-conten .company-box-banner .company-blur .company-phonenumber span { margin: 0px 8px; } .company-container .company-conten .company-box-banner .company-blur a { color: #ea0029 !important; } .company-container .company-conten .company-box-banner .company-blur .contact__flex__link { padding-top: 0px !important; display: flex; align-items: center; justify-content: center; } .company-container .company-conten .company-box-banner .company-blur .contact__flex__link .contac__flex__content { display: flex; align-items: center; } .company-container .company-conten .company-box-banner .company-blur .contact__flex__link .contac__flex__content .company__link { font-weight: 500; font-size: 20px; line-height: 130%; color: #FF6B85 !important; display: block; margin-right: 10px; font-family: 'FS PF BeauSans Pro'; } .company-container .company-conten .company-box-banner .company-blur .contact__flex__link .contac__flex__content img { width: 18px; height: 18px; object-fit: cover; } @media screen and (min-width: 992px) { .company-container .company-conten .company-box-banner .company-blur .family__slide { display: flex; margin: 0 auto; width: 960px; } .company-container .company-conten .company-box-banner .company-blur .company-box-title { margin-bottom: 20px; margin-top: 45px; } .company-container .company-conten .company-box-banner .company-blur .company-box-title .company-title { font-weight: bold; font-size: 58px; line-height: 72px; text-align: center; color: #ffffff; display: block; margin: auto; } .company-container .company-conten .company-box-banner .company-blur .company-box-title .company-title span { color: #EA0029; } } @media screen and (min-width: 1200px) { .company-container .company-conten .company-box-banner .company-blur .family__slide { display: flex; margin: 0 auto; width: 1140px; justify-content: space-around; } .company-container .company-conten .company-box-banner .company-blur .family__blur__item { width: 33.33%; cursor: pointer; max-width: 350px; } } @media screen and (min-width: 2200px) and (max-width: 2560px) { .company-container .company-conten .company-box-banner { height: 1353px; } .company-container .company-conten .company-box-banner .bg_linear { height: 1470px; } .company-container .company-conten .company-box-banner .company-blur { padding-top: 165px; } .company-container .company-conten .company-box-banner .company-blur .family__slide { display: flex; margin: 0 auto; width: 1100px; } } @media screen and (min-width: 1900px) and (max-width: 2199px) { .company-container .company-conten .company-box-banner { height: 1185px; } .company-container .company-conten .company-box-banner .bg_linear { height: 1315px; } .company-container .company-conten .company-box-banner .company-blur { padding-top: 130px; } .company-container .company-conten .company-box-banner .company-blur .family__slide { display: flex; margin: 0 auto; width: 1100px; } } @media screen and (min-width: 1700px) and (max-width: 1899px) { .company-container .company-conten .company-box-banner { height: 1065px; } .company-container .company-conten .company-box-banner .bg_linear { height: 1150px; } .company-container .company-conten .company-box-banner .company-blur { padding-top: 68px; } .company-container .company-conten .company-box-banner .company-blur .family__slide { display: flex; margin: 0 auto; width: 1100px; } } .loading__container { height: 100vh; width: 100%; position: absolute; top: 0; left: 0; z-index: 5555; } .loading__container .loading__conten--background { height: 100vh; width: 100%; overflow: hidden; position: fixed; top: 0; left: 0; opacity: 0; background-color: #f5f5f7; transition: 1s; -o-transition: 1s; z-index: 9999; } .loading__container .loading__conten--background .loading__conten { transition: 0.5s; } .loading__container .loading__conten--background .loading__conten h1 { position: absolute; font-weight: 600; font-size: 14px; left: 50%; top: 58%; color: #3c3c3c; margin-left: -20px; } .loading__container .loading__conten--background .loading__conten .body { position: absolute; top: 50%; margin-left: -50px; left: 50%; animation: speeder 0.4s linear infinite; } .loading__container .loading__conten--background .loading__conten .body > span { height: 5px; width: 35px; background: #3c3c3c; position: absolute; top: -19px; left: 60px; border-radius: 2px 10px 1px 0; } .loading__container .loading__conten--background .loading__conten .base span { position: absolute; width: 0; height: 0; border-top: 6px solid transparent; border-right: 100px solid #3c3c3c; border-bottom: 6px solid transparent; } .loading__container .loading__conten--background .loading__conten .base span:before { content: ''; height: 22px; width: 22px; border-radius: 50%; background: #3c3c3c; position: absolute; right: -110px; top: -16px; } .loading__container .loading__conten--background .loading__conten .base span:after { content: ''; position: absolute; width: 0; height: 0; border-top: 0 solid transparent; border-right: 55px solid #3c3c3c; border-bottom: 16px solid transparent; top: -16px; right: -98px; } .loading__container .loading__conten--background .loading__conten .face { position: absolute; height: 12px; width: 20px; background: #3c3c3c; border-radius: 20px 20px 0 0; transform: rotate(-40deg); right: -125px; top: -15px; } .loading__container .loading__conten--background .loading__conten .face:after { content: ''; height: 12px; width: 12px; background: #3c3c3c; right: 4px; top: 7px; position: absolute; transform: rotate(40deg); transform-origin: 50% 50%; border-radius: 0 0 0 2px; } .loading__container .loading__conten--background .loading__conten .body > span > span:nth-child(1), .loading__container .loading__conten--background .loading__conten .body > span > span:nth-child(2), .loading__container .loading__conten--background .loading__conten .body > span > span:nth-child(3), .loading__container .loading__conten--background .loading__conten .body > span > span:nth-child(4) { width: 30px; height: 1px; background: #3c3c3c; position: absolute; animation: fazer1 0.2s linear infinite; } .loading__container .loading__conten--background .loading__conten .body > span > span:nth-child(2) { top: 3px; animation: fazer2 0.4s linear infinite; } .loading__container .loading__conten--background .loading__conten .body > span > span:nth-child(3) { top: 1px; animation: fazer3 0.4s linear infinite; animation-delay: -1s; } .loading__container .loading__conten--background .loading__conten .body > span > span:nth-child(4) { top: 4px; animation: fazer4 1s linear infinite; animation-delay: -1s; } @keyframes fazer1 { 0% { left: 0; } 100% { left: -80px; opacity: 0; } } @keyframes fazer2 { 0% { left: 0; } 100% { left: -100px; opacity: 0; } } @keyframes fazer3 { 0% { left: 0; } 100% { left: -50px; opacity: 0; } } @keyframes fazer4 { 0% { left: 0; } 100% { left: -150px; opacity: 0; } } @keyframes speeder { 0% { transform: translate(2px, 1px) rotate(0deg); } 10% { transform: translate(-1px, -3px) rotate(-1deg); } 20% { transform: translate(-2px, 0px) rotate(1deg); } 30% { transform: translate(1px, 2px) rotate(0deg); } 40% { transform: translate(1px, -1px) rotate(1deg); } 50% { transform: translate(-1px, 3px) rotate(-1deg); } 60% { transform: translate(-1px, 1px) rotate(0deg); } 70% { transform: translate(3px, 1px) rotate(-1deg); } 80% { transform: translate(-2px, -1px) rotate(1deg); } 90% { transform: translate(2px, 1px) rotate(0deg); } 100% { transform: translate(1px, -2px) rotate(-1deg); } } .loading__container .loading__conten--background .loading__conten .longfazers { position: absolute; width: 100%; height: 100%; overflow: hidden; } .loading__container .loading__conten--background .loading__conten .longfazers span { position: absolute; height: 2px; width: 20%; background: #000; } .loading__container .loading__conten--background .loading__conten .longfazers span:nth-child(1) { top: 20%; animation: lf 0.6s linear infinite; animation-delay: -5s; } .loading__container .loading__conten--background .loading__conten .longfazers span:nth-child(2) { top: 40%; animation: lf2 0.8s linear infinite; animation-delay: -1s; } .loading__container .loading__conten--background .loading__conten .longfazers span:nth-child(3) { top: 60%; animation: lf3 0.6s linear infinite; } .loading__container .loading__conten--background .loading__conten .longfazers span:nth-child(4) { top: 80%; animation: lf4 0.5s linear infinite; animation-delay: -3s; } @keyframes lf { 0% { left: 200%; } 100% { left: -200%; opacity: 0; } } @keyframes lf2 { 0% { left: 200%; } 100% { left: -200%; opacity: 0; } } @keyframes lf3 { 0% { left: 200%; } 100% { left: -100%; opacity: 0; } } @keyframes lf4 { 0% { left: 200%; } 100% { left: -100%; opacity: 0; } } .home-container { width: 100%; height: 100%; background: #f5f5f7; overflow: hidden; } .home-container .full-page { height: 100%; width: 100%; margin-bottom: -1px; } .digital-marketing { position: relative; width: 100%; height: 60em; background-image: url("/images/release/background.png"); background-repeat: no-repeat; background-position-x: center; background-position-y: top; background-size: cover; -ms-background-size: cover; -o-background-size: cover; -moz-background-size: cover; -webkit-background-size: cover; } .digital-marketing .bg-overlay { position: absolute; width: 100%; top: 50%; left: 50%; transform: translate(-50%, -50%); background: linear-gradient(181.23deg, rgba(245, 245, 247, 0.3) 1.05%, #f5f5f7 75.74%); } .digital-marketing .game-release-box-content { height: auto; margin: 0 auto; position: relative; z-index: 1; } .digital-marketing .game-release-box-content .game-release-content { opacity: 0; } .digital-marketing .game-release-box-content .game-release-content .game-release-ellipse { height: 330px; margin-top: -64px; } .digital-marketing .game-release-box-content .game-release-content .game-release-ellipse img { width: 100%; height: 330px; object-fit: cover; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .d-flex { display: flex; justify-content: center; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title { margin: 150px 0px 65px 0px; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .news__discover__mover { font-size: 16px; line-height: 19px; color: #3874e8; margin-bottom: 0px; margin-top: 18px; text-align: center; cursor: pointer; display: flex; justify-content: center; align-items: center; align-content: center; justify-items: center; font-family: 'FS PF BeauSans Pro'; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .game-release-title { font-weight: 600; font-size: 60px; line-height: 72px; text-align: center; color: #1D1D1D; display: block; margin-bottom: 30px; width: 1390px; font-family: 'FS PF BeauSans Pro'; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .game-release-title span { color: #EA0029; font-family: 'FS PF BeauSans Pro'; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .game-release-text-note { font-size: 18px; line-height: 150%; text-align: center; color: #13151f; display: block; width: 820px; margin: auto; font-family: 'FS PF BeauSans Pro'; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .game-release-text-note span { font-size: 20px; font-weight: 600; color: #EA0029; font-family: 'FS PF BeauSans Pro'; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-title-list-game { font-weight: 600; font-size: 20px; line-height: 130%; letter-spacing: 0.02em; color: #000000; display: block; margin-bottom: 24px; width: 1140px; margin-left: auto; margin-right: auto; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide { display: flex; margin-right: -10px; margin-left: -10px; justify-content: center; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game__slide__item { width: 33%; background: #FFFFFF; box-shadow: 0px 4px 24px rgba(19, 48, 83, 0.05); border-radius: 28px; text-align: center; margin-right: 20px; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-box-image { margin-top: 40px; margin-bottom: 18px; display: block; cursor: pointer; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-box-image .imgs { width: 114px; border-radius: 50px; object-fit: cover; cursor: pointer; transition: all 0.25s ease-in-out; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-item-game-name { font-weight: 600; font-size: 24px; letter-spacing: 0.02em; color: #13151f; margin-bottom: 10px; line-height: 130%; width: 96%; overflow: hidden; text-overflow: ellipsis; cursor: pointer; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-word; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-item-game-name:hover { color: #353846; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-game-note { font-size: 16px; line-height: 130%; color: #13151F; margin-bottom: 25px; padding: 0px 23px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game a { text-decoration: none; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game a .game-release-box-more { display: flex; align-items: center; cursor: pointer; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game a .game-release-box-more .game-release-text-more { font-size: 16px; line-height: 130%; color: #0d57e7; display: block; margin-right: 7px; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game a .game-release-box-more .game-release-text-more:hover { color: #77aeff; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game a .game-release-box-more img { width: 18px; height: 18px; object-fit: cover; } @media screen and (min-width: 992px) { .digital-marketing .game-release-box-content .game-release-content { width: 960px; margin: auto; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .game-release-title { width: 900px; } } @media screen and (min-width: 1200px) { .digital-marketing .game-release-box-content .game-release-content { width: 1140px; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .game-release-title { width: 1140px; } } @media screen and (min-width: 1600px) { .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .game-release-title { width: 1390px; } } @media screen and (min-width: 1920px) { .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .game-release-title { width: 1390px; } } @media screen and (min-width: 2100px) { .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .game-release-title { width: 1390px; } .digital-marketing .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game__slide__item { width: 636px !important; } } .film-kd { position: relative; width: 100%; height: 65em; background-image: url("/images/release/background.png"); background-repeat: no-repeat; background-position-x: center; background-position-y: top; background-size: cover; -ms-background-size: cover; -o-background-size: cover; -moz-background-size: cover; -webkit-background-size: cover; } .film-kd .bg-overlay { position: absolute; width: 100%; height: 101%; top: 50%; left: 50%; transform: translate(-50%, -50%); background: radial-gradient(50% 50% at 50% 50%, #DEE5F0 0%, rgba(244, 247, 252, 0.977356) 18.75%, rgba(255, 255, 255, 0.85) 100%); backdrop-filter: blur(2px); } .film-kd .game-release-box-content { height: auto; margin: 0 auto; position: relative; z-index: 1; } .film-kd .game-release-box-content .game-release-content { opacity: 0; } .film-kd .game-release-box-content .game-release-content .game-release-ellipse { height: 330px; margin-top: -64px; } .film-kd .game-release-box-content .game-release-content .game-release-ellipse img { width: 100%; height: 330px; object-fit: cover; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .d-flex { display: flex; justify-content: center; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title { margin: 150px 0px 65px 0px; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .news__discover__mover { font-size: 16px; line-height: 19px; color: #3874e8; margin-bottom: 0px; margin-top: 18px; text-align: center; cursor: pointer; display: flex; justify-content: center; align-items: center; align-content: center; justify-items: center; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .game-release-title { font-weight: 600; font-size: 55px; line-height: 72px; text-align: center; color: #1D1D1D; display: block; margin-bottom: 30px; font-family: 'FS PF BeauSans Pro'; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .game-release-title span { font-family: 'FS PF BeauSans Pro'; color: #EA0029; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .game-release-text-note { font-size: 18px; line-height: 150%; text-align: center; color: #13151f; display: block; margin: auto; font-family: 'FS PF BeauSans Pro'; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .game-release-text-note .red { font-size: 20px; font-weight: 600; color: #EA0029; font-family: 'FS PF BeauSans Pro'; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .game-release-text-note p, .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .game-release-text-note span { font-family: 'FS PF BeauSans Pro'; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .game-release-text-note .black { font-size: 20px; font-weight: 600; color: #13151F; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-box-title .form-contact { font-family: 'FS PF BeauSans Pro'; font-style: normal; font-weight: 400; font-size: 18px; line-height: 130%; color: #0D57E7; text-align: center; cursor: pointer; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-title-list-game { font-weight: 500; font-size: 20px; line-height: 130%; letter-spacing: 0.02em; color: #000000; display: block; margin-bottom: 24px; width: 1140px; margin-left: auto; margin-right: auto; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .slick-list { margin: 0px; padding: 0px !important; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .slick-list .slick-track { margin: auto; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .slick-list .slick-track .slick-slide { width: auto !important; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .owl-slider-next { background: url("https://mcvideomd1fr.keeng.vn/playnow/images/static/web/mocha_video_05.png") no-repeat scroll center center; height: 48px; position: absolute; right: -60px; top: 40%; width: 48px; z-index: 2; opacity: 0.9; border: none; border-radius: 50%; cursor: pointer; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .owl-slider-back { background: url("https://mcvideomd1fr.keeng.vn/playnow/images/static/web/mocha_video_06.png") no-repeat scroll center center; height: 48px; position: absolute; left: -55px; top: 40%; width: 48px; z-index: 2; opacity: 0.9; border: none; border-radius: 50%; cursor: pointer; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .list-film { margin-right: 20px; width: 270px; height: 386px; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .list-film img { width: 100%; max-width: 270px; max-height: 386px; object-fit: cover; cursor: pointer; border-radius: 4px; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .list-film .text-list-film { margin-top: 10px; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .list-film .text-list-film .text-top { font-weight: 600; font-size: 14px; line-height: 24px; letter-spacing: 0.02em; color: #000000; display: block; margin-bottom: 0px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .list-film .text-list-film .text-middle { font-size: 14px; line-height: 19px; color: #5E5E60; display: block; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .list-film .text-list-film a { text-decoration: none; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .list-film .text-list-film a .film-page-link-more { display: flex; align-items: center; cursor: pointer; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .list-film .text-list-film a .film-page-link-more .film-text-more { line-height: 130%; font-size: 16px; color: #3d89fc; display: block; margin-right: 7px; font-family: 'SF UI Text Medium'; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .list-film .text-list-film a .film-page-link-more img { width: 15px; height: 15px; object-fit: cover; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game__slide__item { width: 367px; height: 313px; background: #FFFFFF; box-shadow: 0px 4px 24px rgba(19, 48, 83, 0.05); border-radius: 28px; text-align: center; margin-right: 20px; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-box-image { margin-top: 40px; margin-bottom: 18px; display: block; cursor: pointer; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-item-game-name { font-weight: 600; font-size: 24px; letter-spacing: 0.02em; color: #13151f; margin-bottom: 10px; line-height: 130%; width: 96%; overflow: hidden; text-overflow: ellipsis; cursor: pointer; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-word; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-item-game-name:hover { color: #353846; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-game-note { font-size: 16px; line-height: 130%; color: #13151F; margin-bottom: 10px; padding: 0px 23px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game a { text-decoration: none; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game a .game-release-box-more { display: flex; align-items: center; cursor: pointer; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game a .game-release-box-more .game-release-text-more { font-size: 16px; line-height: 130%; color: #0d57e7; display: block; margin-right: 7px; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game a .game-release-box-more .game-release-text-more:hover { color: #77aeff; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game a .game-release-box-more img { width: 18px; height: 18px; object-fit: cover; } @media screen and (min-width: 992px) { .film-kd .game-release-box-content .game-release-content { width: 852px; margin: auto; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .slick-list { margin: 0px; padding: 0px !important; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .slick-list .slick-track { margin: auto; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .slick-list .slick-track .slick-slide { width: 188px !important; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .list-film { margin-right: 20px; width: auto; height: auto; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-box-image { height: 274px; } } @media screen and (min-width: 1200px) { .film-kd .game-release-box-content .game-release-content { width: 1160px; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .slick-list { margin: 0px; padding: 0px !important; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .slick-list .slick-track { margin: auto; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .slick-list .slick-track .slick-slide { width: auto !important; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-box-image { height: 274px; } } @media screen and (min-width: 1600px) { .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-box-image { height: 280px; } } @media screen and (min-width: 1920px) { .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-box-image { height: 280px; } } @media screen and (min-width: 2100px) { .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game__slide__item { width: 636px !important; } .film-kd .game-release-box-content .game-release-content .game-release-box-product .game-release-list-game .game-release-slide .game-release-item-game .game-release-box-image { height: 380px; } } .media-complex { background-color: #FFFFFF; width: 100%; margin: 0px; padding: 80px 0px; position: relative; } .media-complex .media-content { width: 1150px; margin: auto; } .media-complex .media-content .media-title { text-align: center; font-family: 'FS PF BeauSans Pro'; } .media-complex .media-content .media-title p { margin: 0px; font-style: normal; font-weight: 700; font-size: 60px; line-height: 72px; letter-spacing: 0.02em; color: #13151F; font-family: 'FS PF BeauSans Pro'; } .media-complex .media-content .media-title p span { color: red; font-family: 'FS PF BeauSans Pro'; } .media-complex .media-content .media-menu { display: flex; justify-content: center; margin-top: 40px; } .media-complex .media-content .media-menu .menu-item { color: #A3A3A3; border-radius: 8px; width: 134px; height: 38px; text-align: center; margin: 0px 10px; padding: 9px 17px 8px 18px; cursor: pointer; } .media-complex .media-content .media-menu .menu-item p { font-family: 'SF Pro Display'; font-style: normal; font-weight: 400; font-size: 18px; line-height: 21px; } .media-complex .media-content .media-menu .actives { background: rgba(236, 27, 46, 0.1); color: red; } .media-complex .media-content .media-subject { text-align: center; font-family: 'FS PF BeauSans Pro'; } .media-complex .media-content .media-subject p { font-family: 'FS PF BeauSans Pro'; font-style: normal; font-weight: 400; font-size: 18px; line-height: 150%; text-align: center; color: #13151F; margin: 32px 0px 0px 0px; } .media-complex .media-content .media-subject p span { font-family: 'FS PF BeauSans Pro'; color: #EC1B2E; font-size: 20px; font-weight: 600; } .media-complex .media-content .viettel-media { margin: auto !important; width: 900px !important; display: flex; justify-content: center; margin-top: 25px; } .media-complex .media-content .viettel-media .box-left { width: 38%; } .media-complex .media-content .viettel-media .box-left .vittel-tin { width: 270px; height: 234px; border-radius: 12px; margin: auto; font-family: 'SF Pro Display'; font-style: normal; text-align: center; margin-bottom: 20px; padding: 20px 0px; cursor: pointer; box-shadow: 0px 4px 24px rgba(19, 48, 83, 0.1); padding: 20px; } .media-complex .media-content .viettel-media .box-left .vittel-tin img { display: block; margin: auto; width: 88px; height: 88px; } .media-complex .media-content .viettel-media .box-left .vittel-tin .tin-titel { font-weight: 700; font-size: 16px; line-height: 130%; letter-spacing: 0.02em; color: #13151F; margin: 4px; } .media-complex .media-content .viettel-media .box-left .vittel-tin .tin-titel1 { margin-bottom: 8px; margin-top: 15px; } .media-complex .media-content .viettel-media .box-left .vittel-tin span { font-weight: 400; font-size: 14px; line-height: 150%; color: #13151F; } .media-complex .media-content .viettel-media .box-center { width: 29.5%; border-radius: 12px; margin-bottom: 20px; cursor: pointer; box-shadow: 0px 4px 24px rgba(19, 48, 83, 0.1); padding-bottom: 30px; } .media-complex .media-content .viettel-media .box-center .viettel-mocha { width: 270px; margin: auto; padding: 33px 32px 0px 31px; text-align: center; } .media-complex .media-content .viettel-media .box-center .viettel-mocha img { margin: auto; width: 88px; height: 88px; margin-bottom: 15px; } .media-complex .media-content .viettel-media .box-center .viettel-mocha .mocha-titel { font-weight: 700; font-size: 16px; line-height: 130%; letter-spacing: 0.02em; color: #13151F; margin: 0px; } .media-complex .media-content .viettel-media .box-center .viettel-mocha .mocha-titel span { font-weight: 400; font-size: 14px; line-height: 150%; color: #13151F; } .media-complex .media-content .viettel-media .box-center .browser { display: flex; } .media-complex .media-content .viettel-media .box-center .browser .browser-item { width: auto; margin: auto; margin-top: 125px; } .media-complex .media-content .viettel-media .box-center .browser .browser-item img { margin: 0px 25px; } .media-complex .media-content .viettel-media .box-right { width: 38%; } .media-complex .media-content .viettel-face { display: flex; } .media-complex .media-content .viettel-face .face-item { width: 270px; height: 234px; border-radius: 12px; margin: auto; font-family: 'SF Pro Display'; font-style: normal; text-align: center; margin-bottom: 20px; padding: 35px 45px; margin-top: 48px; cursor: pointer; box-shadow: 0px 4px 24px rgba(19, 48, 83, 0.1); } .media-complex .media-content .viettel-face .face-item img { display: block; margin: auto; width: 88px; height: 88px; margin-bottom: 15px; } .media-complex .media-content .viettel-face .face-item .face-titel { font-weight: 700; font-size: 14px; line-height: 120%; letter-spacing: 0.02em; color: #13151F; margin: 0px; } .media-complex .media-content .viettel-face .face-item .face-titel1 { margin-bottom: 7px; } .media-complex .media-content .viettel-face .face-item span { font-weight: 400; font-size: 14px; line-height: 150%; color: #13151F; } @media screen and (min-width: 992px) { .media-complex { background-color: #FFFFFF; width: 100%; position: relative; } .media-complex .media-content { width: 960px; margin: auto; } .media-complex .media-content .media-title { text-align: center; } .media-complex .media-content .media-title p { margin: 0px; font-family: 'SF Pro Display'; font-style: normal; font-weight: 700; font-size: 60px; line-height: 72px; letter-spacing: 0.02em; color: #13151F; } .media-complex .media-content .media-title p span { color: red; } } @media screen and (min-width: 1200px) { .media-complex .media-content { width: 1140px; margin: auto; } } .digital-Popup { position: fixed; width: 100%; height: 100%; z-index: 10; top: 0px; } .digital-Popup .CompanionpPopup { background: white; width: 749px; height: 465px; margin: auto; border-radius: 12px; box-shadow: 0px 4px 16px rgba(9, 11, 57, 0.1); z-index: 12; padding-bottom: 50px; margin-top: 200px; } .digital-Popup .CompanionpPopup .row { display: flex; } .digital-Popup .CompanionpPopup .row .box-left { width: 40%; background-color: #F5F5F7; border-top-left-radius: 12px; border-bottom-left-radius: 12px; } .digital-Popup .CompanionpPopup .row .box-left p { font-family: 'SF Pro Display'; font-style: normal; font-weight: 500; font-size: 24px; line-height: 150%; margin: 20px 14px 0px 25px; } .digital-Popup .CompanionpPopup .row .box-left .contact { margin-top: 85px; } .digital-Popup .CompanionpPopup .row .box-left .contact p { font-family: 'SF Pro Display'; font-style: normal; font-weight: 600; font-size: 16px; line-height: 19px; } .digital-Popup .CompanionpPopup .row .box-left .contact .phone-number { margin: 23px 14px 0px 25px; } .digital-Popup .CompanionpPopup .row .box-left .contact .phone-number span { margin-left: 13px; font-family: 'SF Pro Display'; font-style: normal; font-weight: 500; font-size: 16px; line-height: 19px; color: #7A7A8F; } .digital-Popup .CompanionpPopup .row .box-left .contact .phone-number p { font-family: 'SF Pro Display'; font-style: normal; font-weight: 500; font-size: 16px; line-height: 19px; color: #7A7A8F; margin-top: 8px; margin-left: 29px; cursor: pointer; } .digital-Popup .CompanionpPopup .row .box-left .contact .phone-number .phone_ { margin-left: 29px; } .digital-Popup .CompanionpPopup .row .box-left .contact .email { margin-bottom: 18px; } .digital-Popup .CompanionpPopup .row .box-left .contact .email p a { color: #7A7A8F; } .digital-Popup .CompanionpPopup .row .box-right { width: 60%; background-color: white; border-top-right-radius: 12px; border-bottom-right-radius: 12px; } .digital-Popup .CompanionpPopup .row .box-right .infor-title { display: flex; } .digital-Popup .CompanionpPopup .row .box-right .infor-title p { margin: 25px 35px 0px 25px; font-family: 'SF Pro Display'; font-style: normal; font-weight: 600; font-size: 16px; line-height: 19px; color: #13151F; } .digital-Popup .CompanionpPopup .row .box-right .infor-title img { margin: 23px 25px 0px 100px; cursor: pointer; } .digital-Popup .CompanionpPopup .row .box-right form { height: 100%; max-height: 395px; } .digital-Popup .CompanionpPopup .row .box-right form .form-infor { margin: 15px 25px 0px 25px; } .digital-Popup .CompanionpPopup .row .box-right form .form-infor p { margin-bottom: 10px; font-family: 'SF Pro Display'; font-style: normal; font-weight: 500; font-size: 14px; line-height: 17px; color: #13151F; margin-top: 25px; } .digital-Popup .CompanionpPopup .row .box-right form .form-infor input { background: #FFFFFF; border: 1px solid #DADADA; border-radius: 4px; width: 398px; height: 38px; padding-left: 11px; } .digital-Popup .CompanionpPopup .row .box-right form .form-infor .mess-err { margin-top: 0px; color: red; margin-bottom: 0px; } .digital-Popup .CompanionpPopup .row .box-right form .form-infor .full-name { height: 100%; max-height: 65px; } .digital-Popup .CompanionpPopup .row .box-right form .form-infor .email-phone { display: flex; height: 100%; max-height: 90px; } .digital-Popup .CompanionpPopup .row .box-right form .form-infor .email-phone .email { width: 50%; margin-right: 10px; } .digital-Popup .CompanionpPopup .row .box-right form .form-infor .email-phone .email input { width: 193px; } .digital-Popup .CompanionpPopup .row .box-right form .form-infor .email-phone .phone { width: 50%; } .digital-Popup .CompanionpPopup .row .box-right form .form-infor .email-phone .phone input { width: 193px; } .digital-Popup .CompanionpPopup .row .box-right form .form-infor .text-arena { height: 100%; max-height: 134px; } .digital-Popup .CompanionpPopup .row .box-right form .form-infor .text-arena textarea { height: 107px; width: 100%; resize: none; border: 1px solid #DADADA; border-radius: 4px; padding-left: 11px; padding-top: 8px; } .digital-Popup .CompanionpPopup .row .box-right form .form-infor .submit-form input { width: 100%; height: 38px; background: #EA0029; border-radius: 4px; cursor: pointer; color: white; font-family: 'SF Pro Display'; font-style: normal; font-weight: 500; font-size: 14px; line-height: 17px; margin-top: 15px; } .not-found-container { width: 100%; background: #ffff; min-height: 100vh; display: flex; align-items: center; justify-content: center; padding-top: 64px; } .not-found-container .not-found-conten { width: 590px; } .not-found-container .not-found-conten .not-found-box-img { position: relative; width: 100%; height: 358px; margin-bottom: 65px; } .not-found-container .not-found-conten .not-found-box-img .not-found-text-top { font-size: 20px; line-height: 24px; text-transform: uppercase; color: #13151f; position: absolute; top: 0; left: 50%; -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); width: 440px; } .not-found-container .not-found-conten .not-found-box-img img { width: 100%; height: 100%; object-fit: cover; } .not-found-container .not-found-conten .not-found-box-img .not-found-text-bottom { font-size: 20px; line-height: 150%; text-align: center; text-transform: uppercase; color: #13151f; position: absolute; bottom: -42px; left: 50%; -ms-transform: translate(-50%, 0); transform: translate(-50%, 0); width: 570px; } .not-found-container .not-found-conten .not-found-bottom-submit { width: 234px; height: 42px; background: #ec1b2e; border-radius: 6px; font-weight: 500; font-size: 16px; line-height: 19px; text-align: center; color: #ffffff; display: block; padding: 11px; margin: auto; } .film-page-page-banner { height: 2000px; width: 100%; background: #1b1bb1; position: relative; overflow: hidden; } .film-page-page-banner .film-page-box-imag-banner { width: 100%; height: 100%; position: relative; background-image: url("/images/news/banner-film.png"); background-repeat: no-repeat; background-size: cover; background-position-x: center; background-position-y: top; background-attachment: fixed; padding-top: 100px; } .film-page-page-banner .film-page-box-imag-banner .film-page-fixed { width: 100%; height: 100%; position: absolute; background: linear-gradient(180deg, rgba(0, 0, 0, 0.3) 0%, rgba(0, 0, 0, 0.9) 70%, black 100%); opacity: 0; z-index: 2; } .film-page-page-banner .film-page-box-imag-banner img { width: 100%; height: 100%; object-fit: cover; } .film-page-page-banner .film-page-box-imag-banner .film-page-list-image-split { position: absolute; background-repeat: no-repeat; transform: scale(0.2); padding-top: 64px; opacity: 0; z-index: 1; } .film-page-page-banner .film-banner-conten { position: absolute; top: 500px; left: 0; width: 100%; z-index: 3; opacity: 0; padding-top: 100px; } .film-page-page-banner .film-banner-conten .film-page-box-title { width: 1140px; margin: auto; margin-bottom: 127px; } .film-page-page-banner .film-banner-conten .film-page-box-title .text-banner-top { font-family: 'FS PF BeauSans Pro'; display: block; font-weight: bold; font-size: 80px; line-height: 130%; letter-spacing: 0.02em; color: #ffffff; margin-bottom: 8px; } .film-page-page-banner .film-banner-conten .film-page-box-title .text-banner-bottom { display: block; text-align: center; font-size: 24px; font-weight: 400; color: #ffffff; line-height: 130%; width: 560px; } .film-page-page-banner .film-banner-conten .film-page-conten-slide .text-film { font-weight: 600; font-size: 26px; line-height: 130%; letter-spacing: 0.02em; color: #ffffff; display: block; width: 1140px; margin-left: auto; margin-right: auto; margin-bottom: 26px; } .film-page-page-banner .film-banner-conten .film-page-conten-slide .film-page-slick-image .list-film { margin: 0 13px; } .film-page-page-banner .film-banner-conten .film-page-conten-slide .film-page-slick-image .list-film img { width: 100%; max-height: 450px; object-fit: cover; cursor: pointer; } .film-page-page-banner .film-banner-conten .film-page-conten-slide .film-page-slick-image .list-film .text-list-film { margin-top: 23px; } .film-page-page-banner .film-banner-conten .film-page-conten-slide .film-page-slick-image .list-film .text-list-film .text-top { font-weight: 600; font-size: 30px; line-height: 130%; letter-spacing: 0.02em; color: #ffffff; display: block; margin-bottom: 10px; } .film-page-page-banner .film-banner-conten .film-page-conten-slide .film-page-slick-image .list-film .text-list-film .text-middle { font-size: 18px; line-height: 130%; color: #ffffff; display: block; margin-bottom: 20px; height: 46px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; } .film-page-page-banner .film-banner-conten .film-page-conten-slide .film-page-slick-image .list-film .text-list-film a { text-decoration: none; } .film-page-page-banner .film-banner-conten .film-page-conten-slide .film-page-slick-image .list-film .text-list-film a .film-page-link-more { display: flex; align-items: center; cursor: pointer; } .film-page-page-banner .film-banner-conten .film-page-conten-slide .film-page-slick-image .list-film .text-list-film a .film-page-link-more .film-text-more { line-height: 130%; font-size: 16px; color: #3d89fc; display: block; margin-right: 7px; } .film-page-page-banner .film-banner-conten .film-page-conten-slide .film-page-slick-image .list-film .text-list-film a .film-page-link-more img { width: 15px; height: 15px; object-fit: cover; } @media screen and (min-width: 992px) { .film-page-page-banner { height: 1800px; } .film-page-page-banner .film-banner-conten .film-page-box-title { width: 960px; } .film-page-page-banner .film-banner-conten .film-page-conten-slide .text-film { width: 960px; } .film-page-page-banner .film-banner-conten .film-page-conten-slide .film-page-slick-image .list-film img { width: 100%; max-height: 450px; object-fit: cover; cursor: pointer; } } @media screen and (min-width: 1200px) { .film-page-page-banner { height: 1800px; } .film-page-page-banner .film-banner-conten .film-page-box-title { width: 1140px; } .film-page-page-banner .film-banner-conten .film-page-conten-slide .text-film { width: 1140px; } .film-page-page-banner .film-banner-conten .film-page-conten-slide .film-page-slick-image .list-film img { max-height: 297px; } } @media screen and (min-width: 1600px) { .film-page-page-banner { height: 1900px; } .film-page-page-banner .film-banner-conten .film-page-conten-slide .film-page-slick-image .list-film img { max-height: 297px; } } @media screen and (min-width: 1920px) { .film-page-page-banner { height: 2000px; } .film-page-page-banner .filfilm-banner-conten .film-page-conten-slide { width: 1920px; margin: auto; } .film-page-page-banner .filfilm-banner-conten .film-page-conten-slide .film-page-slick-image .list-film img { max-height: 297px; } }