.heroes-area {
    padding: 100px 0;
	background-image: linear-gradient(45deg, #eaf6ff, #fff3f2);

}
.w1200 {
    width: 1200px;
    position: relative;
    margin: 0 auto;
    overflow: hidden;
}
.w1400 {
    width: calc(1200px - 20px);
    position: relative;
    margin: 0 auto;
    overflow: hidden;
    padding-left: 10px !important;
    padding-right: 10px !important;
}
.heroes-area h1 {
    font-size: 50px;
    font-weight: 700;
    color: #233253;
    margin-bottom: 20px;
}

.heroes-area p{
    color: #777777;
    font-size: 12px;
}


.mt-5 {
    margin-top: 3rem !important;
}
.btn {
    --bs-btn-padding-x: 0.75rem;
    --bs-btn-padding-y: 0.375rem;
    --bs-btn-font-family: ;
    --bs-btn-font-size: 1rem;
    --bs-btn-font-weight: 400;
    --bs-btn-line-height: 1.5;
    --bs-btn-color: var(--bs-body-color);
    --bs-btn-bg: transparent;
    --bs-btn-border-width: var(--bs-border-width);
    --bs-btn-border-color: transparent;
    --bs-btn-border-radius: var(--bs-border-radius);
    --bs-btn-hover-border-color: transparent;
    --bs-btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
    --bs-btn-disabled-opacity: 0.65;
    --bs-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);
    display: inline-block;
    padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
    font-family: var(--bs-btn-font-family);
    font-size: var(--bs-btn-font-size);
    font-weight: var(--bs-btn-font-weight);
    line-height: var(--bs-btn-line-height);
    color: var(--bs-btn-color);
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);
    border-radius: var(--bs-btn-border-radius);
    background-color: var(--bs-btn-bg);
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.btn-primary {
    border-radius: 10px;
    overflow: hidden;
    --bs-btn-color: #fff;
    --bs-btn-bg: #0d6efd;
    --bs-btn-border-color: #0d6efd;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #0b5ed7;
    --bs-btn-hover-border-color: #0a58ca;
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #0a58ca;
    --bs-btn-active-border-color: #0a53be;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #0d6efd;
    --bs-btn-disabled-border-color: #0d6efd;
}
.px-5 {
    padding-right: 3rem !important;
    padding-left: 3rem !important;
}

