.product-font-style[data-v-51f515bd]{transition:.4s cubic-bezier(.4,.4,0,1)}.spinner[data-v-36413753]{animation:loading-spin-36413753 1s linear infinite;height:16px;pointer-events:none;width:16px}.spinner[data-v-36413753]:before{border-bottom:2px solid transparent;border-right:2px solid transparent;border-color:transparent currentcolor currentcolor transparent;border-style:solid;border-width:2px;opacity:.2}.spinner[data-v-36413753]:after,.spinner[data-v-36413753]:before{border-radius:50%;box-sizing:border-box;content:"";height:100%;position:absolute;width:100%}.spinner[data-v-36413753]:after{border-left:2px solid transparent;border-top:2px solid transparent;border-color:currentcolor transparent transparent currentcolor;border-style:solid;border-width:2px;opacity:1}@keyframes loading-spin-36413753{0%{transform:rotate(0)}to{transform:rotate(1turn)}}@font-face{font-family:grandam;font-style:normal;font-weight:400;src:url(https://storage.googleapis.com/studio-front/fonts/grandam.ttf) format("truetype")}@font-face{font-family:Material Icons;font-style:normal;font-weight:400;src:url(https://storage.googleapis.com/production-os-assets/assets/material-icons/1629704621943/MaterialIcons-Regular.eot);src:local("Material Icons"),local("MaterialIcons-Regular"),url(https://storage.googleapis.com/production-os-assets/assets/material-icons/1629704621943/MaterialIcons-Regular.woff2) format("woff2"),url(https://storage.googleapis.com/production-os-assets/assets/material-icons/1629704621943/MaterialIcons-Regular.woff) format("woff"),url(https://storage.googleapis.com/production-os-assets/assets/material-icons/1629704621943/MaterialIcons-Regular.ttf) format("truetype")}.StudioCanvas{display:flex;height:auto;min-height:100dvh}.StudioCanvas>.sd{min-height:100dvh;overflow:clip}a,abbr,address,article,aside,audio,b,blockquote,body,button,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,input,ins,kbd,label,legend,li,main,mark,menu,nav,object,ol,p,pre,q,samp,section,select,small,span,strong,sub,summary,sup,table,tbody,td,textarea,tfoot,th,thead,time,tr,ul,var,video{border:0;font-family:sans-serif;line-height:1;list-style:none;margin:0;padding:0;text-decoration:none;-webkit-font-smoothing:antialiased;-webkit-backface-visibility:hidden;box-sizing:border-box;color:#333;transition:.3s cubic-bezier(.4,.4,0,1);word-spacing:1px}a:focus:not(:focus-visible),button:focus:not(:focus-visible),summary:focus:not(:focus-visible){outline:none}nav ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:none}a,button{background:transparent;font-size:100%;margin:0;padding:0;vertical-align:baseline}ins{text-decoration:none}ins,mark{background-color:#ff9;color:#000}mark{font-style:italic;font-weight:700}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{border:0;border-top:1px solid #ccc;display:block;height:1px;margin:1em 0;padding:0}input,select{vertical-align:middle}textarea{resize:none}.clearfix:after{clear:both;content:"";display:block}[slot=after] button{overflow-anchor:none}.sd{flex-wrap:nowrap;max-width:100%;pointer-events:all;z-index:0;-webkit-overflow-scrolling:touch;align-content:center;align-items:center;display:flex;flex:none;flex-direction:column;position:relative}.sd::-webkit-scrollbar{display:none}.sd,.sd.richText *{transition-property:all,--g-angle,--g-color-0,--g-position-0,--g-color-1,--g-position-1,--g-color-2,--g-position-2,--g-color-3,--g-position-3,--g-color-4,--g-position-4,--g-color-5,--g-position-5,--g-color-6,--g-position-6,--g-color-7,--g-position-7,--g-color-8,--g-position-8,--g-color-9,--g-position-9,--g-color-10,--g-position-10,--g-color-11,--g-position-11}input.sd,textarea.sd{align-content:normal}.sd[tabindex]:focus{outline:none}.sd[tabindex]:focus-visible{outline:1px solid;outline-color:Highlight;outline-color:-webkit-focus-ring-color}input[type=email],input[type=tel],input[type=text],select,textarea{-webkit-appearance:none}select{cursor:pointer}.frame{display:block;overflow:hidden}.frame>iframe{height:100%;width:100%}.frame .formrun-embed>iframe:not(:first-child){display:none!important}.image{position:relative}.image:before{background-position:50%;background-size:cover;border-radius:inherit;content:"";height:100%;left:0;pointer-events:none;position:absolute;top:0;transition:inherit;width:100%;z-index:-2}.sd.file{cursor:pointer;flex-direction:row;outline:2px solid transparent;outline-offset:-1px;overflow-wrap:anywhere;word-break:break-word}.sd.file:focus-within{outline-color:Highlight;outline-color:-webkit-focus-ring-color}.file>input[type=file]{opacity:0;pointer-events:none;position:absolute}.sd.text,.sd:where(.icon){align-content:center;align-items:center;display:flex;flex-direction:row;justify-content:center;overflow:visible;overflow-wrap:anywhere;word-break:break-word}.sd:where(.icon.fa){display:inline-flex}.material-icons{align-items:center;display:inline-flex;font-family:Material Icons;font-size:24px;font-style:normal;font-weight:400;justify-content:center;letter-spacing:normal;line-height:1;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}.sd:where(.icon.material-symbols){align-items:center;display:flex;font-style:normal;font-variation-settings:"FILL" var(--symbol-fill,0),"wght" var(--symbol-weight,400);justify-content:center;min-height:1em;min-width:1em}.sd.material-symbols-outlined{font-family:Material Symbols Outlined}.sd.material-symbols-rounded{font-family:Material Symbols Rounded}.sd.material-symbols-sharp{font-family:Material Symbols Sharp}.sd.material-symbols-weight-100{--symbol-weight:100}.sd.material-symbols-weight-200{--symbol-weight:200}.sd.material-symbols-weight-300{--symbol-weight:300}.sd.material-symbols-weight-400{--symbol-weight:400}.sd.material-symbols-weight-500{--symbol-weight:500}.sd.material-symbols-weight-600{--symbol-weight:600}.sd.material-symbols-weight-700{--symbol-weight:700}.sd.material-symbols-fill{--symbol-fill:1}a,a.icon,a.text{-webkit-tap-highlight-color:rgba(0,0,0,.15)}.fixed{z-index:2}.sticky{z-index:1}.button{transition:.4s cubic-bezier(.4,.4,0,1)}.button,.link{cursor:pointer}.submitLoading{opacity:.5!important;pointer-events:none!important}.richText{display:block;word-break:break-word}.richText [data-thread],.richText a,.richText blockquote,.richText em,.richText h1,.richText h2,.richText h3,.richText h4,.richText li,.richText ol,.richText p,.richText p>code,.richText pre,.richText pre>code,.richText s,.richText strong,.richText table tbody,.richText table tbody tr,.richText table tbody tr>td,.richText table tbody tr>th,.richText u,.richText ul{backface-visibility:visible;color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;text-align:inherit}.richText p{display:block;margin:10px 0}.richText>p{min-height:1em}.richText img,.richText video{height:auto;max-width:100%;vertical-align:bottom}.richText h1{display:block;font-size:3em;font-weight:700;margin:20px 0}.richText h2{font-size:2em}.richText h2,.richText h3{display:block;font-weight:700;margin:10px 0}.richText h3{font-size:1em}.richText h4,.richText h5{font-weight:600}.richText h4,.richText h5,.richText h6{display:block;font-size:1em;margin:10px 0}.richText h6{font-weight:500}.richText [data-type=table]{overflow-x:auto}.richText [data-type=table] p{white-space:pre-line;word-break:break-all}.richText table{border:1px solid #f2f2f2;border-collapse:collapse;border-spacing:unset;color:#1a1a1a;font-size:14px;line-height:1.4;margin:10px 0;table-layout:auto}.richText table tr th{background:hsla(0,0%,96%,.5)}.richText table tr td,.richText table tr th{border:1px solid #f2f2f2;max-width:240px;min-width:100px;padding:12px}.richText table tr td p,.richText table tr th p{margin:0}.richText blockquote{border-left:3px solid rgba(0,0,0,.15);font-style:italic;margin:10px 0;padding:10px 15px}.richText [data-type=embed_code]{margin:20px 0;position:relative}.richText [data-type=embed_code]>.height-adjuster>.wrapper{position:relative}.richText [data-type=embed_code]>.height-adjuster>.wrapper[style*=padding-top] iframe{height:100%;left:0;position:absolute;top:0;width:100%}.richText [data-type=embed_code][data-embed-sandbox=true]{display:block;overflow:hidden}.richText [data-type=embed_code][data-embed-code-type=instagram]>.height-adjuster>.wrapper[style*=padding-top]{padding-top:100%}.richText [data-type=embed_code][data-embed-code-type=instagram]>.height-adjuster>.wrapper[style*=padding-top] blockquote{height:100%;left:0;overflow:hidden;position:absolute;top:0;width:100%}.richText [data-type=embed_code][data-embed-code-type=codepen]>.height-adjuster>.wrapper{padding-top:50%}.richText [data-type=embed_code][data-embed-code-type=codepen]>.height-adjuster>.wrapper iframe{height:100%;left:0;position:absolute;top:0;width:100%}.richText [data-type=embed_code][data-embed-code-type=slideshare]>.height-adjuster>.wrapper{padding-top:56.25%}.richText [data-type=embed_code][data-embed-code-type=slideshare]>.height-adjuster>.wrapper iframe{height:100%;left:0;position:absolute;top:0;width:100%}.richText [data-type=embed_code][data-embed-code-type=speakerdeck]>.height-adjuster>.wrapper{padding-top:56.25%}.richText [data-type=embed_code][data-embed-code-type=speakerdeck]>.height-adjuster>.wrapper iframe{height:100%;left:0;position:absolute;top:0;width:100%}.richText [data-type=embed_code][data-embed-code-type=snapwidget]>.height-adjuster>.wrapper{padding-top:30%}.richText [data-type=embed_code][data-embed-code-type=snapwidget]>.height-adjuster>.wrapper iframe{height:100%;left:0;position:absolute;top:0;width:100%}.richText [data-type=embed_code][data-embed-code-type=firework]>.height-adjuster>.wrapper fw-embed-feed{-webkit-user-select:none;-moz-user-select:none;user-select:none}.richText [data-type=embed_code_empty]{display:none}.richText ul{margin:0 0 0 20px}.richText ul li{list-style:disc;margin:10px 0}.richText ul li p{margin:0}.richText ol{margin:0 0 0 20px}.richText ol li{list-style:decimal;margin:10px 0}.richText ol li p{margin:0}.richText hr{border-top:1px solid #ccc;margin:10px 0}.richText p>code{background:#eee;border:1px solid rgba(0,0,0,.1);border-radius:6px;display:inline;margin:2px;padding:0 5px}.richText pre{background:#eee;border-radius:6px;font-family:Menlo,Monaco,Courier New,monospace;margin:20px 0;padding:25px 35px;white-space:pre-wrap}.richText pre code{border:none;padding:0}.richText strong{color:inherit;display:inline;font-family:inherit;font-weight:900}.richText em{font-style:italic}.richText a,.richText u{text-decoration:underline}.richText a{color:#007cff;display:inline}.richText s{text-decoration:line-through}.richText [data-type=table_of_contents]{background-color:#f5f5f5;border-radius:2px;color:#616161;font-size:16px;list-style:none;margin:0;padding:24px 24px 8px;text-decoration:underline}.richText [data-type=table_of_contents] .toc_list{margin:0}.richText [data-type=table_of_contents] .toc_item{color:currentColor;font-size:inherit!important;font-weight:inherit;list-style:none}.richText [data-type=table_of_contents] .toc_item>a{border:none;color:currentColor;font-size:inherit!important;font-weight:inherit;text-decoration:none}.richText [data-type=table_of_contents] .toc_item>a:hover{opacity:.7}.richText [data-type=table_of_contents] .toc_item--1{margin:0 0 16px}.richText [data-type=table_of_contents] .toc_item--2{margin:0 0 16px;padding-left:2rem}.richText [data-type=table_of_contents] .toc_item--3{margin:0 0 16px;padding-left:4rem}.sd.section{align-content:center!important;align-items:center!important;flex-direction:column!important;flex-wrap:nowrap!important;height:auto!important;max-width:100%!important;padding:0!important;width:100%!important}.sd.section-inner{position:static!important}@property --g-angle{syntax:"";inherits:false;initial-value:180deg}@property --g-color-0{syntax:"";inherits:false;initial-value:transparent}@property --g-position-0{syntax:"";inherits:false;initial-value:.01%}@property --g-color-1{syntax:"";inherits:false;initial-value:transparent}@property --g-position-1{syntax:"";inherits:false;initial-value:100%}@property --g-color-2{syntax:"";inherits:false;initial-value:transparent}@property --g-position-2{syntax:"";inherits:false;initial-value:100%}@property --g-color-3{syntax:"";inherits:false;initial-value:transparent}@property --g-position-3{syntax:"";inherits:false;initial-value:100%}@property --g-color-4{syntax:"";inherits:false;initial-value:transparent}@property --g-position-4{syntax:"";inherits:false;initial-value:100%}@property --g-color-5{syntax:"";inherits:false;initial-value:transparent}@property --g-position-5{syntax:"";inherits:false;initial-value:100%}@property --g-color-6{syntax:"";inherits:false;initial-value:transparent}@property --g-position-6{syntax:"";inherits:false;initial-value:100%}@property --g-color-7{syntax:"";inherits:false;initial-value:transparent}@property --g-position-7{syntax:"";inherits:false;initial-value:100%}@property --g-color-8{syntax:"";inherits:false;initial-value:transparent}@property --g-position-8{syntax:"";inherits:false;initial-value:100%}@property --g-color-9{syntax:"";inherits:false;initial-value:transparent}@property --g-position-9{syntax:"";inherits:false;initial-value:100%}@property --g-color-10{syntax:"";inherits:false;initial-value:transparent}@property --g-position-10{syntax:"";inherits:false;initial-value:100%}@property --g-color-11{syntax:"";inherits:false;initial-value:transparent}@property --g-position-11{syntax:"";inherits:false;initial-value:100%}a[data-v-d2500ebd]{align-items:center;border-radius:4px;bottom:20px;height:20px;justify-content:center;left:20px;perspective:300px;position:fixed;transition:0s linear;width:84px;z-index:2000}@media (hover:hover){a[data-v-d2500ebd]{transition:.4s cubic-bezier(.4,.4,0,1);will-change:width,height}a[data-v-d2500ebd]:hover{height:32px;width:200px}}[data-v-d2500ebd] .custom-fill path{fill:var(--1167f19e)}.fade-enter-active[data-v-d2500ebd],.fade-leave-active[data-v-d2500ebd]{position:absolute;transform:translateZ(0);transition:opacity .3s cubic-bezier(.4,.4,0,1);will-change:opacity,transform}.fade-enter-from[data-v-d2500ebd],.fade-leave-to[data-v-d2500ebd]{opacity:0}.loading[data-v-8a583dac]{align-content:center;align-items:center;background-color:#fff;display:flex;height:100%;justify-content:center;left:0;perspective:300px;position:fixed;top:0;transition:none;width:100%;z-index:1000}.icon[data-v-8a583dac]{clip-path:inset(0 0 0 0);height:140px;position:relative;transform:rotate(45deg);transition:.6s cubic-bezier(.4,.4,0,1);width:20px}.back[data-v-8a583dac]{background-color:var(--rebranding-loading-bg);top:0}.back[data-v-8a583dac],.progress[data-v-8a583dac]{height:140px;left:0;position:absolute;width:20px}.progress[data-v-8a583dac]{background-color:var(--rebranding-loading-bar);bottom:0;clip:rect(10px,20px,140px,0)}.loading-enter-from .progress[data-v-8a583dac]{clip:rect(140px,20px,140px,0)}.loading-enter-active .progress[data-v-8a583dac]{transition:2s cubic-bezier(.31,.13,0,1)}.loading-leave-active[data-v-8a583dac]{transition:.6s cubic-bezier(.4,.4,0,1) .3s}.loading-leave-active .icon[data-v-8a583dac]{transition:.3s cubic-bezier(.4,.4,0,1) .3s}.loading-leave-active .progress[data-v-8a583dac]{transition:.3s cubic-bezier(.4,.4,0,1)}.loading-leave-to[data-v-8a583dac]{background-color:#fff0}.loading-leave-to .icon[data-v-8a583dac]{clip-path:inset(0 0 160px 0)}.loading-leave-to .progress[data-v-8a583dac]{clip:rect(0,20px,140px,0)}.LoadMoreAnnouncer[data-v-4f7a7294],.TitleAnnouncer[data-v-692a2727]{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0);border-width:0;white-space:nowrap}.design-canvas__modal{height:100%;pointer-events:none;position:fixed;transition:none;width:100%;z-index:2}.design-canvas__modal:focus{outline:none}.design-canvas__modal.v-enter-active .studio-canvas,.design-canvas__modal.v-leave-active,.design-canvas__modal.v-leave-active .studio-canvas{transition:.4s cubic-bezier(.4,.4,0,1)}.design-canvas__modal.v-enter-active .studio-canvas *,.design-canvas__modal.v-leave-active .studio-canvas *{transition:none!important}.design-canvas__modal.isNone{transition:none}.design-canvas__modal .design-canvas__modal__base{height:100%;left:0;pointer-events:auto;position:fixed;top:0;transition:.4s cubic-bezier(.4,.4,0,1);width:100%;z-index:-1}.design-canvas__modal .studio-canvas{height:100%;pointer-events:none}.design-canvas__modal .studio-canvas>*{background:none!important;pointer-events:none}.preview-notice-popover[data-v-748e3100]{background-color:transparent;display:flex;inset:0;justify-content:flex-end;padding:16px;pointer-events:none;top:auto;width:100%}.preview-notice-content[data-v-748e3100]{align-items:center;background-color:#f7f7f7;border:1px solid #2222221a;border-radius:6px;box-shadow:0 2px 4px -1px #0000000f,0 2px 12px -1.5px #00000008;color:#222;display:flex;font-family:Helvetica Neue,Arial,Hiragino Kaku Gothic ProN,Hiragino Sans,Noto Sans JP,Meiryo,sans-serif;font-feature-settings:"palt";gap:8px;max-width:560px;padding:12px;pointer-events:all;transition:none}.preview-notice-content[data-v-748e3100] .preview-notice-icon[data-v-748e3100]{color:#22222280;height:24px;width:24px}.preview-notice-content[data-v-748e3100] .preview-notice-main[data-v-748e3100]{color:inherit;display:flex;flex:1;flex-direction:column;font-family:inherit;gap:4px;margin-right:8px}.preview-notice-content[data-v-748e3100] .preview-notice-main[data-v-748e3100] .preview-notice-heading[data-v-748e3100]{color:inherit;font-family:inherit;font-size:14px;font-weight:600;line-height:20px}.preview-notice-content[data-v-748e3100] .preview-notice-main[data-v-748e3100] .preview-notice-description[data-v-748e3100]{color:inherit;font-family:inherit;font-size:12px;line-height:16px}.preview-notice-content[data-v-748e3100] .preview-notice-close[data-v-748e3100]{align-items:center;background-color:#fff;border:1px solid #2222221a;border-radius:6px;color:inherit;cursor:pointer;display:flex;font-family:inherit;font-size:12px;font-weight:600;height:36px;justify-content:center;line-height:16px;width:68px}.preview-notice-content[data-v-748e3100] .preview-notice-close[data-v-748e3100][data-v-748e3100]:hover{background-color:#2222220d}.publish-studio-style[data-v-c7690742]{transition:.4s cubic-bezier(.4,.4,0,1)}.snackbar[data-v-3129703d]{align-items:center;background:#fff;border:1px solid #ededed;border-radius:6px;box-shadow:0 16px 48px -8px #00000014,0 10px 25px -5px #0000001c;display:flex;flex-direction:row;gap:8px;justify-content:space-between;left:50%;max-width:90vw;padding:16px 20px;position:fixed;top:32px;transform:translate(-50%);-webkit-user-select:none;-moz-user-select:none;user-select:none;width:480px;z-index:9999}.snackbar.v-enter-active[data-v-3129703d],.snackbar.v-leave-active[data-v-3129703d]{transition:.4s cubic-bezier(.4,.4,0,1)}.snackbar.v-enter-from[data-v-3129703d],.snackbar.v-leave-to[data-v-3129703d]{opacity:0;transform:translate(-50%,-10px)}.snackbar .convey[data-v-3129703d]{align-items:center;display:flex;flex-direction:row;gap:8px;padding:0}.snackbar .convey .icon[data-v-3129703d]{background-position:50%;background-repeat:no-repeat;flex-shrink:0;height:24px;width:24px}.snackbar .convey .message[data-v-3129703d]{font-size:14px;font-style:normal;font-weight:400;line-height:20px;white-space:pre-line}.snackbar .convey.error .icon[data-v-3129703d]{background-image:url(../images/close_circle.c7480f3c.svg)}.snackbar .convey.error .message[data-v-3129703d]{color:#f84f65}.snackbar .convey.success .icon[data-v-3129703d]{background-image:url(../images/round_check.0ebac23f.svg)}.snackbar .convey.success .message[data-v-3129703d]{color:#111}.snackbar .button[data-v-3129703d]{align-items:center;border-radius:40px;color:#4b9cfb;display:flex;flex-shrink:0;font-family:Inter;font-size:12px;font-style:normal;font-weight:700;justify-content:center;line-height:16px;padding:4px 8px}.snackbar .button[data-v-3129703d]:hover{background:#f5f5f5}.app[data-v-4a64a196]{align-items:center;flex-direction:column;height:100%;justify-content:center;width:100%}.title[data-v-4a64a196]{font-size:34px;font-weight:300;letter-spacing:2.45px;line-height:30px;margin:30px} /* Extracted from index.html */ .page-enter-active { transition: .6s cubic-bezier(.4, .4, 0, 1) } .page-leave-active { transition: .3s cubic-bezier(.4, .4, 0, 1) } .page-enter-from, .page-leave-to { opacity: 0 } :root { --rebranding-loading-bg: #e5e5e5; --rebranding-loading-bar: #222 } .product-font-style[data-v-51f515bd] { transition: .4s cubic-bezier(.4, .4, 0, 1) } /*! * Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) * Copyright 2023 Fonticons, Inc. */ .fa-brands, .fa-solid { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; --fa-display: inline-flex; align-items: center; display: var(--fa-display, inline-block); font-style: normal; font-variant: normal; justify-content: center; line-height: 1; text-rendering: auto } .fa-solid { font-family: Font Awesome\ 6 Free; font-weight: 900 } .fa-brands { font-family: Font Awesome\ 6 Brands; font-weight: 400 } :host, :root { --fa-style-family-classic: "Font Awesome 6 Free"; --fa-font-solid: normal 900 1em/1 "Font Awesome 6 Free"; --fa-style-family-brands: "Font Awesome 6 Brands"; --fa-font-brands: normal 400 1em/1 "Font Awesome 6 Brands" } @font-face { font-display: block; font-family: Font Awesome\ 6 Free; font-style: normal; font-weight: 900; src: url(https://storage.googleapis.com/production-os-assets/assets/fontawesome/1629704621943/6.4.2/webfonts/fa-solid-900.woff2) format("woff2"), url(https://storage.googleapis.com/production-os-assets/assets/fontawesome/1629704621943/6.4.2/webfonts/fa-solid-900.ttf) format("truetype") } @font-face { font-display: block; font-family: Font Awesome\ 6 Brands; font-style: normal; font-weight: 400; src: url(https://storage.googleapis.com/production-os-assets/assets/fontawesome/1629704621943/6.4.2/webfonts/fa-brands-400.woff2) format("woff2"), url(https://storage.googleapis.com/production-os-assets/assets/fontawesome/1629704621943/6.4.2/webfonts/fa-brands-400.ttf) format("truetype") } .spinner[data-v-36413753] { animation: loading-spin-36413753 1s linear infinite; height: 16px; pointer-events: none; width: 16px } .spinner[data-v-36413753]:before { border-bottom: 2px solid transparent; border-right: 2px solid transparent; border-color: transparent currentcolor currentcolor transparent; border-style: solid; border-width: 2px; opacity: .2 } .spinner[data-v-36413753]:after, .spinner[data-v-36413753]:before { border-radius: 50%; box-sizing: border-box; content: ""; height: 100%; position: absolute; width: 100% } .spinner[data-v-36413753]:after { border-left: 2px solid transparent; border-top: 2px solid transparent; border-color: currentcolor transparent transparent currentcolor; border-style: solid; border-width: 2px; opacity: 1 } @keyframes loading-spin-36413753 { 0% { transform: rotate(0deg) } to { transform: rotate(1turn) } } @font-face { font-family: grandam; font-style: normal; font-weight: 400; src: url(https://storage.googleapis.com/studio-front/fonts/grandam.ttf) format("truetype") } @font-face { font-family: Material Icons; font-style: normal; font-weight: 400; src: url(https://storage.googleapis.com/production-os-assets/assets/material-icons/1629704621943/MaterialIcons-Regular.eot); src: local("Material Icons"), local("MaterialIcons-Regular"), url(https://storage.googleapis.com/production-os-assets/assets/material-icons/1629704621943/MaterialIcons-Regular.woff2) format("woff2"), url(https://storage.googleapis.com/production-os-assets/assets/material-icons/1629704621943/MaterialIcons-Regular.woff) format("woff"), url(https://storage.googleapis.com/production-os-assets/assets/material-icons/1629704621943/MaterialIcons-Regular.ttf) format("truetype") } .StudioCanvas { display: flex; height: auto; min-height: 100dvh } .StudioCanvas>.sd { min-height: 100dvh; overflow: clip } a, abbr, address, article, aside, audio, b, blockquote, body, button, canvas, caption, cite, code, dd, del, details, dfn, div, dl, dt, em, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, input, ins, kbd, label, legend, li, main, mark, menu, nav, object, ol, p, pre, q, samp, section, select, small, span, strong, sub, summary, sup, table, tbody, td, textarea, tfoot, th, thead, time, tr, ul, var, video { border: 0; font-family: sans-serif; line-height: 1; list-style: none; margin: 0; padding: 0; text-decoration: none; -webkit-font-smoothing: antialiased; -webkit-backface-visibility: hidden; box-sizing: border-box; color: #333; transition: .3s cubic-bezier(.4, .4, 0, 1); word-spacing: 1px } a:focus:not(:focus-visible), button:focus:not(:focus-visible), summary:focus:not(:focus-visible) { outline: none } nav ul { list-style: none } blockquote, q { quotes: none } blockquote:after, blockquote:before, q:after, q:before { content: none } a, button { background: transparent; font-size: 100%; margin: 0; padding: 0; vertical-align: baseline } ins { text-decoration: none } ins, mark { background-color: #ff9; color: #000 } mark { font-style: italic; font-weight: 700 } del { text-decoration: line-through } abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help } table { border-collapse: collapse; border-spacing: 0 } hr { border: 0; border-top: 1px solid #ccc; display: block; height: 1px; margin: 1em 0; padding: 0 } input, select { vertical-align: middle } textarea { resize: none } .clearfix:after { clear: both; content: ""; display: block } [slot=after] button { overflow-anchor: none } .sd { flex-wrap: nowrap; max-width: 100%; pointer-events: all; z-index: 0; -webkit-overflow-scrolling: touch; align-content: center; align-items: center; display: flex; flex: none; flex-direction: column; position: relative } .sd::-webkit-scrollbar { display: none } .sd, .sd.richText * { transition-property: all, --g-angle, --g-color-0, --g-position-0, --g-color-1, --g-position-1, --g-color-2, --g-position-2, --g-color-3, --g-position-3, --g-color-4, --g-position-4, --g-color-5, --g-position-5, --g-color-6, --g-position-6, --g-color-7, --g-position-7, --g-color-8, --g-position-8, --g-color-9, --g-position-9, --g-color-10, --g-position-10, --g-color-11, --g-position-11 } input.sd, textarea.sd { align-content: normal } .sd[tabindex]:focus { outline: none } .sd[tabindex]:focus-visible { outline: 1px solid; outline-color: Highlight; outline-color: -webkit-focus-ring-color } input[type=email], input[type=tel], input[type=text], select, textarea { -webkit-appearance: none } select { cursor: pointer } .frame { display: block; overflow: hidden } .frame>iframe { height: 100%; width: 100% } .frame .formrun-embed>iframe:not(:first-child) { display: none !important } .image { position: relative } .image:before { background-position: 50%; background-size: cover; border-radius: inherit; content: ""; height: 100%; left: 0; pointer-events: none; position: absolute; top: 0; transition: inherit; width: 100%; z-index: -2 } .sd.file { cursor: pointer; flex-direction: row; outline: 2px solid transparent; outline-offset: -1px; overflow-wrap: anywhere; word-break: break-word } .sd.file:focus-within { outline-color: Highlight; outline-color: -webkit-focus-ring-color } .file>input[type=file] { opacity: 0; pointer-events: none; position: absolute } .sd.text, .sd:where(.icon) { align-content: center; align-items: center; display: flex; flex-direction: row; justify-content: center; overflow: visible; overflow-wrap: anywhere; word-break: break-word } .sd:where(.icon.fa) { display: inline-flex } .material-icons { align-items: center; display: inline-flex; font-family: Material Icons; font-size: 24px; font-style: normal; font-weight: 400; justify-content: center; letter-spacing: normal; line-height: 1; text-transform: none; white-space: nowrap; word-wrap: normal; direction: ltr; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased } .sd:where(.icon.material-symbols) { align-items: center; display: flex; font-style: normal; font-variation-settings: "FILL" var(--symbol-fill, 0), "wght" var(--symbol-weight, 400); justify-content: center; min-height: 1em; min-width: 1em } .sd.material-symbols-outlined { font-family: Material Symbols Outlined } .sd.material-symbols-rounded { font-family: Material Symbols Rounded } .sd.material-symbols-sharp { font-family: Material Symbols Sharp } .sd.material-symbols-weight-100 { --symbol-weight: 100 } .sd.material-symbols-weight-200 { --symbol-weight: 200 } .sd.material-symbols-weight-300 { --symbol-weight: 300 } .sd.material-symbols-weight-400 { --symbol-weight: 400 } .sd.material-symbols-weight-500 { --symbol-weight: 500 } .sd.material-symbols-weight-600 { --symbol-weight: 600 } .sd.material-symbols-weight-700 { --symbol-weight: 700 } .sd.material-symbols-fill { --symbol-fill: 1 } a, a.icon, a.text { -webkit-tap-highlight-color: rgba(0, 0, 0, .15) } .fixed { z-index: 2 } .sticky { z-index: 1 } .button { transition: .4s cubic-bezier(.4, .4, 0, 1) } .button, .link { cursor: pointer } .submitLoading { opacity: .5 !important; pointer-events: none !important } .richText { display: block; word-break: break-word } .richText [data-thread], .richText a, .richText blockquote, .richText em, .richText h1, .richText h2, .richText h3, .richText h4, .richText li, .richText ol, .richText p, .richText p>code, .richText pre, .richText pre>code, .richText s, .richText strong, .richText table tbody, .richText table tbody tr, .richText table tbody tr>td, .richText table tbody tr>th, .richText u, .richText ul { backface-visibility: visible; color: inherit; font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; letter-spacing: inherit; line-height: inherit; text-align: inherit } .richText p { display: block; margin: 10px 0 } .richText>p { min-height: 1em } .richText img, .richText video { height: auto; max-width: 100%; vertical-align: bottom } .richText h1 { display: block; font-size: 3em; font-weight: 700; margin: 20px 0 } .richText h2 { font-size: 2em } .richText h2, .richText h3 { display: block; font-weight: 700; margin: 10px 0 } .richText h3 { font-size: 1em } .richText h4, .richText h5 { font-weight: 600 } .richText h4, .richText h5, .richText h6 { display: block; font-size: 1em; margin: 10px 0 } .richText h6 { font-weight: 500 } .richText [data-type=table] { overflow-x: auto } .richText [data-type=table] p { white-space: pre-line; word-break: break-all } .richText table { border: 1px solid #f2f2f2; border-collapse: collapse; border-spacing: unset; color: #1a1a1a; font-size: 14px; line-height: 1.4; margin: 10px 0; table-layout: auto } .richText table tr th { background: hsla(0, 0%, 96%, .5) } .richText table tr td, .richText table tr th { border: 1px solid #f2f2f2; max-width: 240px; min-width: 100px; padding: 12px } .richText table tr td p, .richText table tr th p { margin: 0 } .richText blockquote { border-left: 3px solid rgba(0, 0, 0, .15); font-style: italic; margin: 10px 0; padding: 10px 15px } .richText [data-type=embed_code] { margin: 20px 0; position: relative } .richText [data-type=embed_code]>.height-adjuster>.wrapper { position: relative } .richText [data-type=embed_code]>.height-adjuster>.wrapper[style*=padding-top] iframe { height: 100%; left: 0; position: absolute; top: 0; width: 100% } .richText [data-type=embed_code][data-embed-sandbox=true] { display: block; overflow: hidden } .richText [data-type=embed_code][data-embed-code-type=instagram]>.height-adjuster>.wrapper[style*=padding-top] { padding-top: 100% } .richText [data-type=embed_code][data-embed-code-type=instagram]>.height-adjuster>.wrapper[style*=padding-top] blockquote { height: 100%; left: 0; overflow: hidden; position: absolute; top: 0; width: 100% } .richText [data-type=embed_code][data-embed-code-type=codepen]>.height-adjuster>.wrapper { padding-top: 50% } .richText [data-type=embed_code][data-embed-code-type=codepen]>.height-adjuster>.wrapper iframe { height: 100%; left: 0; position: absolute; top: 0; width: 100% } .richText [data-type=embed_code][data-embed-code-type=slideshare]>.height-adjuster>.wrapper { padding-top: 56.25% } .richText [data-type=embed_code][data-embed-code-type=slideshare]>.height-adjuster>.wrapper iframe { height: 100%; left: 0; position: absolute; top: 0; width: 100% } .richText [data-type=embed_code][data-embed-code-type=speakerdeck]>.height-adjuster>.wrapper { padding-top: 56.25% } .richText [data-type=embed_code][data-embed-code-type=speakerdeck]>.height-adjuster>.wrapper iframe { height: 100%; left: 0; position: absolute; top: 0; width: 100% } .richText [data-type=embed_code][data-embed-code-type=snapwidget]>.height-adjuster>.wrapper { padding-top: 30% } .richText [data-type=embed_code][data-embed-code-type=snapwidget]>.height-adjuster>.wrapper iframe { height: 100%; left: 0; position: absolute; top: 0; width: 100% } .richText [data-type=embed_code][data-embed-code-type=firework]>.height-adjuster>.wrapper fw-embed-feed { -webkit-user-select: none; -moz-user-select: none; user-select: none } .richText [data-type=embed_code_empty] { display: none } .richText ul { margin: 0 0 0 20px } .richText ul li { list-style: disc; margin: 10px 0 } .richText ul li p { margin: 0 } .richText ol { margin: 0 0 0 20px } .richText ol li { list-style: decimal; margin: 10px 0 } .richText ol li p { margin: 0 } .richText hr { border-top: 1px solid #ccc; margin: 10px 0 } .richText p>code { background: #eee; border: 1px solid rgba(0, 0, 0, .1); border-radius: 6px; display: inline; margin: 2px; padding: 0 5px } .richText pre { background: #eee; border-radius: 6px; font-family: Menlo, Monaco, Courier New, monospace; margin: 20px 0; padding: 25px 35px; white-space: pre-wrap } .richText pre code { border: none; padding: 0 } .richText strong { color: inherit; display: inline; font-family: inherit; font-weight: 900 } .richText em { font-style: italic } .richText a, .richText u { text-decoration: underline } .richText a { color: #007cff; display: inline } .richText s { text-decoration: line-through } .richText [data-type=table_of_contents] { background-color: #f5f5f5; border-radius: 2px; color: #616161; font-size: 16px; list-style: none; margin: 0; padding: 24px 24px 8px; text-decoration: underline } .richText [data-type=table_of_contents] .toc_list { margin: 0 } .richText [data-type=table_of_contents] .toc_item { color: currentColor; font-size: inherit !important; font-weight: inherit; list-style: none } .richText [data-type=table_of_contents] .toc_item>a { border: none; color: currentColor; font-size: inherit !important; font-weight: inherit; text-decoration: none } .richText [data-type=table_of_contents] .toc_item>a:hover { opacity: .7 } .richText [data-type=table_of_contents] .toc_item--1 { margin: 0 0 16px } .richText [data-type=table_of_contents] .toc_item--2 { margin: 0 0 16px; padding-left: 2rem } .richText [data-type=table_of_contents] .toc_item--3 { margin: 0 0 16px; padding-left: 4rem } .sd.section { align-content: center !important; align-items: center !important; flex-direction: column !important; flex-wrap: nowrap !important; height: auto !important; max-width: 100% !important; padding: 0 !important; width: 100% !important } .sd.section-inner { position: static !important } @property --g-angle { syntax: ""; inherits: false; initial-value: 180deg } @property --g-color-0 { syntax: ""; inherits: false; initial-value: transparent } @property --g-position-0 { syntax: ""; inherits: false; initial-value: .01% } @property --g-color-1 { syntax: ""; inherits: false; initial-value: transparent } @property --g-position-1 { syntax: ""; inherits: false; initial-value: 100% } @property --g-color-2 { syntax: ""; inherits: false; initial-value: transparent } @property --g-position-2 { syntax: ""; inherits: false; initial-value: 100% } @property --g-color-3 { syntax: ""; inherits: false; initial-value: transparent } @property --g-position-3 { syntax: ""; inherits: false; initial-value: 100% } @property --g-color-4 { syntax: ""; inherits: false; initial-value: transparent } @property --g-position-4 { syntax: ""; inherits: false; initial-value: 100% } @property --g-color-5 { syntax: ""; inherits: false; initial-value: transparent } @property --g-position-5 { syntax: ""; inherits: false; initial-value: 100% } @property --g-color-6 { syntax: ""; inherits: false; initial-value: transparent } @property --g-position-6 { syntax: ""; inherits: false; initial-value: 100% } @property --g-color-7 { syntax: ""; inherits: false; initial-value: transparent } @property --g-position-7 { syntax: ""; inherits: false; initial-value: 100% } @property --g-color-8 { syntax: ""; inherits: false; initial-value: transparent } @property --g-position-8 { syntax: ""; inherits: false; initial-value: 100% } @property --g-color-9 { syntax: ""; inherits: false; initial-value: transparent } @property --g-position-9 { syntax: ""; inherits: false; initial-value: 100% } @property --g-color-10 { syntax: ""; inherits: false; initial-value: transparent } @property --g-position-10 { syntax: ""; inherits: false; initial-value: 100% } @property --g-color-11 { syntax: ""; inherits: false; initial-value: transparent } @property --g-position-11 { syntax: ""; inherits: false; initial-value: 100% } a[data-v-d2500ebd] { align-items: center; border-radius: 4px; bottom: 20px; height: 20px; justify-content: center; left: 20px; perspective: 300px; position: fixed; transition: 0s linear; width: 84px; z-index: 2000 } @media (hover:hover) { a[data-v-d2500ebd] { transition: .4s cubic-bezier(.4, .4, 0, 1); will-change: width, height } a[data-v-d2500ebd]:hover { height: 32px; width: 200px } } [data-v-d2500ebd] .custom-fill path { fill: var(--1167f19e) } .fade-enter-active[data-v-d2500ebd], .fade-leave-active[data-v-d2500ebd] { position: absolute; transform: translateZ(0); transition: opacity .3s cubic-bezier(.4, .4, 0, 1); will-change: opacity, transform } .fade-enter-from[data-v-d2500ebd], .fade-leave-to[data-v-d2500ebd] { opacity: 0 } .loading[data-v-8a583dac] { align-content: center; align-items: center; background-color: #fff; display: flex; height: 100%; justify-content: center; left: 0; perspective: 300px; position: fixed; top: 0; transition: none; width: 100%; z-index: 1000 } .icon[data-v-8a583dac] { clip-path: inset(0 0 0 0); height: 140px; position: relative; transform: rotate(45deg); transition: .6s cubic-bezier(.4, .4, 0, 1); width: 20px } .back[data-v-8a583dac] { background-color: var(--rebranding-loading-bg); top: 0 } .back[data-v-8a583dac], .progress[data-v-8a583dac] { height: 140px; left: 0; position: absolute; width: 20px } .progress[data-v-8a583dac] { background-color: var(--rebranding-loading-bar); bottom: 0; clip: rect(10px, 20px, 140px, 0) } .loading-enter-from .progress[data-v-8a583dac] { clip: rect(140px, 20px, 140px, 0) } .loading-enter-active .progress[data-v-8a583dac] { transition: 2s cubic-bezier(.31, .13, 0, 1) } .loading-leave-active[data-v-8a583dac] { transition: .6s cubic-bezier(.4, .4, 0, 1) .3s } .loading-leave-active .icon[data-v-8a583dac] { transition: .3s cubic-bezier(.4, .4, 0, 1) .3s } .loading-leave-active .progress[data-v-8a583dac] { transition: .3s cubic-bezier(.4, .4, 0, 1) } .loading-leave-to[data-v-8a583dac] { background-color: hsla(0, 0%, 100%, 0) } .loading-leave-to .icon[data-v-8a583dac] { clip-path: inset(0 0 160px 0) } .loading-leave-to .progress[data-v-8a583dac] { clip: rect(0, 20px, 140px, 0) } .LoadMoreAnnouncer[data-v-4f7a7294] { height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; clip: rect(0, 0, 0, 0); border-width: 0; white-space: nowrap } .TitleAnnouncer[data-v-692a2727] { height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; clip: rect(0, 0, 0, 0); border-width: 0; white-space: nowrap } .design-canvas__modal { height: 100%; pointer-events: none; position: fixed; transition: none; width: 100%; z-index: 2 } .design-canvas__modal:focus { outline: none } .design-canvas__modal.v-enter-active .studio-canvas, .design-canvas__modal.v-leave-active, .design-canvas__modal.v-leave-active .studio-canvas { transition: .4s cubic-bezier(.4, .4, 0, 1) } .design-canvas__modal.v-enter-active .studio-canvas *, .design-canvas__modal.v-leave-active .studio-canvas * { transition: none !important } .design-canvas__modal.isNone { transition: none } .design-canvas__modal .design-canvas__modal__base { height: 100%; left: 0; pointer-events: auto; position: fixed; top: 0; transition: .4s cubic-bezier(.4, .4, 0, 1); width: 100%; z-index: -1 } .design-canvas__modal .studio-canvas { height: 100%; pointer-events: none } .design-canvas__modal .studio-canvas>* { background: none !important; pointer-events: none } .preview-notice-popover[data-v-748e3100] { background-color: transparent; display: flex; inset: 0; justify-content: flex-end; padding: 16px; pointer-events: none; top: auto; width: 100% } .preview-notice-content[data-v-748e3100] { align-items: center; background-color: #f7f7f7; border: 1px solid #2222221a; border-radius: 6px; box-shadow: 0 2px 4px -1px #0000000f, 0 2px 12px -1.5px #00000008; color: #222; display: flex; font-family: Helvetica Neue, Arial, Hiragino Kaku Gothic ProN, Hiragino Sans, Noto Sans JP, Meiryo, sans-serif; font-feature-settings: "palt"; gap: 8px; max-width: 560px; padding: 12px; pointer-events: all; transition: none; .preview-notice-icon[data-v-748e3100] { color: #22222280; height: 24px; width: 24px } .preview-notice-main[data-v-748e3100] { color: inherit; display: flex; flex: 1; flex-direction: column; font-family: inherit; gap: 4px; margin-right: 8px; .preview-notice-heading[data-v-748e3100] { color: inherit; font-family: inherit; font-size: 14px; font-weight: 600; line-height: 20px } .preview-notice-description[data-v-748e3100] { color: inherit; font-family: inherit; font-size: 12px; line-height: 16px } } .preview-notice-close[data-v-748e3100] { align-items: center; background-color: #fff; border: 1px solid #2222221a; border-radius: 6px; color: inherit; cursor: pointer; display: flex; font-family: inherit; font-size: 12px; font-weight: 600; height: 36px; justify-content: center; line-height: 16px; width: 68px; &[data-v-748e3100]:hover { background-color: #2222220d } } } .publish-studio-style[data-v-c7690742] { transition: .4s cubic-bezier(.4, .4, 0, 1) } .snackbar[data-v-3129703d] { align-items: center; background: #fff; border: 1px solid #ededed; border-radius: 6px; box-shadow: 0 16px 48px -8px rgba(0, 0, 0, .08), 0 10px 25px -5px rgba(0, 0, 0, .11); display: flex; flex-direction: row; gap: 8px; justify-content: space-between; left: 50%; max-width: 90vw; padding: 16px 20px; position: fixed; top: 32px; transform: translateX(-50%); -webkit-user-select: none; -moz-user-select: none; user-select: none; width: 480px; z-index: 9999 } .snackbar.v-enter-active[data-v-3129703d], .snackbar.v-leave-active[data-v-3129703d] { transition: .4s cubic-bezier(.4, .4, 0, 1) } .snackbar.v-enter-from[data-v-3129703d], .snackbar.v-leave-to[data-v-3129703d] { opacity: 0; transform: translate(-50%, -10px) } .snackbar .convey[data-v-3129703d] { align-items: center; display: flex; flex-direction: row; gap: 8px; padding: 0 } .snackbar .convey .icon[data-v-3129703d] { background-position: 50%; background-repeat: no-repeat; flex-shrink: 0; height: 24px; width: 24px } .snackbar .convey .message[data-v-3129703d] { font-size: 14px; font-style: normal; font-weight: 400; line-height: 20px; white-space: pre-line } .snackbar .convey.error .icon[data-v-3129703d] { background-image: url(./assets/images/close_circle.c7480f3c.svg) } .snackbar .convey.error .message[data-v-3129703d] { color: #f84f65 } .snackbar .convey.success .icon[data-v-3129703d] { background-image: url(./assets/images/round_check.0ebac23f.svg) } .snackbar .convey.success .message[data-v-3129703d] { color: #111 } .snackbar .button[data-v-3129703d] { align-items: center; border-radius: 40px; color: #4b9cfb; display: flex; flex-shrink: 0; font-family: Inter; font-size: 12px; font-style: normal; font-weight: 700; justify-content: center; line-height: 16px; padding: 4px 8px } .snackbar .button[data-v-3129703d]:hover { background: #f5f5f5 } .app[data-v-4a64a196] { align-items: center; flex-direction: column; height: 100%; justify-content: center; width: 100% } .title[data-v-4a64a196] { font-size: 34px; font-weight: 300; letter-spacing: 2.45px; line-height: 30px; margin: 30px } @import url('https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap'); /*! * Font Awesome Free 6.4.2 by @fontawesome - https://fontawesome.com * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License) * Copyright 2023 Fonticons, Inc. */ .fa-brands, .fa-solid { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; --fa-display: inline-flex; align-items: center; display: var(--fa-display, inline-block); font-style: normal; font-variant: normal; justify-content: center; line-height: 1; text-rendering: auto } .fa-solid { font-family: Font Awesome\ 6 Free; font-weight: 900 } .fa-brands { font-family: Font Awesome\ 6 Brands; font-weight: 400 } :host, :root { --fa-style-family-classic: "Font Awesome 6 Free"; --fa-font-solid: normal 900 1em/1 "Font Awesome 6 Free"; --fa-style-family-brands: "Font Awesome 6 Brands"; --fa-font-brands: normal 400 1em/1 "Font Awesome 6 Brands" } @font-face { font-display: block; font-family: Font Awesome\ 6 Free; font-style: normal; font-weight: 900; src: url(https://storage.googleapis.com/production-os-assets/assets/fontawesome/1629704621943/6.4.2/webfonts/fa-solid-900.woff2) format("woff2"), url(https://storage.googleapis.com/production-os-assets/assets/fontawesome/1629704621943/6.4.2/webfonts/fa-solid-900.ttf) format("truetype") } @font-face { font-display: block; font-family: Font Awesome\ 6 Brands; font-style: normal; font-weight: 400; src: url(https://storage.googleapis.com/production-os-assets/assets/fontawesome/1629704621943/6.4.2/webfonts/fa-brands-400.woff2) format("woff2"), url(https://storage.googleapis.com/production-os-assets/assets/fontawesome/1629704621943/6.4.2/webfonts/fa-brands-400.ttf) format("truetype") } .fa-x-twitter:before { content: "\e61b"; } @font-face { font-family: 'こぶりなゴシック W6 JIS2004'; font-weight: Bold; src: url(//wf.typesquare.com/3/tsst/dist/ja/ts?condition=4718c9a9f8cd832693b52e90cd1107c4&onetime_condition=&eid=5ad00062415c46a09fd67fd7ac1e024a&bw[name]=Chrome&bw[ftf]=0&bw[os]=Macintosh&location=preview.studio.site%2Flive%2FbXqz8p7wWD&fonts[id]=2539&fonts[str]=LS8wM0FDSU5QUlNUVVZYYWJjZGVpbW5vcHJzdHfCt%2BKAnOKAneOAgeOAguOBguOBhOOBhuOBiuOBi%2BOBjOOBjeOBj%2BOBkeOBk%2BOBlOOBleOBluOBl%2BOBmeOBmuOBm%2BOBn%2BOBoOOBoeOBo%2BOBpOOBpuOBp%2BOBqOOBquOBq%2BOBreOBruOBr%2BOBueOBvuOBv%2BOCguOCieOCiuOCi%2BOCjOOCj%2BOCkuOCoeOCouOCo%2BOCpOOCpuOCqOOCqeOCquOCq%2BOCreOCr%2BOCsOOCseOCs%2BOCteOCuOOCueOCuuOCv%2BODgOODgeODg%2BODhOODhuODh%2BODiOODieODiuODjeODjuODj%2BODkOODkeODk%2BODleODl%2BODnuODoOODoeODouODo%2BODqeODquODq%2BODrOODreODs%2BODvOS4luS4reS6i%2BS7leS7o%2BS8geS8muS9v%2BS%2Bm%2BWFiOWFseWGheWHuuWIhuWIh%2BWJteWKm%2BWLleWMluWPjuWPluWQhOWQiOWQjeWQkeWRs%2BWToeWVj%2BWcqOWcsOWfueWjsuWtpuWun%2BWuouWuueWwguWxleW8iuW8j%2BW9ueW%2Fg%2BaDheaJgOaJi%2BaKgOaKiuaMgeaMh%2BaOm%2BaOoeaOpeaPkOaPoeaPtOaQuuaUr%2BaVsOaWsOacgOacquacrOadpeagquahiOalreamguani%2BanmOauteawl%2Ba0u%2BeCueeGseeKtuePvueUn%2BeUqOeVjOeZuuebiuebruebuOefpeekvuenkeeri%2Berr%2Beviee0sOe1hOe2mee2mue3oOe5i%2BiIiOihk%2BihqOijheimgeimj%2BioreiovOips%2Birh%2BitmOiyqeizh%2Bi7vemAo%2BmBiumBqemHjemHjumHkemWgOmWi%2BmWoumnhumokw%3D%3D); } @font-face { font-family: 'こぶりなゴシック W3 JIS2004'; font-weight: Bold; src: url(//wf.typesquare.com/3/tsst/dist/ja/ts?condition=4718c9a9f8cd832693b52e90cd1107c4&onetime_condition=&eid=5ad00062415c46a09fd67fd7ac1e024a&bw[name]=Chrome&bw[ftf]=0&bw[os]=Macintosh&location=preview.studio.site%2Flive%2FbXqz8p7wWD&fonts[id]=2538&fonts[str]=LC0wMTIzNDU2NzhDRktTVmlub3Jz4oiS44CS44Gd44Gq44KK44Ki44Kj44Kk44Kq44Kw44K344K544OJ44OQ44OT44OV44OX44Od44Op44Oq44Or44Ot44Oz44O744O85LiA5LiB5Lmd5LqV5Lqs5Luj5Lya5YaG5YyX5Yy65Y2D5Y2X5Y%2B35aSn5aWl5biC5bmz5bm05bqc5byP5oCl5pel5pyI5pys5p2x5qCq5q6155Sw55S655Wq55uu56S%2B6KeS6YO96Ziq6aKv77yU77yX77yY); } @font-face { font-family: 'こぶりなゴシック W6 JIS2004'; font-weight: Bold; src: url(//wf.typesquare.com/3/tsst/dist/ja/ts?condition=4718c9a9f8cd832693b52e90cd1107c4&onetime_condition=&eid=5ad00062415c46a09fd67fd7ac1e024a&bw[name]=Chrome&bw[ftf]=0&bw[os]=Macintosh&location=preview.studio.site%2Flive%2FbXqz8p7wWD&fonts[id]=2539&fonts[str]=LS8wM0FDSU5QUlNUVVZYYWJjZGVpbW5vcHJzdHfCt%2BKAnOKAneOAgeOAguOBguOBhOOBhuOBiuOBi%2BOBjOOBjeOBj%2BOBkeOBk%2BOBlOOBleOBluOBl%2BOBmeOBmuOBm%2BOBn%2BOBoOOBoeOBo%2BOBpOOBpuOBp%2BOBqOOBquOBq%2BOBreOBruOBr%2BOBueOBvuOBv%2BOCguOCieOCiuOCi%2BOCjOOCj%2BOCkuOCoeOCouOCo%2BOCpOOCpuOCqOOCqeOCquOCq%2BOCreOCr%2BOCsOOCseOCs%2BOCteOCuOOCueOCuuOCv%2BODgOODgeODg%2BODhOODhuODh%2BODiOODieODiuODjeODjuODj%2BODkOODkeODk%2BODleODl%2BODnuODoOODoeODouODo%2BODqeODquODq%2BODrOODreODs%2BODvOS4luS4reS6i%2BS7leS7o%2BS8geS8muS9v%2BS%2Bm%2BWFiOWFseWGheWHuuWIhuWIh%2BWJteWKm%2BWLleWMluWPjuWPluWQhOWQiOWQjeWQkeWRs%2BWToeWVj%2BWcqOWcsOWfueWjsuWtpuWun%2BWuouWuueWwguWxleW8iuW8j%2BW9ueW%2Fg%2BaDheaJgOaJi%2BaKgOaKiuaMgeaMh%2BaOm%2BaOoeaOpeaPkOaPoeaPtOaQuuaUr%2BaVsOaWsOacgOacquacrOadpeagquahiOalreamguani%2BanmOauteawl%2Ba0u%2BeCueeGseeKtuePvueUn%2BeUqOeVjOeZuuebiuebruebuOefpeekvuenkeeri%2Berr%2Beviee0sOe1hOe2mee2mue3oOe5i%2BiIiOihk%2BihqOijheimgeimj%2BioreiovOips%2Birh%2BitmOiyqeizh%2Bi7vemAo%2BmBiumBqemHjemHjumHkemWgOmWi%2BmWoumnhumokw%3D%3D); } @font-face { font-family: 'こぶりなゴシック W3 JIS2004'; font-weight: Bold; src: url(//wf.typesquare.com/3/tsst/dist/ja/ts?condition=4718c9a9f8cd832693b52e90cd1107c4&onetime_condition=&eid=5ad00062415c46a09fd67fd7ac1e024a&bw[name]=Chrome&bw[ftf]=0&bw[os]=Macintosh&location=preview.studio.site%2Flive%2FbXqz8p7wWD&fonts[id]=2538&fonts[str]=LC0wMTIzNDU2NzhDRktTVmlub3Jz4oiS44CS44Gd44Gq44KK44Ki44Kj44Kk44Kq44Kw44K344K544OJ44OQ44OT44OV44OX44Od44Op44Oq44Or44Ot44Oz44O744O85LiA5LiB5Lmd5LqV5Lqs5Luj5Lya5YaG5YyX5Yy65Y2D5Y2X5Y%2B35aSn5aWl5biC5bmz5bm05bqc5byP5oCl5pel5pyI5pys5p2x5qCq5q6155Sw55S655Wq55uu56S%2B6KeS6YO96Ziq6aKv77yU77yX77yY); } @font-face { font-family: 'こぶりなゴシック W6 JIS2004'; font-weight: Bold; src: url(//wf.typesquare.com/3/tsst/dist/ja/ts?condition=4718c9a9f8cd832693b52e90cd1107c4&onetime_condition=&eid=5ad00062415c46a09fd67fd7ac1e024a&bw[name]=Chrome&bw[ftf]=0&bw[os]=Macintosh&location=preview.studio.site%2Flive%2FbXqz8p7wWD&fonts[id]=2539&fonts[str]=LS8wM0FDRUlOT1BSU1RVVlhhYmNkZWZpbW5vcHJzdHV3wrfigJzigJ3jgIHjgILjgYLjgYTjgYbjgYrjgYvjgYzjgY3jgY%2FjgZHjgZPjgZTjgZXjgZbjgZfjgZnjgZrjgZvjgZ%2FjgaDjgaHjgaPjgaTjgabjgafjgajjgarjgavjga3jga7jga%2Fjgbnjgb7jgb%2FjgoLjgoPjgonjgorjgovjgozjgo%2FjgpLjgpPjgqHjgqLjgqPjgqTjgqbjgqjjgqnjgqrjgqvjgq3jgq%2FjgrDjgrHjgrPjgrXjgrbjgrfjgrjjgrnjgrrjgr%2Fjg4Djg4Hjg4Pjg4Tjg4bjg4fjg4jjg4njg4rjg43jg47jg4%2Fjg5Djg5Hjg5Pjg5Xjg5fjg5rjg57jg6Djg6Hjg6Ljg6Pjg6njg6rjg6vjg6zjg63jg7Pjg7zkuJbkuK3kuovkupXku5Xku6PkvIHkvJrkvb%2FkvpvlhYjlhbHlhoXlh7rliIbliIflibXlipvli5Xli5nli53ljJblj47lj5blj7LlkITlkIjlkI3lkJHlkbPlkozlk6HllY%2FlnKjlnLDln7nlo7LlpKflpKrlpaXlrablrojlrp%2FlrqLlrq7lrrnlsILlsZXlubPlvIrlvI%2Flvablvbnlv4Pmg4XmiYDmiYvmioDmiormjIHmjIfmjpvmjqHmjqXmj5Dmj6Hmj7TmkLrmlK%2FmlbDmlrDmmbrmnIDmnKrmnKzmnaXmoKrmoYjmpa3mpoLmp4vmp5jmqYvmrrXmsJfmsrvmtLvmupDngrnnhrHnirbnj77nlJ%2FnlKjnlYznmbrnm4rnm67nm7jnn6XnpL7np5Hnq4vnq6%2Fnr4nntLDntYTntpnntprnt4%2Fnt6DnuYvoiIjoi7HooZPooajoo4XopoHopo%2FoqK3oqLzoqanoqbPoq4forZjosLfosqnos4fou73pgKPpgYrpganph43ph47ph5HploDplovplqLpoq%2Fpp4bpqJPpq5g%3D); } @font-face { font-family: 'こぶりなゴシック W3 JIS2004'; font-weight: Bold; src: url(//wf.typesquare.com/3/tsst/dist/ja/ts?condition=4718c9a9f8cd832693b52e90cd1107c4&onetime_condition=&eid=5ad00062415c46a09fd67fd7ac1e024a&bw[name]=Chrome&bw[ftf]=0&bw[os]=Macintosh&location=preview.studio.site%2Flive%2FbXqz8p7wWD&fonts[id]=2538&fonts[str]=LC0wMTIzNDU2NzhDRktTVmlub3Jz4oiS44CS44Gd44Gq44KK44Ki44Kj44Kk44Kq44Kw44K344K544OJ44OQ44OT44OV44OX44Od44Op44Oq44Or44Ot44Oz44O744O85LiA5LiB5Lmd5LqV5Lqs5Luj5Lya5YaG5YyX5Yy65Y2D5Y2X5Y%2B35aSn5aWl5biC5bmz5bm05bqc5byP5oCl5pel5pyI5pys5p2x5qCq5q6155Sw55S655Wq55uu56S%2B6KeS6YO96Ziq6aKv77yU77yX77yY); } @font-face { font-family: 'こぶりなゴシック W6 JIS2004'; font-weight: Bold; src: url(//wf.typesquare.com/3/tsst/dist/ja/ts?condition=4718c9a9f8cd832693b52e90cd1107c4&onetime_condition=&eid=5ad00062415c46a09fd67fd7ac1e024a&bw[name]=Chrome&bw[ftf]=0&bw[os]=Macintosh&location=preview.studio.site%2Flive%2FbXqz8p7wWD&fonts[id]=2539&fonts[str]=LS8wM0FDRUlOT1BSU1RVVlhhYmNkZWZpbW5vcHJzdHV3wrfigJzigJ3jgIHjgILjgYLjgYTjgYbjgYrjgYvjgYzjgY3jgY%2FjgZHjgZPjgZTjgZXjgZbjgZfjgZnjgZrjgZvjgZ%2FjgaDjgaHjgaPjgaTjgabjgafjgajjgarjgavjga3jga7jga%2Fjgbnjgb7jgb%2FjgoLjgoPjgonjgorjgovjgozjgo%2FjgpLjgpPjgqHjgqLjgqPjgqTjgqbjgqjjgqnjgqrjgqvjgq3jgq%2FjgrDjgrHjgrPjgrXjgrfjgrjjgrnjgrrjgr%2Fjg4Djg4Hjg4Pjg4Tjg4bjg4fjg4jjg4njg4rjg4vjg43jg47jg4%2Fjg5Djg5Hjg5Pjg5Xjg5fjg5rjg57jg6Djg6Hjg6Ljg6Pjg6fjg6njg6rjg6vjg6zjg63jg7Pjg7zkuJbkuK3kuLnkuovkupXku5Xku6PkvIHkvJrkvb%2FkvpvlhYjlhbHlhoXlh7rliIbliIflibXlipvli5Xli5nli53ljJblj47lj5blkITlkIjlkI3lkJHlkbPlkozlk6HllY%2FlnKjlnLDln7nlo7LlpKflpKrlpaXlrablrojlrp%2FlrqLlrrnlsILlsZXlubPlvIrlvI%2Flvablvbnlvozlv4Pmg4XmiYDmiYvmioDmiormjIHmjIfmjpvmjqHmjqXmj5Dmj6Hmj7TmkLrmlK%2FmlbDmlrDmnIDmnKrmnKzmnaXmoKrmoYjmpa3mpoLmp4vmp5jmqYvmrrXmsJfmsrvmtLvmupDngrnnhrHnirbnj77nlJ%2FnlKjnlLDnlYznmbrnm4rnm67nm7jnn6XnpL7np5Hnq4vnq6%2Fnr4nntLDntYTntpnntprnt4%2Fnt6DnuYvoiIjoi7HooZPooajoo4XopoHopo%2FoqK3oqLzoqanoqbPoq4forZjosLfosqnos4fou73pgKPpgYrpganph43ph47ph5HploDplovplqLpoq%2Fpp4bpqJPpq5g%3D); } @font-face { font-family: 'こぶりなゴシック W3 JIS2004'; font-weight: Bold; src: url(//wf.typesquare.com/3/tsst/dist/ja/ts?condition=4718c9a9f8cd832693b52e90cd1107c4&onetime_condition=&eid=5ad00062415c46a09fd67fd7ac1e024a&bw[name]=Chrome&bw[ftf]=0&bw[os]=Macintosh&location=preview.studio.site%2Flive%2FbXqz8p7wWD&fonts[id]=2538&fonts[str]=LC0wMTIzNDU2NzhDRktTVmlub3Jz4oiS44CS44Gd44Gq44KK44Ki44Kj44Kk44Kq44Kw44K344K544OJ44OQ44OT44OV44OX44Od44Op44Oq44Or44Ot44Oz44O744O85LiA5LiB5Lmd5LqV5Lqs5Luj5Lya5YaG5YyX5Yy65Y2D5Y2X5Y%2B35aSn5aWl5biC5bmz5bm05bqc5byP5oCl5pel5pyI5pys5p2x5qCq5q6155Sw55S655Wq55uu56S%2B6KeS6YO96Ziq6aKv77yU77yX77yY); } .sd.header { align-content: center; align-items: center; background: #ffffffff; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2) inset; display: flex; flex: none; flex-direction: row; flex-wrap: nowrap; height: 80px; justify-content: space-between; left: 0; margin: 0 0 0 0; padding: 0px 40px; position: fixed; top: 0; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.header { display: flex; } } @media screen and (max-width: 540px) { .sd.header { display: flex; padding: 0px 20px; } } .sd.header-home { align-content: center; align-items: center; background: #bf2e9f00; flex: none; flex-direction: column; flex-wrap: nowrap; height: 100%; justify-content: center; width: auto; max-width: 100%; } .sd.header-img { flex: none; height: auto; width: 195px; max-width: 100%; } .sd.header-link { align-content: center; align-items: center; background: #ff0000ff; border-radius: 50px; display: none; flex: none; flex-direction: column; flex-wrap: nowrap; height: 50px; justify-content: center; width: 50px; max-width: 100%; } @media screen and (max-width: 976px) { .sd.header-link { background: #4edca1ff; display: flex; } } @media screen and (max-width: 540px) { .sd.header-link { background: #4edca1ff; display: flex; } } .sd.header-icon { color: #ffffffff; font-size: 24px; } .sd.header-nav { align-content: center; align-items: center; background: #6ddbff00; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 40px; height: 100%; justify-content: center; padding: 0px 20px; width: auto; --gap-h-2c3a010b-95e0-45f3-a69a-edac1f2555f4: 40px; --gap-v-2c3a010b-95e0-45f3-a69a-edac1f2555f4: 0px; --gap-uuid: 2c3a010b-95e0-45f3-a69a-edac1f2555f4; max-width: 100%; } @media screen and (max-width: 976px) { .sd.header-nav { display: none; --gap-h-2c3a010b-95e0-45f3-a69a-edac1f2555f4: 40px; --gap-v-2c3a010b-95e0-45f3-a69a-edac1f2555f4: 0px; } } @media screen and (max-width: 540px) { .sd.header-nav { display: none; --gap-h-2c3a010b-95e0-45f3-a69a-edac1f2555f4: 40px; --gap-v-2c3a010b-95e0-45f3-a69a-edac1f2555f4: 0px; } } .sd.header-business-3 { align-content: center; align-items: center; background: #eeeeee00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; width: auto; max-width: 100%; } .sd.header-business-3:hover { opacity: 1; } .sd.header-text { background: rgba(198, 240, 255, 0); color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: 40px; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.header-nav-item-deco-1 { background: #000000ff; bottom: 0px; flex: none; height: 2px; left: 0px; margin: 0 0 0 0; position: absolute; right: 0px; top: auto; width: 0%; max-width: 0%; } .sd.header-business-3:hover .sd.header-nav-item-deco-1 { flex: none; width: 100%; max-width: 100%; } .sd.header-campany-1 { align-content: center; align-items: center; background: #eeeeee00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; width: auto; max-width: 100%; } .sd.header-campany-1:hover { opacity: 1; } .sd.header-text-2 { background: rgba(198, 240, 255, 0); color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: 40px; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.header-nav-item-deco-2 { background: #000000ff; bottom: 0px; flex: none; height: 2px; left: 0px; margin: 0 0 0 0; position: absolute; right: 0px; top: auto; width: 0%; max-width: 0%; } .sd.header-campany-1:hover .sd.header-nav-item-deco-2 { flex: none; width: 100%; max-width: 100%; } .sd.header-member-3 { align-content: center; align-items: center; background: #eeeeee00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; width: auto; max-width: 100%; } .sd.header-member-3:hover { opacity: 1; } .sd.header-text-3 { background: rgba(198, 240, 255, 0); color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: 40px; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.header-nav-item-deco-3 { background: #000000ff; bottom: 0px; flex: none; height: 2px; left: 0px; margin: 0 0 0 0; position: absolute; right: 0px; top: auto; width: 0%; max-width: 0%; } .sd.header-member-3:hover .sd.header-nav-item-deco-3 { flex: none; width: 100%; max-width: 100%; } .sd.header-contact { align-content: center; align-items: center; background: #4ed998ff; border-radius: 25px; flex: none; flex-direction: row; flex-wrap: nowrap; height: 50px; justify-content: center; padding: 0px 20px; width: auto; max-width: 100%; } .sd.header-contact:hover { background: #ffffffff; } .sd.header-icon-2 { color: #ffffffff; font-size: 24px; } .sd.header-contact:hover .sd.header-icon-2 { color: #4ed998ff; } .sd.header-text-4 { color: #ffffffff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.header-contact:hover .sd.header-text-4 { color: #4ed998ff; } .sd.footer { align-content: center; align-items: center; background: #ffffffff; border-radius: 0px 0px 0px 0px; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 20px; height: auto; justify-content: center; padding: 60px 0px; width: 100%; --gap-h-210c2dd3-19c8-4545-82e8-0517e681e5b5: 0px; --gap-v-210c2dd3-19c8-4545-82e8-0517e681e5b5: 20px; --gap-uuid: 210c2dd3-19c8-4545-82e8-0517e681e5b5; max-width: 100%; } @media screen and (max-width: 976px) { .sd.footer { border-radius: 0px 0px 0px 0px; --gap-h-210c2dd3-19c8-4545-82e8-0517e681e5b5: 0px; --gap-v-210c2dd3-19c8-4545-82e8-0517e681e5b5: 20px; } } @media screen and (max-width: 540px) { .sd.footer { border-radius: 0px 0px 0px 0px; --gap-h-210c2dd3-19c8-4545-82e8-0517e681e5b5: 0px; --gap-v-210c2dd3-19c8-4545-82e8-0517e681e5b5: 20px; } } .sd.footer-content { align-content: flex-start; align-items: flex-start; background: #f2c9a000; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 40px; height: auto; justify-content: center; padding: 0px 40px; width: 1280px; --gap-h-6b3bc49c-2d94-47b6-abb0-94d5fcbf675d: 40px; --gap-v-6b3bc49c-2d94-47b6-abb0-94d5fcbf675d: 0px; --gap-uuid: 6b3bc49c-2d94-47b6-abb0-94d5fcbf675d; max-width: 100%; } @media screen and (max-width: 540px) { .sd.footer-content { flex-direction: column; flex-wrap: nowrap; padding: 0px 20px; --gap-h-6b3bc49c-2d94-47b6-abb0-94d5fcbf675d: 0px; --gap-v-6b3bc49c-2d94-47b6-abb0-94d5fcbf675d: 40px; } } .sd.footer-info { align-content: flex-start; align-items: flex-start; background: #8ec35b00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 10px 0px 0px 0px; width: calc(50% - (var(--gap-h-6b3bc49c-2d94-47b6-abb0-94d5fcbf675d) * 0.5)); max-width: calc(50% - (var(--gap-h-6b3bc49c-2d94-47b6-abb0-94d5fcbf675d) * 0.5)); } @media screen and (max-width: 540px) { .sd.footer-info { flex: none; width: calc(100% - (var(--gap-h-6b3bc49c-2d94-47b6-abb0-94d5fcbf675d) * 0)); max-width: calc(100% - (var(--gap-h-6b3bc49c-2d94-47b6-abb0-94d5fcbf675d) * 0)); } } .sd.footer-img { background: rgba(255, 161, 161, 0); height: auto; width: 431px; max-width: 100%; } .sd.footer-CrossVision { background: rgba(255, 111, 111, 0); color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 16px; font-weight: 400; height: auto; line-height: 1.4; margin: 20px 0px 0px 0px; text-align: left; width: 100%; max-width: 100%; justify-content: flex-start; } .sd.footer-text { background: rgba(255, 138, 138, 0); color: #000000ff; flex: none; font-family: var(--s-font-3eb085da); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; margin: 5px 0px 0px 0px; text-align: left; width: 100%; max-width: 100%; justify-content: flex-start; } .sd.footer-ul { align-content: flex-start; align-items: flex-start; background: #aabd8f00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; width: calc(50% - (var(--gap-h-6b3bc49c-2d94-47b6-abb0-94d5fcbf675d) * 0.5)); max-width: calc(50% - (var(--gap-h-6b3bc49c-2d94-47b6-abb0-94d5fcbf675d) * 0.5)); } @media screen and (max-width: 540px) { .sd.footer-ul { flex: none; width: calc(100% - (var(--gap-h-6b3bc49c-2d94-47b6-abb0-94d5fcbf675d) * 0)); max-width: calc(100% - (var(--gap-h-6b3bc49c-2d94-47b6-abb0-94d5fcbf675d) * 0)); } } .sd.footer-top-tab { align-content: center; align-items: center; background: #ff929200; border-bottom: 1px solid #000000; border-left: 0px solid #000000; border-right: 0px solid #000000; border-top: 0px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; height: 50px; justify-content: space-between; width: 100%; max-width: 100%; } .sd.footer-top-tab:hover { opacity: 1; } .sd.footer-text-2 { background: rgba(255, 184, 184, 0); color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.footer-icon { background: rgba(255, 184, 184, 0); color: #000000ff; font-size: 24px; } .sd.footer-top-tab:hover .sd.footer-icon { transform: translate(10px, 0px); } .sd.footer-about-yuudou { align-content: center; align-items: center; background: #ff929200; border-bottom: 1px solid #000000; border-left: 0px solid #000000; border-right: 0px solid #000000; border-top: 0px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; height: 50px; justify-content: space-between; width: 100%; max-width: 100%; } .sd.footer-about-yuudou:hover { opacity: 1; } .sd.footer-CrossVision-2 { background: rgba(255, 184, 184, 0); color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.footer-icon-2 { background: rgba(255, 184, 184, 0); color: #000000ff; font-size: 24px; } .sd.footer-about-yuudou:hover .sd.footer-icon-2 { transform: translate(10px, 0px); } .sd.footer-business-yuudou { align-content: center; align-items: center; background: #ff929200; border-bottom: 1px solid #000000; border-left: 0px solid #000000; border-right: 0px solid #000000; border-top: 0px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; height: 50px; justify-content: space-between; width: 100%; max-width: 100%; } .sd.footer-business-yuudou:hover { opacity: 1; } .sd.footer-text-3 { background: rgba(255, 184, 184, 0); color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.footer-icon-3 { background: rgba(255, 184, 184, 0); color: #000000ff; font-size: 24px; } .sd.footer-business-yuudou:hover .sd.footer-icon-3 { transform: translate(10px, 0px); } .sd.footer-campany-1 { align-content: center; align-items: center; background: #ff929200; border-bottom: 1px solid #000000; border-left: 0px solid #000000; border-right: 0px solid #000000; border-top: 0px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; height: 50px; justify-content: space-between; width: 100%; max-width: 100%; } .sd.footer-campany-1:hover { opacity: 1; } .sd.footer-text-4 { background: rgba(255, 184, 184, 0); color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.footer-icon-4 { background: rgba(255, 184, 184, 0); color: #000000ff; font-size: 24px; } .sd.footer-campany-1:hover .sd.footer-icon-4 { transform: translate(10px, 0px); } .sd.footer-member { align-content: center; align-items: center; background: #ff929200; border-bottom: 1px solid #000000; border-left: 0px solid #000000; border-right: 0px solid #000000; border-top: 0px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; height: 50px; justify-content: space-between; width: 100%; max-width: 100%; } .sd.footer-member:hover { opacity: 1; } .sd.footer-text-5 { background: rgba(255, 184, 184, 0); color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.footer-icon-5 { background: rgba(255, 184, 184, 0); color: #000000ff; font-size: 24px; } .sd.footer-member:hover .sd.footer-icon-5 { transform: translate(10px, 0px); } .sd.footer-contact { align-content: center; align-items: center; background: #ff929200; border-bottom: 1px solid #000000; border-left: 0px solid #000000; border-right: 0px solid #000000; border-top: 0px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; height: 50px; justify-content: space-between; width: 100%; max-width: 100%; } .sd.footer-contact:hover { opacity: 1; } .sd.footer-text-6 { background: rgba(255, 184, 184, 0); color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.footer-icon-6 { background: rgba(255, 184, 184, 0); color: #000000ff; font-size: 24px; } .sd.footer-contact:hover .sd.footer-icon-6 { transform: translate(10px, 0px); } .sd.footer-text-7 { background: rgba(255, 184, 184, 0); color: #000000ff; font-family: var(--s-font-3eb085da); font-size: 12px; font-weight: 400; height: auto; line-height: 1.4; margin: 40px 0px 0px 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.footer-spacer { background: #EEEEEE; flex: none; height: 1px; width: calc(80% - (var(--gap-h-210c2dd3-19c8-4545-82e8-0517e681e5b5) * 0.2)); max-width: calc(80% - (var(--gap-h-210c2dd3-19c8-4545-82e8-0517e681e5b5) * 0.2)); } .sd.footer-copyright { align-content: center; align-items: center; background: #ffdba700; flex: none; flex-direction: row; flex-wrap: nowrap; height: auto; justify-content: space-between; padding: 0px 40px; width: 1280px; max-width: 100%; } @media screen and (max-width: 540px) { .sd.footer-copyright { padding: 0px 20px; } } .sd.footer-text-8 { background: rgba(185, 255, 146, 0); color: #000000ff; font-family: var(--s-font-92a74d95); font-size: 13px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.footer-social { align-content: center; align-items: center; background: #99dd9900; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 20px; height: auto; justify-content: center; width: auto; --gap-h-f0fc6fa2-5467-4146-bef5-43ec746fa535: 20px; --gap-v-f0fc6fa2-5467-4146-bef5-43ec746fa535: 0px; --gap-uuid: f0fc6fa2-5467-4146-bef5-43ec746fa535; max-width: 100%; } .sd.footer-link { background: rgba(255, 235, 192, 0); color: #222222; font-size: 24px; } .sd.intro-root { align-content: center; align-items: center; background: #ffffff; flex-direction: column; flex-wrap: nowrap; height: 100%; justify-content: center; width: 100%; max-width: 100%; } .sd.st-f84f120d-2966-4ccd-8a85-685175ece94b { align-content: center; align-items: center; background: #eeeeee00; display: flex; flex: none; flex-direction: row; flex-wrap: nowrap; height: 80px; justify-content: space-between; left: 0; margin: 0 0 0 0; padding: 0px 40px; position: fixed; top: 0; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.st-f84f120d-2966-4ccd-8a85-685175ece94b { display: flex; } } @media screen and (max-width: 540px) { .sd.st-f84f120d-2966-4ccd-8a85-685175ece94b { display: flex; padding: 0px 20px; } } .sd.st-20dd9b47-548c-4721-afbc-3b5f01ec85b8 { align-content: center; align-items: center; background: #bf2e9fff; flex: none; flex-direction: column; flex-wrap: nowrap; height: 100%; justify-content: center; width: auto; max-width: 100%; } .sd.st-2459cf81-da19-4674-860c-d2378252e793 { flex: none; height: auto; width: 110px; max-width: 100%; } .sd.st-4c581620-d71e-480a-a149-4b92c7aea0cf { align-content: center; align-items: center; background: #6ddbff00; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 40px; height: 100%; justify-content: center; padding: 0px 20px; width: auto; --gap-h-4c581620-d71e-480a-a149-4b92c7aea0cf: 40px; --gap-v-4c581620-d71e-480a-a149-4b92c7aea0cf: 0px; --gap-uuid: 4c581620-d71e-480a-a149-4b92c7aea0cf; max-width: 100%; } @media screen and (max-width: 976px) { .sd.st-4c581620-d71e-480a-a149-4b92c7aea0cf { display: none; --gap-h-4c581620-d71e-480a-a149-4b92c7aea0cf: 40px; --gap-v-4c581620-d71e-480a-a149-4b92c7aea0cf: 0px; } } @media screen and (max-width: 540px) { .sd.st-4c581620-d71e-480a-a149-4b92c7aea0cf { display: none; --gap-h-4c581620-d71e-480a-a149-4b92c7aea0cf: 40px; --gap-v-4c581620-d71e-480a-a149-4b92c7aea0cf: 0px; } } .sd.st-0cc9c6ca-049f-4832-86b4-51e2c33e497c { align-content: center; align-items: center; background: #eeeeee00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; width: auto; max-width: 100%; } .sd.st-0cc9c6ca-049f-4832-86b4-51e2c33e497c:hover { opacity: 1; } .sd.st-a973cd11-490e-4d62-84d2-c0761cbef909 { background: rgba(198, 240, 255, 0); color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: 40px; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-51498ac5-e829-4a7a-a4a9-6ae1f99a07ca { background: #000000ff; bottom: 0px; flex: none; height: 2px; left: 0px; margin: 0 0 0 0; position: absolute; right: 0px; top: auto; width: 0%; max-width: 0%; } .sd.st-0cc9c6ca-049f-4832-86b4-51e2c33e497c:hover .sd.st-51498ac5-e829-4a7a-a4a9-6ae1f99a07ca { flex: none; width: 100%; max-width: 100%; } .sd.st-59eeca4f-9a11-4162-ad8b-6fb4ec94ddb2 { align-content: center; align-items: center; background: #eeeeee00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; width: auto; max-width: 100%; } .sd.st-59eeca4f-9a11-4162-ad8b-6fb4ec94ddb2:hover { opacity: 1; } .sd.st-390ff479-0d04-4f2f-94b3-279fe178fd4d { background: rgba(198, 240, 255, 0); color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: 40px; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-b6652cd1-b9bc-4ee6-a6d5-cbcabbeb376a { background: #000000ff; bottom: 0px; flex: none; height: 2px; left: 0px; margin: 0 0 0 0; position: absolute; right: 0px; top: auto; width: 0%; max-width: 0%; } .sd.st-59eeca4f-9a11-4162-ad8b-6fb4ec94ddb2:hover .sd.st-b6652cd1-b9bc-4ee6-a6d5-cbcabbeb376a { flex: none; width: 100%; max-width: 100%; } .sd.st-19dae1c4-1ca2-452b-881b-5a24e36331e4 { align-content: center; align-items: center; background: #eeeeee00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; width: auto; max-width: 100%; } .sd.st-19dae1c4-1ca2-452b-881b-5a24e36331e4:hover { opacity: 1; } .sd.st-daee592b-b65f-4830-8fd7-6f01242632ce { background: rgba(198, 240, 255, 0); color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: 40px; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-75c04744-fe90-42ae-8a6f-bb784c1636ba { background: #000000ff; bottom: 0px; flex: none; height: 2px; left: 0px; margin: 0 0 0 0; position: absolute; right: 0px; top: auto; width: 0%; max-width: 0%; } .sd.st-19dae1c4-1ca2-452b-881b-5a24e36331e4:hover .sd.st-75c04744-fe90-42ae-8a6f-bb784c1636ba { flex: none; width: 100%; max-width: 100%; } .sd.st-fd6c1f74-5d47-40f8-a1ce-3c9fb4070a56 { align-content: center; align-items: center; background: #eeeeee00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; width: auto; max-width: 100%; } .sd.st-fd6c1f74-5d47-40f8-a1ce-3c9fb4070a56:hover { opacity: 1; } .sd.st-d4b9ea10-bbe6-45eb-b42d-a2b59c6d613b { background: rgba(198, 240, 255, 0); color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: 40px; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-c5df838b-4894-45d2-893e-71dd3dc27ab1 { background: #000000ff; bottom: 0px; flex: none; height: 2px; left: 0px; margin: 0 0 0 0; position: absolute; right: 0px; top: auto; width: 0%; max-width: 0%; } .sd.st-fd6c1f74-5d47-40f8-a1ce-3c9fb4070a56:hover .sd.st-c5df838b-4894-45d2-893e-71dd3dc27ab1 { flex: none; width: 100%; max-width: 100%; } .sd.st-5a85d124-4569-456e-b840-be7e26212916 { align-content: center; align-items: center; background: #f93d3dff; border-radius: 25px; flex: none; flex-direction: row; flex-wrap: nowrap; height: 50px; justify-content: center; padding: 0px 20px; width: auto; max-width: 100%; } .sd.st-5a85d124-4569-456e-b840-be7e26212916:hover { background: #ffffffff; } .sd.st-ad6a0b82-e2a7-4f58-ad66-455cac8bfa0a { color: #ffffffff; font-size: 24px; } .sd.st-5a85d124-4569-456e-b840-be7e26212916:hover .sd.st-ad6a0b82-e2a7-4f58-ad66-455cac8bfa0a { color: #ff0000ff; } .sd.st-18f7c080-f057-4a72-8486-4838f7ddd30a { color: #ffffffff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-5a85d124-4569-456e-b840-be7e26212916:hover .sd.st-18f7c080-f057-4a72-8486-4838f7ddd30a { color: #ff0000ff; } .sd.st-00171ab2-6992-42c6-bb23-f113250ae275 { align-content: center; align-items: center; background: #ff0000ff; border-radius: 50px; display: none; flex: none; flex-direction: column; flex-wrap: nowrap; height: 50px; justify-content: center; width: 50px; max-width: 100%; } @media screen and (max-width: 976px) { .sd.st-00171ab2-6992-42c6-bb23-f113250ae275 { display: flex; } } @media screen and (max-width: 540px) { .sd.st-00171ab2-6992-42c6-bb23-f113250ae275 { display: flex; } } .sd.st-f0ae921f-b62f-419e-b650-df70430f7d10 { color: #ffffffff; font-size: 24px; } .sd.top-tab_phone { align-content: center; align-items: center; background: #ffffffff; box-shadow: none; display: none; flex: none; flex-direction: row; flex-wrap: wrap; height: 700px; justify-content: center; padding: 0 0; width: 100%; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.top-tab_phone { display: none; } } @media screen and (max-width: 976px) { .sd.top-tab_phone { align-content: center; align-items: center; display: flex; height: 70vh; justify-content: flex-end; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.top-tab_phone { display: flex; height: 380px; width: 100%; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.top-tab_phone { display: flex; height: 340px; width: 100%; max-width: 100%; } } .sd.top-tab_phone-inner { padding: 0 0; width: 100%; height: 700px; flex-direction: row; flex-wrap: wrap; align-content: center; align-items: center; justify-content: center; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.top-tab_phone-inner { flex-direction: column; } } @media screen and (max-width: 976px) { .sd.top-tab_phone-inner { height: 70vh; flex-direction: column; align-content: center; align-items: center; justify-content: flex-end; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.top-tab_phone-inner { width: 100%; height: 380px; flex-direction: column; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.top-tab_phone-inner { height: 340px; flex-direction: column; width: 100%; max-width: 100%; } } .sd.top-tab_phone-image { background-image: url("../images/s-1200x1200_v-fms_webp_2191103b-9193-4756-bc7c-adeeab15c933.webp"); background-size: cover; background-position: center; align-content: flex-end; align-items: flex-end; border-radius: 0px 0px 0px 200px; flex: none; flex-direction: column; flex-wrap: nowrap; height: 100%; justify-content: center; width: 70%; max-width: 70%; } .sd.top-tab_phone-image.appear { opacity: 0; transition-delay: 500ms; transition-duration: 1000ms; } .sd.top-tab_phone-image.appear-active { transition-delay: 500ms; transition-duration: 1000ms; } @media screen and (max-width: 976px) { .sd.top-tab_phone-image { align-content: center; align-items: center; flex: none; height: 100%; justify-content: center; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.top-tab_phone-image { align-content: center; align-items: center; border-radius: 0px 0px 0px 80px; height: 100%; justify-content: center; width: 100%; } } @media screen and (max-width: 321px) { .sd.top-tab_phone-image { align-content: center; align-items: center; border-radius: 0px 0px 0px 60px; flex: none; height: 100%; justify-content: center; } } .sd.top-tab_phone-content { align-content: center; align-items: center; background: #ff9e9e00; display: none; flex: none; flex-direction: row; flex-wrap: nowrap; height: 700px; justify-content: center; margin: -650px 0px 0px 0px; padding: 80px 0px 80px 40px; width: 100%; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.top-tab_phone-content { display: none; padding: 80px 40px 80px 40px; } } @media screen and (max-width: 976px) { .sd.top-tab_phone-content { align-content: center; align-items: center; display: flex; flex-direction: column-reverse; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0px 0px 0px 0px; padding: 80px 20px 80px 20px; width: auto; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.top-tab_phone-content { align-content: center; align-items: center; display: flex; flex-direction: column-reverse; flex-wrap: nowrap; height: auto; justify-content: flex-start; margin: 0px 0px 0px 0px; padding: 90px 0px 60px 0px; } } @media screen and (max-width: 321px) { .sd.top-tab_phone-content { display: flex; flex-direction: column-reverse; flex-wrap: nowrap; height: auto; margin: 0px 0px 0px 0px; padding: 90px 0px 40px 0px; } } .sd.top-tab_phone-hero { align-content: center; align-items: center; flex: none; flex-direction: column; flex-wrap: nowrap; justify-content: center; margin: 0 0 0 0; padding: 0px; width: 50%; max-width: 50%; } @media screen and (max-width: 976px) { .sd.top-tab_phone-hero { flex: none; margin: -40px 0px 0px 0px; width: auto; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.top-tab_phone-hero { flex: none; margin: 0px 0px 0px 0px; width: 400px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.top-tab_phone-hero { height: auto; margin: 0px 0px 0px 0px; max-width: 100%; } } .sd.top-tab_phone-hero-inner { align-content: center; align-items: center; background: #eeeeee00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; padding: 0px; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.top-tab_phone-hero-inner { align-content: center; align-items: center; flex: none; justify-content: center; width: 100%; } } @media screen and (max-width: 540px) { .sd.top-tab_phone-hero-inner { margin: -30px 0px 0px 0px; width: auto; max-width: 100%; } } .sd.top-tab_phone-hero-text-area { align-content: flex-start; align-items: flex-start; background: #e8ea8100; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0 0 0 0; position: relative; width: auto; max-width: 100%; } @media screen and (max-width: 976px) { .sd.top-tab_phone-hero-text-area { align-content: center; align-items: center; flex: none; justify-content: flex-start; width: auto; } } @media screen and (max-width: 540px) { .sd.top-tab_phone-hero-text-area { flex: none; margin: 0px 0px 0px 0px; width: 100%; max-width: 100%; } } .sd.top-tab_phone-hero-text-group-1 { align-content: flex-start; align-items: flex-start; flex: none; flex-direction: column; flex-wrap: nowrap; justify-content: center; margin: 60px 0px 0px 0px; padding: 0px; transform: skew(0deg, -8deg); width: auto; max-width: 100%; position: relative; } @media screen and (max-width: 976px) { .sd.top-tab_phone-hero-text-group-1 { align-content: flex-start; align-items: flex-start; justify-content: center; margin: 0px 0px 0px 0px; transform: skew(0deg, 0deg); max-width: 100%; } } @media screen and (max-width: 540px) { .sd.top-tab_phone-hero-text-group-1 { align-content: center; align-items: center; flex: none; justify-content: center; width: auto; } } @media screen and (max-width: 321px) { .sd.top-tab_phone-hero-text-group-1 { align-content: center; align-items: center; justify-content: center; } } .sd.top-tab_phone-hero-text-group-1.appear { opacity: 1 !important; transform: skew(0deg, -8deg) !important; transition: none !important; } @media screen and (max-width: 976px) { .sd.top-tab_phone-hero-text-group-1.appear { transform: skew(0deg, 0deg) !important; } } .sd.top-tab_phone-text { background: rgba(255, 255, 255, 0); color: #4edca1ff; flex: none; font-family: var(--s-font-8986a4d9); font-size: 91px; font-weight: 600; height: auto; letter-spacing: -0.07em; line-height: 1.1; text-align: left; text-shadow: none; width: 513px; max-width: 100%; justify-content: flex-start; position: relative; z-index: 10; } .sd.top-tab_phone-text.appear { opacity: 0 !important; transform: none !important; transition: opacity 0.1s ease-out !important; } .sd.top-tab_phone-text.appear.in-view { opacity: 1 !important; transition-delay: 1300ms !important; } @media screen and (max-width: 1140px) { .sd.top-tab_phone-text { flex: none; font-size: 72px; height: 88px; width: auto; max-width: 100%; } } @media screen and (max-width: 976px) { .sd.top-tab_phone-text { background: rgb(255, 255, 255); flex: none; font-size: 40px; height: auto; width: auto; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.top-tab_phone-text { flex: none; font-size: 1.25rem; height: auto; width: auto; } } @media screen and (max-width: 321px) { .sd.top-tab_phone-text { font-size: 24px; } } .sd.top-tab_phone-hero-decoration-1 { align-content: center; align-items: center; background: #76bd0d00; flex: none; flex-direction: row; flex-wrap: nowrap; height: 120%; justify-content: flex-start; margin: 0px 0px 0px 0px; width: 100%; max-width: 100%; position: absolute; top: 0; left: 0; z-index: 100; } @media screen and (max-width: 1140px) { .sd.top-tab_phone-hero-decoration-1 { flex: none; height: 95px; width: 424px; max-width: 100%; } } @media screen and (max-width: 976px) { .sd.top-tab_phone-hero-decoration-1 { background: #76bd0d00; flex: none; height: 61px; margin: -72px 0px 0px 0px; width: 285px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.top-tab_phone-hero-decoration-1 { height: 54px; margin: -48px 0px 0px 0px; width: 320px; max-width: 100%; } } .sd.top-tab_phone-hero-decoration-1.appear { opacity: 1 !important; transform: none !important; transition: none !important; } .sd.top-tab_phone-hero-decoration-1-a { background: #ffe64d00; flex: none; height: 100%; width: 630px; max-width: 100%; display: none; } .sd.top-tab_phone-hero-decoration-1-a.appear { background: #ffe64d00; flex: none; transition-delay: 800ms; transition-duration: 400ms; width: 0%; } .sd.top-tab_phone-hero-decoration-1-a.appear-active { transition-delay: 800ms; transition-duration: 400ms; } .sd.top-tab_phone-hero-decoration-1-b { background: #4edca1ff; flex: none !important; height: 100%; width: 0%; max-width: 100%; position: absolute; } .sd.top-tab_phone-hero-decoration-1-b.appear { width: 0% !important; flex: none !important; transform: none !important; opacity: 1 !important; } .sd.top-tab_phone-hero-decoration-1-b.appear.in-view { animation: wipe-reveal 1s ease-out forwards; animation-delay: 800ms; } .sd.top-tab_phone-hero-text-group-2 { align-content: flex-start; align-items: flex-start; flex: none; flex-direction: column; flex-wrap: nowrap; justify-content: center; margin: 50px 0px 0px 0px; padding: 0px; transform: skew(0deg, -8deg); width: auto; max-width: 100%; position: relative; } @media screen and (max-width: 976px) { .sd.top-tab_phone-hero-text-group-2 { transform: skew(0deg, 0deg); } } @media screen and (max-width: 540px) { .sd.top-tab_phone-hero-text-group-2 { align-content: center; align-items: center; height: auto; justify-content: center; margin: 35px 0px 0px 0px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.top-tab_phone-hero-text-group-2 { align-content: center; align-items: center; justify-content: center; } } .sd.top-tab_phone-hero-text-group-2.appear { opacity: 1 !important; transform: skew(0deg, -8deg) !important; transition: none !important; } @media screen and (max-width: 976px) { .sd.top-tab_phone-hero-text-group-2.appear { transform: skew(0deg, 0deg) !important; } } .sd.top-tab_phone-text-2 { color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 39px; font-weight: 600; height: 48px; letter-spacing: -0.07em; line-height: 1.2; margin: -30px 0px 0px 0px; text-align: left; width: 358px; max-width: 100%; justify-content: flex-start; position: relative; z-index: 10; } .sd.top-tab_phone-text-2.appear { opacity: 0 !important; transform: none !important; transition: opacity 0.1s ease-out !important; } .sd.top-tab_phone-text-2.appear.in-view { opacity: 1 !important; transition-delay: 1500ms !important; } @media screen and (max-width: 1140px) { .sd.top-tab_phone-text-2 { font-size: 36px; } } @media screen and (max-width: 976px) { .sd.top-tab_phone-text-2 { flex: none; font-size: 20px; height: auto; width: auto; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.top-tab_phone-text-2 { font-size: 16px; height: auto; margin: -50px 0px 0px 0px; width: auto; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.top-tab_phone-text-2 { font-size: 14px; } } .sd.top-tab_phone-hero-decoration-2 { align-content: center; align-items: center; background: #76bd0d00; flex: none; flex-direction: row; flex-wrap: nowrap; height: 120%; justify-content: flex-start; margin: 0px 0px 0px 0px; width: 100%; max-width: 100%; position: absolute; top: -30px; left: 0; z-index: 100; } @media screen and (max-width: 976px) { .sd.top-tab_phone-hero-decoration-2 { background: #76bd0d00; flex: none; height: 34px; margin: -34px 0px 0px 0px; width: 155px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.top-tab_phone-hero-decoration-2 { height: 24px; margin: -24px 0px 0px 0px; width: 294px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.top-tab_phone-hero-decoration-2 { width: 258px; max-width: 100%; } } .sd.top-tab_phone-hero-decoration-2.appear { opacity: 1 !important; transform: none !important; transition: none !important; } .sd.top-tab_phone-hero-decoration-2-a { background: #ffe64d00; flex: none; height: 100%; width: 100%; max-width: 100%; display: none; } .sd.top-tab_phone-hero-decoration-2-a.appear { background: #ffe64d00; flex: none; transition-delay: 800ms; transition-duration: 400ms; width: 0%; } .sd.top-tab_phone-hero-decoration-2-a.appear-active { transition-delay: 800ms; transition-duration: 400ms; } .sd.top-tab_phone-hero-decoration-2-b { background: #000000ff; flex: none !important; height: 100%; width: 0%; max-width: 100%; position: absolute; } .sd.top-tab_phone-hero-decoration-2-b.appear { width: 0% !important; flex: none !important; transform: none !important; opacity: 1 !important; } .sd.top-tab_phone-hero-decoration-2-b.appear.in-view { animation: wipe-reveal 1s ease-out forwards; animation-delay: 1000ms; } .sd.top-tab_phone-hero-images { align-content: center; align-items: center; background: #eeeeee00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; width: 620px; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.top-tab_phone-hero-images { flex: none; width: 500px; max-width: 100%; } } @media screen and (max-width: 976px) { .sd.top-tab_phone-hero-images { display: flex; flex: none; width: 600px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.top-tab_phone-hero-images { display: flex; height: auto; margin: 0px 0px 10px 0px; width: auto; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.top-tab_phone-hero-images { display: flex; height: auto; margin: 0px 0px 10px 0px; width: auto; } } .sd.top-tab_phone-img { flex: none; height: 449.77px; margin: 0px 0px 0px 0px; width: 600px; max-width: 100%; } .sd.top-tab_phone-img.appear { opacity: 0; transform: translate(15px, -10px); transition-delay: 800ms; transition-duration: 1000ms; } .sd.top-tab_phone-img.appear-active { transition-delay: 800ms; transition-duration: 1000ms; } @media screen and (max-width: 1140px) { .sd.top-tab_phone-img { flex: none; height: 375px; width: 500px; max-width: 100%; } } @media screen and (max-width: 976px) { .sd.top-tab_phone-img { flex: none; height: 375px; width: 500px; } } @media screen and (max-width: 540px) { .sd.top-tab_phone-img { height: 210px; width: 280px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.top-tab_phone-img { height: 180px; width: 240px; max-width: 100%; } } .sd.top-tab_phone-img-2 { flex: none; height: 449.77px; margin: -449px 0px 0px 0px; width: 600px; max-width: 100%; } .sd.top-tab_phone-img-2.appear { opacity: 0; transform: translate(-15px, 10px); transition-delay: 800ms; transition-duration: 1000ms; } .sd.top-tab_phone-img-2.appear-active { transition-delay: 800ms; transition-duration: 1000ms; } @media screen and (max-width: 1140px) { .sd.top-tab_phone-img-2 { flex: none; height: 375px; margin: -375px 0px 0px 0px; width: 500px; max-width: 100%; } } @media screen and (max-width: 976px) { .sd.top-tab_phone-img-2 { flex: none; height: 375px; margin: -375px 0px 0px 0px; width: 500px; } } @media screen and (max-width: 540px) { .sd.top-tab_phone-img-2 { height: 210px; margin: -210px 0px 0px 0px; width: 280px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.top-tab_phone-img-2 { height: 180px; margin: -180px 0px 0px 0px; width: 240px; max-width: 100%; } } .sd.top-3 { align-content: center; align-items: center; background: #ffffffff; box-shadow: none; flex: none; flex-direction: row; flex-wrap: wrap; height: 700px; justify-content: center; padding: 0 0; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.top-3 { display: none; flex: none; height: 100vh; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.top-3 { display: none; flex: none; height: 100vh; width: 100%; } } @media screen and (max-width: 321px) { .sd.top-3 { display: none; flex: none; height: 80vh; width: 100%; max-width: 100%; } } .sd.top-3-inner { padding: 0 0; width: 100%; height: 700px; flex-direction: row; flex-wrap: wrap; align-content: center; align-items: center; justify-content: center; max-width: 100%; } @media screen and (max-width: 976px) { .sd.top-3-inner { height: 100vh; flex-direction: column; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.top-3-inner { width: 100%; height: 100vh; flex-direction: column; } } @media screen and (max-width: 321px) { .sd.top-3-inner { height: 80vh; flex-direction: column; width: 100%; max-width: 100%; } } .sd.top-3-div { background: #53b9ff00; flex: none; height: 100%; width: 30%; max-width: 30%; } @media screen and (max-width: 540px) { .sd.top-3-div { flex: none; width: 10%; max-width: 10%; height: 100%; } } .sd.top-3-image { align-content: flex-end; align-items: flex-end; border-radius: 0px 0px 0px 200px; flex: none; flex-direction: column; flex-wrap: nowrap; height: 100%; justify-content: center; width: 70%; max-width: 70%; } .sd.top-3-image.appear { opacity: 0; transition-delay: 500ms; transition-duration: 1000ms; } .sd.top-3-image.appear-active { transition-delay: 500ms; transition-duration: 1000ms; } @media screen and (max-width: 540px) { .sd.top-3-image { border-radius: 0px 0px 0px 100px; flex: none; width: 90%; max-width: 90%; height: 100%; } } .sd.intro-hero-section { align-content: center; align-items: center; background: #ff9e9e00; flex: none; flex-direction: row; flex-wrap: nowrap; height: 700px; justify-content: center; margin: -650px 0px 0px 0px; padding: 80px 0px 80px 40px; width: 100%; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.intro-hero-section { align-content: center; align-items: center; justify-content: center; padding: 80px 40px 80px 40px; } } @media screen and (max-width: 976px) { .sd.intro-hero-section { display: none; flex-direction: row; flex-wrap: nowrap; padding: 80px 20px 80px 20px; } } @media screen and (max-width: 540px) { .sd.intro-hero-section { align-content: center; align-items: center; display: none; flex-direction: column-reverse; flex-wrap: nowrap; justify-content: flex-start; margin: -650px 0px 0px 0px; } } @media screen and (max-width: 321px) { .sd.intro-hero-section { display: none; flex-direction: column-reverse; flex-wrap: nowrap; margin: -650px 0px 0px 0px; } } .sd.intro-hero-container { align-content: center; align-items: center; flex: none; flex-direction: column; flex-wrap: nowrap; justify-content: center; margin: 0px 0px 0px 0px; padding: 0px; width: 50%; max-width: 50%; } @media screen and (max-width: 540px) { .sd.intro-hero-container { flex: none; margin: 0px 0px 80px 0px; width: 400px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.intro-hero-container { margin: 0px 0px 80px -70px; max-width: calc(100% - -70px); } } .sd.intro-hero-content { align-content: center; align-items: center; background: #eeeeee00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; padding: 0px; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.intro-hero-content { align-content: flex-start; align-items: flex-start; justify-content: center; } } @media screen and (max-width: 540px) { .sd.intro-hero-content { margin: -50px 0px 0px 0px; width: 100%; max-width: 100%; } } .sd.intro-hero-text-wrapper { align-content: flex-start; align-items: flex-start; background: #e8ea8100; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0 0 0 0; position: relative; width: auto; max-width: 100%; } @media screen and (max-width: 976px) { .sd.intro-hero-text-wrapper { left: 40px; } } @media screen and (max-width: 540px) { .sd.intro-hero-text-wrapper { flex: none; margin: 0px 0px 0px 50px; width: calc(100% - 50px); max-width: calc(100% - 50px); } } .sd.intro-hero-text-item-1 { align-content: flex-start; align-items: flex-start; flex: none; flex-direction: column; flex-wrap: nowrap; justify-content: center; margin: 60px 0px 0px 0px; padding: 0px; transform: skew(0deg, -8deg); width: auto; max-width: 100%; } .sd.intro-hero-text-item-1.appear { opacity: 1 !important; transform: skew(0deg, -8deg) !important; transition: none !important; } @media screen and (max-width: 540px) { .sd.intro-hero-text-item-1 { flex: none; width: auto; } } .sd.intro-text { background: rgb(255, 255, 255); color: #4edca1ff; flex: none; font-family: var(--s-font-8986a4d9); font-size: 68px; font-weight: 600; height: auto; letter-spacing: -0.07em; line-height: 1.1; margin: -7px 0px 0px 0px; text-align: left; text-shadow: none; /* width: 513px; */ max-width: 100%; justify-content: flex-start; opacity: 0; transition: opacity 0.4s ease-out; } .sd.intro-hero-text-item-1.appear.in-view .sd.intro-text { opacity: 1; transition-delay: 1300ms; } @media screen and (max-width: 1140px) { .sd.intro-text { flex: none; font-size: 69px; height: 88px; width: auto; max-width: 100%; } } @media screen and (max-width: 976px) { .sd.intro-text { flex: none; font-size: 50px; height: auto; width: auto; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.intro-text { flex: none; font-size: 40px; height: auto; width: auto; } } @media screen and (max-width: 321px) { .sd.intro-text { font-size: 40px; } } .sd.intro-hero-deco-1 { align-content: center; align-items: center; background: #76bd0d00; flex: none; flex-direction: row; flex-wrap: nowrap; height: 120%; justify-content: flex-start; margin: 0px 0px 0px 0px; width: 100%; max-width: 100%; position: absolute; top: -7px; left: 0; z-index: 100; } .sd.intro-hero-deco-1.appear { opacity: 1 !important; transform: none !important; transition: none !important; } @media screen and (max-width: 1140px) { .sd.intro-hero-deco-1 { flex: none; height: 120%; width: 100%; max-width: 100%; margin: 0; } } @media screen and (max-width: 976px) { .sd.intro-hero-deco-1 { background: #76bd0d00; flex: none; height: 120%; margin: 0; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.intro-hero-deco-1 { flex: none; height: 120%; margin: 0; width: 100%; max-width: 100%; } } .sd.intro-hero-deco-1-a { background: #ffe64d00; flex: none; height: 100%; width: 630px; max-width: 100%; display: none; } .sd.intro-hero-deco-1-a.appear { background: #ffe64d00; flex: none; transition-delay: 800ms; transition-duration: 400ms; width: 0%; } .sd.intro-hero-deco-1-a.appear-active { transition-delay: 800ms; transition-duration: 400ms; } .sd.intro-hero-deco-1-b { background: #4edca1ff; flex: 1; height: 100%; width: auto; max-width: 100%; width: 0%; position: absolute; } .sd.intro-hero-deco-1.appear.in-view .sd.intro-hero-deco-1-b { animation: wipe-reveal 1s ease-out forwards; animation-delay: 800ms; } .sd.intro-hero-text-item-2 { align-content: flex-start; align-items: flex-start; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 20px 0px 0px 0px; padding: 0px; transform: skew(0deg, -8deg); width: auto; max-width: 100%; } .sd.intro-hero-text-item-2.appear { opacity: 1 !important; transform: skew(0deg, -8deg) !important; transition: none !important; } @media screen and (max-width: 1140px) { .sd.intro-hero-text-item-2 { margin: 40px 0px 0px 0px; max-width: 100%; } } @media screen and (max-width: 976px) { .sd.intro-hero-text-item-2 { margin: 36px 0px 0px 0px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.intro-hero-text-item-2 { flex: none; height: auto; margin: 20px 0px 30px 0px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.intro-hero-text-item-2 { margin: 15px 0px 10px 0px; max-width: 100%; } } .sd.intro-text-2 { background: rgb(255, 255, 255); color: #4edca1ff; flex: none; font-family: var(--s-font-8986a4d9); font-size: 68px; font-weight: 600; height: auto; letter-spacing: -0.07em; line-height: 1.1; margin: -7px 0px 0px 0px; text-align: left; text-shadow: none; /* width: 596px; */ max-width: 100%; justify-content: flex-start; opacity: 0; transition: opacity 0.4s ease-out; } .sd.intro-hero-text-item-2.appear.in-view .sd.intro-text-2 { opacity: 1; transition-delay: 1300ms; } @media screen and (max-width: 1140px) { .sd.intro-text-2 { flex: none; font-size: 69px; width: auto; max-width: 100%; } } @media screen and (max-width: 976px) { .sd.intro-text-2 { flex: none; font-size: 50px; height: auto; width: auto; } } @media screen and (max-width: 540px) { .sd.intro-text-2 { flex: none; font-size: 40px; width: auto; } } @media screen and (max-width: 321px) { .sd.intro-text-2 { font-size: 40px; } } .sd.intro-hero-deco-2 { align-content: center; align-items: center; background: #76bd0d00; flex: none; flex-direction: row; flex-wrap: nowrap; height: 120%; justify-content: flex-start; margin: 0px 0px 0px 0px; width: 100%; max-width: 100%; position: absolute; top: -7px; left: 0; z-index: 100; } .sd.intro-hero-deco-2.appear { opacity: 1 !important; transform: none !important; transition: none !important; } @media screen and (max-width: 1140px) { .sd.intro-hero-deco-2 { flex: none; height: 120%; width: 100%; max-width: 100%; margin: 0; } } @media screen and (max-width: 976px) { .sd.intro-hero-deco-2 { flex: none; height: 120%; margin: 0; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.intro-hero-deco-2 { background: #76bd0d00; flex: none; height: 120%; width: 100%; max-width: 100%; margin: 0; } } .sd.intro-hero-deco-2-a { background: #ffe64d00; flex: none; height: 100%; width: 100%; max-width: 100%; display: none; } .sd.intro-hero-deco-2-a.appear { background: #ffe64d00; flex: none; transition-delay: 1000ms; transition-duration: 400ms; width: 0%; } .sd.intro-hero-deco-2-a.appear-active { transition-delay: 1000ms; transition-duration: 400ms; } .sd.intro-hero-deco-2-b { background: #4edca1ff; flex: 1; height: 100%; width: auto; max-width: 100%; width: 0%; position: absolute; } .sd.intro-hero-deco-2.appear.in-view .sd.intro-hero-deco-2-b { animation: wipe-reveal 1s ease-out forwards; animation-delay: 800ms; } .sd.intro-hero-text-item-3 { align-content: flex-start; align-items: flex-start; flex: none; flex-direction: column; flex-wrap: nowrap; justify-content: center; margin: 50px 0px 0px 0px; padding: 0px; transform: skew(0deg, -8deg); width: auto; max-width: 100%; position: relative; } .sd.intro-hero-text-item-3.appear { opacity: 1 !important; transform: skew(0deg, -8deg) !important; transition: none !important; } @media screen and (max-width: 540px) { .sd.intro-hero-text-item-3 { margin: 40px 0px 0px 0px; max-width: 100%; } } .sd.intro-text-3 { color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 39px; font-weight: 600; height: auto; letter-spacing: -0.07em; line-height: 1.2; margin: -30px 0px 0px 0px; text-align: left; /* width: 358px; */ max-width: 100%; justify-content: flex-start; opacity: 0; transition: opacity 0.1s ease-out; position: relative; z-index: 10; } .sd.intro-hero-text-item-3.appear.in-view .sd.intro-text-3 { opacity: 1; transition-delay: 1300ms; } @media screen and (max-width: 1140px) { .sd.intro-text-3 { font-size: 36px; } } @media screen and (max-width: 976px) { .sd.intro-text-3 { flex: none; font-size: 28px; height: auto; width: auto; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.intro-text-3 { flex: none; font-size: 20px; height: auto; width: auto; } } .sd.intro-hero-deco-3 { align-content: center; align-items: center; background: #76bd0d00; flex: none; flex-direction: row; flex-wrap: nowrap; height: 250%; justify-content: flex-start; margin: 0px 0px 0px 0px; width: 100%; max-width: 100%; position: absolute; top: -30px; left: 0; z-index: 100; } .sd.intro-hero-deco-3.appear { opacity: 1 !important; transform: none !important; transition: none !important; } @media screen and (max-width: 976px) { .sd.intro-hero-deco-3 { background: #76bd0d00; flex: none; height: 34px; margin: -34px 0px 0px 0px; width: 155px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.intro-hero-deco-3 { flex: none; height: 24px; margin: -24px 0px 0px 0px; width: 111px; max-width: 100%; } } .sd.intro-hero-deco-3-a { background: #ffe64d00; flex: none; height: 100%; width: 100%; max-width: 100%; display: none; } .sd.intro-hero-deco-3-a.appear { background: #ffe64d00; flex: none; transition-delay: 1200ms; transition-duration: 400ms; width: 0%; } .sd.intro-hero-deco-3-a.appear-active { transition-delay: 1200ms; transition-duration: 400ms; } .sd.intro-hero-deco-3-b { background: #000000ff; flex: none !important; height: 100%; width: 0%; max-width: 100%; position: absolute; } .sd.intro-hero-deco-3.appear.in-view .sd.intro-hero-deco-3-b { animation: wipe-reveal 1s ease-out forwards; animation-delay: 800ms; } .sd.intro-hero-text-item-4 { align-content: flex-start; align-items: flex-start; flex-direction: column; flex-wrap: nowrap; justify-content: center; margin: 36px 0px 0px 0px; padding: 0px; transform: skew(0deg, -8deg); max-width: 100%; position: relative; } .sd.intro-hero-text-item-4.appear { opacity: 1 !important; transform: skew(0deg, -8deg) !important; transition: none !important; } .sd.intro-text-4 { color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 39px; font-weight: 600; height: auto; letter-spacing: -0.07em; line-height: 1.2; margin: -30px 0px 0px 0px; text-align: left; /* width: 358px; */ max-width: 100%; justify-content: flex-start; opacity: 0; transition: opacity 0.1s ease-out; position: relative; z-index: 10; } .sd.intro-hero-text-item-4.appear.in-view .sd.intro-text-4 { opacity: 1; transition-delay: 1300ms; } @media screen and (max-width: 1140px) { .sd.intro-text-4 { font-size: 36px; } } @media screen and (max-width: 976px) { .sd.intro-text-4 { flex: none; font-size: 28px; height: auto; width: auto; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.intro-text-4 { flex: none; font-size: 20px; height: auto; width: auto; } } .sd.intro-hero-deco-4 { align-content: center; align-items: center; background: #76bd0d00; flex: none; flex-direction: row; flex-wrap: nowrap; height: 250%; justify-content: flex-start; margin: 0px 0px 0px 0px; width: 100%; max-width: 100%; position: absolute; top: -30px; left: 0; z-index: 100; } .sd.intro-hero-deco-4.appear { opacity: 1 !important; transform: none !important; transition: none !important; } @media screen and (max-width: 976px) { .sd.intro-hero-deco-4 { background: #76bd0d00; flex: none; height: 34px; margin: -34px 0px 0px 0px; width: 254px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.intro-hero-deco-4 { flex: none; height: 24px; margin: -24px 0px 0px 0px; width: 182px; max-width: 100%; } } .sd.intro-hero-deco-4-a { background: #ffe64d00; flex: none; height: 100%; width: 100%; max-width: 100%; display: none; } .sd.intro-hero-deco-4-a.appear { background: #ffe64d00; flex: none; transition-delay: 800ms; transition-duration: 400ms; width: 0%; } .sd.intro-hero-deco-4-a.appear-active { transition-delay: 800ms; transition-duration: 400ms; } .sd.intro-hero-deco-4-b { background: #000000ff; flex: none !important; height: 100%; width: 0%; max-width: 100%; position: absolute; } .sd.intro-hero-deco-4.appear.in-view .sd.intro-hero-deco-4-b { animation: wipe-reveal 1s ease-out forwards; animation-delay: 800ms; } .sd.intro-hero-images { align-content: center; align-items: center; background: #eeeeee00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0px 0px 0px 0px; width: 620px; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.intro-hero-images { flex: none; width: 500px; max-width: 100%; } } @media screen and (max-width: 976px) { .sd.intro-hero-images { display: flex; flex: none; width: 400px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.intro-hero-images { display: flex; flex: none; height: 270px; width: 360px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.intro-hero-images { display: flex; flex: none; width: 310px; max-width: 100%; } } .sd.intro-img { flex: none; height: 449.77px; margin: 0px 0px 0px 0px; width: 600px; max-width: 100%; opacity: 0; transform: translate(15px, -15px); transition: opacity 1s ease-out, transform 1s ease-out; } .sd.intro-hero-images.appear.in-view .sd.intro-img { opacity: 1; transform: translate(0, 0); transition-delay: 800ms; } @media screen and (max-width: 1140px) { .sd.intro-img { flex: none; height: 375px; width: 500px; max-width: 100%; } } @media screen and (max-width: 976px) { .sd.intro-img { flex: none; height: 290px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.intro-img { flex: none; height: 225px; width: 300px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.intro-img { flex: none; height: 217px; width: 290px; max-width: 100%; } } .sd.intro-img-2 { flex: none; height: 449.77px; margin: -449px 0px 0px 0px; width: 600px; max-width: 100%; opacity: 0; transform: translate(-15px, 15px); transition: opacity 1s ease-out, transform 1s ease-out; } .sd.intro-hero-images.appear.in-view .sd.intro-img-2 { opacity: 1; transform: translate(0, 0); transition-delay: 800ms; } @media screen and (max-width: 1140px) { .sd.intro-img-2 { flex: none; height: 375px; margin: -375px 0px 0px 0px; width: 500px; max-width: 100%; } } @media screen and (max-width: 976px) { .sd.intro-img-2 { flex: none; height: 290px; margin: -290px 0px 0px 0px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.intro-img-2 { flex: none; height: 225px; margin: -225px 0px 0px 0px; width: 300px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.intro-img-2 { flex: none; height: 217.5px; margin: -218px 0px 0px 0px; width: 290px; max-width: 100%; } } .sd.about-yuudou { background: #FFFFFF; height: 0px; padding: 0 0; width: 1080px; max-width: 100%; } .sd.about-yuudou-inner { padding: 0 0; width: 1080px; height: 0px; flex-direction: column; max-width: 100%; } .sd.about-pc { align-content: center; align-items: center; background: #ffffffff; flex: none; flex-direction: row; flex-wrap: nowrap; height: auto; justify-content: center; padding: 100px 40px; width: 1280px; --gap-uuid: 97980f39-6677-455b-ae57-e365946bb310; --gap-h-97980f39-6677-455b-ae57-e365946bb310: 0px; --gap-v-97980f39-6677-455b-ae57-e365946bb310: 0px; max-width: 100%; } @media screen and (max-width: 976px) { .sd.about-pc { display: none; flex-direction: column-reverse; flex-wrap: nowrap; } } @media screen and (max-width: 540px) { .sd.about-pc { display: none; flex-direction: column-reverse; flex-wrap: nowrap; padding: 80px 20px; } } @media screen and (max-width: 321px) { .sd.about-pc { align-content: center; align-items: center; display: none; flex: none; gap: 20px; height: auto; justify-content: flex-end; --gap-h-97980f39-6677-455b-ae57-e365946bb310: 20px; --gap-v-97980f39-6677-455b-ae57-e365946bb310: 0px; } } .sd.about-pc-inner { padding: 100px 40px; width: 1280px; height: auto; flex-direction: row; flex-wrap: nowrap; align-content: center; align-items: center; justify-content: center; --gap-uuid: 97980f39-6677-455b-ae57-e365946bb310; --gap-h-97980f39-6677-455b-ae57-e365946bb310: 0px; --gap-v-97980f39-6677-455b-ae57-e365946bb310: 0px; max-width: 100%; } @media screen and (max-width: 976px) { .sd.about-pc-inner { flex-direction: column-reverse; flex-wrap: nowrap; } } @media screen and (max-width: 540px) { .sd.about-pc-inner { padding: 80px 20px; flex-direction: column-reverse; flex-wrap: nowrap; } } @media screen and (max-width: 321px) { .sd.about-pc-inner { height: auto; flex-direction: column; align-content: center; align-items: center; justify-content: flex-end; gap: 20px; --gap-h-97980f39-6677-455b-ae57-e365946bb310: 20px; --gap-v-97980f39-6677-455b-ae57-e365946bb310: 0px; } } .sd.about-pc-images-wrapper { align-content: center; align-items: center; background: #e3fef3ff; border-radius: 40px; box-shadow: none; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: flex-start; margin: 0px 40px 0px 0px; width: calc(50% - 40px - (var(--gap-h-97980f39-6677-455b-ae57-e365946bb310) * 0.5)); max-width: calc(50% - 40px - (var(--gap-h-97980f39-6677-455b-ae57-e365946bb310) * 0.5)); } .sd.about-pc-images-wrapper:hover { opacity: 1; } @media screen and (max-width: 1140px) { .sd.about-pc-images-wrapper { align-content: center; align-items: center; flex: none; height: auto; justify-content: center; margin: 0px 0px 0px 0px; width: calc(50% - (var(--gap-h-97980f39-6677-455b-ae57-e365946bb310) * 0.5)); max-width: calc(50% - (var(--gap-h-97980f39-6677-455b-ae57-e365946bb310) * 0.5)); } } @media screen and (max-width: 976px) { .sd.about-pc-images-wrapper { flex: none; height: auto; margin: 0px 0px 0px 0px; width: calc(100% - (var(--gap-h-97980f39-6677-455b-ae57-e365946bb310) * 0)); max-width: calc(100% - (var(--gap-h-97980f39-6677-455b-ae57-e365946bb310) * 0)); } } @media screen and (max-width: 540px) { .sd.about-pc-images-wrapper { flex: none; flex-direction: column; flex-wrap: nowrap; height: 374px; width: 374px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.about-pc-images-wrapper { flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; width: calc(100% - (var(--gap-h-97980f39-6677-455b-ae57-e365946bb310) * 0)); max-width: calc(100% - (var(--gap-h-97980f39-6677-455b-ae57-e365946bb310) * 0)); } } .sd.about-pc-image-1-wrapper { align-content: flex-start; align-items: flex-start; background: #756cdf00; border-bottom: 4px solid #00000000; border-left: 4px solid #00000000; border-radius: 50px; border-right: 4px solid #00000000; border-top: 4px solid #00000000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 560px; justify-content: center; width: 560px; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.about-pc-image-1-wrapper { flex: none; height: 510px; width: 510px; max-width: 100%; } } @media screen and (max-width: 976px) { .sd.about-pc-image-1-wrapper { flex: none; height: 760px; width: 760px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.about-pc-image-1-wrapper { border-radius: 0px; flex: none; height: 500px; width: 500px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.about-pc-image-1-wrapper { flex: none; height: auto; width: 100%; max-width: 100%; } } .sd.about-pc-img { border-radius: 50px; flex: none; height: auto; width: 100%; max-width: 100%; } .sd.about-pc-img.appear { transform: translate(0px, 5px) scale(0, 0); transition-delay: 300ms; transition-duration: 600ms; } .sd.about-pc-img.appear-active { transition-delay: 300ms; transition-duration: 600ms; } .sd.about-pc-images-wrapper:hover .sd.about-pc-img { transform: translate(1px, -5px) scale(1.2, 1.2); } @media screen and (max-width: 540px) { .sd.about-pc-img { border-radius: 0px; } } .sd.about-pc-image-2-wrapper { align-content: flex-end; align-items: flex-end; background: #756cdf00; border-bottom: 4px solid #00000000; border-left: 4px solid #00000000; border-radius: 50px; border-right: 4px solid #00000000; border-top: 4px solid #00000000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 560px; justify-content: center; margin: -560px 0px 0px 0px; width: 560px; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.about-pc-image-2-wrapper { flex: none; height: 510px; margin: -510px 0px 0px 0px; width: 510px; max-width: 100%; } } @media screen and (max-width: 976px) { .sd.about-pc-image-2-wrapper { flex: none; height: 760px; margin: -760px 0px 0px 0px; width: 760px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.about-pc-image-2-wrapper { border-radius: 0px; flex: none; height: 500px; margin: -500px 0px 0px 0px; width: 500px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.about-pc-image-2-wrapper { flex: none; height: auto; margin: -280px 0px 0px 0px; width: 100%; max-width: 100%; } } .sd.about-pc-img-2 { border-radius: 50px; flex: none; height: auto; width: 100%; max-width: 100%; } .sd.about-pc-img-2.appear { opacity: 0; transform: translate(0px, -5px) scale(0, 0); transition-delay: 400ms; transition-duration: 600ms; } .sd.about-pc-img-2.appear-active { transition-delay: 400ms; transition-duration: 600ms; } .sd.about-pc-images-wrapper:hover .sd.about-pc-img-2 { transform: translate(-3px, -2px) scale(1.2, 1.2); } @media screen and (max-width: 540px) { .sd.about-pc-img-2 { border-radius: 0px; } } .sd.about-pc-image-3-wrapper { align-content: center; align-items: center; background: #756cdf00; border-bottom: 4px solid #00000000; border-left: 4px solid #00000000; border-radius: 50px; border-right: 4px solid #00000000; border-top: 4px solid #00000000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 560px; justify-content: center; margin: -560px 0px 0px 0px; width: 560px; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.about-pc-image-3-wrapper { flex: none; height: 510px; margin: -510px 0px 0px 0px; max-width: 100%; } } @media screen and (max-width: 976px) { .sd.about-pc-image-3-wrapper { flex: none; height: 760px; margin: -760px 0px 0px 0px; width: 760px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.about-pc-image-3-wrapper { border-radius: 0px; flex: none; height: 500px; margin: -500px 0px 0px 0px; width: 500px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.about-pc-image-3-wrapper { flex: none; height: auto; margin: -280px 0px 0px 0px; width: 100%; max-width: 100%; } } .sd.about-pc-img-3 { border-radius: 50px; flex: none; height: auto; width: 100%; max-width: 100%; } .sd.about-pc-img-3.appear { opacity: 0; transform: translate(0px, -5px) scale(0, 0); transition-delay: 500ms; transition-duration: 600ms; } .sd.about-pc-img-3.appear-active { transition-delay: 500ms; transition-duration: 600ms; } .sd.about-pc-images-wrapper:hover .sd.about-pc-img-3 { transform: translate(3px, 5px) scale(1.2, 1.2); } @media screen and (max-width: 540px) { .sd.about-pc-img-3 { border-radius: 0px; } } .sd.about-pc-image-4-wrapper { align-content: center; align-items: center; background: #756cdf00; border-bottom: 4px solid #00000000; border-left: 4px solid #00000000; border-radius: 50px; border-right: 4px solid #00000000; border-top: 4px solid #00000000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 560px; justify-content: center; margin: -560px 0px 0px 0px; width: 560px; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.about-pc-image-4-wrapper { flex: none; height: 510px; margin: -510px 0px 0px 0px; width: 510px; max-width: 100%; } } @media screen and (max-width: 976px) { .sd.about-pc-image-4-wrapper { flex: none; height: 760px; margin: -760px 0px 0px 0px; width: 760px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.about-pc-image-4-wrapper { border-radius: 0px; flex: none; height: 500px; margin: -500px 0px 0px 0px; width: 500px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.about-pc-image-4-wrapper { flex: none; height: auto; margin: -280px 0px 0px 0px; width: 100%; max-width: 100%; } } .sd.about-pc-img-4 { border-radius: 50px; flex: none; height: auto; width: 100%; max-width: 100%; } .sd.about-pc-img-4.appear { opacity: 0; transform: translate(0px, -5px) scale(0, 0); transition-delay: 600ms; transition-duration: 600ms; } .sd.about-pc-img-4.appear-active { transition-delay: 600ms; transition-duration: 600ms; } .sd.about-pc-images-wrapper:hover .sd.about-pc-img-4 { transform: translate(3px, 5px) scale(1.2, 1.2); } @media screen and (max-width: 540px) { .sd.about-pc-img-4 { border-radius: 0px; } } .sd.about-pc-text-content { align-content: center; align-items: center; background: #60a2a600; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 40px; height: auto; justify-content: center; margin: 0px 0px 80px 40px; width: calc(50% - 40px - (var(--gap-h-97980f39-6677-455b-ae57-e365946bb310) * 0.5)); --gap-h-dbf3fab0-ae6d-42de-967c-304ab424d9ea: 0px; --gap-v-dbf3fab0-ae6d-42de-967c-304ab424d9ea: 40px; --gap-uuid: dbf3fab0-ae6d-42de-967c-304ab424d9ea; max-width: calc(50% - 40px - (var(--gap-h-97980f39-6677-455b-ae57-e365946bb310) * 0.5)); } .sd.about-pc-text-content:hover { opacity: 1; --gap-h-dbf3fab0-ae6d-42de-967c-304ab424d9ea: 0px; --gap-v-dbf3fab0-ae6d-42de-967c-304ab424d9ea: 40px; } @media screen and (max-width: 976px) { .sd.about-pc-text-content { flex: none; margin: 0px 0px 80px 0px; padding: 0px 0px; width: calc(100% - (var(--gap-h-97980f39-6677-455b-ae57-e365946bb310) * 0)); --gap-h-dbf3fab0-ae6d-42de-967c-304ab424d9ea: 0px; --gap-v-dbf3fab0-ae6d-42de-967c-304ab424d9ea: 40px; max-width: calc(100% - (var(--gap-h-97980f39-6677-455b-ae57-e365946bb310) * 0)); } } @media screen and (max-width: 321px) { .sd.about-pc-text-content { margin: 0px 0px 0px 0px; --gap-h-dbf3fab0-ae6d-42de-967c-304ab424d9ea: 0px; --gap-v-dbf3fab0-ae6d-42de-967c-304ab424d9ea: 40px; width: calc(100% - (var(--gap-h-97980f39-6677-455b-ae57-e365946bb310) * 0)); max-width: calc(100% - (var(--gap-h-97980f39-6677-455b-ae57-e365946bb310) * 0)); } } .sd.about-pc-text-header { align-content: flex-start; align-items: flex-start; background: #eeeeee00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: flex-start; margin: 0px 0px 0px 0px; width: calc(100% - (var(--gap-h-dbf3fab0-ae6d-42de-967c-304ab424d9ea) * 0)); max-width: calc(100% - (var(--gap-h-dbf3fab0-ae6d-42de-967c-304ab424d9ea) * 0)); } @media screen and (max-width: 976px) { .sd.about-pc-text-header { flex-direction: column; flex-wrap: nowrap; padding: 0px 0px 0px 20px; } } @media screen and (max-width: 540px) { .sd.about-pc-text-header { align-content: center; align-items: center; justify-content: flex-start; } } @media screen and (max-width: 321px) { .sd.about-pc-text-header { flex-direction: column; flex-wrap: nowrap; } } .sd.about-pc-text-header-top { align-content: center; align-items: center; background: #a85f5f00; flex: none; flex-direction: row; flex-wrap: wrap; height: auto; justify-content: flex-start; width: auto; max-width: 100%; } @media screen and (max-width: 976px) { .sd.about-pc-text-header-top { margin: 0px 0px 0px -10px; max-width: calc(100% - -10px); } } @media screen and (max-width: 540px) { .sd.about-pc-text-header-top { flex-direction: row; flex-wrap: wrap; } } .sd.about-pc-text { color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 43px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 1140px) { .sd.about-pc-text { font-size: 36px; } } @media screen and (max-width: 540px) { .sd.about-pc-text { font-size: 24px; margin: 0px 0px 0px 0px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.about-pc-text { font-size: 20px; } } .sd.about-pc-text-2 { color: #333333; font-family: var(--s-font-92a74d95); font-size: 20px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.about-pc-text-header-highlight { background: #eeeeee00; flex: none; flex-direction: row; flex-wrap: nowrap; height: auto; width: auto; --gap-uuid: 194a6181-088a-4eb1-b8f8-4135f17a1fe2; --gap-h-194a6181-088a-4eb1-b8f8-4135f17a1fe2: 0px; --gap-v-194a6181-088a-4eb1-b8f8-4135f17a1fe2: 0px; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.about-pc-text-header-highlight { flex: none; gap: 0px; height: 50px; --gap-h-194a6181-088a-4eb1-b8f8-4135f17a1fe2: 0px; --gap-v-194a6181-088a-4eb1-b8f8-4135f17a1fe2: 0px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.about-pc-text-header-highlight { align-content: center; align-items: center; background: #eeeeee00; flex: none; flex-direction: row; flex-wrap: nowrap; height: auto; justify-content: center; max-width: 100%; } } .sd.about-pc-text-3 { color: transparent; font-family: var(--s-font-ff98f853); font-size: 43px; font-weight: 400; height: auto; line-height: 1.4; margin: 0px 0px 0px -10px; text-align: left; width: auto; max-width: calc(100% - -10px); justify-content: flex-start; background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1)); background-clip: text; -webkit-background-clip: text; --g-color-0: #4edca1ff; --g-position-0: 100%; --g-color-1: #000000ff; --g-position-1: 100%; --g-color-2: #000000ff; --g-position-2: 100%; --g-color-3: #000000ff; --g-position-3: 100%; --g-color-4: #000000ff; --g-position-4: 100%; --g-color-5: #000000ff; --g-position-5: 100%; --g-color-6: #000000ff; --g-position-6: 100%; --g-color-7: #000000ff; --g-position-7: 100%; --g-color-8: #000000ff; --g-position-8: 100%; --g-color-9: #000000ff; --g-position-9: 100%; --g-color-10: #000000ff; --g-position-10: 100%; --g-color-11: #000000ff; --g-position-11: 100%; --g-angle: 90deg; } .sd.about-pc-text-3.appear { color: transparent; transition-delay: 600ms; transition-duration: 1000ms; background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1)); background-clip: text; -webkit-background-clip: text; --g-color-0: #4edca1ff; --g-position-0: 0%; --g-color-1: #000000ff; --g-position-1: 0%; --g-color-2: #000000ff; --g-position-2: 0%; --g-color-3: #000000ff; --g-position-3: 0%; --g-color-4: #000000ff; --g-position-4: 0%; --g-color-5: #000000ff; --g-position-5: 0%; --g-color-6: #000000ff; --g-position-6: 0%; --g-color-7: #000000ff; --g-position-7: 0%; --g-color-8: #000000ff; --g-position-8: 0%; --g-color-9: #000000ff; --g-position-9: 0%; --g-color-10: #000000ff; --g-position-10: 0%; --g-color-11: #000000ff; --g-position-11: 0%; --g-angle: 90deg; } .sd.about-pc-text-3.appear-active { transition-delay: 600ms; transition-duration: 1000ms; } @media screen and (max-width: 1140px) { .sd.about-pc-text-3 { font-size: 36px; } } @media screen and (max-width: 540px) { .sd.about-pc-text-3 { font-size: 24px; } } @media screen and (max-width: 321px) { .sd.about-pc-text-3 { font-size: 20px; } } .sd.about-pc-text-4 { color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 43px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 1140px) { .sd.about-pc-text-4 { font-size: 36px; } } @media screen and (max-width: 540px) { .sd.about-pc-text-4 { font-size: 24px; } } @media screen and (max-width: 321px) { .sd.about-pc-text-4 { font-size: 20px; } } .sd.about-pc-text-5 { background: #64ffda00; color: #333333ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 20px; font-weight: 400; height: auto; line-height: 1.7; text-align: left; width: calc(100% - (var(--gap-h-dbf3fab0-ae6d-42de-967c-304ab424d9ea) * 0)); max-width: calc(100% - (var(--gap-h-dbf3fab0-ae6d-42de-967c-304ab424d9ea) * 0)); justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.about-pc-text-5 { font-size: 16px; padding: 0px 0px; } } @media screen and (max-width: 321px) { .sd.about-pc-text-5 { font-size: 14px; } } .sd.about-tablet_phone { align-content: center; align-items: center; background: #ffffffff; display: none; flex: none; flex-direction: row; flex-wrap: nowrap; height: auto; justify-content: center; padding: 100px 40px; width: 1280px; --gap-uuid: b2a5a19c-0ae3-4fce-80ee-f39af561562a; --gap-h-b2a5a19c-0ae3-4fce-80ee-f39af561562a: 0px; --gap-v-b2a5a19c-0ae3-4fce-80ee-f39af561562a: 0px; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.about-tablet_phone { display: none; } } @media screen and (max-width: 976px) { .sd.about-tablet_phone { display: flex; flex-direction: column; flex-wrap: nowrap; } } @media screen and (max-width: 540px) { .sd.about-tablet_phone { display: flex; flex-direction: column; flex-wrap: nowrap; padding: 40px 20px; } } @media screen and (max-width: 321px) { .sd.about-tablet_phone { align-content: center; align-items: center; display: flex; flex: none; gap: 20px; height: auto; justify-content: flex-end; --gap-h-b2a5a19c-0ae3-4fce-80ee-f39af561562a: 20px; --gap-v-b2a5a19c-0ae3-4fce-80ee-f39af561562a: 0px; } } .sd.about-tablet_phone-inner { padding: 100px 40px; width: 1280px; height: auto; flex-direction: row; flex-wrap: nowrap; align-content: center; align-items: center; justify-content: center; --gap-uuid: b2a5a19c-0ae3-4fce-80ee-f39af561562a; --gap-h-b2a5a19c-0ae3-4fce-80ee-f39af561562a: 0px; --gap-v-b2a5a19c-0ae3-4fce-80ee-f39af561562a: 0px; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.about-tablet_phone-inner { flex-direction: column; } } @media screen and (max-width: 976px) { .sd.about-tablet_phone-inner { flex-direction: column; flex-wrap: nowrap; } } @media screen and (max-width: 540px) { .sd.about-tablet_phone-inner { padding: 40px 20px; flex-direction: column; flex-wrap: nowrap; } } @media screen and (max-width: 321px) { .sd.about-tablet_phone-inner { height: auto; flex-direction: column; align-content: center; align-items: center; justify-content: flex-end; gap: 20px; --gap-h-b2a5a19c-0ae3-4fce-80ee-f39af561562a: 20px; --gap-v-b2a5a19c-0ae3-4fce-80ee-f39af561562a: 0px; } } .sd.about-tablet_phone-images-wrapper { align-content: center; align-items: center; background: #e3fef3ff; border-radius: 40px; box-shadow: none; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: flex-start; margin: 0px 40px 0px 0px; width: calc(50% - 40px - (var(--gap-h-b2a5a19c-0ae3-4fce-80ee-f39af561562a) * 0.5)); max-width: calc(50% - 40px - (var(--gap-h-b2a5a19c-0ae3-4fce-80ee-f39af561562a) * 0.5)); } .sd.about-tablet_phone-images-wrapper:hover { opacity: 1; } @media screen and (max-width: 1140px) { .sd.about-tablet_phone-images-wrapper { align-content: center; align-items: center; flex: none; height: auto; justify-content: center; margin: 0px 0px 0px 0px; width: calc(50% - (var(--gap-h-b2a5a19c-0ae3-4fce-80ee-f39af561562a) * 0.5)); max-width: calc(50% - (var(--gap-h-b2a5a19c-0ae3-4fce-80ee-f39af561562a) * 0.5)); } } @media screen and (max-width: 976px) { .sd.about-tablet_phone-images-wrapper { flex: none; height: auto; margin: 0px 0px 0px 0px; width: auto; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.about-tablet_phone-images-wrapper { flex-direction: column; flex-wrap: nowrap; height: 321px; width: 321px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.about-tablet_phone-images-wrapper { flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; width: calc(100% - (var(--gap-h-b2a5a19c-0ae3-4fce-80ee-f39af561562a) * 0)); max-width: calc(100% - (var(--gap-h-b2a5a19c-0ae3-4fce-80ee-f39af561562a) * 0)); } } .sd.about-tablet_phone-image-1-wrapper { align-content: flex-start; align-items: flex-start; background: #756cdf00; border-bottom: 4px solid #00000000; border-left: 4px solid #00000000; border-radius: 50px; border-right: 4px solid #00000000; border-top: 4px solid #00000000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 560px; justify-content: center; width: 560px; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.about-tablet_phone-image-1-wrapper { flex: none; height: 510px; width: 510px; max-width: 100%; } } @media screen and (max-width: 976px) { .sd.about-tablet_phone-image-1-wrapper { flex: none; height: 760px; width: 760px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.about-tablet_phone-image-1-wrapper { border-radius: 0px; flex: none; height: 500px; width: 500px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.about-tablet_phone-image-1-wrapper { flex: none; height: auto; width: 100%; max-width: 100%; } } .sd.about-tablet_phone-img { border-radius: 50px; flex: none; height: auto; width: 100%; max-width: 100%; } .sd.about-tablet_phone-img.appear { transform: translate(0px, 5px) scale(0, 0); transition-delay: 300ms; transition-duration: 600ms; } .sd.about-tablet_phone-img.appear-active { transition-delay: 300ms; transition-duration: 600ms; } .sd.about-tablet_phone-images-wrapper:hover .sd.about-tablet_phone-img { transform: translate(1px, -5px) scale(1.2, 1.2); } @media screen and (max-width: 540px) { .sd.about-tablet_phone-img { border-radius: 0px; } } .sd.about-tablet_phone-image-2-wrapper { align-content: flex-end; align-items: flex-end; background: #756cdf00; border-bottom: 4px solid #00000000; border-left: 4px solid #00000000; border-radius: 50px; border-right: 4px solid #00000000; border-top: 4px solid #00000000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 560px; justify-content: center; margin: -560px 0px 0px 0px; width: 560px; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.about-tablet_phone-image-2-wrapper { flex: none; height: 510px; margin: -510px 0px 0px 0px; width: 510px; max-width: 100%; } } @media screen and (max-width: 976px) { .sd.about-tablet_phone-image-2-wrapper { flex: none; height: 760px; margin: -760px 0px 0px 0px; width: 760px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.about-tablet_phone-image-2-wrapper { border-radius: 0px; flex: none; height: 500px; margin: -500px 0px 0px 0px; width: 500px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.about-tablet_phone-image-2-wrapper { flex: none; height: auto; margin: -280px 0px 0px 0px; width: 100%; max-width: 100%; } } .sd.about-tablet_phone-img-2 { border-radius: 50px; flex: none; height: auto; width: 100%; max-width: 100%; } .sd.about-tablet_phone-img-2.appear { opacity: 0; transform: translate(0px, -5px) scale(0, 0); transition-delay: 400ms; transition-duration: 600ms; } .sd.about-tablet_phone-img-2.appear-active { transition-delay: 400ms; transition-duration: 600ms; } .sd.about-tablet_phone-images-wrapper:hover .sd.about-tablet_phone-img-2 { transform: translate(-3px, -2px) scale(1.2, 1.2); } @media screen and (max-width: 540px) { .sd.about-tablet_phone-img-2 { border-radius: 0px; } } .sd.about-tablet_phone-image-3-wrapper { align-content: center; align-items: center; background: #756cdf00; border-bottom: 4px solid #00000000; border-left: 4px solid #00000000; border-radius: 50px; border-right: 4px solid #00000000; border-top: 4px solid #00000000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 560px; justify-content: center; margin: -560px 0px 0px 0px; width: 560px; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.about-tablet_phone-image-3-wrapper { flex: none; height: 510px; margin: -510px 0px 0px 0px; max-width: 100%; } } @media screen and (max-width: 976px) { .sd.about-tablet_phone-image-3-wrapper { flex: none; height: 760px; margin: -760px 0px 0px 0px; width: 760px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.about-tablet_phone-image-3-wrapper { border-radius: 0px; flex: none; height: 500px; margin: -500px 0px 0px 0px; width: 500px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.about-tablet_phone-image-3-wrapper { flex: none; height: auto; margin: -280px 0px 0px 0px; width: 100%; max-width: 100%; } } .sd.about-tablet_phone-img-3 { border-radius: 50px; flex: none; height: auto; width: 100%; max-width: 100%; } .sd.about-tablet_phone-img-3.appear { opacity: 0; transform: translate(0px, -5px) scale(0, 0); transition-delay: 500ms; transition-duration: 600ms; } .sd.about-tablet_phone-img-3.appear-active { transition-delay: 500ms; transition-duration: 600ms; } .sd.about-tablet_phone-images-wrapper:hover .sd.about-tablet_phone-img-3 { transform: translate(3px, 5px) scale(1.2, 1.2); } @media screen and (max-width: 540px) { .sd.about-tablet_phone-img-3 { border-radius: 0px; } } .sd.about-tablet_phone-image-4-wrapper { align-content: center; align-items: center; background: #756cdf00; border-bottom: 4px solid #00000000; border-left: 4px solid #00000000; border-radius: 50px; border-right: 4px solid #00000000; border-top: 4px solid #00000000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 560px; justify-content: center; margin: -560px 0px 0px 0px; width: 560px; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.about-tablet_phone-image-4-wrapper { flex: none; height: 510px; margin: -510px 0px 0px 0px; width: 510px; max-width: 100%; } } @media screen and (max-width: 976px) { .sd.about-tablet_phone-image-4-wrapper { height: 760px; margin: -760px 0px 0px 0px; width: 760px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.about-tablet_phone-image-4-wrapper { border-radius: 0px; flex: none; height: 500px; margin: -500px 0px 0px 0px; width: 500px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.about-tablet_phone-image-4-wrapper { flex: none; height: auto; margin: -280px 0px 0px 0px; width: 100%; max-width: 100%; } } .sd.about-tablet_phone-img-4 { border-radius: 50px; flex: none; height: auto; width: 100%; max-width: 100%; } .sd.about-tablet_phone-img-4.appear { opacity: 0; transform: translate(0px, -5px) scale(0, 0); transition-delay: 600ms; transition-duration: 600ms; } .sd.about-tablet_phone-img-4.appear-active { transition-delay: 600ms; transition-duration: 600ms; } .sd.about-tablet_phone-images-wrapper:hover .sd.about-tablet_phone-img-4 { transform: translate(3px, 5px) scale(1.2, 1.2); } @media screen and (max-width: 540px) { .sd.about-tablet_phone-img-4 { border-radius: 0px; } } .sd.about-tablet_phone-text-content { align-content: center; align-items: center; background: #60a2a600; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 40px; height: auto; justify-content: center; margin: 0px 0px 80px 40px; width: calc(50% - 40px - (var(--gap-h-b2a5a19c-0ae3-4fce-80ee-f39af561562a) * 0.5)); --gap-h-45014ba3-462a-4d43-8bca-d8ec9c5c04f8: 0px; --gap-v-45014ba3-462a-4d43-8bca-d8ec9c5c04f8: 40px; --gap-uuid: 45014ba3-462a-4d43-8bca-d8ec9c5c04f8; max-width: calc(50% - 40px - (var(--gap-h-b2a5a19c-0ae3-4fce-80ee-f39af561562a) * 0.5)); } .sd.about-tablet_phone-text-content:hover { opacity: 1; --gap-h-45014ba3-462a-4d43-8bca-d8ec9c5c04f8: 0px; --gap-v-45014ba3-462a-4d43-8bca-d8ec9c5c04f8: 40px; } @media screen and (max-width: 976px) { .sd.about-tablet_phone-text-content { flex: none; margin: 80px 0px 0px 0px; padding: 0px 0px; width: calc(100% - (var(--gap-h-b2a5a19c-0ae3-4fce-80ee-f39af561562a) * 0)); --gap-h-45014ba3-462a-4d43-8bca-d8ec9c5c04f8: 0px; --gap-v-45014ba3-462a-4d43-8bca-d8ec9c5c04f8: 40px; max-width: calc(100% - (var(--gap-h-b2a5a19c-0ae3-4fce-80ee-f39af561562a) * 0)); } } @media screen and (max-width: 540px) { .sd.about-tablet_phone-text-content { gap: 20px; margin: 40px 0px 0px 0px; --gap-h-45014ba3-462a-4d43-8bca-d8ec9c5c04f8: 0px; --gap-v-45014ba3-462a-4d43-8bca-d8ec9c5c04f8: 20px; width: calc(100% - (var(--gap-h-b2a5a19c-0ae3-4fce-80ee-f39af561562a) * 0)); max-width: calc(100% - (var(--gap-h-b2a5a19c-0ae3-4fce-80ee-f39af561562a) * 0)); } } @media screen and (max-width: 321px) { .sd.about-tablet_phone-text-content { gap: 24px; margin: 0px 0px 0px 0px; --gap-h-45014ba3-462a-4d43-8bca-d8ec9c5c04f8: 0px; --gap-v-45014ba3-462a-4d43-8bca-d8ec9c5c04f8: 24px; width: calc(100% - (var(--gap-h-b2a5a19c-0ae3-4fce-80ee-f39af561562a) * 0)); max-width: calc(100% - (var(--gap-h-b2a5a19c-0ae3-4fce-80ee-f39af561562a) * 0)); } } .sd.about-tablet_phone-text-header { align-content: flex-start; align-items: flex-start; background: #eeeeee00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: flex-start; margin: 0px 0px 0px 0px; width: calc(100% - (var(--gap-h-45014ba3-462a-4d43-8bca-d8ec9c5c04f8) * 0)); max-width: calc(100% - (var(--gap-h-45014ba3-462a-4d43-8bca-d8ec9c5c04f8) * 0)); } @media screen and (max-width: 976px) { .sd.about-tablet_phone-text-header { flex-direction: column; flex-wrap: nowrap; padding: 0px 0px 0px 20px; } } @media screen and (max-width: 540px) { .sd.about-tablet_phone-text-header { align-content: center; align-items: center; justify-content: flex-start; padding: 0px 0px 0px 0px; } } @media screen and (max-width: 321px) { .sd.about-tablet_phone-text-header { flex-direction: column; flex-wrap: nowrap; padding: 0px 0px 0px 0px; } } .sd.about-tablet_phone-text-header-top { align-content: center; align-items: center; background: #a85f5f00; flex: none; flex-direction: row; flex-wrap: wrap; height: auto; justify-content: flex-start; width: auto; max-width: 100%; } @media screen and (max-width: 976px) { .sd.about-tablet_phone-text-header-top { margin: 0px 0px 0px -10px; max-width: calc(100% - -10px); } } @media screen and (max-width: 540px) { .sd.about-tablet_phone-text-header-top { flex-direction: row; flex-wrap: wrap; } } .sd.about-tablet_phone-text { color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 43px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 1140px) { .sd.about-tablet_phone-text { font-size: 36px; } } @media screen and (max-width: 540px) { .sd.about-tablet_phone-text { font-size: 24px; margin: 0px 0px 0px 0px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.about-tablet_phone-text { font-size: 20px; } } .sd.about-tablet_phone-text-2 { color: #333333; font-family: var(--s-font-92a74d95); font-size: 20px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.about-tablet_phone-text-header-highlight { align-content: center; align-items: center; flex-direction: row; flex-wrap: nowrap; justify-content: center; padding: 0px; } @media screen and (max-width: 976px) { .sd.about-tablet_phone-text-header-highlight { flex-direction: row; } } .sd.about-tablet_phone-text-header-highlight-inner { background: #eeeeee00; flex: none; flex-direction: row; flex-wrap: nowrap; height: auto; width: auto; --gap-uuid: 72da63ab-f9e4-4496-85dc-bdee7310718e; --gap-h-72da63ab-f9e4-4496-85dc-bdee7310718e: 0px; --gap-v-72da63ab-f9e4-4496-85dc-bdee7310718e: 0px; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.about-tablet_phone-text-header-highlight-inner { flex: none; gap: 0px; height: 50px; --gap-h-72da63ab-f9e4-4496-85dc-bdee7310718e: 0px; --gap-v-72da63ab-f9e4-4496-85dc-bdee7310718e: 0px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.about-tablet_phone-text-header-highlight-inner { align-content: center; align-items: center; background: #eeeeee00; flex: none; flex-direction: row; flex-wrap: nowrap; height: auto; justify-content: center; max-width: 100%; } } .sd.about-tablet_phone-text-3 { color: #4edca1; font-family: var(--s-font-ff98f853); font-size: 43px; font-weight: 400; height: auto; line-height: 1.4; margin: 0px 0px 0px -10px; text-align: left; width: auto; max-width: calc(100% - -10px); justify-content: flex-start; } .sd.about-tablet_phone-text-3.appear { color: #4edca1; opacity: 0; transition-delay: 600ms; transition-duration: 1000ms; } .sd.about-tablet_phone-text-3.appear-active { transition-delay: 600ms; transition-duration: 1000ms; } @media screen and (max-width: 1140px) { .sd.about-tablet_phone-text-3 { font-size: 36px; } } @media screen and (max-width: 540px) { .sd.about-tablet_phone-text-3 { font-size: 24px; } } @media screen and (max-width: 321px) { .sd.about-tablet_phone-text-3 { font-size: 20px; } } .sd.about-tablet_phone-text-4 { color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 43px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 1140px) { .sd.about-tablet_phone-text-4 { font-size: 36px; } } @media screen and (max-width: 540px) { .sd.about-tablet_phone-text-4 { font-size: 24px; } } @media screen and (max-width: 321px) { .sd.about-tablet_phone-text-4 { font-size: 20px; } } .sd.about-tablet_phone-text-5 { background: #64ffda00; color: #333333ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 20px; font-weight: 400; height: auto; line-height: 1.5; text-align: left; width: calc(100% - (var(--gap-h-45014ba3-462a-4d43-8bca-d8ec9c5c04f8) * 0)); max-width: calc(100% - (var(--gap-h-45014ba3-462a-4d43-8bca-d8ec9c5c04f8) * 0)); justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.about-tablet_phone-text-5 { font-size: 14px; line-height: 2; padding: 0px 0px; } } @media screen and (max-width: 321px) { .sd.about-tablet_phone-text-5 { font-size: 14px; } } .sd.business-yuudou { background: #FFFFFF; height: 0px; padding: 0 0; width: 1080px; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-yuudou { height: 0px; } } .sd.business-yuudou-inner { padding: 0 0; width: 1080px; height: 0px; flex-direction: column; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-yuudou-inner { height: 0px; flex-direction: column; } } .sd.business-3 { align-content: center; align-items: center; background: #ffb2b200; display: flex; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0px 0px 0px 0px; padding: 80px 0px; width: 100%; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.business-3 { display: flex; } } @media screen and (max-width: 976px) { .sd.business-3 { display: none; flex: none; height: auto; } } @media screen and (max-width: 540px) { .sd.business-3 { align-content: center; align-items: center; display: none; justify-content: center; } } @media screen and (max-width: 321px) { .sd.business-3 { display: none; } } .sd.business-3-inner { padding: 80px 0px; width: 100%; height: auto; flex-direction: column; flex-wrap: nowrap; align-content: center; align-items: center; justify-content: center; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.business-3-inner { flex-direction: column; } } @media screen and (max-width: 976px) { .sd.business-3-inner { height: auto; flex-direction: column; } } @media screen and (max-width: 540px) { .sd.business-3-inner { flex-direction: column; align-content: center; align-items: center; justify-content: center; } } @media screen and (max-width: 321px) { .sd.business-3-inner { flex-direction: column; } } .sd.business-3-header { align-content: flex-start; align-items: flex-start; background: #ffa51200; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0px 0px 20px 0px; padding: 0px 40px; width: 1280px; max-width: 100%; } @media screen and (max-width: 540px) { .sd.business-3-header { padding: 0px 20px; } } .sd.business-3-text { background: rgba(100, 255, 148, 0); color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 24px; font-weight: 400; height: auto; line-height: 1; margin: 0px 0px 0px 10px; text-align: left; width: auto; max-width: calc(100% - 10px); justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.business-3-text { font-size: 20px; } } @media screen and (max-width: 321px) { .sd.business-3-text { font-size: 14px; margin: 0px 0px 0px 5px; max-width: calc(100% - 5px); } } .sd.business-3-Business { background: rgba(197, 255, 229, 0); color: #4edca1ff; font-family: var(--s-font-8986a4d9); font-size: 144px; font-weight: 600; height: auto; letter-spacing: -0.07em; line-height: 1; margin: 0px 0px -22px 0px; padding: 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 976px) { .sd.business-3-Business { font-size: 90px; margin: 0px 0px -14px 0px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-3-Business { font-size: 64px; margin: 0px 0px -10px 0px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.business-3-Business { font-size: 50px; } } .sd.business-3-content { align-content: center; align-items: center; background: #e3fef300; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 200px; height: auto; justify-content: center; width: 100%; --gap-h-f00f58a9-e045-4b74-a6a5-d4253a99ea69: 0px; --gap-v-f00f58a9-e045-4b74-a6a5-d4253a99ea69: 200px; --gap-uuid: f00f58a9-e045-4b74-a6a5-d4253a99ea69; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-3-content { flex: none; gap: 80px; height: auto; --gap-h-f00f58a9-e045-4b74-a6a5-d4253a99ea69: 0px; --gap-v-f00f58a9-e045-4b74-a6a5-d4253a99ea69: 80px; } } @media screen and (max-width: 540px) { .sd.business-3-content { flex: none; gap: 40px; height: auto; --gap-h-f00f58a9-e045-4b74-a6a5-d4253a99ea69: 0px; --gap-v-f00f58a9-e045-4b74-a6a5-d4253a99ea69: 40px; } } .sd.business-3-list { align-content: flex-start; align-items: flex-start; background: #b7a58b00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; padding: 0px; width: calc(100% - (var(--gap-h-f00f58a9-e045-4b74-a6a5-d4253a99ea69) * 0)); max-width: calc(100% - (var(--gap-h-f00f58a9-e045-4b74-a6a5-d4253a99ea69) * 0)); } @media screen and (max-width: 1140px) { .sd.business-3-list { margin: 50px 0px 0px 0px; width: calc(100% - (var(--gap-h-f00f58a9-e045-4b74-a6a5-d4253a99ea69) * 0)); max-width: calc(100% - (var(--gap-h-f00f58a9-e045-4b74-a6a5-d4253a99ea69) * 0)); } } @media screen and (max-width: 976px) { .sd.business-3-list { margin: 0px 0px 0px 0px; width: calc(100% - (var(--gap-h-f00f58a9-e045-4b74-a6a5-d4253a99ea69) * 0)); max-width: calc(100% - (var(--gap-h-f00f58a9-e045-4b74-a6a5-d4253a99ea69) * 0)); } } @media screen and (max-width: 540px) { .sd.business-3-list { flex: none; height: auto; } } .sd.business-3-item-creator { align-content: flex-end; align-items: flex-end; background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1), var(--g-color-2) var(--g-position-2), var(--g-color-3) var(--g-position-3), var(--g-color-4) var(--g-position-4), var(--g-color-5) var(--g-position-5)); border-radius: 0px 50px 50px 0px; box-shadow: 0px 20px 0px #4edca1ff; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0px -300px 0px 0px; padding: 60px 300px 60px 0px; width: calc(50% - -300px); max-width: calc(50% - -300px); --g-color-0: #e3fef3ff; --g-position-0: 0%; --g-color-1: #e3fef3ff; --g-position-1: 26%; --g-color-2: rgb(255, 255, 255); --g-position-2: 27%; --g-color-3: rgb(255, 255, 255); --g-position-3: 75%; --g-color-4: #e3fef3ff; --g-position-4: 76%; --g-color-5: #e3fef3ff; --g-position-5: 100%; --g-color-6: #e3fef3ff; --g-position-6: 100%; --g-color-7: #e3fef3ff; --g-position-7: 100%; --g-color-8: #e3fef3ff; --g-position-8: 100%; --g-color-9: #e3fef3ff; --g-position-9: 100%; --g-color-10: #e3fef3ff; --g-position-10: 100%; --g-color-11: #e3fef3ff; --g-position-11: 100%; --g-angle: 35deg; } @media screen and (max-width: 976px) { .sd.business-3-item-creator { box-shadow: -1px 20px 0px #4edca1ff; flex: none; height: auto; margin: 0px 110px 0px 0px; padding: 80px 0px 80px 0px; width: calc(100% - 110px); max-width: calc(100% - 110px); } } @media screen and (max-width: 540px) { .sd.business-3-item-creator { border-radius: 0px 30px 30px 0px; margin: 0px 40px 0px 0px; padding: 80px 0px 100px 0px; width: calc(100% - 40px); max-width: calc(100% - 40px); } } .sd.business-3-item-creator-inner { align-content: flex-start; align-items: flex-start; background: #b4ffb000; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: flex-end; padding: 0px 0px 0px 40px; width: 640px; max-width: 100%; } .sd.business-3-item-creator-inner.appear { opacity: 0; transform: translate(0px, 20px); transition-delay: 300ms; transition-duration: 600ms; } .sd.business-3-item-creator-inner.appear-active { transition-delay: 300ms; transition-duration: 600ms; } @media screen and (max-width: 976px) { .sd.business-3-item-creator-inner { flex: none; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-3-item-creator-inner { padding: 0px 20px; } } .sd.business-3-item-creator-title { align-content: flex-start; align-items: flex-start; background: #eeeeee00; flex: none; flex-direction: row; flex-wrap: nowrap; height: auto; justify-content: flex-start; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-3-item-creator-title { flex-direction: column; flex-wrap: nowrap; } } @media screen and (max-width: 540px) { .sd.business-3-item-creator-title { flex-direction: column; flex-wrap: nowrap; } } @media screen and (max-width: 321px) { .sd.business-3-item-creator-title { flex-direction: column; flex-wrap: nowrap; } } .sd.business-3-text-2 { background: #ff005500; color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 36px; font-weight: 400; height: auto; line-height: 1.3; margin: 0px 0px 20px 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 976px) { .sd.business-3-text-2 { margin: 0px 0px 0px 0px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-3-text-2 { font-size: 28px; margin: 0px 0px 0px 0px; } } @media screen and (max-width: 321px) { .sd.business-3-text-2 { font-size: 24px; margin: 0px 0px 0px 0px; } } .sd.business-3-text-3 { background: #ff005500; color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 36px; font-weight: 400; height: auto; line-height: 1.3; margin: 0px 0px 20px 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.business-3-text-3 { font-size: 28px; } } @media screen and (max-width: 321px) { .sd.business-3-text-3 { font-size: 24px; } } .sd.business-3-img { flex: none; height: auto; margin: 0px 0px 20px 0px; width: 428px; max-width: 100%; } .sd.business-3-text-4 { background: #ff005500; color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 20px; font-weight: 400; height: auto; line-height: 1.7; margin: 0px 0px 40px 0px; text-align: left; width: 100%; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.business-3-text-4 { font-size: 16px; } } @media screen and (max-width: 321px) { .sd.business-3-text-4 { font-size: 14px; } } .sd.business-3-item-creator-link-wrapper { align-content: center; align-items: center; background: #eeeeee00; flex-direction: row; flex-wrap: nowrap; gap: 5px; height: auto; justify-content: flex-start; padding: 0px; width: auto; z-index: 5; --gap-h-c9fd1193-c7e1-4ec2-8edc-20a2ac792a57: 5px; --gap-v-c9fd1193-c7e1-4ec2-8edc-20a2ac792a57: 0px; --gap-uuid: c9fd1193-c7e1-4ec2-8edc-20a2ac792a57; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-3-item-creator-link-wrapper { align-content: flex-start; align-items: flex-start; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; --gap-h-c9fd1193-c7e1-4ec2-8edc-20a2ac792a57: 0px; --gap-v-c9fd1193-c7e1-4ec2-8edc-20a2ac792a57: 5px; } } @media screen and (max-width: 540px) { .sd.business-3-item-creator-link-wrapper { align-content: flex-start; align-items: flex-start; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; --gap-h-c9fd1193-c7e1-4ec2-8edc-20a2ac792a57: 0px; --gap-v-c9fd1193-c7e1-4ec2-8edc-20a2ac792a57: 5px; } } @media screen and (max-width: 321px) { .sd.business-3-item-creator-link-wrapper { align-content: flex-start; align-items: flex-start; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; --gap-h-c9fd1193-c7e1-4ec2-8edc-20a2ac792a57: 0px; --gap-v-c9fd1193-c7e1-4ec2-8edc-20a2ac792a57: 5px; } } .sd.business-3-item-creator-link { align-content: center; align-items: center; background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1)); border-bottom: 2px solid #000000; border-left: 2px solid #000000; border-radius: 25px; border-right: 2px solid #000000; border-top: 2px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 5px; height: 50px; justify-content: center; margin: 0px 20px 0px 0px; padding: 0px 20px; width: auto; --gap-h-6fd75072-4d98-45fa-b83b-137363aee30f: 5px; --gap-v-6fd75072-4d98-45fa-b83b-137363aee30f: 0px; --gap-uuid: 6fd75072-4d98-45fa-b83b-137363aee30f; max-width: calc(100% - 20px); --g-color-0: #888888ff; --g-position-0: 0%; --g-color-1: #ffffffff; --g-position-1: 0%; --g-color-2: #ffffffff; --g-position-2: 0%; --g-color-3: #ffffffff; --g-position-3: 0%; --g-color-4: #ffffffff; --g-position-4: 0%; --g-color-5: #ffffffff; --g-position-5: 0%; --g-color-6: #ffffffff; --g-position-6: 0%; --g-color-7: #ffffffff; --g-position-7: 0%; --g-color-8: #ffffffff; --g-position-8: 0%; --g-color-9: #ffffffff; --g-position-9: 0%; --g-color-10: #ffffffff; --g-position-10: 0%; --g-color-11: #ffffffff; --g-position-11: 0%; --g-angle: 90deg; } .sd.business-3-item-creator-link:hover { background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1)); transition-duration: 1000ms; --gap-h-6fd75072-4d98-45fa-b83b-137363aee30f: 5px; --gap-v-6fd75072-4d98-45fa-b83b-137363aee30f: 0px; --g-color-0: #888888ff; --g-position-0: 100%; --g-color-1: #ffffff; --g-position-1: 100%; --g-color-2: #ffffff; --g-position-2: 100%; --g-color-3: #ffffff; --g-position-3: 100%; --g-color-4: #ffffff; --g-position-4: 100%; --g-color-5: #ffffff; --g-position-5: 100%; --g-color-6: #ffffff; --g-position-6: 100%; --g-color-7: #ffffff; --g-position-7: 100%; --g-color-8: #ffffff; --g-position-8: 100%; --g-color-9: #ffffff; --g-position-9: 100%; --g-color-10: #ffffff; --g-position-10: 100%; --g-color-11: #ffffff; --g-position-11: 100%; --g-angle: 90deg; } @media screen and (max-width: 540px) { .sd.business-3-item-creator-link { margin: 0px 0px 0px 0px; --gap-h-6fd75072-4d98-45fa-b83b-137363aee30f: 5px; --gap-v-6fd75072-4d98-45fa-b83b-137363aee30f: 0px; max-width: 100%; } } .sd.business-3-text-5 { color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.business-3-item-creator-link:hover .sd.business-3-text-5 { color: #ffffffff; transition-delay: 300ms; } .sd.business-3-icon { color: #222222; font-size: 24px; } .sd.business-3-item-creator-link:hover .sd.business-3-icon { color: #ffffffff; transition-delay: 300ms; } .sd.business-3-item-creator-image-wrapper { align-content: center; align-items: center; background: #ffb82900; flex: none; flex-direction: row; flex-wrap: nowrap; height: 1px; justify-content: center; margin: 0px 0px 0px 0px; width: 100%; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.business-3-item-creator-image-wrapper { padding: 0px 40px 0px 0px; } } @media screen and (max-width: 976px) { .sd.business-3-item-creator-image-wrapper { align-content: flex-end; align-items: flex-end; flex-direction: row; flex-wrap: nowrap; justify-content: center; margin: 300px 0px 0px 0px; padding: 0px 40px 0px 0px; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-3-item-creator-image-wrapper { align-content: center; align-items: center; flex-direction: row; flex-wrap: nowrap; justify-content: flex-end; margin: 50px 0px 0px 0px; padding: 0px 0px 0px 0px; width: 100%; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.business-3-item-creator-image-wrapper { margin: 100px 0px 0px 0px; width: 100%; max-width: 100%; } } .sd.business-3-item-creator-image-spacer { align-content: center; align-items: center; background: #c6ff0000; flex-direction: row; flex-wrap: nowrap; height: 1px; justify-content: center; margin: 0px 0px 0px 0px; padding: 0px 40px 60px 40px; width: 55%; max-width: 55%; } @media screen and (max-width: 976px) { .sd.business-3-item-creator-image-spacer { align-content: flex-end; align-items: flex-end; flex: none; justify-content: flex-start; width: 55%; } } @media screen and (max-width: 540px) { .sd.business-3-item-creator-image-spacer { margin: 0px 0px 0px 0px; padding: 0px 0px 80px 20px; } } .sd.business-3-item-creator-images { align-content: center; align-items: center; background: #eeeeee00; display: none; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 5px; height: auto; justify-content: flex-start; width: 100%; --gap-h-6110791c-4d76-4833-9911-a068f97e5363: 5px; --gap-v-6110791c-4d76-4833-9911-a068f97e5363: 0px; --gap-uuid: 6110791c-4d76-4833-9911-a068f97e5363; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-3-item-creator-images { display: none; --gap-h-6110791c-4d76-4833-9911-a068f97e5363: 5px; --gap-v-6110791c-4d76-4833-9911-a068f97e5363: 0px; } } @media screen and (max-width: 540px) { .sd.business-3-item-creator-images { display: none; --gap-h-6110791c-4d76-4833-9911-a068f97e5363: 5px; --gap-v-6110791c-4d76-4833-9911-a068f97e5363: 0px; } } .sd.business-3-item-creator-logos { align-content: center; align-items: center; background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1)); border-bottom: 2px solid #000000; border-left: 2px solid #000000; border-radius: 25px; border-right: 2px solid #000000; border-top: 2px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 5px; height: 50px; justify-content: center; margin: 0px 20px 0px 0px; padding: 0px 20px; width: auto; --gap-h-0215b513-8921-4cb2-b9c8-ed5cd103a926: 5px; --gap-v-0215b513-8921-4cb2-b9c8-ed5cd103a926: 0px; --gap-uuid: 0215b513-8921-4cb2-b9c8-ed5cd103a926; max-width: calc(100% - 20px); --g-color-0: #888888ff; --g-position-0: 0%; --g-color-1: #ffffffff; --g-position-1: 0%; --g-color-2: #ffffffff; --g-position-2: 0%; --g-color-3: #ffffffff; --g-position-3: 0%; --g-color-4: #ffffffff; --g-position-4: 0%; --g-color-5: #ffffffff; --g-position-5: 0%; --g-color-6: #ffffffff; --g-position-6: 0%; --g-color-7: #ffffffff; --g-position-7: 0%; --g-color-8: #ffffffff; --g-position-8: 0%; --g-color-9: #ffffffff; --g-position-9: 0%; --g-color-10: #ffffffff; --g-position-10: 0%; --g-color-11: #ffffffff; --g-position-11: 0%; --g-angle: 90deg; } .sd.business-3-item-creator-logos:hover { background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1)); transition-duration: 1000ms; --gap-h-0215b513-8921-4cb2-b9c8-ed5cd103a926: 5px; --gap-v-0215b513-8921-4cb2-b9c8-ed5cd103a926: 0px; --g-color-0: #888888ff; --g-position-0: 100%; --g-color-1: #ffffff; --g-position-1: 100%; --g-color-2: #ffffff; --g-position-2: 100%; --g-color-3: #ffffff; --g-position-3: 100%; --g-color-4: #ffffff; --g-position-4: 100%; --g-color-5: #ffffff; --g-position-5: 100%; --g-color-6: #ffffff; --g-position-6: 100%; --g-color-7: #ffffff; --g-position-7: 100%; --g-color-8: #ffffff; --g-position-8: 100%; --g-color-9: #ffffff; --g-position-9: 100%; --g-color-10: #ffffff; --g-position-10: 100%; --g-color-11: #ffffff; --g-position-11: 100%; --g-angle: 90deg; } @media screen and (max-width: 540px) { .sd.business-3-item-creator-logos { margin: 0px 0px 0px 0px; --gap-h-0215b513-8921-4cb2-b9c8-ed5cd103a926: 5px; --gap-v-0215b513-8921-4cb2-b9c8-ed5cd103a926: 0px; max-width: 100%; } } .sd.business-3-text-6 { color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.business-3-item-creator-logos:hover .sd.business-3-text-6 { color: #ffffffff; transition-delay: 300ms; } .sd.business-3-icon-2 { color: #222222; font-size: 24px; } .sd.business-3-item-creator-logos:hover .sd.business-3-icon-2 { color: #ffffffff; transition-delay: 300ms; } .sd.business-3-item-consulting { align-content: center; align-items: center; background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1)); border-bottom: 2px solid #000000; border-left: 2px solid #000000; border-radius: 8px; border-right: 2px solid #000000; border-top: 2px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 5px; height: 50px; justify-content: center; margin: 0px 0px 0px 0px; padding: 0px 20px; width: auto; --gap-h-c9181087-ecee-4f39-b472-fae78e76fa1c: 5px; --gap-v-c9181087-ecee-4f39-b472-fae78e76fa1c: 0px; --gap-uuid: c9181087-ecee-4f39-b472-fae78e76fa1c; max-width: 100%; --g-color-0: #888888ff; --g-position-0: 0%; --g-color-1: #ffffffff; --g-position-1: 0%; --g-color-2: #ffffffff; --g-position-2: 0%; --g-color-3: #ffffffff; --g-position-3: 0%; --g-color-4: #ffffffff; --g-position-4: 0%; --g-color-5: #ffffffff; --g-position-5: 0%; --g-color-6: #ffffffff; --g-position-6: 0%; --g-color-7: #ffffffff; --g-position-7: 0%; --g-color-8: #ffffffff; --g-position-8: 0%; --g-color-9: #ffffffff; --g-position-9: 0%; --g-color-10: #ffffffff; --g-position-10: 0%; --g-color-11: #ffffffff; --g-position-11: 0%; --g-angle: 90deg; } .sd.business-3-item-consulting:hover { background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1)); transition-duration: 1000ms; --gap-h-c9181087-ecee-4f39-b472-fae78e76fa1c: 5px; --gap-v-c9181087-ecee-4f39-b472-fae78e76fa1c: 0px; --g-color-0: #888888ff; --g-position-0: 100%; --g-color-1: #ffffff; --g-position-1: 100%; --g-color-2: #ffffff; --g-position-2: 100%; --g-color-3: #ffffff; --g-position-3: 100%; --g-color-4: #ffffff; --g-position-4: 100%; --g-color-5: #ffffff; --g-position-5: 100%; --g-color-6: #ffffff; --g-position-6: 100%; --g-color-7: #ffffff; --g-position-7: 100%; --g-color-8: #ffffff; --g-position-8: 100%; --g-color-9: #ffffff; --g-position-9: 100%; --g-color-10: #ffffff; --g-position-10: 100%; --g-color-11: #ffffff; --g-position-11: 100%; --g-angle: 90deg; } @media screen and (max-width: 540px) { .sd.business-3-item-consulting { margin: 0px 0px 0px 0px; --gap-h-c9181087-ecee-4f39-b472-fae78e76fa1c: 5px; --gap-v-c9181087-ecee-4f39-b472-fae78e76fa1c: 0px; } } .sd.business-3-text-7 { color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.business-3-item-consulting:hover .sd.business-3-text-7 { color: #ffffffff; transition-delay: 300ms; } .sd.business-3-icon-3 { color: #222222; font-size: 24px; } .sd.business-3-item-consulting:hover .sd.business-3-icon-3 { color: #ffffffff; transition-delay: 300ms; } .sd.business-3-item-consulting-inner { align-content: center; align-items: center; background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1)); border-bottom: 2px solid #000000; border-left: 2px solid #000000; border-radius: 8px; border-right: 2px solid #000000; border-top: 2px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 5px; height: 50px; justify-content: center; margin: 0px 0px 0px 0px; padding: 0px 20px; width: auto; --gap-h-b1455acf-c945-4c28-ac58-394d7259d4c7: 5px; --gap-v-b1455acf-c945-4c28-ac58-394d7259d4c7: 0px; --gap-uuid: b1455acf-c945-4c28-ac58-394d7259d4c7; max-width: 100%; --g-color-0: #888888ff; --g-position-0: 0%; --g-color-1: #ffffffff; --g-position-1: 0%; --g-color-2: #ffffffff; --g-position-2: 0%; --g-color-3: #ffffffff; --g-position-3: 0%; --g-color-4: #ffffffff; --g-position-4: 0%; --g-color-5: #ffffffff; --g-position-5: 0%; --g-color-6: #ffffffff; --g-position-6: 0%; --g-color-7: #ffffffff; --g-position-7: 0%; --g-color-8: #ffffffff; --g-position-8: 0%; --g-color-9: #ffffffff; --g-position-9: 0%; --g-color-10: #ffffffff; --g-position-10: 0%; --g-color-11: #ffffffff; --g-position-11: 0%; --g-angle: 90deg; } .sd.business-3-item-consulting-inner:hover { background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1)); transition-duration: 1000ms; --gap-h-b1455acf-c945-4c28-ac58-394d7259d4c7: 5px; --gap-v-b1455acf-c945-4c28-ac58-394d7259d4c7: 0px; --g-color-0: #888888ff; --g-position-0: 100%; --g-color-1: #ffffff; --g-position-1: 100%; --g-color-2: #ffffff; --g-position-2: 100%; --g-color-3: #ffffff; --g-position-3: 100%; --g-color-4: #ffffff; --g-position-4: 100%; --g-color-5: #ffffff; --g-position-5: 100%; --g-color-6: #ffffff; --g-position-6: 100%; --g-color-7: #ffffff; --g-position-7: 100%; --g-color-8: #ffffff; --g-position-8: 100%; --g-color-9: #ffffff; --g-position-9: 100%; --g-color-10: #ffffff; --g-position-10: 100%; --g-color-11: #ffffff; --g-position-11: 100%; --g-angle: 90deg; } @media screen and (max-width: 540px) { .sd.business-3-item-consulting-inner { margin: 0px 0px 0px 0px; --gap-h-b1455acf-c945-4c28-ac58-394d7259d4c7: 5px; --gap-v-b1455acf-c945-4c28-ac58-394d7259d4c7: 0px; } } .sd.business-3-text-8 { color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.business-3-item-consulting-inner:hover .sd.business-3-text-8 { color: #ffffffff; transition-delay: 300ms; } .sd.business-3-icon-4 { color: #222222; font-size: 24px; } .sd.business-3-item-consulting-inner:hover .sd.business-3-icon-4 { color: #ffffffff; transition-delay: 300ms; } .sd.business-3-item-consulting-title { align-content: center; align-items: center; background: #756cdf00; border-bottom: 4px solid #00000000; border-left: 4px solid #00000000; border-radius: 50px; border-right: 4px solid #00000000; border-top: 4px solid #00000000; flex-direction: column; flex-wrap: nowrap; gap: 20px 0px; height: auto; justify-content: center; margin: -300px 0px 0px 0px; padding: 0px 0px 0px 0px; transform: translate(0px, 0px); width: 500px; --gap-h-ae3ffd4e-4bd9-4f30-8501-5ef19a3bbe4f: 0px; --gap-v-ae3ffd4e-4bd9-4f30-8501-5ef19a3bbe4f: 20px; --gap-uuid: ae3ffd4e-4bd9-4f30-8501-5ef19a3bbe4f; max-width: 100%; } .sd.business-3-item-consulting-title.appear { opacity: 0; transition-delay: 600ms; --gap-h-ae3ffd4e-4bd9-4f30-8501-5ef19a3bbe4f: 0px; --gap-v-ae3ffd4e-4bd9-4f30-8501-5ef19a3bbe4f: 20px; } .sd.business-3-item-consulting-title.appear-active { transition-delay: 600ms; } @media screen and (max-width: 976px) { .sd.business-3-item-consulting-title { flex: none; height: 400px; margin: 0px 0px 0px 0px; transform: translate(0px, 0px); width: 400px; --gap-h-ae3ffd4e-4bd9-4f30-8501-5ef19a3bbe4f: 0px; --gap-v-ae3ffd4e-4bd9-4f30-8501-5ef19a3bbe4f: 20px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-3-item-consulting-title { border-radius: 30px; flex: none; height: 300px; margin: 0px 0px 0px 0px; padding: 0px 20px 0px 0px; width: 300px; --gap-h-ae3ffd4e-4bd9-4f30-8501-5ef19a3bbe4f: 0px; --gap-v-ae3ffd4e-4bd9-4f30-8501-5ef19a3bbe4f: 20px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.business-3-item-consulting-title { flex: none; margin: -80px 0px 0px 0px; padding: 0px 20px 0px 0px; width: 90%; --gap-h-ae3ffd4e-4bd9-4f30-8501-5ef19a3bbe4f: 0px; --gap-v-ae3ffd4e-4bd9-4f30-8501-5ef19a3bbe4f: 20px; max-width: 90%; } } .sd.business-3-img-2 { border-bottom: 3px solid #000000; border-left: 3px solid #000000; border-radius: 40px; border-right: 3px solid #000000; border-top: 3px solid #000000; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); height: 500px; width: 500px; max-width: 100%; } .sd.business-3-img-2.appear { transform: scale(0, 0); transition-delay: 300ms; transition-duration: 600ms; } .sd.business-3-img-2.appear-active { transition-delay: 300ms; transition-duration: 600ms; } .sd.business-3-img-2:hover { transform: scale(1.05, 1.05); } @media screen and (max-width: 1140px) { .sd.business-3-img-2 { height: 450px; width: 450px; max-width: 100%; } } .sd.business-3-item-consulting-image-wrapper { align-content: center; align-items: center; background: #eeeeee00; flex-direction: row; flex-wrap: nowrap; gap: 10px; height: auto; justify-content: center; padding: 0px 10px 0px 0px; width: auto; z-index: 5; --gap-h-c1a1e900-de83-4daf-b5e1-26d4398f885c: 10px; --gap-v-c1a1e900-de83-4daf-b5e1-26d4398f885c: 0px; --gap-uuid: c1a1e900-de83-4daf-b5e1-26d4398f885c; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-3-item-consulting-image-wrapper { align-content: flex-start; align-items: flex-start; flex-direction: row; flex-wrap: nowrap; gap: 20px; justify-content: center; width: auto; --gap-h-c1a1e900-de83-4daf-b5e1-26d4398f885c: 20px; --gap-v-c1a1e900-de83-4daf-b5e1-26d4398f885c: 0px; } } @media screen and (max-width: 540px) { .sd.business-3-item-consulting-image-wrapper { align-content: flex-start; align-items: flex-start; flex-direction: row; flex-wrap: nowrap; gap: 10px; justify-content: flex-start; --gap-h-c1a1e900-de83-4daf-b5e1-26d4398f885c: 10px; --gap-v-c1a1e900-de83-4daf-b5e1-26d4398f885c: 0px; } } @media screen and (max-width: 321px) { .sd.business-3-item-consulting-image-wrapper { align-content: flex-start; align-items: flex-start; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; --gap-h-c1a1e900-de83-4daf-b5e1-26d4398f885c: 10px; --gap-v-c1a1e900-de83-4daf-b5e1-26d4398f885c: 0px; } } .sd.business-3-img-3 { flex: none; height: 50px; width: 140px; max-width: 100%; } @media screen and (max-width: 540px) { .sd.business-3-img-3 { height: 50px; width: 120px; max-width: 100%; } } .sd.business-3-img-4 { flex: none; height: 50px; width: 160px; max-width: 100%; } @media screen and (max-width: 540px) { .sd.business-3-img-4 { height: 50px; width: 140px; max-width: 100%; } } .sd.business-3-item-consulting-image-spacer { align-content: flex-end; align-items: flex-end; background: #f2f2f200; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 40px 0px 0px 0px; padding: 0px; width: calc(100% - (var(--gap-h-f00f58a9-e045-4b74-a6a5-d4253a99ea69) * 0)); max-width: calc(100% - (var(--gap-h-f00f58a9-e045-4b74-a6a5-d4253a99ea69) * 0)); } @media screen and (max-width: 976px) { .sd.business-3-item-consulting-image-spacer { margin: 0px 0px 0px 0px; width: calc(100% - (var(--gap-h-f00f58a9-e045-4b74-a6a5-d4253a99ea69) * 0)); max-width: calc(100% - (var(--gap-h-f00f58a9-e045-4b74-a6a5-d4253a99ea69) * 0)); } } @media screen and (max-width: 540px) { .sd.business-3-item-consulting-image-spacer { margin: 300px 0px 0px 0px; width: calc(100% - (var(--gap-h-f00f58a9-e045-4b74-a6a5-d4253a99ea69) * 0)); max-width: calc(100% - (var(--gap-h-f00f58a9-e045-4b74-a6a5-d4253a99ea69) * 0)); } } @media screen and (max-width: 321px) { .sd.business-3-item-consulting-image-spacer { margin: 200px 0px 0px 0px; width: calc(100% - (var(--gap-h-f00f58a9-e045-4b74-a6a5-d4253a99ea69) * 0)); max-width: calc(100% - (var(--gap-h-f00f58a9-e045-4b74-a6a5-d4253a99ea69) * 0)); } } .sd.business-3-item-consulting-images { align-content: flex-start; align-items: flex-start; background: #4edca1ff; border-radius: 50px 0px 0px 50px; box-shadow: 20px 20px 0px #888888ff; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0px 0px 0px -300px; padding: 80px 0px 80px 300px; width: calc(50% - -300px); max-width: calc(50% - -300px); } @media screen and (max-width: 976px) { .sd.business-3-item-consulting-images { flex: none; margin: 0px 0px 0px 120px; padding: 80px 0px 240px 0px; width: calc(100% - 120px); max-width: calc(100% - 120px); } } @media screen and (max-width: 540px) { .sd.business-3-item-consulting-images { border-radius: 30px 0px 0px 30px; margin: 0px 0px 0px 40px; padding: 80px 0px 120px 0px; width: calc(100% - 40px); max-width: calc(100% - 40px); } } .sd.business-3-item-consulting-image-1 { align-content: center; align-items: center; background: #b4ffb000; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; padding: 0px 40px; width: 640px; max-width: 100%; } .sd.business-3-item-consulting-image-1.appear { opacity: 0; transform: translate(0px, 20px); transition-delay: 300ms; transition-duration: 600ms; } .sd.business-3-item-consulting-image-1.appear-active { transition-delay: 300ms; transition-duration: 600ms; } @media screen and (max-width: 976px) { .sd.business-3-item-consulting-image-1 { flex: none; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-3-item-consulting-image-1 { padding: 0px 20px; } } .sd.business-3-text-9 { background: #ff005500; color: #ffffffff; flex: none; font-family: var(--s-font-ff98f853); font-size: 36px; font-weight: 400; height: auto; letter-spacing: 0.01em; line-height: 1.3; margin: 0px 0px 40px 0px; text-align: left; width: 100%; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.business-3-text-9 { font-size: 28px; } } .sd.business-3-text-10 { background: #ff005500; color: #ffffffff; flex: none; font-family: var(--s-font-ff98f853); font-size: 20px; font-weight: 400; height: auto; line-height: 1.7; text-align: left; width: 100%; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 1140px) { .sd.business-3-text-10 { line-height: 1.4; } } @media screen and (max-width: 540px) { .sd.business-3-text-10 { font-size: 16px; } } @media screen and (max-width: 321px) { .sd.business-3-text-10 { font-size: 14px; } } .sd.business-3-item-consulting-image-2 { align-content: center; align-items: center; background: #ffb82900; flex: none; flex-direction: row-reverse; flex-wrap: nowrap; height: auto; justify-content: flex-start; margin: -200px 0px 0px 0px; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-3-item-consulting-image-2 { align-content: center; align-items: center; justify-content: flex-end; margin: -100px 0px 0px 40px; padding: 0px 0px; width: calc(100% - 40px); max-width: calc(100% - 40px); } } @media screen and (max-width: 540px) { .sd.business-3-item-consulting-image-2 { align-content: flex-end; align-items: flex-end; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; padding: 0px 0px 0px 0px; } } @media screen and (max-width: 321px) { .sd.business-3-item-consulting-image-2 { align-content: center; align-items: center; flex-direction: row-reverse; flex-wrap: nowrap; justify-content: flex-end; margin: 0px 0px 0px 0px; width: 100%; max-width: 100%; } } .sd.business-3-item-consulting-image-spacer-2 { align-content: flex-end; align-items: flex-end; background: #c6ff0000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 100%; justify-content: flex-end; padding: 0px 40px 80px 0px; width: 50%; max-width: 50%; } @media screen and (max-width: 976px) { .sd.business-3-item-consulting-image-spacer-2 { height: 1px; width: 50%; max-width: 50%; } } @media screen and (max-width: 540px) { .sd.business-3-item-consulting-image-spacer-2 { margin: 120px 0px 0px 0px; padding: 0px 20px 80px 0px; width: 50%; max-width: 50%; } } .sd.business-3-item-consulting-images-2 { align-content: center; align-items: center; background: #60a2a600; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0px 0px 0px 40px; width: calc(50% - 40px); max-width: calc(50% - 40px); } @media screen and (max-width: 976px) { .sd.business-3-item-consulting-images-2 { margin: 0px 0px 0px 0px; width: 400px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-3-item-consulting-images-2 { flex: none; margin: 0px 0px 0px 0px; width: 100%; max-width: 100%; } } .sd.business-3-item-consulting-image-3 { align-content: flex-start; align-items: flex-start; background: #756cdf00; border-bottom: 4px solid #00000000; border-left: 4px solid #00000000; border-radius: 50px; border-right: 4px solid #00000000; border-top: 4px solid #00000000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 250px; justify-content: center; margin: -80px 0px 0px 0px; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-3-item-consulting-image-3 { flex: none; height: 292px; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-3-item-consulting-image-3 { border-radius: 30px; flex: none; height: auto; width: 100%; max-width: 100%; } } .sd.business-3-img-5 { border-bottom: 3px solid #000000; border-left: 3px solid #000000; border-radius: 40px; border-right: 3px solid #000000; border-top: 3px solid #000000; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); flex: none; height: auto; width: 477px; max-width: 100%; } .sd.business-3-img-5.appear { transform: scale(0, 0); transition-delay: 300ms; transition-duration: 600ms; } .sd.business-3-img-5.appear-active { transition-delay: 300ms; transition-duration: 600ms; } .sd.business-3-img-5:hover { transform: scale(1.05, 1.05); } @media screen and (max-width: 976px) { .sd.business-3-img-5 { width: 477px; } } @media screen and (max-width: 540px) { .sd.business-3-img-5 { height: auto; width: 400px; max-width: 100%; } } .sd.business-3-item-consulting-image-4 { align-content: flex-end; align-items: flex-end; background: #756cdf00; border-bottom: 4px solid #00000000; border-left: 4px solid #00000000; border-radius: 50px; border-right: 4px solid #00000000; border-top: 4px solid #00000000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 292px; justify-content: center; margin: 0px 0px 0px 0px; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-3-item-consulting-image-4 { margin: -40px 0px 0px 0px; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-3-item-consulting-image-4 { border-radius: 30px; flex: none; height: auto; margin: -50px 0px 0px 0px; width: 100%; max-width: 100%; } } .sd.business-3-img-6 { border-bottom: 3px solid #000000; border-left: 3px solid #000000; border-radius: 40px; border-right: 3px solid #000000; border-top: 3px solid #000000; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); flex: none; height: auto; width: 477px; max-width: 100%; } .sd.business-3-img-6.appear { transform: scale(0, 0); transition-delay: 300ms; transition-duration: 600ms; } .sd.business-3-img-6.appear-active { transition-delay: 300ms; transition-duration: 600ms; } .sd.business-3-img-6:hover { transform: scale(1.05, 1.05); } @media screen and (max-width: 540px) { .sd.business-3-img-6 { width: 400px; max-width: 100%; } } .sd.business-4 { align-content: center; align-items: center; background: #ffffffff; display: none; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0px 0px 0px 0px; padding: 80px 0px; width: 100%; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.business-4 { display: none; } } @media screen and (max-width: 976px) { .sd.business-4 { display: flex; flex: none; height: auto; } } @media screen and (max-width: 540px) { .sd.business-4 { align-content: center; align-items: center; display: none; justify-content: center; padding: 40px 0px; } } @media screen and (max-width: 321px) { .sd.business-4 { display: none; } } .sd.business-4-inner { padding: 80px 0px; width: 100%; height: auto; flex-direction: column; flex-wrap: nowrap; align-content: center; align-items: center; justify-content: center; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.business-4-inner { flex-direction: column; } } @media screen and (max-width: 976px) { .sd.business-4-inner { height: auto; flex-direction: column; } } @media screen and (max-width: 540px) { .sd.business-4-inner { padding: 40px 0px; flex-direction: column; align-content: center; align-items: center; justify-content: center; } } @media screen and (max-width: 321px) { .sd.business-4-inner { flex-direction: column; } } .sd.business-4-header { align-content: flex-start; align-items: flex-start; background: #ffa51200; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0px 0px 20px 0px; padding: 0px 40px; width: 1280px; max-width: 100%; } @media screen and (max-width: 540px) { .sd.business-4-header { padding: 0px 20px; } } .sd.business-4-text { background: rgba(100, 255, 148, 0); color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 24px; font-weight: 400; height: auto; line-height: 1; margin: 0px 0px 0px 10px; text-align: left; width: auto; max-width: calc(100% - 10px); justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.business-4-text { font-size: 20px; } } @media screen and (max-width: 321px) { .sd.business-4-text { font-size: 14px; margin: 0px 0px 0px 5px; max-width: calc(100% - 5px); } } .sd.business-4-Business { background: rgba(197, 255, 229, 0); color: #4edca1ff; font-family: var(--s-font-8986a4d9); font-size: 144px; font-weight: 600; height: auto; letter-spacing: -0.07em; line-height: 1; margin: 0px 0px -22px 0px; padding: 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 976px) { .sd.business-4-Business { font-size: 90px; margin: 0px 0px -14px 0px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-4-Business { font-size: 55px; margin: 0px 0px -10px 0px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.business-4-Business { font-size: 50px; } } .sd.business-4-content { align-content: center; align-items: center; background: #e3fef300; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 200px; height: auto; justify-content: center; width: 100%; --gap-h-1e38c86b-a6d2-441c-b100-6508d8096220: 0px; --gap-v-1e38c86b-a6d2-441c-b100-6508d8096220: 200px; --gap-uuid: 1e38c86b-a6d2-441c-b100-6508d8096220; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-4-content { flex: none; gap: 80px; height: auto; --gap-h-1e38c86b-a6d2-441c-b100-6508d8096220: 0px; --gap-v-1e38c86b-a6d2-441c-b100-6508d8096220: 80px; } } @media screen and (max-width: 540px) { .sd.business-4-content { flex: none; gap: 40px; height: auto; --gap-h-1e38c86b-a6d2-441c-b100-6508d8096220: 0px; --gap-v-1e38c86b-a6d2-441c-b100-6508d8096220: 40px; } } .sd.business-4-list { align-content: flex-start; align-items: flex-start; background: #b7a58b00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; padding: 0px; width: calc(100% - (var(--gap-h-1e38c86b-a6d2-441c-b100-6508d8096220) * 0)); max-width: calc(100% - (var(--gap-h-1e38c86b-a6d2-441c-b100-6508d8096220) * 0)); } @media screen and (max-width: 1140px) { .sd.business-4-list { margin: 50px 0px 0px 0px; width: calc(100% - (var(--gap-h-1e38c86b-a6d2-441c-b100-6508d8096220) * 0)); max-width: calc(100% - (var(--gap-h-1e38c86b-a6d2-441c-b100-6508d8096220) * 0)); } } @media screen and (max-width: 976px) { .sd.business-4-list { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; width: calc(100% - (var(--gap-h-1e38c86b-a6d2-441c-b100-6508d8096220) * 0)); max-width: calc(100% - (var(--gap-h-1e38c86b-a6d2-441c-b100-6508d8096220) * 0)); } } @media screen and (max-width: 540px) { .sd.business-4-list { flex: none; height: auto; } } .sd.business-4-item-creator { align-content: flex-end; align-items: flex-end; background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1), var(--g-color-2) var(--g-position-2), var(--g-color-3) var(--g-position-3), var(--g-color-4) var(--g-position-4), var(--g-color-5) var(--g-position-5)); border-radius: 0px 50px 50px 0px; box-shadow: 0px 20px 0px #4edca1ff; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0px -300px 0px 0px; padding: 60px 300px 80px 0px; width: calc(50% - -300px); max-width: calc(50% - -300px); --g-color-0: #e3fef3ff; --g-position-0: 0%; --g-color-1: #e3fef3ff; --g-position-1: 26%; --g-color-2: rgb(255, 255, 255); --g-position-2: 27%; --g-color-3: rgb(255, 255, 255); --g-position-3: 75%; --g-color-4: #e3fef3ff; --g-position-4: 76%; --g-color-5: #e3fef3ff; --g-position-5: 100%; --g-color-6: #e3fef3ff; --g-position-6: 100%; --g-color-7: #e3fef3ff; --g-position-7: 100%; --g-color-8: #e3fef3ff; --g-position-8: 100%; --g-color-9: #e3fef3ff; --g-position-9: 100%; --g-color-10: #e3fef3ff; --g-position-10: 100%; --g-color-11: #e3fef3ff; --g-position-11: 100%; --g-angle: 35deg; } @media screen and (max-width: 976px) { .sd.business-4-item-creator { box-shadow: -1px 20px 0px #4edca1ff; flex: none; height: auto; margin: 0px 120px 0px 0px; padding: 80px 0px 240px 0px; width: calc(100% - 120px); max-width: calc(100% - 120px); } } @media screen and (max-width: 540px) { .sd.business-4-item-creator { border-radius: 0px 30px 30px 0px; margin: 0px 40px 0px 0px; padding: 80px 0px 100px 0px; width: calc(100% - 40px); max-width: calc(100% - 40px); } } @media screen and (max-width: 321px) { .sd.business-4-item-creator { padding: 80px 0px 80px 0px; } } .sd.business-4-item-creator-inner { align-content: flex-start; align-items: flex-start; background: #b4ffb000; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: flex-end; padding: 0px 0px 0px 40px; width: 640px; max-width: 100%; } .sd.business-4-item-creator-inner.appear { opacity: 0; transform: translate(0px, 20px); transition-delay: 300ms; transition-duration: 600ms; } .sd.business-4-item-creator-inner.appear-active { transition-delay: 300ms; transition-duration: 600ms; } @media screen and (max-width: 976px) { .sd.business-4-item-creator-inner { flex: none; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-4-item-creator-inner { padding: 0px 20px; } } .sd.business-4-item-creator-title { align-content: flex-start; align-items: flex-start; background: #eeeeee00; flex: none; flex-direction: row; flex-wrap: nowrap; height: auto; justify-content: flex-start; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-4-item-creator-title { flex-direction: row; flex-wrap: wrap; } } @media screen and (max-width: 540px) { .sd.business-4-item-creator-title { flex-direction: column; flex-wrap: nowrap; } } @media screen and (max-width: 321px) { .sd.business-4-item-creator-title { flex-direction: column; flex-wrap: nowrap; } } .sd.business-4-text-2 { background: #ff005500; color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 36px; font-weight: 400; height: auto; line-height: 1.3; margin: 0px 0px 20px 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 976px) { .sd.business-4-text-2 { margin: 0px 0px 0px 0px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-4-text-2 { font-size: 28px; margin: 0px 0px 0px 0px; } } @media screen and (max-width: 321px) { .sd.business-4-text-2 { font-size: 24px; margin: 0px 0px 0px 0px; } } .sd.business-4-text-3 { background: #ff005500; color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 36px; font-weight: 400; height: auto; line-height: 1.3; margin: 0px 0px 20px 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.business-4-text-3 { font-size: 28px; } } @media screen and (max-width: 321px) { .sd.business-4-text-3 { font-size: 24px; } } .sd.business-4-img { flex: none; height: auto; margin: 0px 0px 20px 0px; width: 428px; max-width: 100%; } .sd.business-4-text-4 { background: #ff005500; color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 20px; font-weight: 400; height: auto; line-height: 1.7; margin: 0px 0px 40px 0px; text-align: left; width: 100%; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 976px) { .sd.business-4-text-4 { margin: 0px 80px 40px 0px; width: calc(100% - 80px); max-width: calc(100% - 80px); } } @media screen and (max-width: 540px) { .sd.business-4-text-4 { font-size: 14px; margin: 0px 0px 40px 0px; width: 100%; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.business-4-text-4 { font-size: 14px; } } .sd.business-4-item-creator-link-wrapper { align-content: center; align-items: center; background: #eeeeee00; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 5px; height: auto; justify-content: flex-start; padding: 0px; width: 100%; z-index: 5; --gap-h-9f7de2af-8f78-41e2-9afd-338e3e6bdabf: 5px; --gap-v-9f7de2af-8f78-41e2-9afd-338e3e6bdabf: 0px; --gap-uuid: 9f7de2af-8f78-41e2-9afd-338e3e6bdabf; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-4-item-creator-link-wrapper { align-content: flex-start; align-items: flex-start; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; --gap-h-9f7de2af-8f78-41e2-9afd-338e3e6bdabf: 5px; --gap-v-9f7de2af-8f78-41e2-9afd-338e3e6bdabf: 0px; } } @media screen and (max-width: 540px) { .sd.business-4-item-creator-link-wrapper { align-content: flex-start; align-items: flex-start; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; --gap-h-9f7de2af-8f78-41e2-9afd-338e3e6bdabf: 0px; --gap-v-9f7de2af-8f78-41e2-9afd-338e3e6bdabf: 5px; } } @media screen and (max-width: 321px) { .sd.business-4-item-creator-link-wrapper { align-content: flex-start; align-items: flex-start; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; --gap-h-9f7de2af-8f78-41e2-9afd-338e3e6bdabf: 0px; --gap-v-9f7de2af-8f78-41e2-9afd-338e3e6bdabf: 5px; } } .sd.business-4-item-creator-link { align-content: center; align-items: center; background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1)); border-bottom: 2px solid #000000; border-left: 2px solid #000000; border-radius: 25px; border-right: 2px solid #000000; border-top: 2px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 5px; height: 50px; justify-content: center; margin: 0px 20px 0px 0px; padding: 0px 20px; width: auto; --gap-h-b7d8941e-e8c7-4005-a247-1a802a04cc73: 5px; --gap-v-b7d8941e-e8c7-4005-a247-1a802a04cc73: 0px; --gap-uuid: b7d8941e-e8c7-4005-a247-1a802a04cc73; max-width: calc(100% - 20px); --g-color-0: #888888ff; --g-position-0: 0%; --g-color-1: #ffffffff; --g-position-1: 0%; --g-color-2: #ffffffff; --g-position-2: 0%; --g-color-3: #ffffffff; --g-position-3: 0%; --g-color-4: #ffffffff; --g-position-4: 0%; --g-color-5: #ffffffff; --g-position-5: 0%; --g-color-6: #ffffffff; --g-position-6: 0%; --g-color-7: #ffffffff; --g-position-7: 0%; --g-color-8: #ffffffff; --g-position-8: 0%; --g-color-9: #ffffffff; --g-position-9: 0%; --g-color-10: #ffffffff; --g-position-10: 0%; --g-color-11: #ffffffff; --g-position-11: 0%; --g-angle: 90deg; } .sd.business-4-item-creator-link:hover { background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1)); transition-duration: 1000ms; --gap-h-b7d8941e-e8c7-4005-a247-1a802a04cc73: 5px; --gap-v-b7d8941e-e8c7-4005-a247-1a802a04cc73: 0px; --g-color-0: #888888ff; --g-position-0: 100%; --g-color-1: #ffffff; --g-position-1: 100%; --g-color-2: #ffffff; --g-position-2: 100%; --g-color-3: #ffffff; --g-position-3: 100%; --g-color-4: #ffffff; --g-position-4: 100%; --g-color-5: #ffffff; --g-position-5: 100%; --g-color-6: #ffffff; --g-position-6: 100%; --g-color-7: #ffffff; --g-position-7: 100%; --g-color-8: #ffffff; --g-position-8: 100%; --g-color-9: #ffffff; --g-position-9: 100%; --g-color-10: #ffffff; --g-position-10: 100%; --g-color-11: #ffffff; --g-position-11: 100%; --g-angle: 90deg; } @media screen and (max-width: 540px) { .sd.business-4-item-creator-link { margin: 0px 0px 0px 0px; --gap-h-b7d8941e-e8c7-4005-a247-1a802a04cc73: 5px; --gap-v-b7d8941e-e8c7-4005-a247-1a802a04cc73: 0px; max-width: 100%; } } .sd.business-4-text-5 { color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.business-4-item-creator-link:hover .sd.business-4-text-5 { color: #ffffffff; transition-delay: 300ms; } .sd.business-4-icon { color: #222222; font-size: 24px; } .sd.business-4-item-creator-link:hover .sd.business-4-icon { color: #ffffffff; transition-delay: 300ms; } .sd.business-4-item-creator-image-wrapper { align-content: center; align-items: center; background: #ffb82900; flex: none; flex-direction: row; flex-wrap: nowrap; height: 1px; justify-content: center; margin: 0px 0px 0px 0px; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-4-item-creator-image-wrapper { align-content: center; align-items: center; flex-direction: row; flex-wrap: nowrap; height: auto; justify-content: flex-end; margin: -250px 0px 0px 0px; padding: 0px 40px 0px 0px; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-4-item-creator-image-wrapper { align-content: center; align-items: center; flex-direction: row; flex-wrap: nowrap; justify-content: flex-end; margin: 40px 0px 0px 0px; padding: 0px 20px 0px 0px; width: 100%; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.business-4-item-creator-image-wrapper { margin: 30px 0px 0px 0px; padding: 0px 10px 0px 0px; width: 100%; max-width: 100%; } } .sd.business-4-item-creator-image-spacer { align-content: center; align-items: center; background: #c6ff0000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 1px; justify-content: flex-end; margin: 0px 0px 0px 0px; padding: 0px 40px 60px 40px; width: 55%; max-width: 55%; } @media screen and (max-width: 976px) { .sd.business-4-item-creator-image-spacer { align-content: flex-end; align-items: flex-end; justify-content: flex-start; padding: 0px 0px 0px 0px; width: 50%; max-width: 50%; } } @media screen and (max-width: 540px) { .sd.business-4-item-creator-image-spacer { margin: 0px 0px 0px 0px; padding: 0px 0px 80px 20px; } } .sd.business-4-item-creator-images { align-content: flex-end; align-items: flex-end; background: #756cdf00; border-bottom: 4px solid #00000000; border-left: 4px solid #00000000; border-radius: 50px; border-right: 4px solid #00000000; border-top: 4px solid #00000000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 500px; justify-content: center; margin: -300px 0px 0px 0px; padding: 0px; transform: translate(0px, 0px); width: 500px; --gap-uuid: 8a0a897e-8516-412b-8882-74031229d3b2; --gap-h-8a0a897e-8516-412b-8882-74031229d3b2: 0px; --gap-v-8a0a897e-8516-412b-8882-74031229d3b2: 0px; max-width: 100%; } .sd.business-4-item-creator-images.appear { opacity: 0; transition-delay: 600ms; } .sd.business-4-item-creator-images.appear-active { transition-delay: 600ms; } @media screen and (max-width: 976px) { .sd.business-4-item-creator-images { align-content: center; align-items: center; gap: 20px 0px; height: auto; justify-content: center; margin: 0px 0px 0px 0px; transform: translate(0px, 0px); width: 400px; --gap-h-8a0a897e-8516-412b-8882-74031229d3b2: 0px; --gap-v-8a0a897e-8516-412b-8882-74031229d3b2: 20px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-4-item-creator-images { align-content: center; align-items: center; border-radius: 30px; gap: 10px 0px; height: auto; justify-content: center; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; width: auto; --gap-h-8a0a897e-8516-412b-8882-74031229d3b2: 0px; --gap-v-8a0a897e-8516-412b-8882-74031229d3b2: 10px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.business-4-item-creator-images { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; width: 300px; max-width: 100%; } } .sd.business-4-img-2 { border-bottom: 3px solid #000000; border-left: 3px solid #000000; border-radius: 40px; border-right: 3px solid #000000; border-top: 3px solid #000000; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); flex: none; height: auto; width: calc(100% - (var(--gap-h-8a0a897e-8516-412b-8882-74031229d3b2) * 0)); max-width: calc(100% - (var(--gap-h-8a0a897e-8516-412b-8882-74031229d3b2) * 0)); } .sd.business-4-img-2.appear { transform: scale(0, 0); transition-delay: 300ms; transition-duration: 600ms; } .sd.business-4-img-2.appear-active { transition-delay: 300ms; transition-duration: 600ms; } .sd.business-4-img-2:hover { transform: scale(1.05, 1.05); } @media screen and (max-width: 976px) { .sd.business-4-img-2 { height: 400px; width: 400px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-4-img-2 { height: 320px; width: 320px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.business-4-img-2 { border-radius: 30px 30px 30px 30px; height: 300px; width: 300px; max-width: 100%; } } .sd.business-4-item-creator-logos { align-content: center; align-items: center; background: #eeeeee00; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 5px; height: auto; justify-content: flex-start; padding: 0px; width: calc(100% - (var(--gap-h-8a0a897e-8516-412b-8882-74031229d3b2) * 0)); z-index: 5; --gap-h-7769eacb-5dba-471b-a8de-fc3f52d96ac5: 5px; --gap-v-7769eacb-5dba-471b-a8de-fc3f52d96ac5: 0px; --gap-uuid: 7769eacb-5dba-471b-a8de-fc3f52d96ac5; max-width: calc(100% - (var(--gap-h-8a0a897e-8516-412b-8882-74031229d3b2) * 0)); } @media screen and (max-width: 976px) { .sd.business-4-item-creator-logos { align-content: flex-start; align-items: flex-start; flex-direction: row; flex-wrap: nowrap; gap: 20px; justify-content: center; padding: 0px 10px 0px 0px; width: auto; --gap-h-7769eacb-5dba-471b-a8de-fc3f52d96ac5: 20px; --gap-v-7769eacb-5dba-471b-a8de-fc3f52d96ac5: 0px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-4-item-creator-logos { align-content: flex-start; align-items: flex-start; flex-direction: row; flex-wrap: nowrap; gap: 10px; justify-content: center; padding: 0px 10px 0px 0px; --gap-h-7769eacb-5dba-471b-a8de-fc3f52d96ac5: 10px; --gap-v-7769eacb-5dba-471b-a8de-fc3f52d96ac5: 0px; } } @media screen and (max-width: 321px) { .sd.business-4-item-creator-logos { align-content: flex-start; align-items: flex-start; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; --gap-h-7769eacb-5dba-471b-a8de-fc3f52d96ac5: 5px; --gap-v-7769eacb-5dba-471b-a8de-fc3f52d96ac5: 0px; } } .sd.business-4-img-3 { flex: none; height: 50px; width: 140px; max-width: 100%; } @media screen and (max-width: 540px) { .sd.business-4-img-3 { height: 50px; width: 120px; max-width: 100%; } } .sd.business-4-img-4 { flex: none; height: 50px; width: 160px; max-width: 100%; } @media screen and (max-width: 540px) { .sd.business-4-img-4 { height: 50px; width: 140px; max-width: 100%; } } .sd.business-4-item-consulting { align-content: flex-end; align-items: flex-end; background: #f2f2f200; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 40px 0px 0px 0px; padding: 0px; width: calc(100% - (var(--gap-h-1e38c86b-a6d2-441c-b100-6508d8096220) * 0)); max-width: calc(100% - (var(--gap-h-1e38c86b-a6d2-441c-b100-6508d8096220) * 0)); } @media screen and (max-width: 976px) { .sd.business-4-item-consulting { margin: 0px 0px 0px 0px; width: calc(100% - (var(--gap-h-1e38c86b-a6d2-441c-b100-6508d8096220) * 0)); max-width: calc(100% - (var(--gap-h-1e38c86b-a6d2-441c-b100-6508d8096220) * 0)); } } @media screen and (max-width: 540px) { .sd.business-4-item-consulting { margin: 0px 0px 0px 0px; } } @media screen and (max-width: 321px) { .sd.business-4-item-consulting { margin: 0px 0px 0px 0px; } } .sd.business-4-item-consulting-inner { align-content: flex-start; align-items: flex-start; background: #4edca1ff; border-radius: 50px 0px 0px 50px; box-shadow: 20px 20px 0px #888888ff; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0px 0px 0px -300px; padding: 80px 0px 80px 300px; width: calc(50% - -300px); max-width: calc(50% - -300px); } @media screen and (max-width: 976px) { .sd.business-4-item-consulting-inner { flex: none; margin: 0px 0px 0px 120px; padding: 80px 0px 240px 0px; width: calc(100% - 120px); max-width: calc(100% - 120px); } } @media screen and (max-width: 540px) { .sd.business-4-item-consulting-inner { border-radius: 30px 0px 0px 30px; margin: 0px 0px 0px 40px; padding: 80px 0px 120px 0px; width: calc(100% - 40px); max-width: calc(100% - 40px); } } .sd.business-4-item-consulting-title { align-content: center; align-items: center; background: #b4ffb000; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; padding: 0px 40px; width: 640px; max-width: 100%; } .sd.business-4-item-consulting-title.appear { opacity: 0; transform: translate(0px, 20px); transition-delay: 300ms; transition-duration: 600ms; } .sd.business-4-item-consulting-title.appear-active { transition-delay: 300ms; transition-duration: 600ms; } @media screen and (max-width: 976px) { .sd.business-4-item-consulting-title { flex: none; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-4-item-consulting-title { padding: 0px 20px; } } .sd.business-4-text-6 { background: #ff005500; color: #ffffffff; flex: none; font-family: var(--s-font-ff98f853); font-size: 36px; font-weight: 400; height: auto; letter-spacing: 0.01em; line-height: 1.3; margin: 0px 0px 40px 0px; text-align: left; width: 100%; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 976px) { .sd.business-4-text-6 { margin: 0px 0px 40px 40px; width: calc(100% - 40px); max-width: calc(100% - 40px); } } @media screen and (max-width: 540px) { .sd.business-4-text-6 { font-size: 28px; } } @media screen and (max-width: 321px) { .sd.business-4-text-6 { font-size: 26px; margin: 0px 0px 40px 0px; width: 100%; max-width: 100%; } } .sd.business-4-text-7 { background: #ff005500; color: #ffffffff; flex: none; font-family: var(--s-font-ff98f853); font-size: 20px; font-weight: 400; height: auto; line-height: 1.7; text-align: left; width: 100%; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 1140px) { .sd.business-4-text-7 { line-height: 1.4; } } @media screen and (max-width: 976px) { .sd.business-4-text-7 { margin: 0px 0px 0px 40px; width: calc(100% - 40px); max-width: calc(100% - 40px); } } @media screen and (max-width: 540px) { .sd.business-4-text-7 { font-size: 14px; } } @media screen and (max-width: 321px) { .sd.business-4-text-7 { font-size: 14px; margin: 0px 0px 0px 0px; width: 100%; max-width: 100%; } } .sd.business-4-item-consulting-image-wrapper { align-content: center; align-items: center; background: #ffb82900; flex: none; flex-direction: row-reverse; flex-wrap: nowrap; height: auto; justify-content: flex-start; margin: -200px 0px 0px 0px; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-4-item-consulting-image-wrapper { align-content: center; align-items: center; justify-content: flex-end; margin: -100px 0px 0px 0px; padding: 0px 0px 0px 40px; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-4-item-consulting-image-wrapper { align-content: flex-end; align-items: flex-end; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; padding: 0px 0px 0px 0px; } } @media screen and (max-width: 321px) { .sd.business-4-item-consulting-image-wrapper { align-content: center; align-items: center; flex-direction: row-reverse; flex-wrap: nowrap; justify-content: flex-end; margin: -100px 0px 0px 0px; } } .sd.business-4-item-consulting-image-spacer { align-content: flex-end; align-items: flex-end; background: #c6ff0000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 100%; justify-content: flex-end; padding: 0px 40px 80px 0px; width: 50%; max-width: 50%; } @media screen and (max-width: 976px) { .sd.business-4-item-consulting-image-spacer { height: 1px; width: 50%; max-width: 50%; } } @media screen and (max-width: 540px) { .sd.business-4-item-consulting-image-spacer { margin: 0px 0px 0px 0px; padding: 0px 20px 80px 0px; width: 50%; max-width: 50%; } } .sd.business-4-item-consulting-images { align-content: center; align-items: center; background: #60a2a600; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0px 0px 0px 40px; width: calc(50% - 40px); max-width: calc(50% - 40px); } @media screen and (max-width: 976px) { .sd.business-4-item-consulting-images { margin: 0px 0px 0px 0px; width: 60%; max-width: 60%; } } @media screen and (max-width: 540px) { .sd.business-4-item-consulting-images { flex: none; margin: 0px 0px 0px 0px; width: 100%; max-width: 100%; } } .sd.business-4-item-consulting-image-1 { align-content: flex-start; align-items: flex-start; background: #756cdf00; border-bottom: 4px solid #00000000; border-left: 4px solid #00000000; border-radius: 50px; border-right: 4px solid #00000000; border-top: 4px solid #00000000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 250px; justify-content: center; margin: -80px 0px 0px 0px; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-4-item-consulting-image-1 { height: auto; margin: -80px 40px 0px 0px; width: calc(100% - 40px); max-width: calc(100% - 40px); } } @media screen and (max-width: 540px) { .sd.business-4-item-consulting-image-1 { border-radius: 30px; flex: none; height: auto; margin: 0px 40px 0px 0px; width: calc(100% - 40px); max-width: calc(100% - 40px); } } @media screen and (max-width: 321px) { .sd.business-4-item-consulting-image-1 { border-radius: 0px 0px 0px 0px; } } .sd.business-4-img-5 { border-bottom: 3px solid #000000; border-left: 3px solid #000000; border-radius: 40px; border-right: 3px solid #000000; border-top: 3px solid #000000; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); flex: none; height: auto; width: 477px; max-width: 100%; } .sd.business-4-img-5.appear { transform: scale(0, 0); transition-delay: 300ms; transition-duration: 600ms; } .sd.business-4-img-5.appear-active { transition-delay: 300ms; transition-duration: 600ms; } .sd.business-4-img-5:hover { transform: scale(1.05, 1.05); } @media screen and (max-width: 976px) { .sd.business-4-img-5 { width: 477px; } } @media screen and (max-width: 540px) { .sd.business-4-img-5 { height: auto; width: 400px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.business-4-img-5 { border-radius: 20px 20px 20px 20px; } } .sd.business-4-item-consulting-image-2 { align-content: flex-end; align-items: flex-end; background: #756cdf00; border-bottom: 4px solid #00000000; border-left: 4px solid #00000000; border-radius: 50px; border-right: 4px solid #00000000; border-top: 4px solid #00000000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 292px; justify-content: center; margin: 0px 0px 0px 0px; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-4-item-consulting-image-2 { height: auto; margin: -40px 0px 0px 40px; width: calc(100% - 40px); max-width: calc(100% - 40px); } } @media screen and (max-width: 540px) { .sd.business-4-item-consulting-image-2 { border-radius: 30px; flex: none; height: auto; margin: -50px 0px 0px 40px; width: calc(100% - 40px); max-width: calc(100% - 40px); } } @media screen and (max-width: 321px) { .sd.business-4-item-consulting-image-2 { border-radius: 0px 0px 0px 0px; margin: -50px 0px 0px 40px; } } .sd.business-4-img-6 { border-bottom: 3px solid #000000; border-left: 3px solid #000000; border-radius: 40px; border-right: 3px solid #000000; border-top: 3px solid #000000; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); flex: none; height: auto; width: 477px; max-width: 100%; } .sd.business-4-img-6.appear { transform: scale(0, 0); transition-delay: 300ms; transition-duration: 600ms; } .sd.business-4-img-6.appear-active { transition-delay: 300ms; transition-duration: 600ms; } .sd.business-4-img-6:hover { transform: scale(1.05, 1.05); } @media screen and (max-width: 540px) { .sd.business-4-img-6 { width: 400px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.business-4-img-6 { border-radius: 20px 20px 20px 20px; } } .sd.business-smf { align-content: center; align-items: center; background: #ffffffff; display: none; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0px 0px 0px 0px; padding: 80px 0px; width: 100%; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.business-smf { display: none; } } @media screen and (max-width: 976px) { .sd.business-smf { display: none; flex: none; height: auto; } } @media screen and (max-width: 540px) { .sd.business-smf { align-content: center; align-items: center; display: flex; justify-content: center; padding: 40px 0px; } } @media screen and (max-width: 321px) { .sd.business-smf { display: flex; } } .sd.business-smf-inner { padding: 80px 0px; width: 100%; height: auto; flex-direction: column; flex-wrap: nowrap; align-content: center; align-items: center; justify-content: center; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.business-smf-inner { flex-direction: column; } } @media screen and (max-width: 976px) { .sd.business-smf-inner { height: auto; flex-direction: column; } } @media screen and (max-width: 540px) { .sd.business-smf-inner { padding: 40px 0px; flex-direction: column; align-content: center; align-items: center; justify-content: center; } } @media screen and (max-width: 321px) { .sd.business-smf-inner { flex-direction: column; } } .sd.business-smf-header { align-content: flex-start; align-items: flex-start; background: #ffa51200; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0px 0px 20px 0px; padding: 0px 40px; width: 1280px; max-width: 100%; } @media screen and (max-width: 540px) { .sd.business-smf-header { padding: 0px 20px; } } .sd.business-smf-text { background: rgba(100, 255, 148, 0); color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 24px; font-weight: 400; height: auto; line-height: 1; margin: 0px 0px 0px 10px; text-align: left; width: auto; max-width: calc(100% - 10px); justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.business-smf-text { font-size: 20px; } } @media screen and (max-width: 321px) { .sd.business-smf-text { font-size: 14px; margin: 0px 0px 0px 5px; max-width: calc(100% - 5px); } } .sd.business-smf-Business { background: rgba(197, 255, 229, 0); color: #4edca1ff; font-family: var(--s-font-8986a4d9); font-size: 144px; font-weight: 600; height: auto; letter-spacing: -0.07em; line-height: 1; margin: 0px 0px -22px 0px; padding: 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 976px) { .sd.business-smf-Business { font-size: 90px; margin: 0px 0px -14px 0px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-smf-Business { font-size: 55px; margin: 0px 0px -10px 0px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.business-smf-Business { font-size: 50px; } } .sd.business-smf-content { align-content: center; align-items: center; background: #e3fef300; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 200px; height: auto; justify-content: center; width: 100%; --gap-h-8f67bbe5-b5d6-425a-88b3-b49efd8fd92a: 0px; --gap-v-8f67bbe5-b5d6-425a-88b3-b49efd8fd92a: 200px; --gap-uuid: 8f67bbe5-b5d6-425a-88b3-b49efd8fd92a; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-smf-content { flex: none; gap: 80px; height: auto; --gap-h-8f67bbe5-b5d6-425a-88b3-b49efd8fd92a: 0px; --gap-v-8f67bbe5-b5d6-425a-88b3-b49efd8fd92a: 80px; } } @media screen and (max-width: 540px) { .sd.business-smf-content { flex: none; gap: 40px; height: auto; --gap-h-8f67bbe5-b5d6-425a-88b3-b49efd8fd92a: 0px; --gap-v-8f67bbe5-b5d6-425a-88b3-b49efd8fd92a: 40px; } } .sd.business-smf-list { align-content: flex-start; align-items: flex-start; background: #b7a58b00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; padding: 0px; width: calc(100% - (var(--gap-h-8f67bbe5-b5d6-425a-88b3-b49efd8fd92a) * 0)); max-width: calc(100% - (var(--gap-h-8f67bbe5-b5d6-425a-88b3-b49efd8fd92a) * 0)); } @media screen and (max-width: 1140px) { .sd.business-smf-list { margin: 50px 0px 0px 0px; width: calc(100% - (var(--gap-h-8f67bbe5-b5d6-425a-88b3-b49efd8fd92a) * 0)); max-width: calc(100% - (var(--gap-h-8f67bbe5-b5d6-425a-88b3-b49efd8fd92a) * 0)); } } @media screen and (max-width: 976px) { .sd.business-smf-list { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; width: calc(100% - (var(--gap-h-8f67bbe5-b5d6-425a-88b3-b49efd8fd92a) * 0)); max-width: calc(100% - (var(--gap-h-8f67bbe5-b5d6-425a-88b3-b49efd8fd92a) * 0)); } } @media screen and (max-width: 540px) { .sd.business-smf-list { flex: none; height: auto; } } .sd.business-smf-item-creator { align-content: flex-end; align-items: flex-end; background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1), var(--g-color-2) var(--g-position-2), var(--g-color-3) var(--g-position-3), var(--g-color-4) var(--g-position-4), var(--g-color-5) var(--g-position-5)); border-radius: 0px 50px 50px 0px; box-shadow: 0px 20px 0px #4edca1ff; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0px -300px 0px 0px; padding: 60px 300px 80px 0px; width: calc(50% - -300px); max-width: calc(50% - -300px); --g-color-0: #e3fef3ff; --g-position-0: 0%; --g-color-1: #e3fef3ff; --g-position-1: 26%; --g-color-2: rgb(255, 255, 255); --g-position-2: 27%; --g-color-3: rgb(255, 255, 255); --g-position-3: 75%; --g-color-4: #e3fef3ff; --g-position-4: 76%; --g-color-5: #e3fef3ff; --g-position-5: 100%; --g-color-6: #e3fef3ff; --g-position-6: 100%; --g-color-7: #e3fef3ff; --g-position-7: 100%; --g-color-8: #e3fef3ff; --g-position-8: 100%; --g-color-9: #e3fef3ff; --g-position-9: 100%; --g-color-10: #e3fef3ff; --g-position-10: 100%; --g-color-11: #e3fef3ff; --g-position-11: 100%; --g-angle: 35deg; } @media screen and (max-width: 976px) { .sd.business-smf-item-creator { box-shadow: -1px 20px 0px #4edca1ff; flex: none; height: auto; margin: 0px 120px 0px 0px; padding: 80px 0px 240px 0px; width: calc(100% - 120px); max-width: calc(100% - 120px); } } @media screen and (max-width: 540px) { .sd.business-smf-item-creator { border-radius: 0px 30px 30px 0px; margin: 0px 40px 0px 0px; padding: 80px 0px 80px 0px; width: calc(100% - 40px); max-width: calc(100% - 40px); } } @media screen and (max-width: 321px) { .sd.business-smf-item-creator { padding: 80px 0px 80px 0px; } } .sd.business-smf-item-creator-inner { align-content: flex-start; align-items: flex-start; background: #b4ffb000; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: flex-end; padding: 0px 0px 0px 40px; width: 640px; max-width: 100%; } .sd.business-smf-item-creator-inner.appear { opacity: 0; transform: translate(0px, 20px); transition-delay: 300ms; transition-duration: 600ms; } .sd.business-smf-item-creator-inner.appear-active { transition-delay: 300ms; transition-duration: 600ms; } @media screen and (max-width: 976px) { .sd.business-smf-item-creator-inner { flex: none; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-smf-item-creator-inner { padding: 0px 20px; } } @media screen and (max-width: 321px) { .sd.business-smf-item-creator-inner { padding: 0px 20px 0px 20px; } } .sd.business-smf-item-creator-title { align-content: flex-start; align-items: flex-start; background: #eeeeee00; flex: none; flex-direction: row; flex-wrap: nowrap; height: auto; justify-content: flex-start; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-smf-item-creator-title { flex-direction: row; flex-wrap: wrap; } } @media screen and (max-width: 540px) { .sd.business-smf-item-creator-title { flex-direction: column; flex-wrap: nowrap; } } @media screen and (max-width: 321px) { .sd.business-smf-item-creator-title { flex-direction: column; flex-wrap: nowrap; } } .sd.business-smf-text-2 { background: #ff005500; color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 36px; font-weight: 400; height: auto; line-height: 1.3; margin: 0px 0px 20px 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 976px) { .sd.business-smf-text-2 { margin: 0px 0px 0px 0px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-smf-text-2 { font-size: 28px; margin: 0px 0px 0px 0px; } } @media screen and (max-width: 321px) { .sd.business-smf-text-2 { font-size: 20px; margin: 0px 0px 0px 0px; } } .sd.business-smf-text-3 { background: #ff005500; color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 36px; font-weight: 400; height: auto; line-height: 1.3; margin: 0px 0px 20px 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.business-smf-text-3 { font-size: 28px; } } @media screen and (max-width: 321px) { .sd.business-smf-text-3 { font-size: 24px; } } .sd.business-smf-img { flex: none; height: auto; margin: 0px 0px 20px 0px; width: 428px; max-width: 100%; } .sd.business-smf-text-4 { background: #ff005500; color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 20px; font-weight: 400; height: auto; line-height: 1.7; margin: 0px 0px 40px 0px; text-align: left; width: 100%; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 976px) { .sd.business-smf-text-4 { margin: 0px 80px 40px 0px; width: calc(100% - 80px); max-width: calc(100% - 80px); } } @media screen and (max-width: 540px) { .sd.business-smf-text-4 { font-size: 14px; margin: 0px 0px 40px 0px; width: 100%; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.business-smf-text-4 { font-size: 14px; } } .sd.business-smf-item-creator-link-wrapper { align-content: center; align-items: center; background: #eeeeee00; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 5px; height: auto; justify-content: flex-start; padding: 0px; width: 100%; z-index: 5; --gap-h-0bd409e5-abb4-450d-8600-7c9374059ac0: 5px; --gap-v-0bd409e5-abb4-450d-8600-7c9374059ac0: 0px; --gap-uuid: 0bd409e5-abb4-450d-8600-7c9374059ac0; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-smf-item-creator-link-wrapper { align-content: flex-start; align-items: flex-start; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; --gap-h-0bd409e5-abb4-450d-8600-7c9374059ac0: 5px; --gap-v-0bd409e5-abb4-450d-8600-7c9374059ac0: 0px; } } @media screen and (max-width: 540px) { .sd.business-smf-item-creator-link-wrapper { align-content: flex-start; align-items: flex-start; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; --gap-h-0bd409e5-abb4-450d-8600-7c9374059ac0: 0px; --gap-v-0bd409e5-abb4-450d-8600-7c9374059ac0: 5px; } } @media screen and (max-width: 321px) { .sd.business-smf-item-creator-link-wrapper { align-content: flex-start; align-items: flex-start; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; --gap-h-0bd409e5-abb4-450d-8600-7c9374059ac0: 0px; --gap-v-0bd409e5-abb4-450d-8600-7c9374059ac0: 5px; } } .sd.business-smf-item-creator-link { align-content: center; align-items: center; background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1)); border-bottom: 2px solid #000000; border-left: 2px solid #000000; border-radius: 25px; border-right: 2px solid #000000; border-top: 2px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 5px; height: 50px; justify-content: center; margin: 0px 20px 0px 0px; padding: 0px 20px; width: auto; --gap-h-6f4095d4-b165-4744-966a-10b0174924a8: 5px; --gap-v-6f4095d4-b165-4744-966a-10b0174924a8: 0px; --gap-uuid: 6f4095d4-b165-4744-966a-10b0174924a8; max-width: calc(100% - 20px); --g-color-0: #888888ff; --g-position-0: 0%; --g-color-1: #ffffffff; --g-position-1: 0%; --g-color-2: #ffffffff; --g-position-2: 0%; --g-color-3: #ffffffff; --g-position-3: 0%; --g-color-4: #ffffffff; --g-position-4: 0%; --g-color-5: #ffffffff; --g-position-5: 0%; --g-color-6: #ffffffff; --g-position-6: 0%; --g-color-7: #ffffffff; --g-position-7: 0%; --g-color-8: #ffffffff; --g-position-8: 0%; --g-color-9: #ffffffff; --g-position-9: 0%; --g-color-10: #ffffffff; --g-position-10: 0%; --g-color-11: #ffffffff; --g-position-11: 0%; --g-angle: 90deg; } .sd.business-smf-item-creator-link:hover { background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1)); transition-duration: 1000ms; --gap-h-6f4095d4-b165-4744-966a-10b0174924a8: 5px; --gap-v-6f4095d4-b165-4744-966a-10b0174924a8: 0px; --g-color-0: #888888ff; --g-position-0: 100%; --g-color-1: #ffffff; --g-position-1: 100%; --g-color-2: #ffffff; --g-position-2: 100%; --g-color-3: #ffffff; --g-position-3: 100%; --g-color-4: #ffffff; --g-position-4: 100%; --g-color-5: #ffffff; --g-position-5: 100%; --g-color-6: #ffffff; --g-position-6: 100%; --g-color-7: #ffffff; --g-position-7: 100%; --g-color-8: #ffffff; --g-position-8: 100%; --g-color-9: #ffffff; --g-position-9: 100%; --g-color-10: #ffffff; --g-position-10: 100%; --g-color-11: #ffffff; --g-position-11: 100%; --g-angle: 90deg; } @media screen and (max-width: 540px) { .sd.business-smf-item-creator-link { margin: 0px 0px 0px 0px; --gap-h-6f4095d4-b165-4744-966a-10b0174924a8: 5px; --gap-v-6f4095d4-b165-4744-966a-10b0174924a8: 0px; max-width: 100%; } } .sd.business-smf-text-5 { color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.business-smf-item-creator-link:hover .sd.business-smf-text-5 { color: #ffffffff; transition-delay: 300ms; } .sd.business-smf-icon { color: #222222; font-size: 24px; } .sd.business-smf-item-creator-link:hover .sd.business-smf-icon { color: #ffffffff; transition-delay: 300ms; } .sd.business-smf-item-creator-image-wrapper { align-content: center; align-items: center; background: #ffb82900; flex: none; flex-direction: row; flex-wrap: nowrap; height: 1px; justify-content: center; margin: 0px 0px 0px 0px; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-smf-item-creator-image-wrapper { align-content: center; align-items: center; flex-direction: row; flex-wrap: nowrap; height: auto; justify-content: flex-end; margin: -250px 0px 0px 0px; padding: 0px 40px 0px 0px; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-smf-item-creator-image-wrapper { align-content: center; align-items: center; flex-direction: row; flex-wrap: nowrap; justify-content: flex-end; margin: 40px 0px 0px 0px; padding: 0px 20px 0px 0px; width: 100%; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.business-smf-item-creator-image-wrapper { margin: 30px 0px 0px 0px; padding: 0px 10px 0px 0px; width: 100%; max-width: 100%; } } .sd.business-smf-item-creator-image-spacer { align-content: center; align-items: center; background: #c6ff0000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 1px; justify-content: flex-end; margin: 0px 0px 0px 0px; padding: 0px 40px 60px 40px; width: 55%; max-width: 55%; } @media screen and (max-width: 976px) { .sd.business-smf-item-creator-image-spacer { align-content: flex-end; align-items: flex-end; justify-content: flex-start; padding: 0px 0px 0px 0px; width: 50%; max-width: 50%; } } @media screen and (max-width: 540px) { .sd.business-smf-item-creator-image-spacer { margin: 0px 0px 0px 0px; padding: 0px 0px 80px 20px; } } .sd.business-smf-item-creator-images { align-content: flex-end; align-items: flex-end; background: #756cdf00; border-bottom: 4px solid #00000000; border-left: 4px solid #00000000; border-radius: 50px; border-right: 4px solid #00000000; border-top: 4px solid #00000000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 500px; justify-content: center; margin: -300px 0px 0px 0px; padding: 0px; transform: translate(0px, 0px); width: 500px; --gap-uuid: a423c4ef-002e-4986-8d00-efe59425a60c; --gap-h-a423c4ef-002e-4986-8d00-efe59425a60c: 0px; --gap-v-a423c4ef-002e-4986-8d00-efe59425a60c: 0px; max-width: 100%; } .sd.business-smf-item-creator-images.appear { opacity: 0; transition-delay: 600ms; } .sd.business-smf-item-creator-images.appear-active { transition-delay: 600ms; } @media screen and (max-width: 976px) { .sd.business-smf-item-creator-images { align-content: center; align-items: center; gap: 20px 0px; height: auto; justify-content: center; margin: 0px 0px 0px 0px; transform: translate(0px, 0px); width: 400px; --gap-h-a423c4ef-002e-4986-8d00-efe59425a60c: 0px; --gap-v-a423c4ef-002e-4986-8d00-efe59425a60c: 20px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-smf-item-creator-images { align-content: center; align-items: center; border-radius: 30px; gap: 10px 0px; height: auto; justify-content: center; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; width: auto; --gap-h-a423c4ef-002e-4986-8d00-efe59425a60c: 0px; --gap-v-a423c4ef-002e-4986-8d00-efe59425a60c: 10px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.business-smf-item-creator-images { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; width: 300px; max-width: 100%; } } .sd.business-smf-img-2 { border-bottom: 3px solid #000000; border-left: 3px solid #000000; border-radius: 40px; border-right: 3px solid #000000; border-top: 3px solid #000000; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); flex: none; height: auto; width: calc(100% - (var(--gap-h-a423c4ef-002e-4986-8d00-efe59425a60c) * 0)); max-width: calc(100% - (var(--gap-h-a423c4ef-002e-4986-8d00-efe59425a60c) * 0)); } .sd.business-smf-img-2.appear { transform: scale(0, 0); transition-delay: 300ms; transition-duration: 600ms; } .sd.business-smf-img-2.appear-active { transition-delay: 300ms; transition-duration: 600ms; } .sd.business-smf-img-2:hover { transform: scale(1.05, 1.05); } @media screen and (max-width: 976px) { .sd.business-smf-img-2 { height: 400px; width: 400px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-smf-img-2 { height: 320px; width: 320px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.business-smf-img-2 { border-radius: 30px 30px 30px 30px; height: 300px; width: 300px; max-width: 100%; } } .sd.business-smf-item-creator-logos { align-content: center; align-items: center; background: #eeeeee00; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 5px; height: auto; justify-content: flex-start; padding: 0px; width: calc(100% - (var(--gap-h-a423c4ef-002e-4986-8d00-efe59425a60c) * 0)); z-index: 5; --gap-h-b04f914d-2171-49ce-b674-92e00f46b030: 5px; --gap-v-b04f914d-2171-49ce-b674-92e00f46b030: 0px; --gap-uuid: b04f914d-2171-49ce-b674-92e00f46b030; max-width: calc(100% - (var(--gap-h-a423c4ef-002e-4986-8d00-efe59425a60c) * 0)); } @media screen and (max-width: 976px) { .sd.business-smf-item-creator-logos { align-content: flex-start; align-items: flex-start; flex-direction: row; flex-wrap: nowrap; gap: 20px; justify-content: center; padding: 0px 10px 0px 0px; width: auto; --gap-h-b04f914d-2171-49ce-b674-92e00f46b030: 20px; --gap-v-b04f914d-2171-49ce-b674-92e00f46b030: 0px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-smf-item-creator-logos { align-content: flex-start; align-items: flex-start; flex-direction: row; flex-wrap: nowrap; gap: 10px; justify-content: center; padding: 0px 10px 0px 0px; --gap-h-b04f914d-2171-49ce-b674-92e00f46b030: 10px; --gap-v-b04f914d-2171-49ce-b674-92e00f46b030: 0px; } } @media screen and (max-width: 321px) { .sd.business-smf-item-creator-logos { align-content: flex-start; align-items: flex-start; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; --gap-h-b04f914d-2171-49ce-b674-92e00f46b030: 5px; --gap-v-b04f914d-2171-49ce-b674-92e00f46b030: 0px; } } .sd.business-smf-img-3 { flex: none; height: 50px; width: 140px; max-width: 100%; } @media screen and (max-width: 540px) { .sd.business-smf-img-3 { height: 50px; width: 120px; max-width: 100%; } } .sd.business-smf-img-4 { flex: none; height: 50px; width: 160px; max-width: 100%; } @media screen and (max-width: 540px) { .sd.business-smf-img-4 { height: 50px; width: 140px; max-width: 100%; } } .sd.business-smf-item-consulting { align-content: flex-end; align-items: flex-end; background: #f2f2f200; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 40px 0px 0px 0px; padding: 0px; width: calc(100% - (var(--gap-h-8f67bbe5-b5d6-425a-88b3-b49efd8fd92a) * 0)); max-width: calc(100% - (var(--gap-h-8f67bbe5-b5d6-425a-88b3-b49efd8fd92a) * 0)); } @media screen and (max-width: 976px) { .sd.business-smf-item-consulting { margin: 0px 0px 0px 0px; width: calc(100% - (var(--gap-h-8f67bbe5-b5d6-425a-88b3-b49efd8fd92a) * 0)); max-width: calc(100% - (var(--gap-h-8f67bbe5-b5d6-425a-88b3-b49efd8fd92a) * 0)); } } @media screen and (max-width: 540px) { .sd.business-smf-item-consulting { margin: 0px 0px 0px 0px; } } @media screen and (max-width: 321px) { .sd.business-smf-item-consulting { margin: 0px 0px 0px 0px; } } .sd.business-smf-item-consulting-inner { align-content: flex-start; align-items: flex-start; background: #4edca1ff; border-radius: 50px 0px 0px 50px; box-shadow: 20px 20px 0px #888888ff; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0px 0px 0px -300px; padding: 80px 0px 80px 300px; width: calc(50% - -300px); max-width: calc(50% - -300px); } @media screen and (max-width: 976px) { .sd.business-smf-item-consulting-inner { flex: none; margin: 0px 0px 0px 120px; padding: 80px 0px 240px 0px; width: calc(100% - 120px); max-width: calc(100% - 120px); } } @media screen and (max-width: 540px) { .sd.business-smf-item-consulting-inner { border-radius: 30px 0px 0px 30px; margin: 0px 0px 0px 40px; padding: 80px 0px 120px 0px; width: calc(100% - 40px); max-width: calc(100% - 40px); } } .sd.business-smf-item-consulting-title { align-content: center; align-items: center; background: #b4ffb000; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; padding: 0px 40px; width: 640px; max-width: 100%; } .sd.business-smf-item-consulting-title.appear { opacity: 0; transform: translate(0px, 20px); transition-delay: 300ms; transition-duration: 600ms; } .sd.business-smf-item-consulting-title.appear-active { transition-delay: 300ms; transition-duration: 600ms; } @media screen and (max-width: 976px) { .sd.business-smf-item-consulting-title { flex: none; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-smf-item-consulting-title { padding: 0px 20px; } } .sd.business-smf-text-6 { background: #ff005500; color: #ffffffff; flex: none; font-family: var(--s-font-ff98f853); font-size: 36px; font-weight: 400; height: auto; letter-spacing: 0.01em; line-height: 1.3; margin: 0px 0px 40px 0px; text-align: left; width: 100%; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 976px) { .sd.business-smf-text-6 { margin: 0px 0px 40px 40px; width: calc(100% - 40px); max-width: calc(100% - 40px); } } @media screen and (max-width: 540px) { .sd.business-smf-text-6 { font-size: 26px; } } @media screen and (max-width: 321px) { .sd.business-smf-text-6 { font-size: 20px; margin: 0px 0px 40px 0px; width: 100%; max-width: 100%; } } .sd.business-smf-text-7 { background: #ff005500; color: #ffffffff; flex: none; font-family: var(--s-font-ff98f853); font-size: 20px; font-weight: 400; height: auto; line-height: 1.7; text-align: left; width: 100%; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 1140px) { .sd.business-smf-text-7 { line-height: 1.4; } } @media screen and (max-width: 976px) { .sd.business-smf-text-7 { margin: 0px 0px 0px 40px; width: calc(100% - 40px); max-width: calc(100% - 40px); } } @media screen and (max-width: 540px) { .sd.business-smf-text-7 { font-size: 14px; } } @media screen and (max-width: 321px) { .sd.business-smf-text-7 { font-size: 14px; margin: 0px 0px 0px 0px; width: 100%; max-width: 100%; } } .sd.business-smf-item-consulting-image-wrapper { align-content: center; align-items: center; background: #ffb82900; flex: none; flex-direction: row-reverse; flex-wrap: nowrap; height: auto; justify-content: flex-start; margin: -200px 0px 0px 0px; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-smf-item-consulting-image-wrapper { align-content: center; align-items: center; justify-content: flex-end; margin: -100px 0px 0px 0px; padding: 0px 0px 0px 40px; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.business-smf-item-consulting-image-wrapper { align-content: flex-end; align-items: flex-end; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; padding: 0px 0px 0px 0px; } } @media screen and (max-width: 321px) { .sd.business-smf-item-consulting-image-wrapper { align-content: center; align-items: center; flex-direction: row-reverse; flex-wrap: nowrap; justify-content: flex-end; margin: -100px 0px 0px 0px; } } .sd.business-smf-item-consulting-image-spacer { align-content: flex-end; align-items: flex-end; background: #c6ff0000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 100%; justify-content: flex-end; padding: 0px 40px 80px 0px; width: 50%; max-width: 50%; } @media screen and (max-width: 976px) { .sd.business-smf-item-consulting-image-spacer { height: 1px; width: 50%; max-width: 50%; } } @media screen and (max-width: 540px) { .sd.business-smf-item-consulting-image-spacer { margin: 0px 0px 0px 0px; padding: 0px 20px 80px 0px; width: 50%; max-width: 50%; } } .sd.business-smf-item-consulting-images { align-content: center; align-items: center; background: #60a2a600; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0px 0px 0px 40px; width: calc(50% - 40px); max-width: calc(50% - 40px); } @media screen and (max-width: 976px) { .sd.business-smf-item-consulting-images { margin: 0px 0px 0px 0px; width: 60%; max-width: 60%; } } @media screen and (max-width: 540px) { .sd.business-smf-item-consulting-images { flex: none; margin: 0px 0px 0px 0px; width: 100%; max-width: 100%; } } .sd.business-smf-item-consulting-image-1 { align-content: flex-start; align-items: flex-start; background: #756cdf00; border-bottom: 4px solid #00000000; border-left: 4px solid #00000000; border-radius: 50px; border-right: 4px solid #00000000; border-top: 4px solid #00000000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 250px; justify-content: center; margin: -80px 0px 0px 0px; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-smf-item-consulting-image-1 { height: auto; margin: -80px 40px 0px 0px; width: calc(100% - 40px); max-width: calc(100% - 40px); } } @media screen and (max-width: 540px) { .sd.business-smf-item-consulting-image-1 { border-radius: 30px; flex: none; height: auto; margin: 0px 40px 0px 0px; width: calc(100% - 40px); max-width: calc(100% - 40px); } } @media screen and (max-width: 321px) { .sd.business-smf-item-consulting-image-1 { border-radius: 0px 0px 0px 0px; } } .sd.business-smf-img-5 { border-bottom: 3px solid #000000; border-left: 3px solid #000000; border-radius: 40px; border-right: 3px solid #000000; border-top: 3px solid #000000; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); flex: none; height: auto; width: 477px; max-width: 100%; } .sd.business-smf-img-5.appear { transform: scale(0, 0); transition-delay: 300ms; transition-duration: 600ms; } .sd.business-smf-img-5.appear-active { transition-delay: 300ms; transition-duration: 600ms; } .sd.business-smf-img-5:hover { transform: scale(1.05, 1.05); } @media screen and (max-width: 976px) { .sd.business-smf-img-5 { width: 477px; } } @media screen and (max-width: 540px) { .sd.business-smf-img-5 { height: auto; width: 400px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.business-smf-img-5 { border-radius: 20px 20px 20px 20px; } } .sd.business-smf-item-consulting-image-2 { align-content: flex-end; align-items: flex-end; background: #756cdf00; border-bottom: 4px solid #00000000; border-left: 4px solid #00000000; border-radius: 50px; border-right: 4px solid #00000000; border-top: 4px solid #00000000; flex: none; flex-direction: column; flex-wrap: nowrap; height: 292px; justify-content: center; margin: 0px 0px 0px 0px; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.business-smf-item-consulting-image-2 { height: auto; margin: -40px 0px 0px 40px; width: calc(100% - 40px); max-width: calc(100% - 40px); } } @media screen and (max-width: 540px) { .sd.business-smf-item-consulting-image-2 { border-radius: 30px; flex: none; height: auto; margin: -50px 0px 0px 40px; width: calc(100% - 40px); max-width: calc(100% - 40px); } } @media screen and (max-width: 321px) { .sd.business-smf-item-consulting-image-2 { border-radius: 0px 0px 0px 0px; margin: -50px 0px 0px 40px; } } .sd.business-smf-img-6 { border-bottom: 3px solid #000000; border-left: 3px solid #000000; border-radius: 40px; border-right: 3px solid #000000; border-top: 3px solid #000000; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.2); flex: none; height: auto; width: 477px; max-width: 100%; } .sd.business-smf-img-6.appear { transform: scale(0, 0); transition-delay: 300ms; transition-duration: 600ms; } .sd.business-smf-img-6.appear-active { transition-delay: 300ms; transition-duration: 600ms; } .sd.business-smf-img-6:hover { transform: scale(1.05, 1.05); } @media screen and (max-width: 540px) { .sd.business-smf-img-6 { width: 400px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.business-smf-img-6 { border-radius: 20px 20px 20px 20px; } } .sd.campany { align-content: center; align-items: center; background: #ffffffff; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; padding: 80px 0px; width: 100%; max-width: 100%; } @media screen and (max-width: 540px) { .sd.campany { padding: 40px 0px; } } @media screen and (max-width: 321px) { .sd.campany { padding: 40px 0px 0px 0px; } } .sd.campany-inner { padding: 80px 0px; width: 100%; height: auto; flex-direction: column; flex-wrap: nowrap; align-content: center; align-items: center; justify-content: center; max-width: 100%; } @media screen and (max-width: 540px) { .sd.campany-inner { padding: 40px 0px; flex-direction: column; } } @media screen and (max-width: 321px) { .sd.campany-inner { padding: 40px 0px 0px 0px; flex-direction: column; } } .sd.campany-header { align-content: center; align-items: center; background: #ffb70000; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; padding: 0px 40px; width: 1280px; max-width: 100%; } @media screen and (max-width: 540px) { .sd.campany-header { flex: none; height: 74px; padding: 0px 20px; max-width: 100%; } } .sd.campany-text { background: rgba(223, 255, 209, 0); color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 24px; font-weight: 400; height: auto; line-height: 1; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.campany-text { font-size: 20px; } } .sd.campany-Company { background: rgba(148, 255, 218, 0); color: #4edca1ff; font-family: var(--s-font-8986a4d9); font-size: 144px; font-weight: 600; height: auto; letter-spacing: -0.07em; line-height: 1; margin: 0px 0px 0px 0px; padding: 0px 10px 0px 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 976px) { .sd.campany-Company { font-size: 90px; margin: 0px 0px 0px 0px; } } @media screen and (max-width: 540px) { .sd.campany-Company { font-size: 55px; margin: 0px 0px 0px 0px; } } @media screen and (max-width: 321px) { .sd.campany-Company { font-size: 50px; } } .sd.campany-content { align-content: center; align-items: center; background: #ffffffff; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 40px 0px 0px 0px; width: 100%; max-width: 100%; } .sd.campany-table { align-content: center; align-items: center; background: #4effa600; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; width: 1280px; max-width: 100%; } .sd.campany-table-inner { align-content: center; align-items: center; background: #e3fef300; border-radius: 24px; flex: none; flex-direction: column; flex-wrap: nowrap; height: 100%; justify-content: center; padding: 20px 40px; width: 50%; max-width: 50%; } .sd.campany-table-inner.appear { opacity: 0; transform: translate(0px, 20px); transition-delay: 300ms; transition-duration: 600ms; } .sd.campany-table-inner.appear-active { transition-delay: 300ms; transition-duration: 600ms; } @media screen and (max-width: 976px) { .sd.campany-table-inner { flex: none; width: 100%; max-width: 100%; height: 100%; } } @media screen and (max-width: 540px) { .sd.campany-table-inner { padding: 0px 20px; } } .sd.campany-row-name { align-content: flex-start; align-items: flex-start; background: #e289ff00; border-bottom: 1px solid #000000; border-left: 0px solid #000000; border-right: 0px solid #000000; border-top: 0px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; height: auto; justify-content: center; padding: 30px 0px; width: 100%; max-width: 100%; } .sd.campany-text-2 { background: rgba(198, 193, 193, 0); color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.8; text-align: left; width: 120px; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.campany-text-2 { flex: none; width: 100px; max-width: 100%; } } .sd.campany-CrossVision { background: rgba(223, 234, 188, 0); color: #333333ff; flex: 1; font-family: var(--s-font-3eb085da); font-size: 15px; font-weight: 400; height: auto; line-height: 1.8; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.campany-row-ceo { align-content: flex-start; align-items: flex-start; background: #e289ff00; border-bottom: 1px solid #000000; border-left: 0px solid #000000; border-right: 0px solid #000000; border-top: 0px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; height: auto; justify-content: center; padding: 30px 0px; width: 100%; max-width: 100%; } .sd.campany-text-3 { background: rgba(198, 193, 193, 0); color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.8; text-align: left; width: 120px; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.campany-text-3 { flex: none; width: 100px; max-width: 100%; } } .sd.campany-text-4 { background: rgba(223, 234, 188, 0); color: #333333ff; flex: 1; font-family: var(--s-font-3eb085da); font-size: 15px; font-weight: 400; height: auto; line-height: 1.8; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.campany-row-founded { align-content: flex-start; align-items: flex-start; background: #e289ff00; border-bottom: 1px solid #000000; border-left: 0px solid #000000; border-right: 0px solid #000000; border-top: 0px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; height: auto; justify-content: center; padding: 30px 0px; width: 100%; max-width: 100%; } .sd.campany-text-5 { background: rgba(198, 193, 193, 0); color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.8; text-align: left; width: 120px; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.campany-text-5 { flex: none; width: 100px; max-width: 100%; } } .sd.campany-2024-1-4 { background: rgba(223, 234, 188, 0); color: #333333; flex: 1; font-family: var(--s-font-3eb085da); font-size: 15px; font-weight: 400; height: auto; line-height: 1.8; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.campany-row-capital { align-content: flex-start; align-items: flex-start; background: #e289ff00; border-bottom: 1px solid #000000; border-left: 0px solid #000000; border-right: 0px solid #000000; border-top: 0px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; height: auto; justify-content: center; padding: 30px 0px; width: 100%; max-width: 100%; } .sd.campany-text-6 { background: rgba(198, 193, 193, 0); color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.8; text-align: left; width: 120px; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.campany-text-6 { flex: none; width: 100px; max-width: 100%; } } .sd.campany-3-800-000 { background: rgba(223, 234, 188, 0); color: #333333; flex: 1; font-family: var(--s-font-3eb085da); font-size: 15px; font-weight: 400; height: auto; line-height: 1.8; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.campany-row-address { align-content: flex-start; align-items: flex-start; background: #e289ff00; flex: none; flex-direction: row; flex-wrap: nowrap; height: auto; justify-content: center; padding: 30px 0px; width: 100%; max-width: 100%; } .sd.campany-text-7 { background: rgba(198, 193, 193, 0); color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.8; text-align: left; width: 120px; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.campany-text-7 { flex: none; width: 100px; max-width: 100%; } } .sd.campany-text-8 { background: rgba(223, 234, 188, 0); color: #333333; flex: 1; font-family: var(--s-font-3eb085da); font-size: 15px; font-weight: 400; height: auto; line-height: 1.8; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.intro-section { align-content: center; align-items: center; background: #FFFFFF; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; padding: 100px 40px; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.intro-section { padding: 80px 40px; } } @media screen and (max-width: 540px) { .sd.intro-section { padding: 40px 20px; } } @media screen and (max-width: 321px) { .sd.intro-section { padding: 20px 20px; } } .sd.intro-inner { padding: 100px 40px; width: 100%; height: auto; flex-direction: column; flex-wrap: nowrap; align-content: center; align-items: center; justify-content: center; max-width: 100%; } @media screen and (max-width: 976px) { .sd.intro-inner { padding: 80px 40px; flex-direction: column; } } @media screen and (max-width: 540px) { .sd.intro-inner { padding: 40px 20px; flex-direction: column; } } @media screen and (max-width: 321px) { .sd.intro-inner { padding: 20px 20px; flex-direction: column; } } .sd.intro-startup-section { align-content: center; align-items: center; background: #ffffffff; flex: none; flex-direction: row-reverse; flex-wrap: nowrap; height: auto; justify-content: flex-end; width: 1280px; max-width: 100%; } @media screen and (max-width: 976px) { .sd.intro-startup-section { align-content: center; align-items: center; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; } } .sd.intro-startup-image-1 { align-content: center; align-items: center; flex: none; flex-direction: column; flex-wrap: nowrap; justify-content: center; padding: 190px 80px 80px 80px; width: 50%; max-width: 50%; } @media screen and (max-width: 1140px) { .sd.intro-startup-image-1 { padding: 60px; } } @media screen and (max-width: 976px) { .sd.intro-startup-image-1 { flex: none; padding: 80px; width: 75%; max-width: 75%; } } @media screen and (max-width: 540px) { .sd.intro-startup-image-1 { flex: none; padding: 60px 40px; width: 100%; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.intro-startup-image-1 { padding: 40px 20px; } } .sd.intro-img-3 { border-radius: 40px; flex: none; height: auto; width: 100%; max-width: 100%; } .sd.intro-img-3.appear { opacity: 0; transform: translate(0px, 3px); transition-delay: 300ms; transition-duration: 600ms; } .sd.intro-img-3.appear-active { transition-delay: 300ms; transition-duration: 600ms; } @media screen and (max-width: 976px) { .sd.intro-img-3 { border-radius: 20px 20px 20px 20px; flex: none; width: 100%; } } @media screen and (max-width: 540px) { .sd.intro-img-3 { border-radius: 6px; } } .sd.intro-startup-content { align-content: flex-start; align-items: flex-start; background: rgba(255, 120, 120, 0); flex: none; flex-direction: column; flex-wrap: nowrap; gap: 0px; height: auto; justify-content: center; margin: 0px 0px; padding: 30px 0px; width: 50%; --gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b: 0px; --gap-v-848cb859-63d8-49b6-943d-5fb8b9fa576b: 0px; --gap-uuid: 848cb859-63d8-49b6-943d-5fb8b9fa576b; max-width: 50%; } .sd.intro-startup-content.appear { opacity: 1; --gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b: 0px; --gap-v-848cb859-63d8-49b6-943d-5fb8b9fa576b: 0px; } .sd.intro-startup-content.appear-active {} @media screen and (max-width: 1140px) { .sd.intro-startup-content { gap: 32px; margin: 0px 32px; --gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b: 0px; --gap-v-848cb859-63d8-49b6-943d-5fb8b9fa576b: 32px; width: calc(50% - 64px); max-width: calc(50% - 64px); } } @media screen and (max-width: 976px) { .sd.intro-startup-content { align-content: center; align-items: center; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 30px; justify-content: center; margin: -50px 0px 0px 0px; width: 100%; --gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b: 0px; --gap-v-848cb859-63d8-49b6-943d-5fb8b9fa576b: 30px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.intro-startup-content { align-content: center; align-items: center; gap: 20px; justify-content: center; margin: -20px 0px 0px 0px; --gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b: 0px; --gap-v-848cb859-63d8-49b6-943d-5fb8b9fa576b: 20px; width: 100%; max-width: 100%; } } .sd.intro-img-4 { flex: none; height: auto; margin: 0px 10px 20px 60px; width: calc(100% - 70px - (var(--gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b) * 0)); max-width: calc(100% - 70px - (var(--gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b) * 0)); } .sd.intro-img-4.appear { opacity: 0; transform: translate(0px, 8px); transition-delay: 500ms; transition-duration: 500ms; } .sd.intro-img-4.appear-active { transition-delay: 500ms; transition-duration: 500ms; } @media screen and (max-width: 976px) { .sd.intro-img-4 { flex: none; margin: 0px 0px 0px 40px; width: calc(70% - 40px - (var(--gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b) * 0.3)); max-width: calc(70% - 40px - (var(--gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b) * 0.3)); } } @media screen and (max-width: 540px) { .sd.intro-img-4 { margin: -40px 0px 0px 30px; width: calc(70% - 30px - (var(--gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b) * 0.3)); max-width: calc(70% - 30px - (var(--gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b) * 0.3)); } } @media screen and (max-width: 321px) { .sd.intro-img-4 { margin: -40px 0px 20px 0px; width: calc(70% - (var(--gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b) * 0.3)); max-width: calc(70% - (var(--gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b) * 0.3)); } } .sd.intro-startup-text { align-content: flex-start; align-items: flex-start; background: rgba(255, 127, 127, 0); flex: none; gap: 0px; height: auto; justify-content: flex-start; margin: 0px 0px 30px 0px; padding: 0px 0px 0px 0px; width: calc(100% - (var(--gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b) * 0)); --gap-h-0cb991cf-09e9-41cb-99c5-186fe77c10d4: 0px; --gap-v-0cb991cf-09e9-41cb-99c5-186fe77c10d4: 0px; --gap-uuid: 0cb991cf-09e9-41cb-99c5-186fe77c10d4; max-width: calc(100% - (var(--gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b) * 0)); } .sd.intro-startup-text.appear { opacity: 0; transform: translate(0px, 8px); transition-delay: 500ms; transition-duration: 500ms; transition-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1); --gap-h-0cb991cf-09e9-41cb-99c5-186fe77c10d4: 0px; --gap-v-0cb991cf-09e9-41cb-99c5-186fe77c10d4: 0px; } .sd.intro-startup-text.appear-active { transition-delay: 500ms; transition-duration: 500ms; transition-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1); } @media screen and (max-width: 976px) { .sd.intro-startup-text { align-content: flex-start; align-items: flex-start; flex: none; justify-content: flex-start; margin: 0px 0px 0px 0px; width: calc(100% - (var(--gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b) * 0)); --gap-h-0cb991cf-09e9-41cb-99c5-186fe77c10d4: 0px; --gap-v-0cb991cf-09e9-41cb-99c5-186fe77c10d4: 0px; max-width: calc(100% - (var(--gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b) * 0)); } } @media screen and (max-width: 540px) { .sd.intro-startup-text { flex: none; gap: 24px; height: auto; padding: 0px 0px; --gap-h-0cb991cf-09e9-41cb-99c5-186fe77c10d4: 0px; --gap-v-0cb991cf-09e9-41cb-99c5-186fe77c10d4: 24px; } } .sd.intro-startup-title { align-content: flex-start; align-items: flex-start; background: #eeeeee00; flex: none; flex-direction: row; flex-wrap: nowrap; height: auto; justify-content: center; width: calc(100% - (var(--gap-h-0cb991cf-09e9-41cb-99c5-186fe77c10d4) * 0)); max-width: calc(100% - (var(--gap-h-0cb991cf-09e9-41cb-99c5-186fe77c10d4) * 0)); } @media screen and (max-width: 540px) { .sd.intro-startup-title { align-content: flex-start; align-items: flex-start; justify-content: center; } } @media screen and (max-width: 321px) { .sd.intro-startup-title { padding: 0px; } } .sd.intro-text-5 { color: transparent; flex: none; font-family: var(--s-font-92a74d95); font-feature-settings: 'palt' 1; font-size: 43px; font-weight: 700; height: auto; letter-spacing: 0.15em; line-height: 1.4; margin: 0px 0px 40px 0px; padding: 0px 0px 0px 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1)); background-clip: text; -webkit-background-clip: text; --g-color-0: #ce0e2aff; --g-position-0: 100%; --g-color-1: #000000ff; --g-position-1: 100%; --g-color-2: #000000ff; --g-position-2: 100%; --g-color-3: #000000ff; --g-position-3: 100%; --g-color-4: #000000ff; --g-position-4: 100%; --g-color-5: #000000ff; --g-position-5: 100%; --g-color-6: #000000ff; --g-position-6: 100%; --g-color-7: #000000ff; --g-position-7: 100%; --g-color-8: #000000ff; --g-position-8: 100%; --g-color-9: #000000ff; --g-position-9: 100%; --g-color-10: #000000ff; --g-position-10: 100%; --g-color-11: #000000ff; --g-position-11: 100%; --g-angle: 90deg; } .sd.intro-text-5.appear { color: transparent; transition-delay: 600ms; transition-duration: 1000ms; background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1)); background-clip: text; -webkit-background-clip: text; --g-color-0: #ce0e2aff; --g-position-0: 0%; --g-color-1: #000000ff; --g-position-1: 0%; --g-color-2: #000000ff; --g-position-2: 0%; --g-color-3: #000000ff; --g-position-3: 0%; --g-color-4: #000000ff; --g-position-4: 0%; --g-color-5: #000000ff; --g-position-5: 0%; --g-color-6: #000000ff; --g-position-6: 0%; --g-color-7: #000000ff; --g-position-7: 0%; --g-color-8: #000000ff; --g-position-8: 0%; --g-color-9: #000000ff; --g-position-9: 0%; --g-color-10: #000000ff; --g-position-10: 0%; --g-color-11: #000000ff; --g-position-11: 0%; --g-angle: 90deg; } .sd.intro-text-5.appear-active { transition-delay: 600ms; transition-duration: 1000ms; } @media screen and (max-width: 1140px) { .sd.intro-text-5 { font-size: 32px; margin: 0px 0px 20px 0px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.intro-text-5 { font-size: 24px; margin: 0px 0px 0px 0px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.intro-text-5 { font-size: 20px; } } .sd.intro-text-6 { color: #000000ff; flex: none; font-family: var(--s-font-92a74d95); font-feature-settings: 'palt' 1; font-size: 43px; font-weight: 700; height: auto; letter-spacing: 0.15em; line-height: 1.4; margin: 0px 0px 40px 0px; padding: 0px 0px 0px 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 1140px) { .sd.intro-text-6 { font-size: 32px; margin: 0px 0px 20px 0px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.intro-text-6 { font-size: 24px; margin: 0px 0px 0px 0px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.intro-text-6 { font-size: 20px; } } .sd.intro-text-7 { color: #393939ff; font-family: var(--s-font-ff98f853); font-feature-settings: 'palt' 1; font-size: 20px; font-style: normal; font-weight: 400; height: auto; letter-spacing: normal; line-height: 1.7; margin: 0px 0px 0px 0px; text-align: left; width: calc(100% - (var(--gap-h-0cb991cf-09e9-41cb-99c5-186fe77c10d4) * 0)); max-width: calc(100% - (var(--gap-h-0cb991cf-09e9-41cb-99c5-186fe77c10d4) * 0)); justify-content: flex-start; } @media screen and (max-width: 976px) { .sd.intro-text-7 { font-size: 20px; padding: 0px 0px; text-align: left; justify-content: flex-start; } } @media screen and (max-width: 540px) { .sd.intro-text-7 { font-size: 16px; } } @media screen and (max-width: 321px) { .sd.intro-text-7 { line-height: 2; } } .sd.intro-startup-link-wrapper { align-content: center; align-items: center; background: #eeeeee00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; width: calc(100% - (var(--gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b) * 0)); max-width: calc(100% - (var(--gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b) * 0)); } @media screen and (max-width: 540px) { .sd.intro-startup-link-wrapper { margin: 20px 0px 0px 0px; width: calc(100% - (var(--gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b) * 0)); max-width: calc(100% - (var(--gap-h-848cb859-63d8-49b6-943d-5fb8b9fa576b) * 0)); } } .sd.intro-startup-link { align-content: center; align-items: center; background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1)); border-bottom: 2px solid #000000; border-left: 2px solid #000000; border-radius: 25px; border-right: 2px solid #000000; border-top: 2px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 5px; height: 50px; justify-content: center; margin: 0px 0px 0px 0px; padding: 0px 20px; width: auto; --gap-h-d47f0191-d045-48cd-b6cd-a7063f6c313c: 5px; --gap-v-d47f0191-d045-48cd-b6cd-a7063f6c313c: 0px; --gap-uuid: d47f0191-d045-48cd-b6cd-a7063f6c313c; max-width: 100%; --g-color-0: #888888ff; --g-position-0: 0%; --g-color-1: #ffffffff; --g-position-1: 0%; --g-color-2: #ffffffff; --g-position-2: 0%; --g-color-3: #ffffffff; --g-position-3: 0%; --g-color-4: #ffffffff; --g-position-4: 0%; --g-color-5: #ffffffff; --g-position-5: 0%; --g-color-6: #ffffffff; --g-position-6: 0%; --g-color-7: #ffffffff; --g-position-7: 0%; --g-color-8: #ffffffff; --g-position-8: 0%; --g-color-9: #ffffffff; --g-position-9: 0%; --g-color-10: #ffffffff; --g-position-10: 0%; --g-color-11: #ffffffff; --g-position-11: 0%; --g-angle: 90deg; } .sd.intro-startup-link:hover { background: linear-gradient(var(--g-angle), var(--g-color-0) var(--g-position-0), var(--g-color-1) var(--g-position-1)); transition-duration: 1000ms; --gap-h-d47f0191-d045-48cd-b6cd-a7063f6c313c: 5px; --gap-v-d47f0191-d045-48cd-b6cd-a7063f6c313c: 0px; --g-color-0: #888888ff; --g-position-0: 100%; --g-color-1: #ffffff; --g-position-1: 100%; --g-color-2: #ffffff; --g-position-2: 100%; --g-color-3: #ffffff; --g-position-3: 100%; --g-color-4: #ffffff; --g-position-4: 100%; --g-color-5: #ffffff; --g-position-5: 100%; --g-color-6: #ffffff; --g-position-6: 100%; --g-color-7: #ffffff; --g-position-7: 100%; --g-color-8: #ffffff; --g-position-8: 100%; --g-color-9: #ffffff; --g-position-9: 100%; --g-color-10: #ffffff; --g-position-10: 100%; --g-color-11: #ffffff; --g-position-11: 100%; --g-angle: 90deg; } @media screen and (max-width: 540px) { .sd.intro-startup-link { margin: 0px 0px 0px 0px; --gap-h-d47f0191-d045-48cd-b6cd-a7063f6c313c: 5px; --gap-v-d47f0191-d045-48cd-b6cd-a7063f6c313c: 0px; } } .sd.intro-text-8 { color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.intro-startup-link:hover .sd.intro-text-8 { color: #ffffffff; transition-delay: 300ms; } .sd.intro-icon { color: #222222; font-size: 24px; } .sd.intro-startup-link:hover .sd.intro-icon { color: #ffffffff; transition-delay: 300ms; } .sd.member-3 { align-content: center; align-items: center; background: #FFFFFF; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; padding: 120px 0px 160px 0px; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.member-3 { padding: 80px 20px; } } @media screen and (max-width: 540px) { .sd.member-3 { padding: 60px 0px; } } @media screen and (max-width: 321px) { .sd.member-3 { padding: 40px 0px; } } .sd.member-3-inner { padding: 120px 0px 160px 0px; width: 100%; height: auto; flex-direction: column; flex-wrap: nowrap; align-content: center; align-items: center; justify-content: center; max-width: 100%; } @media screen and (max-width: 976px) { .sd.member-3-inner { padding: 80px 20px; flex-direction: column; } } @media screen and (max-width: 540px) { .sd.member-3-inner { padding: 60px 0px; flex-direction: column; } } @media screen and (max-width: 321px) { .sd.member-3-inner { padding: 40px 0px; flex-direction: column; } } .sd.member-3-header { align-content: flex-start; align-items: flex-start; background: #ffb70000; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; padding: 0px 40px; width: 1280px; max-width: 100%; } @media screen and (max-width: 540px) { .sd.member-3-header { align-content: flex-start; align-items: flex-start; justify-content: center; padding: 0px 20px; } } .sd.member-3-text { background: rgba(223, 255, 209, 0); color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 24px; font-weight: 400; height: auto; line-height: 1; margin: 0px 0px 0px 10px; text-align: left; width: auto; max-width: calc(100% - 10px); justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.member-3-text { font-size: 20px; } } @media screen and (max-width: 321px) { .sd.member-3-text { font-size: 14px; } } .sd.member-3-Member { background: rgba(148, 255, 218, 0); color: #4edca1ff; font-family: var(--s-font-8986a4d9); font-size: 144px; font-weight: 600; height: auto; letter-spacing: -0.07em; line-height: 1; margin: 0px 0px -22px 0px; padding: 0px 10px 0px 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 976px) { .sd.member-3-Member { font-size: 90px; margin: 0px 0px -14px 0px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.member-3-Member { font-size: 55px; margin: 0px 0px -10px 0px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.member-3-Member { font-size: 50px; margin: 0px 0px 0px 0px; max-width: 100%; } } .sd.member-3-spacer { background: #000000ff; flex: none; height: 1px; width: 100%; max-width: 100%; } .sd.member-3-spacer.appear { flex: none; height: 1px; width: 0%; } .sd.member-3-spacer.appear-active {} .sd.member-3-description { align-content: flex-start; align-items: flex-start; background: #eeeeee00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; padding: 20px 40px; width: 1280px; max-width: 100%; } .sd.member-3-description.appear { opacity: 0; transform: translate(0px, 5px); transition-delay: 300ms; transition-duration: 600ms; } .sd.member-3-description.appear-active { transition-delay: 300ms; transition-duration: 600ms; } @media screen and (max-width: 976px) { .sd.member-3-description { padding: 20px 20px; } } @media screen and (max-width: 540px) { .sd.member-3-description { padding: 20px 20px; } } @media screen and (max-width: 321px) { .sd.member-3-description { padding: 20px 20px; } } .sd.member-3-text-2 { color: #333333; font-family: var(--s-font-ff98f853); font-size: 20px; font-weight: 400; height: auto; line-height: 1.7; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.member-3-text-2 { font-size: 16px; } } @media screen and (max-width: 321px) { .sd.member-3-text-2 { font-size: 14px; line-height: 2; } } .sd.member-3-carousel { align-content: center; align-items: center; background: rgb(255, 255, 255); flex: none; flex-direction: row; flex-wrap: nowrap; gap: 0px; height: auto; justify-content: center; overflow-x: hidden; overflow-y: hidden; padding: 0px 10px; transition-timing-function: cubic-bezier(0, 0, 0.99, 0.98); width: 100%; --gap-h-8bde6fc8-20be-42a0-ab46-cd4f62713dc5: 0px; --gap-v-8bde6fc8-20be-42a0-ab46-cd4f62713dc5: 0px; --gap-uuid: 8bde6fc8-20be-42a0-ab46-cd4f62713dc5; max-width: 100%; } @media screen and (max-width: 540px) { .sd.member-3-carousel { flex: none; height: auto; padding: 40px 10px; --gap-h-8bde6fc8-20be-42a0-ab46-cd4f62713dc5: 0px; --gap-v-8bde6fc8-20be-42a0-ab46-cd4f62713dc5: 0px; } } @media screen and (max-width: 321px) { .sd.member-3-carousel { padding: 20px 10px; --gap-h-8bde6fc8-20be-42a0-ab46-cd4f62713dc5: 0px; --gap-v-8bde6fc8-20be-42a0-ab46-cd4f62713dc5: 0px; } } .sd.member-3-card { flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; outline-offset: -4px; padding: 20px 10px; transform: { { transform } } ; transition-duration: { { _duration } } ms; transition-property: transform; transition-timing-function: cubic-bezier(0.58, 0.21, 0.41, 0.96); width: calc(25% - (var(--gap-h-8bde6fc8-20be-42a0-ab46-cd4f62713dc5) * 0.75)); will-change: transform; max-width: calc(25% - (var(--gap-h-8bde6fc8-20be-42a0-ab46-cd4f62713dc5) * 0.75)); } .sd.member-3-card:focus { outline: none; } .sd.member-3-card:focus-visible { outline: 2px solid black; } .sd._animatingNext.member-3-card { transform: translateX(-100%); } .sd._animatingPrev.member-3-card { transform: translateX(100%); } @media screen and (max-width: 976px) { .sd.member-3-card { flex: none; width: calc(33.33333333% - (var(--gap-h-8bde6fc8-20be-42a0-ab46-cd4f62713dc5) * 0.66666667)); max-width: calc(33.33333333% - (var(--gap-h-8bde6fc8-20be-42a0-ab46-cd4f62713dc5) * 0.66666667)); } } @media screen and (max-width: 540px) { .sd.member-3-card { flex: none; height: auto; width: calc(50% - (var(--gap-h-8bde6fc8-20be-42a0-ab46-cd4f62713dc5) * 0.5)); max-width: calc(50% - (var(--gap-h-8bde6fc8-20be-42a0-ab46-cd4f62713dc5) * 0.5)); } } .sd.member-3-link-7 { align-content: center; align-items: center; background: #ffffffff; border-bottom: 0px solid #808080ff; border-left: 0px solid #808080ff; border-radius: 8px; border-right: 0px solid #808080ff; border-top: 0px solid #808080ff; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 0px; height: auto; justify-content: flex-start; overflow-x: visible; overflow-y: visible; padding: 0px; width: 100%; --gap-h-d0176319-e39e-4fae-a22e-bd4681082c63: 0px; --gap-v-d0176319-e39e-4fae-a22e-bd4681082c63: 0px; --gap-uuid: d0176319-e39e-4fae-a22e-bd4681082c63; max-width: 100%; } .sd.member-3-link-7:hover { opacity: 1; --gap-h-d0176319-e39e-4fae-a22e-bd4681082c63: 0px; --gap-v-d0176319-e39e-4fae-a22e-bd4681082c63: 0px; } @media screen and (max-width: 540px) { .sd.member-3-link-7 { flex: none; width: 100%; --gap-h-d0176319-e39e-4fae-a22e-bd4681082c63: 0px; --gap-v-d0176319-e39e-4fae-a22e-bd4681082c63: 0px; } } @media screen and (max-width: 321px) { .sd.member-3-link-7 { gap: 0px; --gap-h-d0176319-e39e-4fae-a22e-bd4681082c63: 0px; --gap-v-d0176319-e39e-4fae-a22e-bd4681082c63: 0px; } } .sd.member-3-img-7 { background: rgba(230, 235, 236, 0); border-bottom: 0px solid #000000; border-left: 0px solid #000000; border-radius: 50%; border-right: 0px solid #000000; border-top: 0px solid #000000; box-shadow: none; flex: none; height: auto; margin: 0px 0px 20px 0px; padding: 0px 0px 0px 0px; transform: scale(1.15, 1.15); transform-origin: center center; width: calc(100% - (var(--gap-h-d0176319-e39e-4fae-a22e-bd4681082c63) * 0)); max-width: calc(100% - (var(--gap-h-d0176319-e39e-4fae-a22e-bd4681082c63) * 0)); } .sd.member-3-img-7:before { background-position: center top; background-size: 140%; } .sd.member-3-link-7:hover .sd.member-3-img-7:hover { transform: scale(1.25, 1.25); } .sd.member-3-CEO { color: #333333; flex: none; font-family: var(--s-font-ff98f853); font-feature-settings: 'palt' 1; font-size: 12px; font-weight: 400; height: auto; letter-spacing: 0.17em; line-height: 1.4; text-align: center; width: calc(100% - (var(--gap-h-d0176319-e39e-4fae-a22e-bd4681082c63) * 0)); max-width: calc(100% - (var(--gap-h-d0176319-e39e-4fae-a22e-bd4681082c63) * 0)); justify-content: center; } @media screen and (max-width: 540px) { .sd.member-3-CEO { font-size: 10px; height: 20px; width: calc(100% - (var(--gap-h-d0176319-e39e-4fae-a22e-bd4681082c63) * 0)); max-width: calc(100% - (var(--gap-h-d0176319-e39e-4fae-a22e-bd4681082c63) * 0)); } } @media screen and (max-width: 321px) { .sd.member-3-CEO { font-size: 10px; } } .sd.member-3-text-12 { background: rgba(255, 211, 211, 0); color: #333333; font-family: var(--s-font-ff98f853); font-size: 20px; font-weight: 400; height: auto; line-height: 1.4; margin: 5px 0px 0px 0px; padding: 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.member-3-text-12 { height: 60px; max-width: 100%; } } .sd.st-c51aa7c9-0757-4931-a6bc-185db81bd19d { align-content: center; align-items: center; background: #ffffffff; border-bottom: 0px solid #808080ff; border-left: 0px solid #808080ff; border-radius: 8px; border-right: 0px solid #808080ff; border-top: 0px solid #808080ff; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 0px; height: auto; justify-content: flex-start; overflow-x: visible; overflow-y: visible; padding: 20px 10px; width: calc(25% - (var(--gap-h-8bde6fc8-20be-42a0-ab46-cd4f62713dc5) * 0.75)); --gap-h-c51aa7c9-0757-4931-a6bc-185db81bd19d: 0px; --gap-v-c51aa7c9-0757-4931-a6bc-185db81bd19d: 0px; --gap-uuid: c51aa7c9-0757-4931-a6bc-185db81bd19d; max-width: calc(25% - (var(--gap-h-8bde6fc8-20be-42a0-ab46-cd4f62713dc5) * 0.75)); } .sd.st-c51aa7c9-0757-4931-a6bc-185db81bd19d:hover { opacity: 1; --gap-h-c51aa7c9-0757-4931-a6bc-185db81bd19d: 0px; --gap-v-c51aa7c9-0757-4931-a6bc-185db81bd19d: 0px; } @media screen and (max-width: 540px) { .sd.st-c51aa7c9-0757-4931-a6bc-185db81bd19d { flex: none; width: calc(50% - (var(--gap-h-8bde6fc8-20be-42a0-ab46-cd4f62713dc5) * 0.5)); --gap-h-c51aa7c9-0757-4931-a6bc-185db81bd19d: 0px; --gap-v-c51aa7c9-0757-4931-a6bc-185db81bd19d: 0px; max-width: calc(50% - (var(--gap-h-8bde6fc8-20be-42a0-ab46-cd4f62713dc5) * 0.5)); } } .sd.st-24a3d56b-6164-4924-b68f-70790b894666 { background: rgba(230, 235, 236, 0); border-bottom: 0px solid #000000; border-left: 0px solid #000000; border-radius: 50%; border-right: 0px solid #000000; border-top: 0px solid #000000; box-shadow: none; flex: none; height: auto; margin: 0px 0px 20px 0px; transform: scale(1.15, 1.15); transform-origin: center center; width: calc(100% - (var(--gap-h-c51aa7c9-0757-4931-a6bc-185db81bd19d) * 0)); max-width: calc(100% - (var(--gap-h-c51aa7c9-0757-4931-a6bc-185db81bd19d) * 0)); } .sd.st-24a3d56b-6164-4924-b68f-70790b894666:before { background-position: center top; background-size: 140%; } .sd.st-c51aa7c9-0757-4931-a6bc-185db81bd19d:hover .sd.st-24a3d56b-6164-4924-b68f-70790b894666:hover { transform: scale(1.25, 1.25); } .sd.st-b63c80ff-5384-4692-ab36-41ab66e6e4ee { color: #333333; flex: none; font-family: var(--s-font-ff98f853); font-feature-settings: 'palt' 1; font-size: 12px; font-weight: 400; height: auto; letter-spacing: 0.17em; line-height: 1.4; text-align: center; width: calc(100% - (var(--gap-h-c51aa7c9-0757-4931-a6bc-185db81bd19d) * 0)); max-width: calc(100% - (var(--gap-h-c51aa7c9-0757-4931-a6bc-185db81bd19d) * 0)); justify-content: center; } .sd.st-2184202b-f8fb-4353-af9c-03b76a62ce1e { background: rgba(255, 211, 211, 0); color: #333333; font-family: var(--s-font-ff98f853); font-size: 20px; font-weight: 400; height: auto; line-height: 1.4; margin: 5px 0px 0px 0px; padding: 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.contact { align-content: flex-start; align-items: flex-start; background: #000000ff; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; padding: 120px 40px; width: 1280px; max-width: 100%; } @media screen and (max-width: 540px) { .sd.contact { padding: 80px 20px; } } .sd.contact-inner { padding: 120px 40px; width: 1280px; height: auto; flex-direction: column; flex-wrap: nowrap; align-content: flex-start; align-items: flex-start; justify-content: center; max-width: 100%; } @media screen and (max-width: 540px) { .sd.contact-inner { padding: 80px 20px; flex-direction: column; } } .sd.contact-CONTACT { background: rgba(176, 255, 154, 0); color: #ffffffff; flex: none; font-family: var(--s-font-8986a4d9); font-size: 48px; font-weight: 400; height: auto; line-height: 1.3; text-align: left; width: 50%; max-width: 50%; justify-content: flex-start; } @media screen and (max-width: 976px) { .sd.contact-CONTACT { flex: none; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.contact-CONTACT { flex: none; font-size: 28px; height: 43%; width: 100%; max-width: 100%; } } .sd.contact-header { background: #ffffffff; flex: none; height: 1px; width: 100%; max-width: 100%; } .sd.contact-content { align-content: center; align-items: center; background: #ffffff00; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 30px; height: auto; justify-content: center; margin: 10px 0px 0px 0px; padding: 0px 0px 40px 0px; width: 100%; --gap-h-029af337-1906-40b9-b110-ed24856569d7: 0px; --gap-v-029af337-1906-40b9-b110-ed24856569d7: 30px; --gap-uuid: 029af337-1906-40b9-b110-ed24856569d7; max-width: 100%; } .sd.contact-content.appear { opacity: 0; transform: translate(0px, 20px); transition-delay: 300ms; transition-duration: 600ms; --gap-h-029af337-1906-40b9-b110-ed24856569d7: 0px; --gap-v-029af337-1906-40b9-b110-ed24856569d7: 30px; } .sd.contact-content.appear-active { transition-delay: 300ms; transition-duration: 600ms; } @media screen and (max-width: 976px) { .sd.contact-content { flex-direction: column; flex-wrap: nowrap; gap: 20px; --gap-h-029af337-1906-40b9-b110-ed24856569d7: 0px; --gap-v-029af337-1906-40b9-b110-ed24856569d7: 20px; } } @media screen and (max-width: 540px) { .sd.contact-content { flex-direction: column; flex-wrap: nowrap; --gap-h-029af337-1906-40b9-b110-ed24856569d7: 0px; --gap-v-029af337-1906-40b9-b110-ed24856569d7: 30px; } } .sd.contact-message { align-content: flex-start; align-items: flex-start; background: rgba(253, 121, 121, 0); flex: none; flex-direction: column; flex-wrap: nowrap; gap: 20px; height: auto; justify-content: flex-start; padding: 0px; width: calc(100% - (var(--gap-h-029af337-1906-40b9-b110-ed24856569d7) * 0)); --gap-h-a1e6e2b1-005a-41ef-9de8-7d19aca50630: 0px; --gap-v-a1e6e2b1-005a-41ef-9de8-7d19aca50630: 20px; --gap-uuid: a1e6e2b1-005a-41ef-9de8-7d19aca50630; max-width: calc(100% - (var(--gap-h-029af337-1906-40b9-b110-ed24856569d7) * 0)); } @media screen and (max-width: 540px) { .sd.contact-message { flex: none; width: 100%; --gap-h-a1e6e2b1-005a-41ef-9de8-7d19aca50630: 0px; --gap-v-a1e6e2b1-005a-41ef-9de8-7d19aca50630: 20px; } } .sd.contact-text { background: rgba(255, 189, 249, 0); color: #ffffffff; flex: none; font-family: var(--s-font-ff98f853); font-size: 20px; font-weight: 400; height: auto; line-height: 1.5; text-align: left; width: calc(100% - (var(--gap-h-a1e6e2b1-005a-41ef-9de8-7d19aca50630) * 0)); max-width: calc(100% - (var(--gap-h-a1e6e2b1-005a-41ef-9de8-7d19aca50630) * 0)); justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.contact-text { font-size: 16px; } } @media screen and (max-width: 321px) { .sd.contact-text { font-size: 14px; } } .sd.contact-links { align-content: center; align-items: center; background: #eeeeee00; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 20px; height: auto; justify-content: center; margin: 0px 10px; width: calc(100% - 20px); --gap-h-f8426a1e-e966-4736-8923-442b9ea850b1: 20px; --gap-v-f8426a1e-e966-4736-8923-442b9ea850b1: 0px; --gap-uuid: f8426a1e-e966-4736-8923-442b9ea850b1; max-width: calc(100% - 20px); } @media screen and (max-width: 1140px) { .sd.contact-links { padding: 0px; --gap-h-f8426a1e-e966-4736-8923-442b9ea850b1: 20px; --gap-v-f8426a1e-e966-4736-8923-442b9ea850b1: 0px; } } @media screen and (max-width: 976px) { .sd.contact-links { flex-direction: column; flex-wrap: nowrap; --gap-h-f8426a1e-e966-4736-8923-442b9ea850b1: 0px; --gap-v-f8426a1e-e966-4736-8923-442b9ea850b1: 20px; } } @media screen and (max-width: 540px) { .sd.contact-links { flex: none; flex-direction: column; flex-wrap: nowrap; gap: 20px; height: auto; padding: 0px 0px; --gap-h-f8426a1e-e966-4736-8923-442b9ea850b1: 0px; --gap-v-f8426a1e-e966-4736-8923-442b9ea850b1: 20px; } } .sd.contact-image { align-content: flex-end; align-items: flex-end; background: rgb(200, 200, 200); border-radius: 24px; flex: none; flex-direction: column; flex-wrap: nowrap; height: 180px; justify-content: flex-end; width: calc(34% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0.66)); max-width: calc(34% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0.66)); } .sd.contact-image:before { filter: grayscale(1); } .sd.contact-image:hover { transform: scale(1.05, 1.05); } .sd.contact-image:hover:before { filter: none; } @media screen and (max-width: 1140px) { .sd.contact-image:before { filter: grayscale(1); } .sd.contact-image { background: rgb(0, 0, 0); flex: none; width: 34%; } } @media screen and (max-width: 976px) { .sd.contact-image { height: 280px; width: calc(70% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0.3)); max-width: calc(70% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0.3)); } } @media screen and (max-width: 540px) { .sd.contact-image { height: 200px; width: calc(100% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0)); max-width: calc(100% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0)); } } @media screen and (max-width: 321px) { .sd.contact-image { border-radius: 12px 12px 12px 12px; flex: none; height: 120px; width: calc(100% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0)); max-width: calc(100% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0)); } } .sd.contact-text-2 { background: rgb(255, 255, 255); color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 20px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.contact-image:hover .sd.contact-text-2 { background: #ffffffff; color: #4edca1ff; font-size: 18px; transform: scale(1, 1); transform-origin: center center; } @media screen and (max-width: 540px) { .sd.contact-text-2 { font-size: 18px; } } .sd.contact-image-2 { align-content: flex-end; align-items: flex-end; background: rgb(200, 200, 200); border-radius: 24px; flex: none; flex-direction: column; flex-wrap: nowrap; height: 180px; justify-content: flex-end; width: calc(34% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0.66)); max-width: calc(34% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0.66)); } .sd.contact-image-2:before { filter: grayscale(1); } .sd.contact-image-2:hover { transform: scale(1.05, 1.05); } .sd.contact-image-2:hover:before { filter: none; } @media screen and (max-width: 1140px) { .sd.contact-image-2:before { filter: grayscale(1); } .sd.contact-image-2 { background: rgb(0, 0, 0); flex: none; width: 34%; } } @media screen and (max-width: 976px) { .sd.contact-image-2 { height: 280px; width: calc(70% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0.3)); max-width: calc(70% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0.3)); } } @media screen and (max-width: 540px) { .sd.contact-image-2 { height: 200px; width: calc(100% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0)); max-width: calc(100% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0)); } } @media screen and (max-width: 321px) { .sd.contact-image-2 { border-radius: 12px 12px 12px 12px; flex: none; height: 120px; width: calc(100% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0)); max-width: calc(100% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0)); } } .sd.contact-text-3 { background: rgb(255, 255, 255); color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 20px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.contact-image-2:hover .sd.contact-text-3 { background: #ffffffff; color: #4edca1ff; font-size: 18px; transform: scale(1, 1); transform-origin: center center; } @media screen and (max-width: 540px) { .sd.contact-text-3 { font-size: 18px; } } .sd.contact-image-3 { align-content: flex-end; align-items: flex-end; background: rgb(200, 200, 200); border-radius: 24px; flex: none; flex-direction: column; flex-wrap: nowrap; height: 180px; justify-content: flex-end; width: calc(34% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0.66)); max-width: calc(34% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0.66)); } .sd.contact-image-3:before { filter: grayscale(1); } .sd.contact-image-3:hover { transform: scale(1.05, 1.05); } .sd.contact-image-3:hover:before { filter: none; } @media screen and (max-width: 1140px) { .sd.contact-image-3:before { filter: grayscale(1); } .sd.contact-image-3 { background: rgb(0, 0, 0); flex: none; width: 34%; } } @media screen and (max-width: 976px) { .sd.contact-image-3 { height: 280px; width: calc(70% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0.3)); max-width: calc(70% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0.3)); } } @media screen and (max-width: 540px) { .sd.contact-image-3 { height: 200px; width: calc(100% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0)); max-width: calc(100% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0)); } } @media screen and (max-width: 321px) { .sd.contact-image-3 { border-radius: 12px 12px 12px 12px; flex: none; height: 120px; width: calc(100% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0)); max-width: calc(100% - (var(--gap-h-f8426a1e-e966-4736-8923-442b9ea850b1) * 0)); } } .sd.contact-text-4 { background: rgb(255, 255, 255); color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 20px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.contact-image-3:hover .sd.contact-text-4 { background: #ffffffff; color: #4edca1ff; font-size: 18px; transform: scale(1, 1); transform-origin: center center; } @media screen and (max-width: 540px) { .sd.contact-text-4 { font-size: 18px; } } .sd.st-8438af9b-d0bf-43ae-ace6-b581fa6b2298 { align-content: center; align-items: center; background: #ffffffff; border-radius: 0px 150px 0px 0px; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 40px; height: auto; justify-content: center; padding: 60px 0px; width: 100%; --gap-h-8438af9b-d0bf-43ae-ace6-b581fa6b2298: 0px; --gap-v-8438af9b-d0bf-43ae-ace6-b581fa6b2298: 40px; --gap-uuid: 8438af9b-d0bf-43ae-ace6-b581fa6b2298; max-width: 100%; } @media screen and (max-width: 976px) { .sd.st-8438af9b-d0bf-43ae-ace6-b581fa6b2298 { border-radius: 0px 100px 0px 0px; --gap-h-8438af9b-d0bf-43ae-ace6-b581fa6b2298: 0px; --gap-v-8438af9b-d0bf-43ae-ace6-b581fa6b2298: 40px; } } @media screen and (max-width: 540px) { .sd.st-8438af9b-d0bf-43ae-ace6-b581fa6b2298 { border-radius: 0px 60px 0px 0px; --gap-h-8438af9b-d0bf-43ae-ace6-b581fa6b2298: 0px; --gap-v-8438af9b-d0bf-43ae-ace6-b581fa6b2298: 40px; } } .sd.st-15f51032-482d-480d-b907-734ee0805427 { align-content: flex-start; align-items: flex-start; background: #f2c9a000; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 40px; height: auto; justify-content: center; padding: 0px 40px; width: 1280px; --gap-h-15f51032-482d-480d-b907-734ee0805427: 40px; --gap-v-15f51032-482d-480d-b907-734ee0805427: 0px; --gap-uuid: 15f51032-482d-480d-b907-734ee0805427; max-width: 100%; } @media screen and (max-width: 540px) { .sd.st-15f51032-482d-480d-b907-734ee0805427 { flex-direction: column; flex-wrap: nowrap; padding: 0px 20px; --gap-h-15f51032-482d-480d-b907-734ee0805427: 0px; --gap-v-15f51032-482d-480d-b907-734ee0805427: 40px; } } .sd.st-8d77f919-8ca1-4721-8a4c-44bccd8e39d6 { align-content: flex-start; align-items: flex-start; background: #8ec35b00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; width: calc(50% - (var(--gap-h-15f51032-482d-480d-b907-734ee0805427) * 0.5)); max-width: calc(50% - (var(--gap-h-15f51032-482d-480d-b907-734ee0805427) * 0.5)); } @media screen and (max-width: 540px) { .sd.st-8d77f919-8ca1-4721-8a4c-44bccd8e39d6 { flex: none; width: calc(100% - (var(--gap-h-15f51032-482d-480d-b907-734ee0805427) * 0)); max-width: calc(100% - (var(--gap-h-15f51032-482d-480d-b907-734ee0805427) * 0)); } } .sd.st-b293c83e-9129-427d-97e0-87a055c2e9e6 { background: rgba(255, 161, 161, 0.09); height: auto; width: 160px; max-width: 100%; } .sd.st-c6104521-e697-4f9d-9c47-5f5ffe725fd7 { background: rgba(255, 111, 111, 0); color: #000000ff; flex: none; font-family: var(--s-font-ff98f853); font-size: 16px; font-weight: 400; height: auto; line-height: 1.4; margin: 20px 0px 0px 0px; text-align: left; width: 100%; max-width: 100%; justify-content: flex-start; } .sd.st-d8effb0d-d86e-4755-9dc7-3600c3c6c90e { background: rgba(255, 138, 138, 0); color: #000000ff; flex: none; font-family: var(--s-font-3eb085da); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; margin: 5px 0px 0px 0px; text-align: left; width: 100%; max-width: 100%; justify-content: flex-start; } .sd.st-43076773-15af-4e3d-859c-d055c968c259 { align-content: flex-start; align-items: flex-start; background: #aabd8f00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; width: calc(50% - (var(--gap-h-15f51032-482d-480d-b907-734ee0805427) * 0.5)); max-width: calc(50% - (var(--gap-h-15f51032-482d-480d-b907-734ee0805427) * 0.5)); } @media screen and (max-width: 540px) { .sd.st-43076773-15af-4e3d-859c-d055c968c259 { flex: none; width: calc(100% - (var(--gap-h-15f51032-482d-480d-b907-734ee0805427) * 0)); max-width: calc(100% - (var(--gap-h-15f51032-482d-480d-b907-734ee0805427) * 0)); } } .sd.st-5777857f-a43f-40d9-92e3-52ba6c6547fc { align-content: center; align-items: center; background: #ff929200; border-bottom: 1px solid #000000; border-left: 0px solid #000000; border-right: 0px solid #000000; border-top: 0px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; height: 50px; justify-content: space-between; width: 100%; max-width: 100%; } .sd.st-5777857f-a43f-40d9-92e3-52ba6c6547fc:hover { opacity: 1; } .sd.st-c54cc23d-ac37-4d3e-9880-30ed513ffc32 { background: rgba(255, 184, 184, 0); color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-a21497f4-f20c-43f1-9a42-b5ff3884a1cc { background: rgba(255, 184, 184, 0); color: #000000ff; font-size: 24px; } .sd.st-5777857f-a43f-40d9-92e3-52ba6c6547fc:hover .sd.st-a21497f4-f20c-43f1-9a42-b5ff3884a1cc { transform: translate(10px, 0px); } .sd.st-479edff5-bdd0-4bbf-b1ef-f3bfe10d6908 { align-content: center; align-items: center; background: #ff929200; border-bottom: 1px solid #000000; border-left: 0px solid #000000; border-right: 0px solid #000000; border-top: 0px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; height: 50px; justify-content: space-between; width: 100%; max-width: 100%; } .sd.st-479edff5-bdd0-4bbf-b1ef-f3bfe10d6908:hover { opacity: 1; } .sd.st-47fc0a9d-6caf-4fc6-b1fb-ec5a123fe595 { background: rgba(255, 184, 184, 0); color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-fd646cbc-bbea-4857-9fff-c74844a8bb1a { background: rgba(255, 184, 184, 0); color: #000000ff; font-size: 24px; } .sd.st-479edff5-bdd0-4bbf-b1ef-f3bfe10d6908:hover .sd.st-fd646cbc-bbea-4857-9fff-c74844a8bb1a { transform: translate(10px, 0px); } .sd.st-0105e02b-abe3-4a10-b5a9-4ffacf326011 { align-content: center; align-items: center; background: #ff929200; border-bottom: 1px solid #000000; border-left: 0px solid #000000; border-right: 0px solid #000000; border-top: 0px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; height: 50px; justify-content: space-between; width: 100%; max-width: 100%; } .sd.st-0105e02b-abe3-4a10-b5a9-4ffacf326011:hover { opacity: 1; } .sd.st-8f08258d-c23b-4591-b542-086065b49a25 { background: rgba(255, 184, 184, 0); color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-7e1e6a50-23b2-4f4f-bcde-148720f99c47 { background: rgba(255, 184, 184, 0); color: #000000ff; font-size: 24px; } .sd.st-0105e02b-abe3-4a10-b5a9-4ffacf326011:hover .sd.st-7e1e6a50-23b2-4f4f-bcde-148720f99c47 { transform: translate(10px, 0px); } .sd.st-e38990f1-3c1a-47f1-83a6-f8a84b8ac951 { align-content: center; align-items: center; background: #ff929200; border-bottom: 1px solid #000000; border-left: 0px solid #000000; border-right: 0px solid #000000; border-top: 0px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; height: 50px; justify-content: space-between; width: 100%; max-width: 100%; } .sd.st-e38990f1-3c1a-47f1-83a6-f8a84b8ac951:hover { opacity: 1; } .sd.st-0f49b0d3-116e-4eaf-b6d1-09d7f063c9ef { background: rgba(255, 184, 184, 0); color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-ef1b49c0-6bb0-48f5-8e33-7bd4de11cc4d { background: rgba(255, 184, 184, 0); color: #000000ff; font-size: 24px; } .sd.st-e38990f1-3c1a-47f1-83a6-f8a84b8ac951:hover .sd.st-ef1b49c0-6bb0-48f5-8e33-7bd4de11cc4d { transform: translate(10px, 0px); } .sd.st-2edd3b58-d2b4-4ecb-ad12-bc5b0fca9d3e { align-content: center; align-items: center; background: #ff929200; border-bottom: 1px solid #000000; border-left: 0px solid #000000; border-right: 0px solid #000000; border-top: 0px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; height: 50px; justify-content: space-between; width: 100%; max-width: 100%; } .sd.st-2edd3b58-d2b4-4ecb-ad12-bc5b0fca9d3e:hover { opacity: 1; } .sd.st-b1d0f034-48e6-410d-9d2e-ee275a3d6d17 { background: rgba(255, 184, 184, 0); color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-ddaa6115-7bd5-457b-b6c9-72cfdd7eff60 { background: rgba(255, 184, 184, 0); color: #000000ff; font-size: 24px; } .sd.st-2edd3b58-d2b4-4ecb-ad12-bc5b0fca9d3e:hover .sd.st-ddaa6115-7bd5-457b-b6c9-72cfdd7eff60 { transform: translate(10px, 0px); } .sd.st-a4b9b9be-a034-4e74-872f-39ca25dbb1eb { align-content: center; align-items: center; background: #ff929200; border-bottom: 1px solid #000000; border-left: 0px solid #000000; border-right: 0px solid #000000; border-top: 0px solid #000000; flex: none; flex-direction: row; flex-wrap: nowrap; height: 50px; justify-content: space-between; width: 100%; max-width: 100%; } .sd.st-a4b9b9be-a034-4e74-872f-39ca25dbb1eb:hover { opacity: 1; } .sd.st-e8689236-019d-4a76-a9aa-098cd256af86 { background: rgba(255, 184, 184, 0); color: #000000ff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-1a238d54-0c21-463f-8f0a-53cbf042d6da { background: rgba(255, 184, 184, 0); color: #000000ff; font-size: 24px; } .sd.st-a4b9b9be-a034-4e74-872f-39ca25dbb1eb:hover .sd.st-1a238d54-0c21-463f-8f0a-53cbf042d6da { transform: translate(10px, 0px); } .sd.st-1004f14f-8845-45c6-aa29-0daeb6ff1e18 { background: rgba(255, 184, 184, 0); color: #000000ff; font-family: var(--s-font-3eb085da); font-size: 12px; font-weight: 400; height: auto; line-height: 1.4; margin: 40px 0px 0px 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-0e0a9978-6a57-4f1c-a94e-767e2d30c72a { align-content: center; align-items: center; background: #ffdba700; flex: none; flex-direction: row; flex-wrap: nowrap; height: auto; justify-content: space-between; padding: 0px 40px; width: 1280px; max-width: 100%; } @media screen and (max-width: 540px) { .sd.st-0e0a9978-6a57-4f1c-a94e-767e2d30c72a { padding: 0px 20px; } } .sd.st-c9ebab6e-00cb-4f63-8557-4cbb638c3fd4 { background: rgba(185, 255, 146, 0); color: #000000ff; font-family: var(--s-font-92a74d95); font-size: 13px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-bab907cd-dcd5-4c2b-a79a-b87ed31c8f56 { align-content: center; align-items: center; background: #99dd9900; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 20px; height: auto; justify-content: center; width: auto; --gap-h-bab907cd-dcd5-4c2b-a79a-b87ed31c8f56: 20px; --gap-v-bab907cd-dcd5-4c2b-a79a-b87ed31c8f56: 0px; --gap-uuid: bab907cd-dcd5-4c2b-a79a-b87ed31c8f56; max-width: 100%; } .sd.st-6f19d73f-47d0-443c-b0e9-e4f245246dd9 { background: rgba(255, 235, 192, 0); color: #222222; font-size: 24px; } .sd.st-5327d0eb-25fc-4440-a8b8-70e7c4d4862b { background: rgba(255, 235, 192, 0); border-radius: 0px; color: #222222; font-size: 24px; } body { background: #ffffff; transition: background 0.5s cubic-bezier(0.4, 0.4, 0, 1); } .sd.st-e61e9325-89da-41bb-8b35-e9cac09cd298 { align-content: center; align-items: center; background: rgba(0, 0, 0, 0.16); height: 100%; justify-content: flex-end; width: 100%; max-width: 100%; } .sd.st-a94f74ae-8967-4693-abc0-f7fd9e952d4b { align-content: center; align-items: center; background: #FFFFFF; border-radius: 10px; box-shadow: 0px 6px 15px 0px rgba(0, 0, 0, 0.2); flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0px; padding: 40px; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.st-a94f74ae-8967-4693-abc0-f7fd9e952d4b { padding: 40px 20px; } } .sd.st-26f3f677-87c3-4300-aeb2-7c2eea7bfbbf { align-content: flex-start; align-items: flex-start; background: #c6e8a500; flex: none; flex-direction: row; flex-wrap: nowrap; height: auto; justify-content: center; width: 100%; max-width: 100%; } @media screen and (max-width: 976px) { .sd.st-26f3f677-87c3-4300-aeb2-7c2eea7bfbbf { margin: -20px 0px 0px 0px; width: 100%; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.st-26f3f677-87c3-4300-aeb2-7c2eea7bfbbf { align-content: center; align-items: center; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; } } .sd.st-f964e27c-8684-456d-9d33-7c888aeb1fa5 { align-content: center; align-items: center; background: #eeeeee00; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; width: 50%; --gap-uuid: f964e27c-8684-456d-9d33-7c888aeb1fa5; --gap-h-f964e27c-8684-456d-9d33-7c888aeb1fa5: 0px; --gap-v-f964e27c-8684-456d-9d33-7c888aeb1fa5: 0px; max-width: 50%; } @media screen and (max-width: 540px) { .sd.st-f964e27c-8684-456d-9d33-7c888aeb1fa5 { flex: none; height: auto; width: 100%; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.st-f964e27c-8684-456d-9d33-7c888aeb1fa5 { gap: 10px; --gap-h-f964e27c-8684-456d-9d33-7c888aeb1fa5: 0px; --gap-v-f964e27c-8684-456d-9d33-7c888aeb1fa5: 10px; } } .sd.st-e4978341-41dd-4eca-88de-79577e6ec159 { border-radius: 0; box-shadow: none; flex: none; height: auto; width: calc(70% - (var(--gap-h-f964e27c-8684-456d-9d33-7c888aeb1fa5) * 0.3)); max-width: calc(70% - (var(--gap-h-f964e27c-8684-456d-9d33-7c888aeb1fa5) * 0.3)); } .sd.st-e4978341-41dd-4eca-88de-79577e6ec159.appear { opacity: 0; transform: translate(0px, 3px); transition-delay: 400ms; transition-duration: 800ms; } .sd.st-e4978341-41dd-4eca-88de-79577e6ec159.appear-active { transition-delay: 400ms; transition-duration: 800ms; } @media screen and (max-width: 976px) { .sd.st-e4978341-41dd-4eca-88de-79577e6ec159 { flex: none; margin: 0px 0px 0px -20px; width: calc(80% - -20px - (var(--gap-h-f964e27c-8684-456d-9d33-7c888aeb1fa5) * 0.2)); max-width: calc(80% - -20px - (var(--gap-h-f964e27c-8684-456d-9d33-7c888aeb1fa5) * 0.2)); } } .sd.st-47f222b9-9396-4ea6-a688-ca6825c034af { align-content: center; align-items: center; flex: none; flex-direction: row; flex-wrap: nowrap; justify-content: center; margin: -200px 0px 0px 0px; padding: 0px; width: calc(100% - (var(--gap-h-f964e27c-8684-456d-9d33-7c888aeb1fa5) * 0)); max-width: calc(100% - (var(--gap-h-f964e27c-8684-456d-9d33-7c888aeb1fa5) * 0)); } @media screen and (max-width: 976px) { .sd.st-47f222b9-9396-4ea6-a688-ca6825c034af { margin: -150px 0px 0px 0px; width: calc(100% - (var(--gap-h-f964e27c-8684-456d-9d33-7c888aeb1fa5) * 0)); max-width: calc(100% - (var(--gap-h-f964e27c-8684-456d-9d33-7c888aeb1fa5) * 0)); } } @media screen and (max-width: 540px) { .sd.st-47f222b9-9396-4ea6-a688-ca6825c034af { margin: -150px 0px 0px 0px; } } @media screen and (max-width: 321px) { .sd.st-47f222b9-9396-4ea6-a688-ca6825c034af { margin: -60px 0px 0px 0px; width: calc(100% - (var(--gap-h-f964e27c-8684-456d-9d33-7c888aeb1fa5) * 0)); max-width: calc(100% - (var(--gap-h-f964e27c-8684-456d-9d33-7c888aeb1fa5) * 0)); } } .sd.st-ebe977ad-365d-4ccb-a24b-2222db704ee2 { align-content: flex-end; align-items: flex-end; background: #eeeeee00; flex: none; flex-direction: column; flex-wrap: nowrap; height: 1px; justify-content: center; width: 56%; max-width: 56%; } .sd.st-ad9931d0-3974-45c6-9311-fe0c88264a3d { background: rgb(148, 255, 147); border-bottom: 0px solid #000000; border-left: 0px solid #000000; border-radius: 50%; border-right: 0px solid #000000; border-top: 0px solid #000000; flex: none; height: auto; width: 170px; max-width: 100%; } .sd.st-ad9931d0-3974-45c6-9311-fe0c88264a3d.appear { opacity: 0; transform: translate(0px, 3px); transition-delay: 600ms; transition-duration: 800ms; } .sd.st-ad9931d0-3974-45c6-9311-fe0c88264a3d.appear-active { transition-delay: 600ms; transition-duration: 800ms; } @media screen and (max-width: 1140px) { .sd.st-ad9931d0-3974-45c6-9311-fe0c88264a3d { flex: none; width: 160px; max-width: 100%; } } @media screen and (max-width: 976px) { .sd.st-ad9931d0-3974-45c6-9311-fe0c88264a3d { flex: none; height: auto; width: 120px; max-width: 100%; } } @media screen and (max-width: 540px) { .sd.st-ad9931d0-3974-45c6-9311-fe0c88264a3d { flex: none; margin: 0px 0px 0px 0px; width: 120px; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.st-ad9931d0-3974-45c6-9311-fe0c88264a3d { flex: none; margin: -60px 0px 0px 0px; width: 80px; max-width: 100%; } } .sd.st-cf0adac0-b1cc-463d-bf2a-930912d9ed62 { align-content: flex-start; align-items: flex-start; background: #e3bebe00; flex: none; flex-direction: column; flex-wrap: nowrap; gap: 10px; height: 100%; justify-content: flex-start; padding: 10px; width: 50%; --gap-h-cf0adac0-b1cc-463d-bf2a-930912d9ed62: 0px; --gap-v-cf0adac0-b1cc-463d-bf2a-930912d9ed62: 10px; --gap-uuid: cf0adac0-b1cc-463d-bf2a-930912d9ed62; max-width: 50%; } @media screen and (max-width: 540px) { .sd.st-cf0adac0-b1cc-463d-bf2a-930912d9ed62 { flex: none; height: auto; overflow-x: hidden; overflow-y: auto; width: 100%; --gap-h-cf0adac0-b1cc-463d-bf2a-930912d9ed62: 0px; --gap-v-cf0adac0-b1cc-463d-bf2a-930912d9ed62: 10px; max-width: 100%; } } .sd.st-b4d5a62e-02d5-4a48-985d-766e6e9711b6 { align-content: center; align-items: center; background: #ffb9b900; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 10px; height: auto; justify-content: center; margin: 20px 0px 0px 0px; width: auto; --gap-h-b4d5a62e-02d5-4a48-985d-766e6e9711b6: 10px; --gap-v-b4d5a62e-02d5-4a48-985d-766e6e9711b6: 0px; --gap-uuid: b4d5a62e-02d5-4a48-985d-766e6e9711b6; max-width: 100%; } @media screen and (max-width: 976px) { .sd.st-b4d5a62e-02d5-4a48-985d-766e6e9711b6 { margin: 0px 0px 0px 0px; --gap-h-b4d5a62e-02d5-4a48-985d-766e6e9711b6: 10px; --gap-v-b4d5a62e-02d5-4a48-985d-766e6e9711b6: 0px; max-width: 100%; } } .sd.st-a60c8ae6-a1d5-43ba-bdf0-d4bfe0d0f35e { color: #333333; font-family: var(--s-font-ff98f853); font-size: 20px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-da955daa-9fd9-4e70-9206-a7ac61907e1f { color: #333333; font-family: var(--s-font-92a74d95); font-size: 20px; font-weight: 400; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-ccd73014-b990-4c9f-b847-0d7fc1b16577 { color: #333333; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 400; height: auto; line-height: 1.4; padding: 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-7f5d93af-5653-4eaf-8255-6b22da2f314e { color: #000000ff; font-family: var(--s-font-3eb085da); font-size: 15px; font-weight: 400; height: auto; line-height: 2; margin: 20px 0px 0px 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } @media screen and (max-width: 540px) { .sd.st-7f5d93af-5653-4eaf-8255-6b22da2f314e { font-size: 12px; height: 200px; overflow-x: visible; overflow-y: visible; position: sticky; top: 0px; z-index: 1; max-width: 100%; } } @media screen and (max-width: 321px) { .sd.st-7f5d93af-5653-4eaf-8255-6b22da2f314e { font-size: 12px; margin: 10px 0px 0px 0px; max-width: 100%; } } .sd.st-53196cac-eaea-4758-a3ab-3d7f3c64eb77 { align-content: flex-end; align-items: flex-end; background: #eeeeee00; display: none; flex: none; flex-direction: row; flex-wrap: nowrap; height: 384px; justify-content: flex-end; margin: -420px 0px 0px 0px; width: 100%; max-width: 100%; } @media screen and (max-width: 1140px) { .sd.st-53196cac-eaea-4758-a3ab-3d7f3c64eb77 { display: none; } } @media screen and (max-width: 976px) { .sd.st-53196cac-eaea-4758-a3ab-3d7f3c64eb77 { display: none; } } @media screen and (max-width: 540px) { .sd.st-53196cac-eaea-4758-a3ab-3d7f3c64eb77 { align-content: flex-start; align-items: flex-start; display: none; justify-content: flex-end; } } @media screen and (max-width: 321px) { .sd.st-53196cac-eaea-4758-a3ab-3d7f3c64eb77 { display: none; } } .sd.st-9e65183c-5e01-431a-ae02-d1b1a6ab3ed5 { background: #e66e6e00; flex: none; height: 67px; width: 55%; max-width: 55%; } @media screen and (max-width: 976px) { .sd.st-9e65183c-5e01-431a-ae02-d1b1a6ab3ed5 { flex: none; height: 1px; width: 55%; max-width: 55%; } } @media screen and (max-width: 540px) { .sd.st-9e65183c-5e01-431a-ae02-d1b1a6ab3ed5 { flex: none; width: 10%; max-width: 10%; } } .sd.st-77b55ea4-4cdc-44d1-8aa5-8241bc16ba07 { bottom: auto; color: #888888ff; font-size: 24px; left: auto; margin: 0 0 0 0; position: absolute; right: 20px; top: 10px; max-width: 100%; } .sd.st-8b250888-7a53-4f9f-bc8d-3e54d4629968 { align-content: flex-end; align-items: flex-end; background: rgba(0, 0, 0, 0.16); height: 100%; justify-content: flex-start; width: 100%; max-width: 100%; } .sd.st-bc90cfd1-339b-4b79-bd47-3d131c77cefa { align-content: flex-start; align-items: flex-start; background: #4edca1ff; border-radius: 10px; box-shadow: 0px 6px 15px 0px rgba(0, 0, 0, 0.2); flex: none; flex-direction: column; flex-wrap: nowrap; height: 100%; justify-content: flex-start; margin: 0px; padding: 40px; width: 600px; max-width: 100%; } @media screen and (max-width: 540px) { .sd.st-bc90cfd1-339b-4b79-bd47-3d131c77cefa { padding: 40px 20px; } } .sd.st-b162595f-13b5-4cb6-920e-19b5c6d5ce92 { align-content: center; align-items: center; background: #ffb3e300; flex: none; flex-direction: column; flex-wrap: nowrap; height: auto; justify-content: center; margin: 0px 0px 60px 0px; width: auto; max-width: 100%; } .sd.st-a730d9dd-c0b9-422c-9f7a-55b4b717e8f6 { flex: none; height: auto; width: 140px; max-width: 100%; } .sd.st-a03934d6-8fbb-4568-b3ec-58347881dd2a { align-content: center; align-items: center; background: #72f44300; flex: none; flex-direction: row; flex-wrap: wrap; gap: 25px 0px; height: auto; justify-content: flex-start; margin: 0px 0px 30px 0px; width: 100%; --gap-h-a03934d6-8fbb-4568-b3ec-58347881dd2a: 0px; --gap-v-a03934d6-8fbb-4568-b3ec-58347881dd2a: 25px; --gap-uuid: a03934d6-8fbb-4568-b3ec-58347881dd2a; max-width: 100%; } .sd.st-0f4a38a1-a43e-4b04-99d6-3cf7cffc35e1 { align-content: flex-start; align-items: flex-start; background: #ffb3e300; flex: none; flex-direction: column; flex-wrap: nowrap; height: 59px; justify-content: center; width: calc(50% - (var(--gap-h-a03934d6-8fbb-4568-b3ec-58347881dd2a) * 0.5)); max-width: calc(50% - (var(--gap-h-a03934d6-8fbb-4568-b3ec-58347881dd2a) * 0.5)); } .sd.st-997c46bf-23c1-4cc2-b73b-b3c6520c4db6 { background: rgba(255, 180, 56, 0); color: #ffffffff; font-family: var(--s-font-92a74d95); font-size: 20px; font-weight: 700; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-957c22c6-5c6d-4e55-a43e-ccdfe09a3c22 { background: rgba(255, 180, 56, 0); color: #ffffffff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 700; height: auto; line-height: 1.4; padding: 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-dde6097c-ffb1-440d-adcb-37560a95cff7 { align-content: flex-start; align-items: flex-start; background: #ffb3e300; flex: none; flex-direction: column; flex-wrap: nowrap; height: 59px; justify-content: center; width: calc(50% - (var(--gap-h-a03934d6-8fbb-4568-b3ec-58347881dd2a) * 0.5)); max-width: calc(50% - (var(--gap-h-a03934d6-8fbb-4568-b3ec-58347881dd2a) * 0.5)); } .sd.st-3a0dadb3-307a-465d-9d2a-2a3002d07109 { background: rgba(255, 180, 56, 0); color: #ffffffff; font-family: var(--s-font-92a74d95); font-size: 20px; font-weight: 700; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-cab8df90-649c-4edb-8384-9f2f69565ed6 { background: rgba(255, 180, 56, 0); color: #ffffffff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 700; height: auto; line-height: 1.4; padding: 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-083ac9e4-9c85-4b4d-a3a2-c14742721b3c { align-content: flex-start; align-items: flex-start; background: #ffb3e300; flex: none; flex-direction: column; flex-wrap: nowrap; height: 59px; justify-content: center; width: calc(50% - (var(--gap-h-a03934d6-8fbb-4568-b3ec-58347881dd2a) * 0.5)); max-width: calc(50% - (var(--gap-h-a03934d6-8fbb-4568-b3ec-58347881dd2a) * 0.5)); } .sd.st-34d3d039-d953-4280-a93f-e45f35a84513 { background: rgba(255, 180, 56, 0); color: #ffffffff; font-family: var(--s-font-92a74d95); font-size: 20px; font-weight: 700; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-cb1c00a0-f1e0-4ceb-a550-1fdd262c4f3e { background: rgba(255, 180, 56, 0); color: #ffffffff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 700; height: auto; line-height: 1.4; padding: 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-516d89b1-d067-4127-ae9d-f549269c6bc7 { align-content: flex-start; align-items: flex-start; background: #ffb3e300; flex: none; flex-direction: column; flex-wrap: nowrap; height: 59px; justify-content: center; width: calc(50% - (var(--gap-h-a03934d6-8fbb-4568-b3ec-58347881dd2a) * 0.5)); max-width: calc(50% - (var(--gap-h-a03934d6-8fbb-4568-b3ec-58347881dd2a) * 0.5)); } .sd.st-bccaca25-d4d8-44b0-ba39-8c64f2a38dbb { background: rgba(255, 180, 56, 0); color: #ffffffff; font-family: var(--s-font-92a74d95); font-size: 20px; font-weight: 700; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-79633e10-53ac-4eba-8783-1b4d03932e9c { background: rgba(255, 180, 56, 0); color: #ffffffff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 700; height: auto; line-height: 1.4; padding: 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-307e7db1-a797-4543-860b-7492c265d5f2 { align-content: flex-start; align-items: flex-start; background: #ffb3e300; flex: none; flex-direction: column; flex-wrap: nowrap; height: 59px; justify-content: center; width: calc(50% - (var(--gap-h-a03934d6-8fbb-4568-b3ec-58347881dd2a) * 0.5)); max-width: calc(50% - (var(--gap-h-a03934d6-8fbb-4568-b3ec-58347881dd2a) * 0.5)); } .sd.st-d0c1ade6-9001-4feb-9175-ed6c4543f1cc { background: rgba(255, 180, 56, 0); color: #ffffffff; font-family: var(--s-font-92a74d95); font-size: 20px; font-weight: 700; height: auto; line-height: 1.4; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-a5779c21-1e7c-4814-b104-66adfe79a38d { background: rgba(255, 180, 56, 0); color: #ffffffff; font-family: var(--s-font-ff98f853); font-size: 15px; font-weight: 700; height: auto; line-height: 1.4; padding: 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-c8235cda-f50c-46d0-879f-ed2bebcc9469 { align-content: center; align-items: center; background: #EEEEEE; border-radius: 25px; flex: none; flex-direction: row; flex-wrap: nowrap; height: 50px; justify-content: center; margin: 0px 0px 30px 0px; width: 100%; max-width: 100%; } .sd.st-216342bf-36ae-4428-bf0a-58ef30e81c59 { color: #4edca1ff; font-size: 24px; padding: 0px; } .sd.st-f7bfe1b2-26c1-4dbc-a87d-fc4ce23a13df { color: #4edca1ff; font-family: var(--s-font-ff98f853); font-size: 16px; font-weight: 400; height: auto; line-height: 1.4; margin: 0px 0px 0px 5px; text-align: left; width: auto; max-width: calc(100% - 5px); justify-content: flex-start; } .sd.st-4368b198-ead5-4a15-9903-7ee2d56ce293 { background: #ffb3e300; color: #ffffffff; font-family: var(--s-font-92a74d95); font-size: 13px; font-weight: 400; height: auto; line-height: 1.4; margin: 0px 0px 20px 0px; text-align: left; width: auto; max-width: 100%; justify-content: flex-start; } .sd.st-0f91ecf3-552d-4df3-9300-8899465ae595 { align-content: center; align-items: center; background: #ffb3e300; flex: none; flex-direction: row; flex-wrap: nowrap; gap: 20px; height: 55px; justify-content: center; width: 152px; --gap-h-0f91ecf3-552d-4df3-9300-8899465ae595: 20px; --gap-v-0f91ecf3-552d-4df3-9300-8899465ae595: 0px; --gap-uuid: 0f91ecf3-552d-4df3-9300-8899465ae595; max-width: 100%; } .sd.st-5599eca8-4c24-4e4c-bcab-8caaa73cbc6e { background: rgba(251, 158, 6, 0); color: #ffffffff; font-size: 24px; } .sd.st-dd796217-e08b-470f-b713-e7452e3b8bdd { background: rgba(251, 158, 6, 0); color: #ffffffff; font-size: 24px; } .sd.st-69197516-a08f-45e0-95b7-f91b262e624f { align-content: center; align-items: center; background: #71f0ff00; border-radius: 50%; bottom: auto; flex: none; flex-direction: column; flex-wrap: nowrap; height: 50px; justify-content: center; left: auto; margin: 0 0 0 0; position: absolute; right: 40px; top: 15px; width: 50px; max-width: 100%; } @media screen and (max-width: 540px) { .sd.st-69197516-a08f-45e0-95b7-f91b262e624f { right: 20px; } } .sd.st-3643032b-dee8-4a30-956f-0c93b217fdf7 { color: #ffffffff; font-size: 24px; margin: 0px 0px 0px 0px; max-width: 100%; } .sd.top-3-image:before { background-image: url("https://storage.googleapis.com/studio-design-asset-files/projects/NxqgYnwrW1/s-1200x1200_v-fms_webp_2191103b-9193-4756-bc7c-adeeab15c933.webp") } .sd.contact-image:before { background-image: url("https://storage.googleapis.com/studio-design-asset-files/projects/NxqgYnwrW1/s-1200x800_v-fms_webp_a08cc185-ae4c-450b-8d14-9d44ae0de74a_small.webp") } .sd.contact-image-2:before { background-image: url("https://storage.googleapis.com/studio-design-asset-files/projects/NxqgYnwrW1/s-1200x800_v-fms_webp_073e9eda-1651-4b41-b1f7-05fb60febf89_small.webp") } .sd.contact-image-3:before { background-image: url("https://storage.googleapis.com/studio-design-asset-files/projects/NxqgYnwrW1/s-1200x800_v-fms_webp_8776f0a5-fc85-430a-8abc-6802af37692e_small.webp") } :root { --s-font-92a74d95: Lato; --s-font-ff98f853: 'こぶりなゴシック W6 JIS2004'; --s-font-8986a4d9: Poppins; --s-font-3eb085da: 'こぶりなゴシック W3 JIS2004'; } :host { --color-base-100: var(--color-base-100); --color-base-200: var(--color-base-200); --color-base-250: var(--color-base-250); --color-base-300: var(--color-base-300); --color-base-400: var(--color-base-400); --color-base-500: var(--color-base-500); --color-base-600: var(--color-base-600); --color-base-700: var(--color-base-700) } .light, [data-mode=light] { --color-base-100: 255 255 255; --color-base-150: 250 250 255; --color-base-200: 246 245 250; --color-base-250: 237 236 244; --color-base-300: 227 226 237; --color-base-400: 176 174 208; --color-base-500: 90 93 141; --color-base-600: 0 8 82; --color-base-700: 1 1 50 } .dark, [data-mode=dark] { --color-base-100: 18 18 18; --color-base-150: 23 23 18; --color-base-200: 34 34 34; --color-base-250: 43 43 43; --color-base-300: 53 53 53; --color-base-400: 116 114 114; --color-base-500: 209 209 209; --color-base-600: 237 237 237; --color-base-700: 255 255 255 } *, :before, :after { --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-gradient-from-position: ; --tw-gradient-via-position: ; --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgb(147 197 253 / .5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; --tw-contain-size: ; --tw-contain-layout: ; --tw-contain-paint: ; --tw-contain-style: } ::backdrop { --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-gradient-from-position: ; --tw-gradient-via-position: ; --tw-gradient-to-position: ; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgb(147 197 253 / .5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; --tw-contain-size: ; --tw-contain-layout: ; --tw-contain-paint: ; --tw-contain-style: } *, :before, :after { box-sizing: border-box; border-width: 0; border-style: solid; border-color: #e5e7eb } :before, :after { --tw-content: "" } html, :host { line-height: 1.5; -webkit-text-size-adjust: 100%; -moz-tab-size: 4; -o-tab-size: 4; tab-size: 4; font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", Segoe UI Symbol, "Noto Color Emoji"; font-feature-settings: normal; font-variation-settings: normal; -webkit-tap-highlight-color: transparent } body { margin: 0; line-height: inherit } hr { height: 0; color: inherit; border-top-width: 1px } abbr:where([title]) { -webkit-text-decoration: underline dotted; text-decoration: underline dotted } h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit } a { color: inherit; text-decoration: inherit } b, strong { font-weight: bolder } code, kbd, samp, pre { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace; font-feature-settings: normal; font-variation-settings: normal; font-size: 1em } small { font-size: 80% } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline } sub { bottom: -.25em } sup { top: -.5em } table { text-indent: 0; border-color: inherit; border-collapse: collapse } button, input, optgroup, select, textarea { font-family: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-size: 100%; font-weight: inherit; line-height: inherit; letter-spacing: inherit; color: inherit; margin: 0; padding: 0 } button, select { text-transform: none } button, input:where([type=button]), input:where([type=reset]), input:where([type=submit]) { -webkit-appearance: button; background-color: transparent; background-image: none } :-moz-focusring { outline: auto } :-moz-ui-invalid { box-shadow: none } progress { vertical-align: baseline } ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto } [type=search] { -webkit-appearance: textfield; outline-offset: -2px } ::-webkit-search-decoration { -webkit-appearance: none } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit } summary { display: list-item } blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre { margin: 0 } fieldset { margin: 0; padding: 0 } legend { padding: 0 } ol, ul, menu { list-style: none; margin: 0; padding: 0 } dialog { padding: 0 } textarea { resize: vertical } input::-moz-placeholder, textarea::-moz-placeholder { opacity: 1; color: #9ca3af } input::placeholder, textarea::placeholder { opacity: 1; color: #9ca3af } button, [role=button] { cursor: pointer } :disabled { cursor: default } img, svg, video, canvas, audio, iframe, embed, object { display: block; vertical-align: middle } img, video { max-width: 100%; height: auto } [hidden]:where(:not([hidden=until-found])) { display: none } @supports (-moz-appearance:none) { * { scrollbar-color: initial; scrollbar-width: initial } } .tiptap>p.is-empty:before { --tw-text-opacity: 1; color: rgba(var(--color-base-400, 176 174 208) / var(--tw-text-opacity, 1)) } .tiptap>p.is-empty:before { content: attr(data-placeholder); float: left; height: 0; pointer-events: none } .container { width: 100% } .pointer-events-none { pointer-events: none } .pointer-events-auto { pointer-events: auto } .\!visible { visibility: visible !important } .visible { visibility: visible } .invisible { visibility: hidden } .collapse { visibility: collapse } .fixed { position: fixed } .absolute { position: absolute } .relative { position: relative } .sticky { position: sticky } .inset-0 { top: 0; right: 0; bottom: 0; left: 0 } .-bottom-1 { bottom: -.25rem } .-right-1 { right: -.25rem } .bottom-0 { bottom: 0 } .bottom-2 { bottom: .5rem } .bottom-4 { bottom: 1rem } .bottom-\[2px\] { bottom: 2px } .bottom-\[calc\(100\%\+16px\)\] { bottom: calc(100% + 16px) } .left-0 { left: 0 } .left-1\/2 { left: 50% } .left-2 { left: .5rem } .left-4 { left: 1rem } .left-\[-80px\] { left: -80px } .left-\[50\%\] { left: 50% } .right-0 { right: 0 } .right-2 { right: .5rem } .right-4 { right: 1rem } .right-5 { right: 1.25rem } .right-6 { right: 1.5rem } .right-\[var\(--spacing-large\)\] { right: var(--spacing-large) } .right-m { right: 1rem } .right-s { right: .5rem } .top-0 { top: 0 } .top-1\/2 { top: 50% } .top-2 { top: .5rem } .top-4 { top: 1rem } .top-6 { top: 1.5rem } .top-\[2px\] { top: 2px } .top-\[50\%\] { top: 50% } .top-\[calc\(var\(--top-position\)\+var\(--spacing-large\)\)\] { top: calc(var(--top-position) + var(--spacing-large)) } .top-s { top: .5rem } .z-10 { z-index: 10 } .z-50 { z-index: 50 } .z-\[10000\] { z-index: 10000 } .z-\[1000\] { z-index: 1000 } .z-\[1001\] { z-index: 1001 } .z-\[100\] { z-index: 100 } .z-\[110\] { z-index: 110 } .z-\[1\] { z-index: 1 } .z-\[30001\] { z-index: 30001 } .z-\[89\] { z-index: 89 } .z-\[90\] { z-index: 90 } .z-\[91\] { z-index: 91 } .z-\[9999\] { z-index: 9999 } .m-0 { margin: 0 } .m-m { margin: 1rem } .mx-0 { margin-left: 0; margin-right: 0 } .mx-4 { margin-left: 1rem; margin-right: 1rem } .mx-6 { margin-left: 1.5rem; margin-right: 1.5rem } .mx-8 { margin-left: 2rem; margin-right: 2rem } .mx-auto { margin-left: auto; margin-right: auto } .my-2 { margin-top: .5rem; margin-bottom: .5rem } .my-3 { margin-top: .75rem; margin-bottom: .75rem } .my-4 { margin-top: 1rem; margin-bottom: 1rem } .-mt-0\.5 { margin-top: -.125rem } .-mt-2 { margin-top: -.5rem } .mb-3 { margin-bottom: .75rem } .mb-4 { margin-bottom: 1rem } .mb-8 { margin-bottom: 2rem } .mb-l { margin-bottom: 1.5rem } .mb-xs { margin-bottom: .25rem } .ml-1 { margin-left: .25rem } .ml-2 { margin-left: .5rem } .ml-3 { margin-left: .75rem } .ml-s { margin-left: .5rem } .mr-2 { margin-right: .5rem } .mr-3 { margin-right: .75rem } .mt-10 { margin-top: 2.5rem } .mt-2 { margin-top: .5rem } .mt-4 { margin-top: 1rem } .mt-6, .mt-l { margin-top: 1.5rem } .mt-s { margin-top: .5rem } .box-border { box-sizing: border-box } .block { display: block } .inline-block { display: inline-block } .inline { display: inline } .flex { display: flex } .inline-flex { display: inline-flex } .table { display: table } .table-cell { display: table-cell } .table-header-group { display: table-header-group } .table-row-group { display: table-row-group } .table-row { display: table-row } .grid { display: grid } .contents { display: contents } .\!hidden { display: none !important } .hidden { display: none } .h-0 { height: 0px } .h-1 { height: .25rem } .h-10 { height: 2.5rem } .h-12 { height: 3rem } .h-14 { height: 3.5rem } .h-3 { height: .75rem } .h-4 { height: 1rem } .h-5 { height: 1.25rem } .h-6 { height: 1.5rem } .h-7 { height: 1.75rem } .h-8 { height: 2rem } .h-9 { height: 2.25rem } .h-96 { height: 24rem } .h-\[16px\] { height: 16px } .h-\[17px\] { height: 17px } .h-\[184px\] { height: 184px } .h-\[1px\] { height: 1px } .h-\[212px\] { height: 212px } .h-\[25px\] { height: 25px } .h-\[28px\] { height: 28px } .h-\[2px\] { height: 2px } .h-\[30px\] { height: 30px } .h-\[32px\] { height: 32px } .h-\[36px\] { height: 36px } .h-\[37px\] { height: 37px } .h-\[54px\] { height: 54px } .h-\[60px\] { height: 60px } .h-\[62px\] { height: 62px } .h-\[74px\] { height: 74px } .h-fit { height: -moz-fit-content; height: fit-content } .h-full { height: 100% } .h-max { height: -moz-max-content; height: max-content } .h-xl { height: 2rem } .max-h-\[320px\] { max-height: 320px } .max-h-\[500px\] { max-height: 500px } .max-h-\[70\%\] { max-height: 70% } .max-h-full { max-height: 100% } .min-h-\[192px\] { min-height: 192px } .min-h-\[37px\] { min-height: 37px } .min-h-\[40px\] { min-height: 40px } .min-h-\[45px\] { min-height: 45px } .\!w-\[280px\] { width: 280px !important } .\!w-\[calc\(100\%-3px\)\] { width: calc(100% - 3px) !important } .w-0 { width: 0px } .w-10 { width: 2.5rem } .w-12 { width: 3rem } .w-14 { width: 3.5rem } .w-3 { width: .75rem } .w-4 { width: 1rem } .w-5 { width: 1.25rem } .w-6 { width: 1.5rem } .w-7 { width: 1.75rem } .w-8 { width: 2rem } .w-9 { width: 2.25rem } .w-\[200px\] { width: 200px } .w-\[220px\] { width: 220px } .w-\[222px\] { width: 222px } .w-\[350px\] { width: 350px } .w-\[390px\] { width: 390px } .w-\[45px\] { width: 45px } .w-\[492px\] { width: 492px } .w-\[514px\] { width: 514px } .w-\[589px\] { width: 589px } .w-\[60px\] { width: 60px } .w-\[647px\] { width: 647px } .w-\[70px\] { width: 70px } .w-\[9\.33px\] { width: 9.33px } .w-\[calc\(100\%-32px\)\] { width: calc(100% - 32px) } .w-\[var\(--chip-input-value-length\)\] { width: var(--chip-input-value-length) } .w-auto { width: auto } .w-fit { width: -moz-fit-content; width: fit-content } .w-full { width: 100% } .min-w-0 { min-width: 0px } .min-w-\[200px\] { min-width: 200px } .min-w-\[274px\] { min-width: 274px } .min-w-\[280px\] { min-width: 280px } .min-w-\[720px\] { min-width: 720px } .min-w-fit { min-width: -moz-fit-content; min-width: fit-content } .max-w-\[1190px\] { max-width: 1190px } .max-w-\[212px\] { max-width: 212px } .max-w-\[260px\] { max-width: 260px } .max-w-\[340px\] { max-width: 340px } .max-w-\[345px\] { max-width: 345px } .max-w-\[390px\] { max-width: 390px } .max-w-\[393px\] { max-width: 393px } .max-w-\[600px\] { max-width: 600px } .max-w-\[none\] { max-width: none } .max-w-full { max-width: 100% } .max-w-sm { max-width: 24rem } .flex-1 { flex: 1 1 0% } .flex-shrink-0, .shrink-0 { flex-shrink: 0 } .grow { flex-grow: 1 } .border-separate { border-collapse: separate } .border-spacing-x-0 { --tw-border-spacing-x: 0px; border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y) } .border-spacing-y-s { --tw-border-spacing-y: .5rem; border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y) } .origin-bottom { transform-origin: bottom } .origin-top { transform-origin: top } .-translate-x-1\/2 { --tw-translate-x: -50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) } .-translate-y-1\/2 { --tw-translate-y: -50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) } .translate-x-\[-280px\] { --tw-translate-x: -280px; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) } .translate-x-\[-50\%\] { --tw-translate-x: -50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) } .translate-y-\[-50\%\] { --tw-translate-y: -50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) } .transform { transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) } @keyframes growFromBottom { 0% { opacity: 0; transform: scale(.9) translateY(16px) } to { opacity: 1; transform: scale(1) translateY(0) } } .animate-grow-from-bottom { animation: growFromBottom .4s cubic-bezier(.28, .84, .42, 1) } @keyframes growFromTop { 0% { opacity: 0; transform: scale(.9) translate(-50%, -16px) } to { opacity: 1; transform: scale(1)translate(-50%) } } .animate-grow-from-top { animation: growFromTop .4s cubic-bezier(.28, .84, .42, 1) } @keyframes pulse { 50% { opacity: .5 } } .animate-pulse { animation: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite } @keyframes spin { to { transform: rotate(360deg) } } .animate-spin { animation: spin 1s linear infinite } .cursor-not-allowed { cursor: not-allowed } .cursor-pointer { cursor: pointer } .touch-none { touch-action: none } .select-none { -webkit-user-select: none; -moz-user-select: none; user-select: none } .select-text { -webkit-user-select: text; -moz-user-select: text; user-select: text } .resize { resize: both } .list-none { list-style-type: none } .appearance-none { -webkit-appearance: none; -moz-appearance: none; appearance: none } .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)) } .flex-row { flex-direction: row } .flex-row-reverse { flex-direction: row-reverse } .flex-col { flex-direction: column } .flex-wrap { flex-wrap: wrap } .place-content-center { place-content: center } .content-start { align-content: flex-start } .items-start { align-items: flex-start } .items-end { align-items: flex-end } .items-center { align-items: center } .justify-start { justify-content: flex-start } .justify-end { justify-content: flex-end } .justify-center { justify-content: center } .justify-between { justify-content: space-between } .\!gap-s { gap: .5rem !important } .gap-1 { gap: .25rem } .gap-2 { gap: .5rem } .gap-3 { gap: .75rem } .gap-4 { gap: 1rem } .gap-6 { gap: 1.5rem } .gap-7 { gap: 1.75rem } .gap-8 { gap: 2rem } .gap-\[2px\] { gap: 2px } .gap-m { gap: 1rem } .gap-s { gap: .5rem } .gap-xs { gap: .25rem } .space-x-3>:not([hidden])~:not([hidden]) { --tw-space-x-reverse: 0; margin-right: calc(.75rem * var(--tw-space-x-reverse)); margin-left: calc(.75rem * calc(1 - var(--tw-space-x-reverse))) } .space-y-1>:not([hidden])~:not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(.25rem * calc(1 - var(--tw-space-y-reverse))); margin-bottom: calc(.25rem * var(--tw-space-y-reverse)) } .self-start { align-self: flex-start } .self-center { align-self: center } .overflow-auto { overflow: auto } .overflow-hidden { overflow: hidden } .overflow-visible { overflow: visible } .overflow-x-auto { overflow-x: auto } .overflow-y-auto { overflow-y: auto } .truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap } .whitespace-nowrap { white-space: nowrap } .text-wrap { text-wrap: wrap } .break-words { overflow-wrap: break-word } .break-all { word-break: break-all } .rounded { border-radius: .25rem } .rounded-2xl { border-radius: 1rem } .rounded-3xl { border-radius: 1.5rem } .rounded-\[3px\] { border-radius: 3px } .rounded-full { border-radius: 9999px } .rounded-lg { border-radius: .5rem } .rounded-md { border-radius: .375rem } .rounded-none { border-radius: 0 } .border { border-width: 1px } .border-0 { border-width: 0px } .border-2 { border-width: 2px } .border-4 { border-width: 4px } .border-\[1px\] { border-width: 1px } .border-y { border-top-width: 1px; border-bottom-width: 1px } .border-b-2 { border-bottom-width: 2px } .border-t { border-top-width: 1px } .border-solid { border-style: solid } .border-base-200 { --tw-border-opacity: 1; border-color: rgba(var(--color-base-200, 246 245 250) / var(--tw-border-opacity, 1)) } .border-base-250 { --tw-border-opacity: 1; border-color: rgba(var(--color-base-250, 237 236 244) / var(--tw-border-opacity, 1)) } .border-base-300 { --tw-border-opacity: 1; border-color: rgba(var(--color-base-300, 227 226 237) / var(--tw-border-opacity, 1)) } .border-base-400 { --tw-border-opacity: 1; border-color: rgba(var(--color-base-400, 176 174 208) / var(--tw-border-opacity, 1)) } .border-base-500 { --tw-border-opacity: 1; border-color: rgba(var(--color-base-500, 90 93 141) / var(--tw-border-opacity, 1)) } .border-base-600 { --tw-border-opacity: 1; border-color: rgba(var(--color-base-600, 0 8 82) / var(--tw-border-opacity, 1)) } .border-primary-400 { --tw-border-opacity: 1; border-color: rgba(var(--color-primary-400, 29 29 255) / var(--tw-border-opacity, 1)) } .border-purple-300 { --tw-border-opacity: 1; border-color: rgb(178 94 244 / var(--tw-border-opacity, 1)) } .border-red-300 { --tw-border-opacity: 1; border-color: rgb(237 49 93 / var(--tw-border-opacity, 1)) } .border-transparent { border-color: transparent } .border-white { --tw-border-opacity: 1; border-color: rgb(255 255 255 / var(--tw-border-opacity, 1)) } .border-t-transparent { border-top-color: transparent } .\!bg-ai-400 { --tw-bg-opacity: 1 !important; background-color: rgb(107 107 255 / var(--tw-bg-opacity, 1)) !important } .bg-\[\#01013166\] { background-color: #01013166 } .bg-base-100 { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-100, 255 255 255) / var(--tw-bg-opacity, 1)) } .bg-base-150 { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-150, 250 250 255) / var(--tw-bg-opacity, 1)) } .bg-base-200 { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-200, 246 245 250) / var(--tw-bg-opacity, 1)) } .bg-base-250 { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-250, 237 236 244) / var(--tw-bg-opacity, 1)) } .bg-base-300 { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-300, 227 226 237) / var(--tw-bg-opacity, 1)) } .bg-base-500 { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-500, 90 93 141) / var(--tw-bg-opacity, 1)) } .bg-base-600 { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-600, 0 8 82) / var(--tw-bg-opacity, 1)) } .bg-base-700\/50 { background-color: rgba(var(--color-base-700, 1 1 50) / .5) } .bg-black\/30 { background-color: #0000004d } .bg-black\/50 { background-color: #00000080 } .bg-green-100 { --tw-bg-opacity: 1; background-color: rgb(235 255 251 / var(--tw-bg-opacity, 1)) } .bg-green-400 { --tw-bg-opacity: 1; background-color: rgb(15 163 136 / var(--tw-bg-opacity, 1)) } .bg-light-blue-100 { --tw-bg-opacity: 1; background-color: rgb(244 250 255 / var(--tw-bg-opacity, 1)) } .bg-orange-100 { --tw-bg-opacity: 1; background-color: rgb(255 244 240 / var(--tw-bg-opacity, 1)) } .bg-primary-100 { --tw-bg-opacity: 1; background-color: rgba(var(--color-primary-100, 242 242 255) / var(--tw-bg-opacity, 1)) } .bg-primary-200 { --tw-bg-opacity: 1; background-color: rgba(var(--color-primary-200, 193 193 255) / var(--tw-bg-opacity, 1)) } .bg-primary-400 { --tw-bg-opacity: 1; background-color: rgba(var(--color-primary-400, 29 29 255) / var(--tw-bg-opacity, 1)) } .bg-primary-500 { --tw-bg-opacity: 1; background-color: rgba(var(--color-primary-500, 0 0 130) / var(--tw-bg-opacity, 1)) } .bg-purple-100 { --tw-bg-opacity: 1; background-color: rgb(249 241 255 / var(--tw-bg-opacity, 1)) } .bg-purple-300 { --tw-bg-opacity: 1; background-color: rgb(178 94 244 / var(--tw-bg-opacity, 1)) } .bg-red-100 { --tw-bg-opacity: 1; background-color: rgb(255 245 247 / var(--tw-bg-opacity, 1)) } .bg-red-300 { --tw-bg-opacity: 1; background-color: rgb(237 49 93 / var(--tw-bg-opacity, 1)) } .bg-red-50 { --tw-bg-opacity: 1; background-color: rgb(254 242 242 / var(--tw-bg-opacity, 1)) } .bg-slate-500 { --tw-bg-opacity: 1; background-color: rgb(100 116 139 / var(--tw-bg-opacity, 1)) } .bg-tertiary-100 { --tw-bg-opacity: 1; background-color: rgb(249 241 255 / var(--tw-bg-opacity, 1)) } .bg-transparent { background-color: transparent } .bg-white { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)) } .fill-base-100 { fill: rgba(var(--color-base-100, 255 255 255) / 1) } .fill-current { fill: currentColor } .fill-green-400 { fill: #0fa388 } .stroke-current { stroke: currentColor } .\!p-0 { padding: 0 !important } .p-0 { padding: 0 } .p-1 { padding: .25rem } .p-2 { padding: .5rem } .p-3 { padding: .75rem } .p-4 { padding: 1rem } .p-5 { padding: 1.25rem } .p-6 { padding: 1.5rem } .p-8 { padding: 2rem } .p-\[2px\] { padding: 2px } .p-m { padding: 1rem } .p-s { padding: .5rem } .p-xs { padding: .25rem } .\!px-2 { padding-left: .5rem !important; padding-right: .5rem !important } .px-1 { padding-left: .25rem; padding-right: .25rem } .px-2 { padding-left: .5rem; padding-right: .5rem } .px-3 { padding-left: .75rem; padding-right: .75rem } .px-4 { padding-left: 1rem; padding-right: 1rem } .px-6 { padding-left: 1.5rem; padding-right: 1.5rem } .px-8 { padding-left: 2rem; padding-right: 2rem } .px-m { padding-left: 1rem; padding-right: 1rem } .py-0\.5 { padding-top: .125rem; padding-bottom: .125rem } .py-1 { padding-top: .25rem; padding-bottom: .25rem } .py-2 { padding-top: .5rem; padding-bottom: .5rem } .py-3 { padding-top: .75rem; padding-bottom: .75rem } .py-4 { padding-top: 1rem; padding-bottom: 1rem } .py-5 { padding-top: 1.25rem; padding-bottom: 1.25rem } .py-s { padding-top: .5rem; padding-bottom: .5rem } .py-xs { padding-top: .25rem; padding-bottom: .25rem } .\!pr-1 { padding-right: .25rem !important } .pb-4 { padding-bottom: 1rem } .pb-7 { padding-bottom: 1.75rem } .pb-m { padding-bottom: 1rem } .pb-s { padding-bottom: .5rem } .pl-10 { padding-left: 2.5rem } .pl-2 { padding-left: .5rem } .pl-4 { padding-left: 1rem } .pl-8 { padding-left: 2rem } .pr-10 { padding-right: 2.5rem } .pr-8 { padding-right: 2rem } .pr-s { padding-right: .5rem } .pt-2 { padding-top: .5rem } .pt-4 { padding-top: 1rem } .pt-6 { padding-top: 1.5rem } .text-left { text-align: left } .text-center { text-align: center } .text-start { text-align: start } .align-text-bottom { vertical-align: text-bottom } .text-2xl { font-size: 1.5rem; line-height: 2rem } .text-2xs { font-size: .625rem } .text-3xl { font-size: 1.875rem; line-height: 2.25rem } .text-4xl { font-size: 2.25rem; line-height: 2.5rem } .text-\[10px\] { font-size: 10px } .text-\[12px\] { font-size: 12px } .text-\[13px\] { font-size: 13px } .text-\[14px\] { font-size: 14px } .text-\[15px\] { font-size: 15px } .text-\[18px\] { font-size: 18px } .text-\[21px\] { font-size: 21px } .text-\[24px\] { font-size: 24px } .text-\[36px\] { font-size: 36px } .text-base { font-size: 1rem; line-height: 1.5rem } .text-lg { font-size: 1.125rem; line-height: 1.75rem } .text-sm { font-size: .875rem; line-height: 1.25rem } .text-xl { font-size: 1.25rem; line-height: 1.75rem } .text-xs { font-size: .75rem; line-height: 1rem } .font-\[400\] { font-weight: 400 } .font-\[500\] { font-weight: 500 } .font-bold { font-weight: 700 } .font-medium { font-weight: 500 } .font-normal { font-weight: 400 } .font-semibold { font-weight: 600 } .uppercase { text-transform: uppercase } .capitalize { text-transform: capitalize } .italic { font-style: italic } .\!leading-4 { line-height: 1rem !important } .leading-5 { line-height: 1.25rem } .leading-\[1\.16\] { line-height: 1.16 } .leading-\[1\.2\] { line-height: 1.2 } .leading-\[1\.3\] { line-height: 1.3 } .leading-\[1\.4\] { line-height: 1.4 } .leading-\[18px\] { line-height: 18px } .leading-none { line-height: 1 } .leading-relaxed { line-height: 1.625 } .leading-snug { line-height: 1.375 } .leading-tight { line-height: 1.25 } .tracking-\[-1\%\] { letter-spacing: -1% } .tracking-\[-1\.5\%\] { letter-spacing: -1.5% } .tracking-\[-2\%\] { letter-spacing: -2% } .tracking-\[-4\%\] { letter-spacing: -4% } .tracking-normal { letter-spacing: 0em } .tracking-tight { letter-spacing: -.025em } .\!text-base-400 { --tw-text-opacity: 1 !important; color: rgba(var(--color-base-400, 176 174 208) / var(--tw-text-opacity, 1)) !important } .\!text-base-600 { --tw-text-opacity: 1 !important; color: rgba(var(--color-base-600, 0 8 82) / var(--tw-text-opacity, 1)) !important } .text-base-100 { --tw-text-opacity: 1; color: rgba(var(--color-base-100, 255 255 255) / var(--tw-text-opacity, 1)) } .text-base-200 { --tw-text-opacity: 1; color: rgba(var(--color-base-200, 246 245 250) / var(--tw-text-opacity, 1)) } .text-base-400 { --tw-text-opacity: 1; color: rgba(var(--color-base-400, 176 174 208) / var(--tw-text-opacity, 1)) } .text-base-500 { --tw-text-opacity: 1; color: rgba(var(--color-base-500, 90 93 141) / var(--tw-text-opacity, 1)) } .text-base-600 { --tw-text-opacity: 1; color: rgba(var(--color-base-600, 0 8 82) / var(--tw-text-opacity, 1)) } .text-base-700 { --tw-text-opacity: 1; color: rgba(var(--color-base-700, 1 1 50) / var(--tw-text-opacity, 1)) } .text-blue-400 { --tw-text-opacity: 1; color: rgba(var(--color-blue-400, 29 29 255) / var(--tw-text-opacity, 1)) } .text-blue-500 { --tw-text-opacity: 1; color: rgba(var(--color-blue-500, 0 0 130) / var(--tw-text-opacity, 1)) } .text-blue-600 { --tw-text-opacity: 1; color: rgb(37 99 235 / var(--tw-text-opacity, 1)) } .text-current { color: currentColor } .text-gray-600 { --tw-text-opacity: 1; color: rgb(75 85 99 / var(--tw-text-opacity, 1)) } .text-green-400 { --tw-text-opacity: 1; color: rgb(15 163 136 / var(--tw-text-opacity, 1)) } .text-green-500 { --tw-text-opacity: 1; color: rgb(3 129 94 / var(--tw-text-opacity, 1)) } .text-green-600 { --tw-text-opacity: 1; color: rgb(22 163 74 / var(--tw-text-opacity, 1)) } .text-light-blue-400 { --tw-text-opacity: 1; color: rgb(0 141 255 / var(--tw-text-opacity, 1)) } .text-orange-400 { --tw-text-opacity: 1; color: rgb(255 107 70 / var(--tw-text-opacity, 1)) } .text-orange-500 { --tw-text-opacity: 1; color: rgb(224 66 26 / var(--tw-text-opacity, 1)) } .text-pink-500 { --tw-text-opacity: 1; color: rgb(236 72 153 / var(--tw-text-opacity, 1)) } .text-primary-300 { --tw-text-opacity: 1; color: rgba(var(--color-primary-300, 133 133 255) / var(--tw-text-opacity, 1)) } .text-primary-400 { --tw-text-opacity: 1; color: rgba(var(--color-primary-400, 29 29 255) / var(--tw-text-opacity, 1)) } .text-primary-500 { --tw-text-opacity: 1; color: rgba(var(--color-primary-500, 0 0 130) / var(--tw-text-opacity, 1)) } .text-purple-300 { --tw-text-opacity: 1; color: rgb(178 94 244 / var(--tw-text-opacity, 1)) } .text-purple-500 { --tw-text-opacity: 1; color: rgb(119 63 133 / var(--tw-text-opacity, 1)) } .text-purple-600 { --tw-text-opacity: 1; color: rgb(147 51 234 / var(--tw-text-opacity, 1)) } .text-purple-800 { --tw-text-opacity: 1; color: rgb(107 33 168 / var(--tw-text-opacity, 1)) } .text-red-300 { --tw-text-opacity: 1; color: rgb(237 49 93 / var(--tw-text-opacity, 1)) } .text-red-400 { --tw-text-opacity: 1; color: rgb(181 3 44 / var(--tw-text-opacity, 1)) } .text-red-500 { --tw-text-opacity: 1; color: rgb(129 1 30 / var(--tw-text-opacity, 1)) } .text-red-600 { --tw-text-opacity: 1; color: rgb(220 38 38 / var(--tw-text-opacity, 1)) } .text-teal-500 { --tw-text-opacity: 1; color: rgb(20 184 166 / var(--tw-text-opacity, 1)) } .text-tertiary-200 { --tw-text-opacity: 1; color: rgb(202 155 239 / var(--tw-text-opacity, 1)) } .text-tertiary-300 { --tw-text-opacity: 1; color: rgb(178 94 244 / var(--tw-text-opacity, 1)) } .text-tertiary-500 { --tw-text-opacity: 1; color: rgb(119 63 133 / var(--tw-text-opacity, 1)) } .text-white { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)) } .text-yellow-500 { --tw-text-opacity: 1; color: rgb(234 179 8 / var(--tw-text-opacity, 1)) } .text-yellow-600 { --tw-text-opacity: 1; color: rgb(202 138 4 / var(--tw-text-opacity, 1)) } .underline { text-decoration-line: underline } .antialiased { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale } .opacity-0 { opacity: 0 } .opacity-30 { opacity: .3 } .opacity-40 { opacity: .4 } .opacity-50 { opacity: .5 } .opacity-65 { opacity: .65 } .shadow { --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1); --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) } .shadow-lg { --tw-shadow: 0px 5px 30px 0px rgba(var(--color-base-600) / .1); --tw-shadow-colored: 0px 5px 30px 0px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) } .shadow-md { --tw-shadow: 0px 5px 20px 0px rgba(var(--color-base-600) / .05); --tw-shadow-colored: 0px 5px 20px 0px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) } .shadow-sm { --tw-shadow: 0px 2px 20px 0px rgba(var(--color-base-600) / .03); --tw-shadow-colored: 0px 2px 20px 0px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) } .outline-none { outline: 2px solid transparent; outline-offset: 2px } .outline { outline-style: solid } .outline-\[4\.5px\] { outline-width: 4.5px } .outline-tertiary-400 { outline-color: #953bab } .ring-base-200 { --tw-ring-opacity: 1; --tw-ring-color: rgba(var(--color-base-200, 246 245 250) / var(--tw-ring-opacity, 1)) } .ring-primary-400\/10 { --tw-ring-color: rgba(var(--color-primary-400, 29 29 255) / .1) } .ring-purple-300\/10 { --tw-ring-color: rgb(178 94 244 / .1) } .ring-red-300\/10 { --tw-ring-color: rgb(237 49 93 / .1) } .blur { --tw-blur: blur(8px); filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) } .filter { filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) } .transition { transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-timing-function: cubic-bezier(.4, 0, .2, 1); transition-duration: .15s } .transition-\[background-color\] { transition-property: background-color; transition-timing-function: cubic-bezier(.4, 0, .2, 1); transition-duration: .15s } .transition-all { transition-property: all; transition-timing-function: cubic-bezier(.4, 0, .2, 1); transition-duration: .15s } .transition-colors { transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; transition-timing-function: cubic-bezier(.4, 0, .2, 1); transition-duration: .15s } .duration-200 { transition-duration: .2s } .duration-500 { transition-duration: .5s } .ease-in-out { transition-timing-function: cubic-bezier(.4, 0, .2, 1) } .ease-linear { transition-timing-function: linear } @keyframes enter { 0% { opacity: var(--tw-enter-opacity, 1); transform: translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0) scale3d(var(--tw-enter-scale, 1), var(--tw-enter-scale, 1), var(--tw-enter-scale, 1)) rotate(var(--tw-enter-rotate, 0)) } } @keyframes exit { to { opacity: var(--tw-exit-opacity, 1); transform: translate3d(var(--tw-exit-translate-x, 0), var(--tw-exit-translate-y, 0), 0) scale3d(var(--tw-exit-scale, 1), var(--tw-exit-scale, 1), var(--tw-exit-scale, 1)) rotate(var(--tw-exit-rotate, 0)) } } .duration-200 { animation-duration: .2s } .duration-500 { animation-duration: .5s } .ease-in-out { animation-timing-function: cubic-bezier(.4, 0, .2, 1) } .ease-linear { animation-timing-function: linear } .running { animation-play-state: running } .paused { animation-play-state: paused } .scrollbar::-webkit-scrollbar-track { background-color: var(--scrollbar-track); border-radius: var(--scrollbar-track-radius) } .scrollbar::-webkit-scrollbar-thumb { background-color: var(--scrollbar-thumb); border-radius: var(--scrollbar-thumb-radius) } .scrollbar::-webkit-scrollbar-corner { background-color: var(--scrollbar-corner); border-radius: var(--scrollbar-corner-radius) } @supports (-moz-appearance:none) { .scrollbar { scrollbar-width: auto; scrollbar-color: var(--scrollbar-thumb, initial) var(--scrollbar-track, initial) } } .scrollbar::-webkit-scrollbar { display: block; width: var(--scrollbar-width, 16px); height: var(--scrollbar-height, 16px) } .scrollbar-thin::-webkit-scrollbar-track { background-color: var(--scrollbar-track); border-radius: var(--scrollbar-track-radius) } .scrollbar-thin::-webkit-scrollbar-thumb { background-color: var(--scrollbar-thumb); border-radius: var(--scrollbar-thumb-radius) } .scrollbar-thin::-webkit-scrollbar-corner { background-color: var(--scrollbar-corner); border-radius: var(--scrollbar-corner-radius) } @supports (-moz-appearance:none) { .scrollbar-thin { scrollbar-width: thin; scrollbar-color: var(--scrollbar-thumb, initial) var(--scrollbar-track, initial) } } .scrollbar-thin::-webkit-scrollbar { display: block; width: 8px; height: 8px } .scrollbar-track-base-200 { --scrollbar-track: rgba(var(--color-base-200, 246 245 250) / 1) } .scrollbar-thumb-base-300 { --scrollbar-thumb: rgba(var(--color-base-300, 227 226 237) / 1) } .scrollbar-track-rounded-full { --scrollbar-track-radius: 9999px } .scrollbar-thumb-rounded-full { --scrollbar-thumb-radius: 9999px } .text-ai-gradient { background-image: linear-gradient(90deg, #4f4fd4, #dc62e3); background-clip: text; color: transparent; -webkit-background-clip: text; -webkit-text-fill-color: transparent } .placeholder\:text-sm::-moz-placeholder { font-size: .875rem; line-height: 1.25rem } .placeholder\:text-sm::placeholder { font-size: .875rem; line-height: 1.25rem } .placeholder\:font-normal::-moz-placeholder { font-weight: 400 } .placeholder\:font-normal::placeholder { font-weight: 400 } .placeholder\:text-base-400::-moz-placeholder { --tw-text-opacity: 1; color: rgba(var(--color-base-400, 176 174 208) / var(--tw-text-opacity, 1)) } .placeholder\:text-base-400::placeholder { --tw-text-opacity: 1; color: rgba(var(--color-base-400, 176 174 208) / var(--tw-text-opacity, 1)) } .before\:absolute:before { content: var(--tw-content); position: absolute } .before\:bottom-0:before { content: var(--tw-content); bottom: 0 } .before\:bottom-\[50\%\]:before { content: var(--tw-content); bottom: 50% } .before\:left-0:before { content: var(--tw-content); left: 0 } .before\:left-\[3px\]:before { content: var(--tw-content); left: 3px } .before\:top-0:before { content: var(--tw-content); top: 0 } .before\:flex:before { content: var(--tw-content); display: flex } .before\:h-4:before { content: var(--tw-content); height: 1rem } .before\:h-\[11px\]:before { content: var(--tw-content); height: 11px } .before\:w-4:before { content: var(--tw-content); width: 1rem } .before\:w-\[11px\]:before { content: var(--tw-content); width: 11px } .before\:w-\[var\(--player-buffer-progress\)\]:before { content: var(--tw-content); width: var(--player-buffer-progress) } .before\:translate-y-\[50\%\]:before { content: var(--tw-content); --tw-translate-y: 50%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) } .before\:content-normal:before { content: var(--tw-content); align-content: normal } .before\:rounded-full:before { content: var(--tw-content); border-radius: 9999px } .before\:bg-base-100:before { content: var(--tw-content); --tw-bg-opacity: 1; background-color: rgba(var(--color-base-100, 255 255 255) / var(--tw-bg-opacity, 1)) } .before\:bg-base-400:before { content: var(--tw-content); --tw-bg-opacity: 1; background-color: rgba(var(--color-base-400, 176 174 208) / var(--tw-bg-opacity, 1)) } .before\:bg-primary-300:before { content: var(--tw-content); --tw-bg-opacity: 1; background-color: rgba(var(--color-primary-300, 133 133 255) / var(--tw-bg-opacity, 1)) } .before\:transition-\[border\]:before { content: var(--tw-content); transition-property: border; transition-timing-function: cubic-bezier(.4, 0, .2, 1); transition-duration: .15s } .before\:transition-\[width\]:before { content: var(--tw-content); transition-property: width; transition-timing-function: cubic-bezier(.4, 0, .2, 1); transition-duration: .15s } .before\:transition-all:before { content: var(--tw-content); transition-property: all; transition-timing-function: cubic-bezier(.4, 0, .2, 1); transition-duration: .15s } .before\:content-\[\'\'\]:before { --tw-content: ""; content: var(--tw-content) } .after\:absolute:after { content: var(--tw-content); position: absolute } .after\:bottom-0:after { content: var(--tw-content); bottom: 0 } .after\:left-0:after { content: var(--tw-content); left: 0 } .after\:top-0:after { content: var(--tw-content); top: 0 } .after\:flex:after { content: var(--tw-content); display: flex } .after\:w-\[var\(--player-timeline-progress\)\]:after { content: var(--tw-content); width: var(--player-timeline-progress) } .after\:content-normal:after { content: var(--tw-content); align-content: normal } .after\:bg-primary-400:after { content: var(--tw-content); --tw-bg-opacity: 1; background-color: rgba(var(--color-primary-400, 29 29 255) / var(--tw-bg-opacity, 1)) } .after\:transition-\[width\]:after { content: var(--tw-content); transition-property: width; transition-timing-function: cubic-bezier(.4, 0, .2, 1); transition-duration: .15s } .first\:rounded-s-2xl:first-child { border-start-start-radius: 1rem; border-end-start-radius: 1rem } .first\:border-s:first-child { border-inline-start-width: 1px } .last\:rounded-e-2xl:last-child { border-start-end-radius: 1rem; border-end-end-radius: 1rem } .last\:border-e:last-child { border-inline-end-width: 1px } .checked\:border-\[5px\]:checked { border-width: 5px } .checked\:border-none:checked { border-style: none } .checked\:border-primary-400:checked { --tw-border-opacity: 1; border-color: rgba(var(--color-primary-400, 29 29 255) / var(--tw-border-opacity, 1)) } .checked\:bg-primary-400:checked { --tw-bg-opacity: 1; background-color: rgba(var(--color-primary-400, 29 29 255) / var(--tw-bg-opacity, 1)) } .before\:checked\:border-\[5px\]:checked:before { content: var(--tw-content); border-width: 5px } .before\:checked\:border-primary-400:checked:before { content: var(--tw-content); --tw-border-opacity: 1; border-color: rgba(var(--color-primary-400, 29 29 255) / var(--tw-border-opacity, 1)) } .focus-within\:outline-none:focus-within { outline: 2px solid transparent; outline-offset: 2px } .hover\:rounded-lg:hover { border-radius: .5rem } .hover\:border-primary-200:hover { --tw-border-opacity: 1; border-color: rgba(var(--color-primary-200, 193 193 255) / var(--tw-border-opacity, 1)) } .hover\:bg-base-200:hover { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-200, 246 245 250) / var(--tw-bg-opacity, 1)) } .hover\:bg-base-250:hover { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-250, 237 236 244) / var(--tw-bg-opacity, 1)) } .hover\:bg-primary-500:hover { --tw-bg-opacity: 1; background-color: rgba(var(--color-primary-500, 0 0 130) / var(--tw-bg-opacity, 1)) } .hover\:bg-purple-400:hover { --tw-bg-opacity: 1; background-color: rgb(149 59 171 / var(--tw-bg-opacity, 1)) } .hover\:bg-red-400:hover { --tw-bg-opacity: 1; background-color: rgb(181 3 44 / var(--tw-bg-opacity, 1)) } .hover\:bg-transparent:hover { background-color: transparent } .hover\:bg-opacity-50:hover { --tw-bg-opacity: .5 } .hover\:bg-none:hover { background-image: none } .hover\:text-primary-500:hover { --tw-text-opacity: 1; color: rgba(var(--color-primary-500, 0 0 130) / var(--tw-text-opacity, 1)) } .hover\:scrollbar-thumb-base-400:hover { --scrollbar-thumb: rgba(var(--color-base-400, 176 174 208) / 1) } .focus\:border-primary-300:focus { --tw-border-opacity: 1; border-color: rgba(var(--color-primary-300, 133 133 255) / var(--tw-border-opacity, 1)) } .focus\:border-red-300:focus { --tw-border-opacity: 1; border-color: rgb(237 49 93 / var(--tw-border-opacity, 1)) } .focus\:bg-base-100:focus { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-100, 255 255 255) / var(--tw-bg-opacity, 1)) } .focus\:bg-base-200:focus { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-200, 246 245 250) / var(--tw-bg-opacity, 1)) } .focus\:bg-primary-100:focus { --tw-bg-opacity: 1; background-color: rgba(var(--color-primary-100, 242 242 255) / var(--tw-bg-opacity, 1)) } .focus\:bg-transparent:focus { background-color: transparent } .focus\:bg-none:focus { background-image: none } .focus\:text-base-600:focus { --tw-text-opacity: 1; color: rgba(var(--color-base-600, 0 8 82) / var(--tw-text-opacity, 1)) } .focus\:outline-none:focus { outline: 2px solid transparent; outline-offset: 2px } .focus\:placeholder\:text-base-400:focus::-moz-placeholder { --tw-text-opacity: 1; color: rgba(var(--color-base-400, 176 174 208) / var(--tw-text-opacity, 1)) } .focus\:placeholder\:text-base-400:focus::placeholder { --tw-text-opacity: 1; color: rgba(var(--color-base-400, 176 174 208) / var(--tw-text-opacity, 1)) } .focus-visible\:ring:focus-visible { --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) } .active\:bg-base-200:active { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-200, 246 245 250) / var(--tw-bg-opacity, 1)) } .active\:bg-primary-500:active { --tw-bg-opacity: 1; background-color: rgba(var(--color-primary-500, 0 0 130) / var(--tw-bg-opacity, 1)) } .active\:bg-purple-400:active { --tw-bg-opacity: 1; background-color: rgb(149 59 171 / var(--tw-bg-opacity, 1)) } .active\:bg-red-400:active { --tw-bg-opacity: 1; background-color: rgb(181 3 44 / var(--tw-bg-opacity, 1)) } .active\:bg-transparent:active { background-color: transparent } .active\:bg-none:active { background-image: none } .active\:opacity-70:active { opacity: .7 } .disabled\:pointer-events-none:disabled { pointer-events: none } .disabled\:\!cursor-not-allowed:disabled { cursor: not-allowed !important } .disabled\:cursor-not-allowed:disabled { cursor: not-allowed } .disabled\:border-base-300:disabled { --tw-border-opacity: 1; border-color: rgba(var(--color-base-300, 227 226 237) / var(--tw-border-opacity, 1)) } .disabled\:bg-base-100:disabled { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-100, 255 255 255) / var(--tw-bg-opacity, 1)) } .disabled\:bg-base-200:disabled { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-200, 246 245 250) / var(--tw-bg-opacity, 1)) } .disabled\:bg-base-300:disabled { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-300, 227 226 237) / var(--tw-bg-opacity, 1)) } .disabled\:text-base-400:disabled { --tw-text-opacity: 1; color: rgba(var(--color-base-400, 176 174 208) / var(--tw-text-opacity, 1)) } .disabled\:\!opacity-50:disabled { opacity: .5 !important } .disabled\:opacity-30:disabled { opacity: .3 } .disabled\:opacity-50:disabled { opacity: .5 } .disabled\:hover\:\!bg-transparent:hover:disabled { background-color: transparent !important } .disabled\:hover\:bg-transparent:hover:disabled { background-color: transparent } .group\/highlight:hover .group-hover\/highlight\:\!flex { display: flex !important } .group\/trigger:hover .group-hover\/trigger\:flex { display: flex } .has-\[\:focus\]\:border-primary-300:has(:focus) { --tw-border-opacity: 1; border-color: rgba(var(--color-primary-300, 133 133 255) / var(--tw-border-opacity, 1)) } .has-\[\:focus\]\:bg-base-200:has(:focus) { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-200, 246 245 250) / var(--tw-bg-opacity, 1)) } .has-\[svg\:first-child\]\:pl-2:has(svg:first-child) { padding-left: .5rem } .has-\[svg\:first-child\]\:pl-3:has(svg:first-child) { padding-left: .75rem } .has-\[svg\:first-child\]\:pl-4:has(svg:first-child) { padding-left: 1rem } .has-\[svg\:first-child\]\:pl-5:has(svg:first-child) { padding-left: 1.25rem } .has-\[svg\:first-child\]\:pr-4:has(svg:first-child) { padding-right: 1rem } .has-\[svg\:first-child\]\:pr-8:has(svg:first-child) { padding-right: 2rem } .has-\[svg\:last-child\]\:pl-4:has(svg:last-child) { padding-left: 1rem } .has-\[svg\:last-child\]\:pl-8:has(svg:last-child) { padding-left: 2rem } .has-\[svg\:last-child\]\:pr-2:has(svg:last-child) { padding-right: .5rem } .has-\[svg\:last-child\]\:pr-3:has(svg:last-child) { padding-right: .75rem } .has-\[svg\:last-child\]\:pr-4:has(svg:last-child) { padding-right: 1rem } .has-\[svg\:last-child\]\:pr-5:has(svg:last-child) { padding-right: 1.25rem } .aria-\[current\=page\]\:border-b-primary-400[aria-current=page] { --tw-border-opacity: 1; border-bottom-color: rgba(var(--color-primary-400, 29 29 255) / var(--tw-border-opacity, 1)) } .aria-\[current\=page\]\:bg-primary-400\/10[aria-current=page] { background-color: rgba(var(--color-primary-400, 29 29 255) / .1) } .aria-\[current\=page\]\:text-primary-400[aria-current=page] { --tw-text-opacity: 1; color: rgba(var(--color-primary-400, 29 29 255) / var(--tw-text-opacity, 1)) } .aria-\[current\=page\]\:hover\:border-b-primary-500:hover[aria-current=page] { --tw-border-opacity: 1; border-bottom-color: rgba(var(--color-primary-500, 0 0 130) / var(--tw-border-opacity, 1)) } .aria-\[current\=page\]\:hover\:bg-primary-400\/20:hover[aria-current=page] { background-color: rgba(var(--color-primary-400, 29 29 255) / .2) } .aria-\[current\=page\]\:hover\:text-primary-500:hover[aria-current=page] { --tw-text-opacity: 1; color: rgba(var(--color-primary-500, 0 0 130) / var(--tw-text-opacity, 1)) } .group\/dropdown-subtrigger[aria-expanded=true] .group-aria-\[expanded\=true\]\/dropdown-subtrigger\:bg-base-200 { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-200, 246 245 250) / var(--tw-bg-opacity, 1)) } .data-\[clickable\=false\]\:pointer-events-none[data-clickable=false], .data-\[disabled\=true\]\:pointer-events-none[data-disabled=true], .data-\[loading\=true\]\:pointer-events-none[data-loading=true] { pointer-events: none } .data-\[disabled\=false\]\:pointer-events-auto[data-disabled=false] { pointer-events: auto } .data-\[size\=l\]\:left-\[17px\][data-size=l] { left: 17px } .data-\[size\=l\]\:top-\[14px\][data-size=l] { top: 14px } .data-\[size\=m\]\:left-\[12px\][data-size=m] { left: 12px } .data-\[size\=m\]\:top-\[9px\][data-size=m] { top: 9px } .data-\[size\=s\]\:left-\[8px\][data-size=s] { left: 8px } .data-\[size\=s\]\:top-\[6px\][data-size=s] { top: 6px } .data-\[size\=xl\]\:left-\[23px\][data-size=xl] { left: 23px } .data-\[size\=xl\]\:top-\[18px\][data-size=xl] { top: 18px } .data-\[size\=xs\]\:left-\[7px\][data-size=xs] { left: 7px } .data-\[size\=xs\]\:top-\[10px\][data-size=xs] { top: 10px } .data-\[size\=\"big\"\]\:h-\[37px\][data-size=big] { height: 37px } .data-\[size\=\"medium\"\]\:h-\[30px\][data-size=medium] { height: 30px } .data-\[size\=\"small\"\]\:h-6[data-size=small] { height: 1.5rem } .data-\[size\=l\]\:h-8[data-size=l] { height: 2rem } .data-\[size\=m\]\:h-6[data-size=m] { height: 1.5rem } .data-\[size\=s\]\:h-4[data-size=s] { height: 1rem } .data-\[size\=xl\]\:h-10[data-size=xl] { height: 2.5rem } .data-\[size\=xs\]\:h-3[data-size=xs] { height: .75rem } .data-\[ai-onboarding\=true\]\:min-h-\[299px\][data-ai-onboarding=true] { min-height: 299px } .data-\[path\=auto-share\]\:min-h-\[275px\][data-path=auto-share] { min-height: 275px } .data-\[size\=l\]\:w-8[data-size=l] { width: 2rem } .data-\[size\=m\]\:w-6[data-size=m] { width: 1.5rem } .data-\[size\=s\]\:w-4[data-size=s] { width: 1rem } .data-\[size\=xl\]\:w-10[data-size=xl] { width: 2.5rem } .data-\[size\=xs\]\:w-3[data-size=xs] { width: .75rem } .data-\[clickable\=false\]\:cursor-default[data-clickable=false] { cursor: default } .data-\[clickable\=true\]\:cursor-pointer[data-clickable=true] { cursor: pointer } .data-\[disabled\=\"true\"\]\:cursor-not-allowed[data-disabled=true] { cursor: not-allowed } .data-\[disabled\=true\]\:\!cursor-not-allowed[data-disabled=true] { cursor: not-allowed !important } .data-\[disabled\=true\]\:cursor-not-allowed[data-disabled=true], .data-\[disabled\]\:cursor-not-allowed[data-disabled], .data-\[loading\=true\]\:cursor-not-allowed[data-loading=true] { cursor: not-allowed } .data-\[outline\=\"true\"\]\:border-\[1px\][data-outline=true] { border-width: 1px } .data-\[focus\=true\]\:border-primary-300[data-focus=true] { --tw-border-opacity: 1; border-color: rgba(var(--color-primary-300, 133 133 255) / var(--tw-border-opacity, 1)) } .data-\[variant\=\"primary\"\]\:border-primary-400[data-variant=primary] { --tw-border-opacity: 1; border-color: rgba(var(--color-primary-400, 29 29 255) / var(--tw-border-opacity, 1)) } .data-\[variant\=\"secondary\"\]\:border-base-400[data-variant=secondary] { --tw-border-opacity: 1; border-color: rgba(var(--color-base-400, 176 174 208) / var(--tw-border-opacity, 1)) } .data-\[checked\=false\]\:bg-base-200[data-checked=false] { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-200, 246 245 250) / var(--tw-bg-opacity, 1)) } .data-\[checked\=true\]\:bg-green-100[data-checked=true] { --tw-bg-opacity: 1; background-color: rgb(235 255 251 / var(--tw-bg-opacity, 1)) } .data-\[disabled\]\:bg-base-100[data-disabled] { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-100, 255 255 255) / var(--tw-bg-opacity, 1)) } .data-\[disabled\]\:bg-base-200[data-disabled], .data-\[selected\=true\]\:bg-base-200[data-selected=true] { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-200, 246 245 250) / var(--tw-bg-opacity, 1)) } .data-\[variant\=\"primary\"\]\:bg-primary-100[data-variant=primary] { --tw-bg-opacity: 1; background-color: rgba(var(--color-primary-100, 242 242 255) / var(--tw-bg-opacity, 1)) } .data-\[variant\=\"secondary\"\]\:bg-base-200[data-variant=secondary] { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-200, 246 245 250) / var(--tw-bg-opacity, 1)) } .data-\[variant\=\"success\"\]\:bg-green-100[data-variant=success] { --tw-bg-opacity: 1; background-color: rgb(235 255 251 / var(--tw-bg-opacity, 1)) } .data-\[variant\=\"tertiary\"\]\:bg-tertiary-100[data-variant=tertiary] { --tw-bg-opacity: 1; background-color: rgb(249 241 255 / var(--tw-bg-opacity, 1)) } .data-\[size\=m\]\:p-4[data-size=m] { padding: 1rem } .data-\[size\=s\]\:p-2[data-size=s] { padding: .5rem } .data-\[size\=\"big\"\]\:px-3[data-size=big] { padding-left: .75rem; padding-right: .75rem } .data-\[size\=\"big\"\]\:py-2[data-size=big] { padding-top: .5rem; padding-bottom: .5rem } .data-\[size\=\"medium\"\]\:px-2[data-size=medium] { padding-left: .5rem; padding-right: .5rem } .data-\[size\=\"medium\"\]\:py-2[data-size=medium] { padding-top: .5rem; padding-bottom: .5rem } .data-\[size\=\"small\"\]\:px-2[data-size=small] { padding-left: .5rem; padding-right: .5rem } .data-\[size\=\"small\"\]\:py-2[data-size=small] { padding-top: .5rem; padding-bottom: .5rem } .data-\[has-cta\=false\]\:text-center[data-has-cta=false] { text-align: center } .data-\[size\=m\]\:text-\[15px\][data-size=m] { font-size: 15px } .data-\[size\=s\]\:text-xs[data-size=s] { font-size: .75rem; line-height: 1rem } .data-\[disabled\=\"true\"\]\:text-base-400[data-disabled=true] { --tw-text-opacity: 1; color: rgba(var(--color-base-400, 176 174 208) / var(--tw-text-opacity, 1)) } .data-\[disabled\=false\]\:\!opacity-100[data-disabled=false] { opacity: 1 !important } .data-\[disabled\=true\]\:\!opacity-50[data-disabled=true] { opacity: .5 !important } .data-\[disabled\=true\]\:opacity-50[data-disabled=true] { opacity: .5 } .data-\[disabled\]\:opacity-30[data-disabled], .data-\[loading\=true\]\:opacity-30[data-loading=true] { opacity: .3 } .data-\[outline\=true\]\:outline[data-outline=true] { outline-style: solid } .data-\[outline\=true\]\:outline-\[1\.5px\][data-outline=true] { outline-width: 1.5px } .data-\[outline\=true\]\:outline-primary-400[data-outline=true] { outline-color: rgba(var(--color-primary-400, 29 29 255) / 1) } .data-\[attached\=true\]\:first\:rounded-r-none:first-child[data-attached=true] { border-top-right-radius: 0; border-bottom-right-radius: 0 } .data-\[attached\=true\]\:first\:border-r-0:first-child[data-attached=true] { border-right-width: 0px } .data-\[attached\=true\]\:last\:rounded-l-none:last-child[data-attached=true] { border-top-left-radius: 0; border-bottom-left-radius: 0 } .data-\[attached\=true\]\:last\:border-l-0:last-child[data-attached=true] { border-left-width: 0px } .data-\[read-only\=true\]\:hover\:border-transparent:hover[data-read-only=true] { border-color: transparent } .data-\[disabled\=true\]\:hover\:\!bg-transparent:hover[data-disabled=true] { background-color: transparent !important } .data-\[variant\=\"secondary\"\]\:hover\:bg-base-250:hover[data-variant=secondary] { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-250, 237 236 244) / var(--tw-bg-opacity, 1)) } .group\/dropdown-wordtrigger[data-state=closed] .group-data-\[state\=closed\]\/dropdown-wordtrigger\:block, .group\/dropdown-wordtrigger[data-state=open] .group-data-\[state\=open\]\/dropdown-wordtrigger\:block { display: block } .group\/trigger[data-state=paused] .group-data-\[state\=paused\]\/trigger\:flex, .group\/trigger[data-state=playing] .group-data-\[state\=playing\]\/trigger\:flex { display: flex } .group\/checkbox[data-checked=false] .group-data-\[checked\=false\]\/checkbox\:hidden, .group\/sidebar[data-state=collapsed] .group-data-\[state\=\"collapsed\"\]\/sidebar\:hidden, .group\/sidebar[data-state=expanded] .group-data-\[state\=\"expanded\"\]\/sidebar\:hidden, .group\/combobox-trigger[data-state=closed] .group-data-\[state\=closed\]\/combobox-trigger\:hidden, .group\/dropdown-wordtrigger[data-state=closed] .group-data-\[state\=closed\]\/dropdown-wordtrigger\:hidden, .group\/combobox-trigger[data-state=open] .group-data-\[state\=open\]\/combobox-trigger\:hidden, .group\/dropdown-wordtrigger[data-state=open] .group-data-\[state\=open\]\/dropdown-wordtrigger\:hidden { display: none } .group\/button[data-size=lg] .group-data-\[size\=\"lg\"\]\/button\:h-6 { height: 1.5rem } .group\/button[data-size=md] .group-data-\[size\=\"md\"\]\/button\:h-5 { height: 1.25rem } .group\/button[data-size=sm] .group-data-\[size\=\"sm\"\]\/button\:h-4 { height: 1rem } .group\/button[data-size=xl] .group-data-\[size\=\"xl\"\]\/button\:h-7 { height: 1.75rem } .group\/button[data-size=lg] .group-data-\[size\=\"lg\"\]\/button\:w-6 { width: 1.5rem } .group\/button[data-size=md] .group-data-\[size\=\"md\"\]\/button\:w-5 { width: 1.25rem } .group\/button[data-size=sm] .group-data-\[size\=\"sm\"\]\/button\:w-4 { width: 1rem } .group\/button[data-size=xl] .group-data-\[size\=\"xl\"\]\/button\:w-7 { width: 1.75rem } .group\/dropdown-item[data-size=m] .group-data-\[size\=m\]\/dropdown-item\:\!w-5 { width: 1.25rem !important } .group\/dropdown-item[data-size=s] .group-data-\[size\=s\]\/dropdown-item\:w-m { width: 1rem } .group\/sidebar[data-state=collapsed] .group-data-\[state\=\"collapsed\"\]\/sidebar\:justify-center { justify-content: center } .group\/input-root[data-invalid=true] .group-data-\[invalid\=true\]\/input-root\:border-red-300 { --tw-border-opacity: 1; border-color: rgb(237 49 93 / var(--tw-border-opacity, 1)) } .group\/switch[data-checked=true] .group-data-\[checked\=true\]\/switch\:bg-green-300 { --tw-bg-opacity: 1; background-color: rgb(0 214 171 / var(--tw-bg-opacity, 1)) } .group\/switch[data-checked=true] .group-data-\[checked\=true\]\/switch\:bg-primary-400 { --tw-bg-opacity: 1; background-color: rgba(var(--color-primary-400, 29 29 255) / var(--tw-bg-opacity, 1)) } .group\/input-root[data-invalid=true] .group-data-\[invalid\=true\]\/input-root\:bg-base-200 { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-200, 246 245 250) / var(--tw-bg-opacity, 1)) } .group\/sidebar[data-type=light] .group-data-\[type\=\"light\"\]\/sidebar\:bg-base-100 { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-100, 255 255 255) / var(--tw-bg-opacity, 1)) } .group\/tooltip[data-type=default] .group-data-\[type\=\"default\"\]\/tooltip\:fill-base-600 { fill: rgba(var(--color-base-600, 0 8 82) / 1) } .group\/tooltip[data-type=error] .group-data-\[type\=\"error\"\]\/tooltip\:fill-red-300 { fill: #ed315d } .group\/tooltip[data-type=success] .group-data-\[type\=\"success\"\]\/tooltip\:fill-green-400 { fill: #0fa388 } .group\/sidebar[data-state=collapsed] .group-data-\[state\=\"collapsed\"\]\/sidebar\:px-1 { padding-left: .25rem; padding-right: .25rem } .group\/chip[data-size=big] .group-data-\[size\=\"big\"\]\/chip\:text-\[13px\] { font-size: 13px } .group\/chip[data-size=medium] .group-data-\[size\=\"medium\"\]\/chip\:text-\[12px\] { font-size: 12px } .group\/chip[data-size=small] .group-data-\[size\=\"small\"\]\/chip\:text-xs { font-size: .75rem; line-height: 1rem } .group\/dropdown-item[data-size=m] .group-data-\[size\=m\]\/dropdown-item\:\!text-\[15px\] { font-size: 15px !important } .group\/dropdown-item[data-size=s] .group-data-\[size\=s\]\/dropdown-item\:text-xs { font-size: .75rem; line-height: 1rem } .group\/dropdown-wordtrigger[data-disabled] .group-data-\[disabled\]\/dropdown-wordtrigger\:text-base-400 { --tw-text-opacity: 1; color: rgba(var(--color-base-400, 176 174 208) / var(--tw-text-opacity, 1)) } .group\/combobox-root[data-invalid=true] .group-data-\[invalid\=true\]\/combobox-root\:text-red-300, .group\/input-root[data-invalid=true] .group-data-\[invalid\=true\]\/input-root\:text-red-300 { --tw-text-opacity: 1; color: rgb(237 49 93 / var(--tw-text-opacity, 1)) } .group\/banner[data-type=secondary] .group-data-\[type\=\"secondary\"\]\/banner\:text-base-100 { --tw-text-opacity: 1; color: rgba(var(--color-base-100, 255 255 255) / var(--tw-text-opacity, 1)) } .group\/chip[data-variant=primary] .group-data-\[variant\=\"primary\"\]\/chip\:text-primary-400 { --tw-text-opacity: 1; color: rgba(var(--color-primary-400, 29 29 255) / var(--tw-text-opacity, 1)) } .group\/chip[data-variant=secondary] .group-data-\[variant\=\"secondary\"\]\/chip\:text-base-400 { --tw-text-opacity: 1; color: rgba(var(--color-base-400, 176 174 208) / var(--tw-text-opacity, 1)) } .group\/chip[data-variant=success] .group-data-\[variant\=\"success\"\]\/chip\:text-green-400 { --tw-text-opacity: 1; color: rgb(15 163 136 / var(--tw-text-opacity, 1)) } .group\/chip[data-variant=tertiary] .group-data-\[variant\=\"tertiary\"\]\/chip\:text-base-300 { --tw-text-opacity: 1; color: rgba(var(--color-base-300, 227 226 237) / var(--tw-text-opacity, 1)) } .group\/chip[data-variant=tertiary] .group-data-\[variant\=\"tertiary\"\]\/chip\:text-tertiary-300 { --tw-text-opacity: 1; color: rgb(178 94 244 / var(--tw-text-opacity, 1)) } .group\/input-root[data-disabled=true] .group-data-\[disabled\=true\]\/input-root\:opacity-50 { opacity: .5 } .group\/switch[data-checked=true] .group-data-\[checked\=true\]\/switch\:before\:translate-x-full:before { content: var(--tw-content); --tw-translate-x: 100%; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) } .group\/sidebar[data-type=light] .group-data-\[type\=\"light\"\]\/sidebar\:hover\:bg-base-150:hover { --tw-bg-opacity: 1; background-color: rgba(var(--color-base-150, 250 250 255) / var(--tw-bg-opacity, 1)) } .group\/input-root[data-invalid=true] .group-data-\[invalid\=true\]\/input-root\:focus\:border-red-300:focus { --tw-border-opacity: 1; border-color: rgb(237 49 93 / var(--tw-border-opacity, 1)) } .group\/chip:hover[data-variant=primary] .group-hover\/chip\:group-data-\[variant\=\"primary\"\]\/chip\:text-primary-500 { --tw-text-opacity: 1; color: rgba(var(--color-primary-500, 0 0 130) / var(--tw-text-opacity, 1)) } .group\/chip:hover[data-variant=secondary] .group-hover\/chip\:group-data-\[variant\=\"secondary\"\]\/chip\:text-base-500 { --tw-text-opacity: 1; color: rgba(var(--color-base-500, 90 93 141) / var(--tw-text-opacity, 1)) } .group\/chip:hover[data-variant=success] .group-hover\/chip\:group-data-\[variant\=\"success\"\]\/chip\:text-green-500 { --tw-text-opacity: 1; color: rgb(3 129 94 / var(--tw-text-opacity, 1)) } .group\/chip:hover[data-variant=tertiary] .group-hover\/chip\:group-data-\[variant\=\"tertiary\"\]\/chip\:text-tertiary-400 { --tw-text-opacity: 1; color: rgb(149 59 171 / var(--tw-text-opacity, 1)) } .group\/sidebar[data-type=light] .group-data-\[type\=\"light\"\]\/sidebar\:aria-\[current\=page\]\:bg-primary-400\/10[aria-current=page] { background-color: rgba(var(--color-primary-400, 29 29 255) / .1) } .group\/sidebar[data-type=light] .group-data-\[type\=\"light\"\]\/sidebar\:aria-\[current\=page\]\:hover\:bg-primary-400\/20:hover[aria-current=page] { background-color: rgba(var(--color-primary-400, 29 29 255) / .2) } @media not all and (min-width: 1024px) { .group\/sidebar:hover .max-lg\:group-hover\/sidebar\:\!px-4 { padding-left: 1rem !important; padding-right: 1rem !important } .group\/sidebar[data-state=default] .max-lg\:group-data-\[state\=\"default\"\]\/sidebar\:hidden { display: none } } @media not all and (min-width: 768px) { .group\/sidebar:hover .group-hover\/sidebar\:max-md\:\!px-4 { padding-left: 1rem !important; padding-right: 1rem !important } .group\/sidebar[data-state=default] .max-md\:group-data-\[state\=\"default\"\]\/sidebar\:justify-center { justify-content: center } .group\/sidebar[data-state=default] .max-md\:group-data-\[state\=\"default\"\]\/sidebar\:px-1 { padding-left: .25rem; padding-right: .25rem } } @media (min-width: 768px) { .md\:text-\[15px\] { font-size: 15px } .md\:text-\[16px\] { font-size: 16px } .md\:text-\[21px\] { font-size: 21px } .md\:text-\[24px\] { font-size: 24px } .md\:text-\[28px\] { font-size: 28px } .md\:text-\[36px\] { font-size: 36px } .md\:text-\[52px\] { font-size: 52px } .md\:leading-\[1\.16\] { line-height: 1.16 } .md\:leading-\[1\.25\] { line-height: 1.25 } .md\:leading-\[1\.2\] { line-height: 1.2 } .md\:leading-\[1\.4\] { line-height: 1.4 } .md\:tracking-\[-1\%\] { letter-spacing: -1% } .md\:tracking-\[-2\%\] { letter-spacing: -2% } .md\:tracking-\[-3\%\] { letter-spacing: -3% } .group\/sidebar[data-state=default] .md\:group-data-\[state\=\"default\"\]\/sidebar\:hidden { display: none } } .\[\&\>\*\]\:outline-none>* { outline: 2px solid transparent; outline-offset: 2px } .data-\[attached\=true\]\:\[\&\>not\(\:first-child\,_\:last-child\)\]\:rounded-none>not(:first-child, :last-child)[data-attached="true"] { border-radius: 0 } .\[\&\>span\]\:\!text-base-100>span { --tw-text-opacity: 1 !important; color: rgba(var(--color-base-100, 255 255 255) / var(--tw-text-opacity, 1)) !important } .\[\&\>span\]\:\!no-underline>span { text-decoration-line: none !important } .\[\&\>svg\]\:gap-xs>svg { gap: .25rem } .\[\&_\>_div_\>_p\]\:data-\[disabled\]\:text-base-400[data-disabled]>div>p { --tw-text-opacity: 1; color: rgba(var(--color-base-400, 176 174 208) / var(--tw-text-opacity, 1)) } .\[\&_button\>span\]\:text-base-500 button>span { --tw-text-opacity: 1; color: rgba(var(--color-base-500, 90 93 141) / var(--tw-text-opacity, 1)) } .\[\&_button\>span\]\:text-orange-400 button>span { --tw-text-opacity: 1; color: rgb(255 107 70 / var(--tw-text-opacity, 1)) } .\[\&_button\>span\]\:text-white button>span { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity, 1)) } .\[\&_button\>svg\]\:text-base-100 button>svg { --tw-text-opacity: 1; color: rgba(var(--color-base-100, 255 255 255) / var(--tw-text-opacity, 1)) } .\[\&_button\>svg\]\:text-light-blue-400 button>svg { --tw-text-opacity: 1; color: rgb(0 141 255 / var(--tw-text-opacity, 1)) } .\[\&_button\>svg\]\:text-orange-400 button>svg { --tw-text-opacity: 1; color: rgb(255 107 70 / var(--tw-text-opacity, 1)) } .\[\&_button\>svg\]\:text-primary-400 button>svg { --tw-text-opacity: 1; color: rgba(var(--color-primary-400, 29 29 255) / var(--tw-text-opacity, 1)) } .\[\&_button\>svg\]\:text-purple-300 button>svg { --tw-text-opacity: 1; color: rgb(178 94 244 / var(--tw-text-opacity, 1)) } .\[\&_button\]\:decoration-base-100 button { text-decoration-color: rgba(var(--color-base-100, 255 255 255) / 1) } .\[\&_button\]\:decoration-orange-400 button { text-decoration-color: #ff6b46 } * { font-family: Work Sans, sans-serif } /* Appear Animation */ .appear { opacity: 0; transform: translateY(20px); transition: opacity 0.6s ease-out, transform 0.6s ease-out; } .appear.in-view { opacity: 1; transform: translateY(0); } /* Smooth Scroll */ html { scroll-behavior: smooth; } /* Member Modal */ #member-modal { backdrop-filter: blur(1px); } /* Pop-in Animation for Tablet/Phone Images */ /* Fix for about-tablet_phone images animation - Pop in effect */ #about-tablet_phone .sd.about-tablet_phone-img.appear, #about-tablet_phone .sd.about-tablet_phone-img-2.appear, #about-tablet_phone .sd.about-tablet_phone-img-3.appear, #about-tablet_phone .sd.about-tablet_phone-img-4.appear { opacity: 0 !important; transform: scale(0) !important; transition: all 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) !important; } #about-tablet_phone .sd.about-tablet_phone-img.appear.in-view, #about-tablet_phone .sd.about-tablet_phone-img-2.appear.in-view, #about-tablet_phone .sd.about-tablet_phone-img-3.appear.in-view, #about-tablet_phone .sd.about-tablet_phone-img-4.appear.in-view { opacity: 1 !important; transform: scale(1) !important; } /* Stagger delays */ #about-tablet_phone .sd.about-tablet_phone-img.appear { transition-delay: 0ms !important; } #about-tablet_phone .sd.about-tablet_phone-img-2.appear { transition-delay: 100ms !important; } #about-tablet_phone .sd.about-tablet_phone-img-3.appear { transition-delay: 200ms !important; } #about-tablet_phone .sd.about-tablet_phone-img-4.appear { transition-delay: 300ms !important; } /* Preserve Hover Effects - Ensure scale is larger on hover */ #about-tablet_phone .sd.about-tablet_phone-images-wrapper:hover .sd.about-tablet_phone-img.appear.in-view, #about-tablet_phone .sd.about-tablet_phone-images-wrapper:hover .sd.about-tablet_phone-img-2.appear.in-view, #about-tablet_phone .sd.about-tablet_phone-images-wrapper:hover .sd.about-tablet_phone-img-3.appear.in-view, #about-tablet_phone .sd.about-tablet_phone-images-wrapper:hover .sd.about-tablet_phone-img-4.appear.in-view { transform: scale(1.1) !important; } /* Pop-in Animation for PC Images (Wrappers) */ #about-pc .sd.about-pc-image-1-wrapper.appear, #about-pc .sd.about-pc-image-2-wrapper.appear, #about-pc .sd.about-pc-image-3-wrapper.appear, #about-pc .sd.about-pc-image-4-wrapper.appear { opacity: 0 !important; transform: scale(0) !important; transition: all 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) !important; } #about-pc .sd.about-pc-image-1-wrapper.appear.in-view, #about-pc .sd.about-pc-image-2-wrapper.appear.in-view, #about-pc .sd.about-pc-image-3-wrapper.appear.in-view, #about-pc .sd.about-pc-image-4-wrapper.appear.in-view { opacity: 1 !important; transform: scale(1) !important; } /* Stagger animation for about-pc images */ #about-pc .sd.about-pc-image-1-wrapper.appear { transition-delay: 0ms !important; } #about-pc .sd.about-pc-image-2-wrapper.appear { transition-delay: 200ms !important; } #about-pc .sd.about-pc-image-3-wrapper.appear { transition-delay: 400ms !important; } #about-pc .sd.about-pc-image-4-wrapper.appear { transition-delay: 600ms !important; } /* Pop-in Animation for Business-3 Images (Wrappers) */ .sd.business-3-img-2.appear, .sd.business-3-item-consulting-image-wrapper.appear, .sd.business-3-item-consulting-image-3.appear, .sd.business-3-item-consulting-image-4.appear { opacity: 0 !important; transform: scale(0) !important; transition: all 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) !important; } .sd.business-3-img-2.appear.in-view, .sd.business-3-item-consulting-image-wrapper.appear.in-view, .sd.business-3-item-consulting-image-3.appear.in-view, .sd.business-3-item-consulting-image-4.appear.in-view { opacity: 1 !important; transform: scale(1) !important; } /* Stagger animation for business-3 images */ .sd.business-3-img-2.appear { transition-delay: 0ms !important; } .sd.business-3-item-consulting-image-wrapper.appear { transition-delay: 200ms !important; } .sd.business-3-item-consulting-image-3.appear { transition-delay: 400ms !important; } .sd.business-3-item-consulting-image-4.appear { transition-delay: 600ms !important; } @keyframes wipe-reveal { 0% { width: 0%; left: 0; right: auto; } 45% { width: 100%; left: 0; right: auto; } 55% { width: 100%; left: auto; right: 0; } 100% { width: 0%; left: auto; right: 0; } } @keyframes wipe-reveal { 0% { width: 0%; left: 0; right: auto; } 45% { width: 100%; left: 0; right: auto; } 55% { width: 100%; left: auto; right: 0; } 100% { width: 0%; left: auto; right: 0; } } @keyframes wipe-reveal { 0% { width: 0%; left: 0; right: auto; } 45% { width: 100%; left: 0; right: auto; } 55% { width: 100%; left: auto; right: 0; } 100% { width: 0%; left: auto; right: 0; } } @keyframes wipe-reveal { 0% { width: 0%; left: 0; right: auto; } 45% { width: 100%; left: 0; right: auto; } 55% { width: 100%; left: auto; right: 0; } 100% { width: 0%; left: auto; right: 0; } } @keyframes wipe-reveal { 0% { width: 0%; left: 0; right: auto; } 45% { width: 100%; left: 0; right: auto; } 55% { width: 100%; left: auto; right: 0; } 100% { width: 0%; left: auto; right: 0; } } /* Mobile Menu Styles */ .mobile-menu-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100dvh; background-color: #fff; z-index: 9999; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; padding: 20px; opacity: 0; pointer-events: none; transition: opacity 0.3s ease; overflow-y: auto; } .mobile-menu-overlay.is-open { opacity: 1; pointer-events: auto; } .mobile-menu-home-link { margin-bottom: 40px; margin-top: 20px; } .mobile-menu-home-link img { height: 30px; width: auto; } .mobile-menu-links { display: flex; flex-direction: column; align-items: center; gap: 24px; width: 100%; margin-bottom: 40px; } .mobile-menu-item { display: flex; flex-direction: column; align-items: center; text-decoration: none; color: #333; } .mobile-menu-item p:first-child { font-size: 24px; font-weight: bold; font-family: 'Poppins', sans-serif; margin-bottom: 4px; } .mobile-menu-item p:last-child { font-size: 12px; font-weight: normal; } .mobile-menu-contact { display: flex; flex-direction: column; align-items: center; margin-bottom: 20px; color: #333; } .mobile-menu-contact i { font-size: 32px; margin-bottom: 8px; } .mobile-menu-privacy { font-size: 10px; color: #666; margin-bottom: 20px; } .mobile-menu-social { display: flex; gap: 20px; margin-bottom: 40px; } .mobile-menu-social .icon { font-size: 24px; color: #333; } .mobile-menu-close { position: absolute; top: 20px; right: 20px; background: none; border: none; cursor: pointer; } .mobile-menu-close i { font-size: 32px; color: #333; } /* AUTOMATED FIX: Ensure .appear elements become visible when in-view */ .appear.in-view { opacity: 1 !important; visibility: visible !important; } /* Ensure mobile specific sections are actually displayed if they are in view */ @media screen and (max-width: 976px) { .sd[class*="phone"].in-view { opacity: 1 !important; } } /* AUTOMATED FIX: Ensure .appear elements become visible when in-view */ .appear.in-view { opacity: 1 !important; visibility: visible !important; /* We avoid forcing transform:none because it might kill slide-in animations */ } /* Ensure mobile specific sections are actually displayed if they are in view */ @media screen and (max-width: 976px) { .sd[class*="phone"].in-view { opacity: 1 !important; } }