.bannerBox, .letsTalk, body, input, select, textarea {font-family: "segoe-ui", sans-serif;}
.innerBanCon {min-height: 650px; position: relative;}
.innerBanCon::before {content: ''; width: 100%; height: 100%; background: linear-gradient(270deg, rgba(28, 65, 105, 0) 0%, rgba(31, 90, 158, 0.94) 57.92%, #1F5A9E 100%); position: absolute; left: 0; top: 0; z-index: 1;}
.innerBanImg .banner {position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover;}
.container {max-width: 1400px; padding: 0 15px; margin: auto; position: relative; z-index: 2;}
.innerBannerBox {max-width: 860px; display: flex; min-height: 650px; padding: 155px 0 50px 0; color: #fff;}
.top-bradcrumb {font-size:13px; color:#fff; margin-bottom:30px;}
.top-bradcrumb a {color:#fff;}
.top-bradcrumb .sep {margin: 0 6px;}
.innerBannerBox .tagBox {display: inline-flex; background: #fff; border-radius: 40px; color: #E14A25; font-size: 14px; font-weight: 500; text-transform: uppercase; padding: 4px 15px; align-items: center; height: 32px; margin-bottom: 30px;}
.innerBannerBox .tagBox i {width: 12px; height: 12px; background: #E14A25; border-radius: 100%; margin-right: 8px;}
.innerBannerBox .heading {font-size: 56px; line-height: 56px; font-weight: 700; margin-bottom: 10px;}
.innerBannerBox .heading span {display: block;}
.innerBannerBox .text {color: #fff; font-size: 20px; line-height: 28px; margin-bottom: 30px;}
a.link {display: inline-flex; align-items: center; height: 42px; background: #E14A25; padding: 0 25px; font-size: 18px; font-weight: 600; color: #fff; border-radius:5px;}
a.link:hover {background: #084991;}
.banInfo {padding-top: 40px; gap: 55px;}
.banInfo li {color: #CECECE; font-size: 12px; line-height: 16px; font-weight: 500; text-transform: uppercase;}
.banInfo li span {display: block;}
.banInfo li strong {display: block;; padding-bottom: 10px; font-size: 16px;}
.banInfo li strong span {display: inline; font-size: 26px; font-weight: 700; color: #fff}
.top-form {max-width:425px; width:100%; display:flex; align-items:center; position:relative;}
.top-input {width:100%; height:42px; background:#fff; border-radius:6px 0 0 6px; padding:0 15px; border:none; font-size:16px;}
.top-button {background: #E14A25; white-space:nowrap; height:42px; border:none; padding:0 22px; border-radius:0 6px 6px 0; color:#fff; font-weight:600; cursor:pointer; font-size:16px}
.top-button:hover {background: #084991;}
#topError {position:absolute; left:0; top:100%; background:#F00; color:#fff; border-radius:3px; padding:5px 10px; font-size:13px; margin-top:2px; display:none;}
.midCon {background-size: cover !important;}
.pt40 {padding-top: 40px;}
.pb40 {padding-bottom: 40px;}
.hd-box {gap: 20px; align-items: end; margin-bottom: 30px;}
.hd-box .main-hd {width: 40%; font-size: 41px; line-height:48px; font-weight: 700;}
.hd-box .main-hd h2 {font-size: 41px; line-height:48px; font-weight: 700; max-width:530px;}
.hd-box .main-hd span {display: block;}
.hd-box .main-hd small {display: block; font-size: 14px; line-height:18px; text-transform: uppercase; font-weight: 400; margin-bottom: 15px; position: relative; padding-left: 35px;}
.hd-box .main-hd small:before {content: ''; width: 22px; height: 2px; background: #E14A25; position: absolute; left: 0; top: 8px;}
.hd-box .hd-text {width: calc(60% - 20px); font-size:20px; line-height: 28px; color: #454545;}
.toggle-box {color: #4A5568; font-size: 16px; font-weight: 500;}
.toggle-box .toggle {background: #00000026; height: 26px; width: 48px; margin: 0 10px; border-radius: 30px; display: block; position: relative;}
.toggle-box .toggle i {box-shadow: 0px 1px 4px 0px #00000040; background: #fff; border-radius: 100%; width: 20px; height: 20px; position: absolute; left: 3px; top: 3px; transition: ease-in-out .4s;}
.toggle-box .toggle.active {background: #E14A25;}
.toggle-box .toggle.active i {left: 25px;}
.toggle-box .save {background: #E8F5E9; height: 22px; padding: 0 15px; display: inline-flex; align-items: center; color: #2E7D32; font-size: 14px; font-weight: 600; border-radius: 30px; margin-left: 10px;}
.plan-list {display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; padding-top: 30px;}
.plan-list.five {display: grid; grid-template-columns: repeat(5, 1fr);}
.plan-list > li {border: 1px solid #00000014; border-radius: 14px; padding: 30px 20px 90px 20px; position: relative; transition: ease-in-out .4s;}
.plan-list > li:hover {box-shadow: 0 0 20px rgba(0, 0, 0, 0.10);}
.plan-list > li .top {display: block; color: #4A5568; font-size: 15px; font-weight: 600; text-transform: uppercase; padding-bottom: 8px;}
.plan-list > li .price {font-size: 42px; font-weight: 600; height: 90px;}
.plan-list > li .price sup {font-size: 20px; font-weight: 400;}
.plan-list > li .price sub {font-size: 16px; font-weight: 300;}
.plan-list > li .price strong {font-size:12px; color:#999; font-weight:500; display:none; padding-top:5px;}
.plan-list > li .price.active strong {display:block;}
.plan-list > li .tags {display:flex; gap:5px; flex-direction:column; align-items:start; margin-bottom:20px;}
.plan-list > li .tags span {display:inline-flex; background:#faeee0; height:24px; border-radius:4px; padding:0 12px; font-size:14px; font-weight:600; align-items:center; color:#c05a0a; border:1px solid #c05a0a;}
.plan-list > li .tags span small {font-weight:400; color:#000;}
.plan-list .det {padding: 20px 0 0 0; border-top: 1px solid #eee;}
.plan-list .det li {color: #4A5568; font-size: 14px; line-height: 22px; padding: 5px 0 5px 28px; position: relative;}
.plan-list .det li:before {content: 'check'; font-family: 'Material Icons'; font-size: 18px;position: absolute;left: 0;top: 5px; color: #000;}
.plan-list .det li.no {color: #8A9AB0;}
.plan-list .det li.no:before {content: 'close'; color: #8A9AB0;}
.plan-list .det li strong {color: #0D1117; font-weight: 600;}
.plan-list .btn {position: absolute; left: 20px; bottom: 20px; right: 20px; border: 1px solid #E14A25; height: 48px; border-radius: 10px; color: #E14A25; font-size: 16px; font-weight: 600; display: flex; align-items: center; justify-content: center; padding: 0 10px;}
.plan-list .btn:hover {background: #fdf0ec;}
.plan-list > li.popular {border:2px solid #E14A25;}
.plan-list > li.popular:hover {box-shadow: 0 0 20px rgba(0, 0, 0, 0.20); transform: translateY(-2px);}
.plan-list > li.popular .top {color: #E14A25;}
.plan-list li.popular .btn {background: #E14A25; color: #fff;}
.plan-list li.popular .btn:hover {background: #e45c3b;}
.most-popular {background: #E14A25; width: 126px; height: 28px; border-radius: 40px; position: absolute; left: 50%; margin-left: -63px; top: -13px; color: #fff; font-size: 12px; text-transform: uppercase; font-weight: 600; display: flex; align-items: center; justify-content: center;}
.white {color: #fff !important;}
.hd-box .main-hd.white small:before {background: #fff;}
.plan-table-con {background-size: 100% auto !important;}
.plan-table {width: 100%; overflow: auto; border-radius: 16px; background: #fff;}
.plan-table table {width: 100%; border-spacing: 0; min-width: 730px;}
.plan-table table th {font-size: 15px; font-weight: 600; text-transform: uppercase; padding: 14px 20px;}
.plan-table table th:first-child {text-align: left;}
.plan-table table th.sub-hd {background: #EDE9FB;}
.plan-table table td {padding: 12px 20px; text-align: center; border-bottom: 1px solid #eee; font-size: 15px; font-weight: 600;}
.plan-table table td strong {font-weight:700;}
.plan-table table td:first-child {text-align: left; font-weight: 400;}
.orange-clr {color: #e45c3b;}
.column3 {display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;}
.why-flexsin-list li {background: #fff; box-shadow: 0px 0px 4px 0px #00000026; border-radius: 10px; border-bottom: 3px solid #E14A25; padding: 25px;}
.why-flexsin-list li .block-text {transition: ease-in-out .4s;}
.why-flexsin-list li:hover {box-shadow: 0 0 20px rgba(0, 0, 0, 0.10);}
.why-flexsin-list li:hover .block-text {transform: translateX(-5px);}
.why-flexsin-list li img {margin-bottom: 10px;}
.block-hd {font-size: 21px; font-weight: 700; margin-bottom: 10px;}
.block-text {font-size: 16px; line-height: 24px; color: rgba(0, 0, 0, 0.65);}
.client-list li {border: 1px solid #00000014; background: #fff; border-radius: 14px; padding: 0 25px; display: flex; flex-direction: column; justify-content: space-between;}
.client-list li:hover {box-shadow:0 0 20px rgba(0, 0, 0, 0.10);}
.client-list li .top {padding: 25px 0; position: relative;}
.client-list li .quote {position: absolute; right: 20px; top: 20px; opacity: .1;}
.client-list li .star {color: #F59E0B;}
.client-list li .block-text {font-style: italic; padding-top: 15px;}
.client-list li .bot {border-top: 1px solid var(--color-black-8, #00000014); padding: 25px 0;}
.client-list li .bot .left {background: #DBEAFE; width: 42px; height: 42px; border-radius: 100%; display: flex; align-items: center; justify-content: center; color: #1E40AF; font-size: 15px; font-weight: 600;}
.client-list li .bot .right {width: calc(100% - 42px); padding-left: 20px; font-size: 16px;}
.client-list li .bot .right .name {display: block; font-weight: 600; padding-bottom: 10px;}
.client-list li .bot .right small {display: block; color: #8A9AB0; font-size: 14px; padding-bottom: 10px;}
.client-list li .bot .right .plan {display: inline-flex; background: #1A56DB1A; height: 26px; border-radius: 30px; align-items: center; padding: 0 15px; color: #1A56DB; font-size: 13px; font-weight: 600;}
.clientSliderCon {border-top: 1px solid #00000033; margin-top: 40px;}
.clientSldier {padding-top: 30px;}
.clientSldier .items {height: 60px; display: flex; align-items: center;}
.clientSldier .items img {max-height: 100%; margin:0 15px;}
.plan-form-con {background-size: auto 100% !important;}
.column-hd.hd-box {flex-direction: column; align-items: start;}
.column-hd.hd-box .main-hd {width: 100%;}
.column-hd.hd-box .hd-text {width: 100%;}
.plan-form-box .left {max-width: 620px; width: 50%; padding-right: 30px;}
.plan-form-box .left .info li {margin-bottom: 20px;}
.plan-form-box .left .info li .icon {width: 42px; height: 42px; background: #E14A25; border-radius: 10px; display: flex; align-items: center; justify-content: center;}
.plan-form-box .left .info li .det {width: calc(100% - 42px); padding-left: 15px; font-size: 15px; font-weight: 500;}
.plan-form-box .left .info li .det span {color: #707070; text-transform: uppercase; display: block; font-size: 13px; padding-bottom: 5px; font-weight: 600; letter-spacing: 1px;}
.plan-form-box .tags {gap: 10px; padding-top: 10px;}
.plan-form-box .tags li {position: relative; border: 1px solid var(--color-black-8, #00000014); border-radius: 30px; height: 40px; padding: 0 15px 0 30px; display: inline-flex; align-items: center; color: #4A5568; font-size: 13px; font-weight: 500; background:#fff;}
.plan-form-box .tags li:before {content: ''; width: 8px; height: 8px; position: absolute; left: 15px; top: 15px; background: #2E7D32; border-radius: 100%;} 
.plan-form-box .right {width: 50%; box-shadow: 0px 2px 10px 0px #00000026; border-bottom: 3px solid #e45c3b; border-radius: 14px; padding: 30px; background: #fff;}
.plan-form {margin: -10px; padding-top: 20px;}
.plan-form li {width: 100%; padding: 10px; position:relative;}
.plan-form li .errorMessage {display:none; background:#ff0000; padding:4px 10px; border-radius:3px; color:#fff; font-size:13px; position:absolute; right:10px; top:12px; margin-top:-5px; z-index:10; white-space:nowrap;}
.plan-form li .errorMessage:before {content:''; border-left:6px solid transparent; border-right:6px solid transparent; border-top:6px solid #ff0000; position:absolute; right:20px; bottom:-6px;}
.plan-form li.error .errorMessage {display:block;}
.plan-form li label {display: block; font-size: 14px; font-weight: 500; padding-bottom: 5px;}
.plan-form li.half {width: 50%;}
.plan-form .input {border: 1px solid var(--color-black-15, #00000026); height: 42px; border-radius: 8px; width: 100%; padding: 0 15px;}
.plan-form textarea.input {height: auto; padding: 15px;}
.form-btn {width: 100%; border-radius: 8px; background: #E14A25; height: 48px; color: #fff; font-size: 18px; font-weight: 500; border: none; cursor: pointer;}
.form-btn:hover {background: #000;}


@media (max-width:1199px) {
.innerBanCon {min-height: 550px;}
.innerBannerBox {min-height: 550px;}
.innerBannerBox .tagBox {font-size: 13px;}
.innerBannerBox .heading {font-size: 46px; line-height: 46px;}
.innerBannerBox .text {font-size: 16px; line-height: 24px;}
.hd-box .main-hd {font-size: 32px; line-height:40px;}
.hd-box .main-hd h2 {font-size: 32px; line-height:40px;}
.hd-box .hd-text {font-size: 16px; line-height: 22px;}
.plan-list {gap:5px;}
.plan-list > li {padding:15px 10px 90px 10px;}
.plan-list .btn {right:10px; left:10px;}
.plan-list .det {padding:10px 0 0 0;}
.plan-list > li .tags span small {display:none;}
}

@media (max-width:999px) {
.hd-box {flex-direction: column; gap: 10px; margin-bottom: 20px;}
.hd-box .main-hd {width: 100%;}
.hd-box .main-hd span {display: inline-block;}
.hd-box .hd-text {width: 100%;}
.column3 {grid-template-columns: repeat(2, 1fr);}
.innerBannerBox .text br {display:none;}
.plan-list {grid-template-columns: repeat(2, 1fr);}
.plan-list.five {grid-template-columns: repeat(3, 1fr);}
.plan-table table th {font-size: 14px; padding: 10px 15px;}
.plan-table table td {padding: 10px 15px; font-size: 14px;}
.plan-table {overflow:auto;}
.plan-form-box {flex-direction:column; gap:20px;}
.plan-form-box .left {max-width:100%; width:100%;}
.plan-form-box .right {max-width:100%; width:100%;}

}

@media (max-width:599px) {
.innerBannerBox {padding: 120px 0 30px 0;}
.innerBannerBox .heading {font-size: 36px; line-height: 40px;}
.banInfo {gap: 20px; padding-top: 30px;}
.banInfo li {font-size: 10px; line-height: 14px;}
.hd-box .main-hd {font-size: 28px; line-height:34px;}
.hd-box .main-hd h2 {font-size: 24px; line-height:30px;}


.column3 {grid-template-columns: repeat(1, 1fr); gap: 10px;}
.column2 {grid-template-columns: repeat(1, 1fr); gap: 10px;}
.why-flexsin-list li {padding: 15px;}
.mainHd.wtspHd {font-size:20px;}
.mainHd.wtspHd:after {bottom:5px; width:60px; margin-left:-30px; height:2px;}
.block-hd {font-size:18px; line-height:22px;}
.plan-list > li .price {font-size:34px;}
.plan-list.five {grid-template-columns: repeat(2, 2fr);}
.plan-form-box .right {padding:15px;}
.plan-form {margin:-5px;}
.plan-form li {padding:5px;}
.plan-form-box .tags {gap:5px;}
.plan-form-box .tags li {font-size:12px;}
.top-input {padding:0 10px; font-size:14px;}
.top-button {padding:0 10px; font-size:14px}
}

