@charset "UTF-8";

.service.asia .bread {
    margin-bottom: 30px;
}
.service.asia .ttl {
    padding-left: 3.5%;
    padding-bottom: 1%;
    margin: 3%;
    font-size: 2vw;
}

.service.asia .btn_vietnam {
    margin-left: 55%;
}

.service.asia .container-fluid {
    width: 100%;
    position: relative;
    text-shadow: 2px 2px 2px #333;
}

.service.asia .card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: .25rem;
}

.service.asia .img-fluid {
    max-width: 100%;
    height: auto;
}

.service.asia .card-img-overlay {
    position: absolute;
    right: 0;
    left: 0;
    /* padding: 1rem; */
    border-radius: calc(.25rem - 1px);
}
.service.asia .card-img-overlay p {
    line-height: 1.5;
    margin-bottom: 1rem;
}

.service.asia .card-img-overlay span {
    color: red;
}

.service.asia .card-ruby-dev-vn {
    text-align: center;
    font-weight: bold;
    top: calc(25% - 0.5rem);
    padding: 0;
}

.service.asia .card-ruby-dev-vn-p1 {
    font-size: 7vw;
    color: #ffff;
}

.service.asia .card-ruby-dev-vn-p2 {
    font-size: 3vw;
    color: red;
}

.service.asia .card-ruby-dev-vn-p3 {
    font-size: 2vw;
    color: #ffff;
}

.service.asia .card-software {
    text-align: center;
    font-weight: bold;
    top: calc(60% - 0.5rem);
    padding: 0;
}

.service.asia .card-software-p1 {
    font-size: 3.5vw;
    color: #ffff;
}

.service.asia .card-software-p2 {
    font-size: 3.5vw;
    color: #ffff
}

.service.asia .card-quality {
    text-align: center;
    font-weight: bold;
    top: calc(60% - 0.5rem); 
    padding: 0;
}

.service.asia .card-quality-p1 {
    font-size: 3.5vw;
    color: #ffff;
}

.service.asia .card-quality-p2 {
    font-size: 3.5vw;
    color: #ffff;
}

.service.asia .card-communication {
    text-align: center;
    font-weight: bold;
    top: calc(70% - 0.5rem);
    padding: 0;
}

.service.asia .card-communication-p1 {
    font-size: 3.5vw;
    color: #ffff;
}

.service.asia .card-communication-p2 {
    font-size: 3.5vw;
    color: #ffff;
}

.service.asia .card-growth {
    text-align: center;
    font-weight: bold;
    top: calc(65% - 0.5rem);
    padding: 0;
    text-shadow: 2px 2px 2px #333;
}

.service.asia .card-growth-p1 {
    font-size: 2.5vw;
    color: #ffff;
}

.service.asia .card-growth-p1-span {
    color: orange !important;
    font-size: 3.5vw;
}

.service.asia .card-growth-p2 {
    font-size: 3.5vw;
    color: #ffff;
}

.service.asia .card-security {
    text-align: center;
    font-weight: bold;
    top: calc(65% - 0.5rem);
    padding: 0;
}

.service.asia .card-security-p {
    font-size: 3vw;
    color: #ffff;
}

.service.asia .card-security-p2 {
    font-size: 3vw;
    color: #ffff;
}

.service.asia .card-solution {
    text-align: center;
    font-weight: bold;
    top: calc(5% - 0.5rem);
    padding: 0;
}

.service.asia .card-solution-p {
    font-size: 3.5vw;
    color: #ffff;
}

.service.asia .card-solution-ul {
    color: #ffff;
    text-align: left;
    font-weight: bold;
}

.service.asia .card-solution-ul-li {
    color: #ffff;
    text-align: left;
    font-weight: bold;
    font-size: 3vw;
    padding: 5%;
    margin: 5%;
}

.service.asia .card-faq {
    text-align: center;
    font-weight: bold;
    top: calc(5% - 0.5rem);
    padding: 0;
}

.service.asia .card-faq-p {
    font-size: 3.5vw;
    color: #fff;
    padding-bottom: 1%;
}

.service.asia .p-5 {
    padding: 3rem!important;
}

.service.asia .m-5 {
    margin: 3rem!important;
}

.service.asia .accordion {
    text-shadow: none;
}
.service.asia .accordion .accordion_one {
	max-width: 1000px;
	margin: 0 auto;
}
.service.asia .accordion .accordion_one .accordion_header {
	background-color: #fff;;
	color: #212529;
	padding: 20px 11%;
	text-align: center;
	position: relative;
	z-index: +1;
	cursor: pointer;
	transition-duration: 0.2s;
    border: 1px solid rgba(0,0,0,.125)
}

.service.asia .accordion .accordion_one .accordion_header .i_box {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 50%;
	right: 5%;
	width: 40px;
	height: 40px;
	border: 1px solid #fff;
	margin-top: -20px;
	box-sizing: border-box;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	transform-origin: center center;
	transition-duration: 0.2s;
}
.service.asia .accordion .accordion_one .accordion_header .i_box .one_i {
	display: block;
	width: 18px;
	height: 18px;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	transform-origin: center center;
	transition-duration: 0.2s;
	position: relative;
}
.service.asia .accordion .accordion_one .accordion_header.open .i_box {
	-webkit-transform: rotate(-360deg);
	transform: rotate(-360deg);
}
.service.asia .accordion .accordion_one .accordion_header .i_box .one_i:before,
.service.asia .accordion .accordion_one .accordion_header .i_box .one_i:after {
	display: flex;
	content: '';
	background-color: #212529;
	border-radius: 10px;
	width: 18px;
	height: 4px;
	position: absolute;
	top: 7px;
	left: 0;
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
	transform-origin: center center;
}
.service.asia .accordion .accordion_one .accordion_header .i_box .one_i:before {
	width: 4px;
	height: 18px;
	top: 0;
	left: 7px;
}
.service.asia .accordion .accordion_one .accordion_header.open .i_box .one_i:before {
	content: none;
}
.service.asia .accordion .accordion_one .accordion_header.open .i_box .one_i:after {
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
.service.asia .accordion .accordion_one .accordion_inner {
	display: none;
	padding: 30px 30px;
	box-sizing: border-box;
    background-color: #fff;;
	color: #212529;
}

.service.asia .accordion .accordion_one .accordion_inner p.txt_a_ac {
	margin: 0;
    font-size: 1vw;
}

.service.asia .ruby_contact {
    text-shadow: none;
    padding-top: 2%;
    margin: 3%;
}

.service.asia section {
    padding: 0;
}

@media screen and (max-width: 1024px) {
    .service.asia .accordion .accordion_one .accordion_header {
		font-size: 2%;
	}
	.service.asia .accordion .accordion_one .accordion_header .i_box {
		width: 30px;
		height: 30px;
		margin-top: -15px;
	}
    .service.asia .accordion .accordion_one .accordion_inner p.txt_a_ac {
        font-size: 2%;
    }
    .service.asia .card-faq {
        top: 20px;
    }
    .service.asia .card-faq-p {
        font-size: 2%;
        color: #212529;
        text-shadow: none;
    }
    .service.asia .sp_faq {
        height: 500px;
    }
}
@media screen and (max-width: 767px) {
	.service.asia .accordion .accordion_one .accordion_header {
		font-size: 2%;
		text-align: left;
		padding: 15px 60px 15px 15px;
	}
}

@media (max-width: 720px) {
    .service.asia h2.main_ttl {
      padding-top: 10px;
      padding-bottom: 10px;
    }
  
    .service.asia section {
      padding-top: 30px !important;
      padding-bottom: 0px !important;
    }
  }