.btn-lg, .btn-group-lg > .btn {
    --bs-btn-padding-y: 0.5rem;
    --bs-btn-padding-x: 1rem;
    --bs-btn-font-size: 1.25rem;
    --bs-btn-border-radius: var(--bs-border-radius-lg);
}
.text-secondary {
    --bs-text-opacity: 1;
    color: rgba(var(--bs-secondary-rgb), var(--bs-text-opacity)) !important;
}
.block{display: block;}
.w100{width: 100%;}
.text-center{text-align: center;}
.flex{display: flex;}
.flex-jcsb{justify-content: space-between;}
.flex-end{justify-content: flex-end;}
.jc-right{justify-content: flex-end;}
.jc-center{justify-content: center;}
.ai-center{align-items: center;}
.img_cover,.CoverImg{
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.GDtime05{
    transition: all .5s;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s;
}
:root{
    --color:#f1f5ff;
}
.t1{padding-top:50px;}
.t1 li{
    width: 23.5%;
    padding: 15px;
    background: var(--color);
}
.t1 .img{height: 150px;}
.t1 h5{
    font-size: 20px;
    text-align: center;
    margin-top: 15px;
}
.t1 span{
    display: block;
    width: 30px;
    height: 3px;
    border-radius: 10px;
    background: #0d6efd;
    margin: 15px auto;
}

.t1 p{
    font-size: 15px;
    line-height: 25px;
    opacity: .6;
}
.dw_relative{
    position: relative;
}
.ptb60{padding: 60px 0;}
.t1 li:hover{
    transform: translateY(-10px);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
}
.t5 li{
    width: 15%;
}
.t5 img{margin: 20px auto 10px;display: block;}
.t5{margin-bottom: 50px;}
.flex-wrap{flex-wrap: wrap;}
.t2{
    margin-top: 30px;
    padding: 20px;
    background: var(--color);
}
.t2 h2{margin-bottom: 30px;}
.t2 .txt{
    background: #fff;
    padding: 50px;
    font-size: 15px;
    width: 60%;
    padding-right: 11%;
    font-weight: 100;
}
.t3 ul li{
    width: 40%;
}
.t3{margin-bottom: 50px;}
.t2 .img{
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 50%;
    border-radius: 10px;
    overflow: hidden;
}
.t2 .txt h5{
    font-size: 20px;
    line-height: 35px;
    font-weight: 500;
}
.t2 .txt p{
    line-height: 30px;
    margin: 6px 0 10px;
}
.t2 .txt ul{
    margin-bottom: 50px;
}
.t2 .txt li{
    line-height: 30px;
    position: relative;
    padding-left: 10PX;
}
.t2 .txt li::after{
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 4px;
    height: 4px;
    background: #000;
    border-radius: 100%;
    overflow: hidden;
}
.part-whydeepseek{
    padding-bottom: 60px;
}


.part-whydeepseek .item{
	text-align:center;
	background-color:#fff;
	padding:15px;
	background: linear-gradient(#f4f7ff, #faf6ff);
	border-radius:10px;
	height:100%;
	
	box-shadow: 0 0 8px #673ab763;
}
.part-whydeepseek .item h5{
	font-size: 22px;
	font-weight:bold;
	color: #1F2A59;
	margin-bottom:1rem;
}

.part-whydeepseek .item p{
    margin-bottom: 0px;
    font-weight: 400;
	font-size:15px;
    line-height: 1.8;
	text-align:left;
    color: #555;
}



.part-deepseek{
	position: relative;
	background-image:url('../../images/bg1.png');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	padding:80px 0;
}

.section-heading {
    position: relative;
    text-align: center;
    margin-bottom: 20px;
}
.section-heading h6 {
    color: #797878;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    line-height: 22px;
    letter-spacing: 4px;
}
.section-heading h2 {
    font-size: 40px;
    font-weight: 700;
    letter-spacing: 1px;
    font-family: "Microsoft JhengHei";
    margin: 10px 0 15px;
}
.section-heading p {
    line-height: 20px;
    letter-spacing: 1px;
    font-family: "Microsoft JhengHei";
    font-size: 14px;
}
.grid{
        display: grid
}
.g-2-20{
   grid-template-columns: repeat(2, 1fr);
   grid-gap: 20px;  
}

.part-deepseek{
	position: relative;
	background-image:url('./image/bg1.png');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	padding-bottom:16rem;
}



.part-deepseek .item{
	padding:1rem;
	background-color:#FFE3E3;
	
	border-radius:10px;
	height:100%;
	
}
.part-deepseek .item .icon-box{
	width:80px;height:80px;
	border-radius:10px;
	background-color:#fff;

	display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.part-deepseek .item .icon-box i{
    font-size: 40px;
    text-align: center;
	color:#673ab7;
}

.part-deepseek .item h5{
	font-size: 1.25rem;
	font-weight:bold;
	margin-top:1rem;
	color: #1F2A59;
}

.part-deepseek .item p{
    font-weight: 400;
	font-size:15px;
    line-height: 1.8;
	text-align:left;
    color: #555;
}

.part-deepseek .item ul{
	margin:0;
	padding-left:1rem;
}


.part-deepseek .item ul li{
	font-size:14px;
    line-height: 1.8;
    color: #555;
    position: relative;
}


.part-deepseek .row .col-md-6:nth-child(2) .item {
    background: #D2D7FF;
}
.part-deepseek .row .col-md-6:nth-child(3) .item{
    background: #FEC;
}
.part-deepseek .row .col-md-6:nth-child(4) .item {
    background: #DFC6FF;
}


.part-deepseek .row .col-md-6:nth-child(odd) .item {
	transform: translateY(60px);
}
.our-portfolio{padding: 80px 0;}
.owl-portfolio .owl-nav {
  position: absolute;
  top: 42%;
  width: 100%;
}
.owl-portfolio .owl-nav .owl-prev {
  position: absolute;
  left: 25px;
}

.owl-portfolio .owl-nav .owl-next {
  position: absolute;
  right: 30px;
}

.owl-portfolio .owl-nav .owl-prev span {
    color: transparent;
}

.owl-portfolio .owl-nav .owl-prev span:hover::after{
  opacity: 1;
}

.owl-portfolio .owl-nav .owl-prev span:after {
  width: 46px;
  height: 46px;
  background-color: #ff695f;
  display: inline-block;
  text-align: center;
  line-height: 46px;
  border-radius: 50%;
  color: #fff;
  content: '«';
  font-size: 22px;

  transition: all .5s;
  opacity: 0.5;
}

.owl-portfolio .owl-nav .owl-next span {
    color: transparent;
}

.owl-portfolio .owl-nav .owl-next span:hover::after{
  opacity: 1;
}

.owl-portfolio .owl-nav .owl-next span:after {
  width: 46px;
  height: 46px;
  background-color: #ff695f;
  display: inline-block;
  text-align: center;
  line-height: 46px;
  border-radius: 50%;
  color: #fff;
  content: '»';
  font-size: 22px;

  transition: all .5s;
  opacity: 0.5;
}
.case1{
    background: var(--color);
    padding: 20px;
    margin-bottom: 30px;
}
.case1 h2{
    margin: 10px 0 20px;
}
.case1 .img{
    width: 65%;
    margin-right: 5%;
}
.case1 h4,h5{
    font-size: 18px;
    line-height: 35px;
    font-weight: bold;
}
.case1 h5{color: red;}
.case1 p{
    font-size: 16px;
    line-height: 25px;
    margin-bottom: 10px;
}
.case1 a{
    background: #6cc5ee;
    font-size: 16px;
    line-height: 40px;
    color: #fff;
    overflow: hidden;
    border-radius: 15px;
    width: 180px;
    text-align: center;
    display: block;
    margin-top: 20px;

}
.case2{margin-bottom: 50px;}

.main-banner {
	position: relative;
	background-image:url('image/bg.png');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	padding-top: 50px;
}

.main-banner  .banner-text{
	display: flex;
    flex-direction: column;
    justify-content: center;
	align-items: flex-start;
	height:100%;
}
.main-banner .banner-text span {
	background: #2D50CE;
	color: #fff;
	border-radius: 50px;
	padding:5px 15px;
}
.main-banner .banner-text p {
    margin-bottom: 0px;
    line-height: 2;
    color: #555;
    font-size: 16px;
}
.main-banner   .banner-text h2 {
  font-size: 50px;
  font-weight: 700;
  color: #1F2A59;
  line-height: 72px;
  margin-top:1rem;
}

.main-banner   .banner-text p {
	margin-bottom: 0px;
    line-height: 2;
    color: #555;
    margin: 20px 0;
}



.main-banner .banner-image{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.main-banner  .banner-image::after {
	position: absolute;
	content: "";
	top: 48px;
	left: 36px;
	width: 92%;
	height: 92%;
	background-image: url('image/circle.png');
	background-repeat: no-repeat;
	z-index: -1;
}
.main-banner .txt{
    width: 45%;
}
.main-banner .img{
    width: 45%;
}
.button_style2 {
	position: relative;
	display:inline-block;
	margin-top:1rem;
    font-size: 14px;
	border-radius: 6px;
	z-index: 1;
	border: none;
	color: #fff;
	cursor: pointer;
	transition: all 0.2s ease;
	
	padding:0.6rem 4rem;
	background-color:#2D50CE;
}
.button_style2:active {
	transform: scale(0.96);
}
.button_style2:before, .button_style2:after {
	position: absolute;
	content: "";
	width: 100%;
	left: 50%;
	bottom: 0%;
	height: 100%;
	transform: translateX(-50%);
	z-index: -1;
	background-repeat: no-repeat;
}
.button_style2:hover:before {
	top: -70%;
	background-image: radial-gradient(circle, #2D50CE 20%, transparent 20%), radial-gradient(circle, transparent 20%, #2D50CE 20%, transparent 30%), radial-gradient(circle, #2D50CE 20%, transparent 20%), radial-gradient(circle, #2D50CE 20%, transparent 20%), radial-gradient(circle, transparent 10%, #2D50CE 15%, transparent 20%), radial-gradient(circle, #2D50CE 20%, transparent 20%), radial-gradient(circle, #2D50CE 20%, transparent 20%), radial-gradient(circle, #2D50CE 20%, transparent 20%), radial-gradient(circle, #2D50CE 20%, transparent 20%);
	background-size: 10% 10%, 20% 20%, 15% 15%, 20% 20%, 18% 18%, 10% 10%, 15% 15%, 10% 10%, 18% 18%;
	background-position: 50% 125%;
	animation: greentopBubbles 0.6s ease;
}
@keyframes greentopBubbles {
  0% {
    background-position: 5% 90%, 10% 90%, 10% 90%, 15% 90%, 25% 90%, 25% 90%, 40% 90%, 55% 90%, 70% 90%;
  }
  50% {
    background-position: 0% 80%, 0% 20%, 10% 40%, 20% 0%, 30% 30%, 22% 50%, 50% 50%, 65% 20%, 90% 30%;
  }
  100% {
    background-position: 0% 70%, 0% 10%, 10% 30%, 20% -10%, 30% 20%, 22% 40%, 50% 40%, 65% 10%, 90% 20%;
    background-size: 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%;
  }
}
.button_style2:hover::after {
	bottom: -70%;
	background-image: radial-gradient(circle, #2D50CE 20%, transparent 20%), radial-gradient(circle, #2D50CE 20%, transparent 20%), radial-gradient(circle, transparent 10%, #2D50CE 15%, transparent 20%), radial-gradient(circle, #2D50CE 20%, transparent 20%), radial-gradient(circle, #2D50CE 20%, transparent 20%), radial-gradient(circle, #2D50CE 20%, transparent 20%), radial-gradient(circle, #2D50CE 20%, transparent 20%);
	background-size: 15% 15%, 20% 20%, 18% 18%, 20% 20%, 15% 15%, 20% 20%, 18% 18%;
	background-position: 50% -125%;
	animation: greenbottomBubbles 0.6s ease;
}
@keyframes greenbottomBubbles {
  0% {
    background-position: 10% -10%, 30% 10%, 55% -10%, 70% -10%, 85% -10%, 70% -10%, 70% 0%;
  }
  50% {
    background-position: 0% 80%, 20% 80%, 45% 60%, 60% 100%, 75% 70%, 95% 60%, 105% 0%;
  }
  100% {
    background-position: 0% 90%, 20% 90%, 45% 70%, 60% 110%, 75% 80%, 95% 70%, 110% 10%;
    background-size: 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%;
  }
}


@media screen and (max-width:767px) {
    .w1200,.container{
        width: 96% !important;
        margin: auto;
        overflow: hidden;
        padding: 0 !important;
    }
    .w1400 {
    width: calc(96% - 20px) !important;
    position: relative;
    margin: 0 auto;
    overflow: hidden;
    padding-left: 10px !important;
    padding-right: 10px !important;
}
.main-banner .txt,.img{width: 100% !important;}
.heroes-area h1 {
    font-size: 30px;
    font-weight: 700;
    color: #233253;
    margin-bottom: 20px;
}
.text-secondary {
    font-size: 16px;
    line-height: 30px;
}
.main-banner .banner-text h2 {
    font-size: 30px;
    font-weight: 700;
    color: #1F2A59;
    line-height: 40px;
    margin-top: 1rem;
}
h2.text-center,.t2 h2,.section-heading h2{font-size: 22px;line-height: 1.5;}
.section-heading h2 {
    margin: 6px 0 6px;
}
.g-2-20 {
    grid-template-columns: repeat(1, 1fr);
    grid-gap: 20px;
    padding-bottom: 10px;
}
.ptb60 {
    padding: 40px 0;
}
.t1 {
    padding-top: 20px;
}
.t1 li {
    width: calc(48% - 20px);
    padding: 10px;
    background: var(--color);
    margin: 6px 0;
}
.t1 .img {
    height: 100px;
}.t1 h5 {
    font-size: 18px;
    text-align: center;
    margin-top: 10px;
}.t1 span {
    display: block;
    width: 30px;
    height: 3px;
    border-radius: 10px;
    background: #0d6efd;
       margin: 6px auto
}.t1 p {
    font-size: 14px;
    line-height: 20px;
    opacity: .6;
}
.t2 .txt {
    background: #fff;
    padding: 15px;
    font-size: 15px;
    width: calc(100% - 30px);
    font-weight: 100;
    margin-bottom: 20px;
}
.t2 .img {
    position: static;
    
    top: 0%;
    transform: translateY(0%);
    width: 100%;
    border-radius: 10px;
    overflow: hidden;
}
.t2 .txt ul {
    margin-bottom: 20px;
}
.part-whydeepseek .item {
    height: auto;
    width: calc(98% - 30px);
}
.part-whydeepseek .item h5 {
    font-size: 18px;
    margin-bottom: 0rem;
}
.part-whydeepseek{
    padding-bottom: 10px;
}
.part-deepseek,.our-portfolio{
    padding: 30px 0 !important;
}
.part-deepseek .row .col-md-6:nth-child(odd) .item {
    transform: translateY(0px);
}
.part-deepseek .col-md-6{
    margin-bottom: 15px;
}
.case1 .img {
    width: 100%;
    margin-right: 0%;
    margin-bottom: 10px;
}
}