/* Max Media Screen ==========================================================*/
@media screen and (max-width: 1800px) { 

.header-fixed nav { padding-right: 240px; }
.header-fixed nav li { padding-right: 30px; }

}

@media screen and (max-width: 1679px) { 

h1 { font-size: 50px; }

.warpper { padding: 100px 80px; }


.header-fixed nav { padding-right: 260px; }
.header-fixed nav li { padding-right: 15px; }
.header-fixed nav li a { font-size: 18px; }

/*.header-fixed aside ul li:first-child { padding-right: 5px; }*/
.header-fixed aside ul li:last-child { padding-left: 15px; }

.en .header-fixed nav li a { font-size: 16px; }


/*.banner main .bg { width: 1030px; }*/
.banner { height: inherit; }
.banner .warpper { order: 2; align-items: flex-start; }
.banner main .bg { position: relative; height: 480px; background-size: cover !important; order: 1; }

.banner main article { padding: 30px 80px 50px 80px }


.start:before { width: 1030px; }

.aboutus-1 article { max-width: 70%; margin: 0; padding-left: 80px; padding-right: 0;  }

.aboutus-2 .warpper { padding: 150px 15%; }
.aboutus-2 .warpper:after { width: 100px; }

.team .lists main h1 { padding-left: 80px; }
.team .lists main .photo figure img { width: 94%; }
.en .team .lists main h1 {  padding-bottom: 80px; }

.service main .text-1 { padding-left: 80px; }
.service main .text-5 { padding-left: 80px; }
.service main .text-6 { padding-right: 80px; }

.technology main .text-1 { padding: 0 80px; }
.technology main .vdo video { padding-top: 0; }
.technology main .vdo figure { padding-top: 0; }

.article main { min-width: 100%; padding: 0 80px; }
.article main li { width: 50%; }
.article main .photo { height: 360px; }
.article main .text { padding: 30px 60px; }


.contactus .box-form .warpper { padding-left: 80px; padding-right: 80px; }
.contactus .address { padding-left: 80px; }


}


/*True*/
@media screen and (max-width: 1366px) { 

h1 { font-size: 46px; }

.header-fixed header { width: 280px; }
.header-fixed header a { padding: 30px 0 }
.header-fixed nav { padding-right: 250px; }


.team .lists main { min-height: inherit; }
.team .lists main .name header { padding: 10px 80px 30px 80px }
.team .lists main .photo figure img { width: 50% }
.team .lists aside .warpper { padding: 60px 0 }
.team h2 { font-size: 30px; padding-bottom: 0; }
.team .title { bottom: 120px; }

}

@media screen and (max-width: 1365px) {

/*.header-fixed nav { display: none; }*/

.header-fixed main { padding: 0 20px; }
.header-fixed nav { padding-right: 370px; }
.header-fixed nav li a { font-size: 15px; }
.en .header-fixed nav li a { font-size: 14px; }
.header-fixed aside { right: 80px; }

.nav { opacity: 1 !important;  visibility: visible !important; }


.aboutus-1 article { max-width: 100%; padding-right: 80px; }
.aboutus-2 .warpper:before { width: 150px; }
.aboutus-2 .warpper:after { width: 80px; }

.team h2 { font-size: 24px; }
.team .title { bottom: 80px; }
.team .lists main .name header { padding-right: 40px; }
.team .lists main .name header:after { display: none; }

.service main .text-4 { left: 100%; }

.treatment-fees main  { padding: 0 30px; }
.treatment-fees main .warpper { padding: 60px 30px 30px 30px; }
.treatment-fees .box-row table thead tr th:last-child { width: 30%; }

.technology main .text-2 { width: 50%; }


.article main .warpper { padding: 60px 30px 0 30px; }
.article main { padding: 0 30px; }

.contactus .box-form .warpper { padding-left: 60px; padding-right: 60px; }
.contactus .address { padding-left: 60px; }

}


/*True*/
@media screen and (max-width: 1280px) {

	
}

/*True*/
@media screen and (max-width: 1279px) {

.header-fixed nav { display: none; }

/*.banner main .bg { width: 100%; }*/


	
}


/*True Vertical*/
@media screen and (max-width: 1024px) {

.header-fixed nav { display: none; }

footer main .footer-contact ul li { padding: 7px 10px; }

.start article {
    position: relative;
    width: 100%;
    padding: 30px;
    left: 0;
}


}

@media screen and (max-width: 1023px) {

.header-fixed header a { padding: 30px 0; }

.nav-mobile aside dl { padding: 60px 40px; }

.why ul li { width: 50%; }

.aboutus-1 .warpper { padding-top: 50px; }
.aboutus-2 .warpper { padding: 100px 80px; }
.aboutus-2 .warpper:before { width: 80px; }
.aboutus-2 .warpper:after { width: 40px; }

.team .title { position: relative; bottom: inherit; padding-top: 50px; }
.team .lists aside .box { width: 100%; }
.team .lists aside:after { display: none; }
.team .lists aside .box:nth-child(2) { padding-top: 50px; }
.team .lists main .name { width: 60%; position: absolute; order: 2; }
.team .lists main .name header { padding-right: 15px; }
.team .lists main .photo { width: 100%; }
.team .lists main .photo figure img { width: 40%; margin-left: auto; margin-right: inherit; }

.service main h1 { padding-top: 60px; }
.service main .box-50 .warpper { max-width: 100%; }
.service main .text-2 { margin-right: 0; margin-top: 80px; }
.service main .text-3 { width: 85%; }
.service main .box-50 { width: 100%; }
.service main .text-4 { left: 0; margin-left: 80px; }
.service main .text-6 { width: 85%; padding-left: 20px; }
.service main .text-7 { left: 0; margin-left: 135px; }
.service main .text-8 { left: 0; padding: 30px 80px 50px 80px }
.service main .text-9 { width: 85%; padding: 30px 80px 50px 80px; left: inherit; margin-left: inherit; margin-right: auto; right: inherit; }
.service main .text-10 { width: 85%; right: inherit; padding: 0 60px 50px 20px }
.service main .photo-1 { position: relative; width: 100%; top: inherit; height: 450px }

.treatment-fees main .warpper  { padding: 40px 0; }

.technology:after { height: 400px; }
.technology main { min-height: inherit; flex-wrap: wrap; }
.technology main .vdo .warpper { padding-top: 50px; }
.technology main .box-50 { width: 100%; }
.technology main .box-50 .warpper { width: 100%; height: inherit; }
.technology main .text-1 { margin-top: 100px; margin-bottom: -70px; padding: 30px 60px; width: 100%; height: inherit; }
.technology main .photo-1 { position: relative; width: 100%; height: 500px; }
.technology main .text-2 { width: 100%; left: 0; z-index: 1 }
.technology main .photo-2 { position: relative; width: 100%; height: 500px; margin-top: -200px; margin-right: 80px; }
.technology main .text-3 { width: 100%; height: inherit; margin-top: 100px; padding-left: 110px; right: 80px; }
.technology main .photo-3 { position: relative; width: 100%; height: 500px; margin-top: -50px; margin-left: 80px; }
.technology main .text-4 { width: 100%; height: inherit; margin-top: 0; margin-left: 0; left: 0 }
.technology main .photo-4 { position: relative; width: 100%; height: 500px; margin-top: -150px; margin-left: 0; }

.article main .warpper { padding-top: 40px; }
.article main { padding: 0 }
.article main .photo { height: 260px; }
.article main li { width: 100%; }

.contactus .box-50 { width: 100%; }
.contactus main .warpper { padding-top: 0; }
.contactus .address { padding: 60px 60px 80px 60px; }
.contactus .photo { margin-top: 0; height: inherit; }
.contactus .photo img { position:relative; }
.contactus .box-form .warpper { max-width: 100%; padding-bottom: 80px; }
.contactus .box-top { padding-top:60px }

footer main .footer-contact ul {   display: grid;
  grid-template-columns: max-content max-content ;
  grid-gap: 5px;
  justify-content:center; }
footer main .footer-contact ul li { width: 50%; }
footer main .footer-contact ul li:nth-child(1) { order: 1 }
footer main .footer-contact ul li:nth-child(2) { order: 2 }
footer main .footer-contact ul li:nth-child(3) { order: 4 }
footer main .footer-contact ul li:nth-child(4) { order: 3 }
footer main .footer-contact ul li:nth-child(5) { order: 5 }
footer main .footer-contact ul li:nth-child(6) { order: 6 }

}


/*True Vertical*/
@media screen and (max-width: 768px) {

.contactus .photo figure { height:inherit; }

}

@media screen and (max-width: 767px) {

h1 { font-size: 26px; }
h2 { font-size: 24px; }
h3 { font-size: 20px; }

input[type="text"], input[type="password"], input[type="email"], input[type="file"], select, textarea { font-size: 16px; }

.header-fixed { height: 70px; }

.header-fixed header { width: 180px; }
.header-fixed header a { padding: 20px 0 }

/*.header-fixed aside ul li:first-child span { display: none; }*/

.nav { top: 15px; }

.nav-mobile aside:before { display: none; }
.nav-mobile aside ul { width: 100%; order: 2; padding: 30px 40px; }
.nav-mobile aside li { padding: 5px 0; }
.nav-mobile aside dl { width: 100%; order: 1; padding: 20px 0 40px 0; justify-content: flex-start; background: none }
.nav-mobile aside dd:first-child { padding-bottom: 20px; margin-bottom: 20px; }
.nav-mobile aside .box { max-width: 320px; }
.nav-mobile aside dd:nth-child(2) {/* width: 100%; padding-right: 15px; padding-bottom: 20px; */} 

.navigation { top: 80px; left: 10px  }
.navigation span:nth-child(2):before { width: 20px }
.navigation span:nth-child(2) { padding-left: 30px; }
.navigation span:nth-child(3):before  { width: 20px }
.navigation span:nth-child(3) { padding-left: 30px; }
.navigation span:nth-child(4):before { width: 20px }
.navigation span:nth-child(4) { padding-left: 30px; }
.navigation span:nth-child(2) a { max-width: 100px; }
.navigation span:nth-child(3) a { max-width: 100px; }
.navigation span:nth-child(4) a { max-width: 100px; }

.banner main article { padding: 30px; }
.banner main article h3 { padding-bottom: 15px; }

.start article { position: relative; width: 100%; padding: 30px; left: 0; }
.start figure { position: absolute; width: auto; left: 30px; top: 60px; height: 270px; }
.start .warpper { padding: 280px 0 0 30px }

.why main { padding-bottom: 40px; }
.why main .warpper { padding: 60px 30px 0 30px; }
.why main:before { top: 60px; width: 90%; }
.why aside .warpper { padding: 30px; }
.why ul { margin: 0 -15px; }
.why ul li { width: 100%; padding: 15px; }


.aboutus-1 .warpper { padding-top: 0; }
.aboutus-1 article { padding: 30px }
.aboutus-1 .photo { margin-top: 0; height: 400px; }
.aboutus-1 .text-1 { padding: 30px; }
.aboutus-2 .warpper { padding: 60px 60px 60px 30px; }
.aboutus-2 .warpper:after { width: 5px; }
.aboutus-2 .warpper:before { width: 40px; }


.team h2 { font-size: 24px; padding-bottom: 0; }
.team .title { padding-top: 30px; }
.team .lists main h1 { padding-left: 30px; padding-bottom: 40px; }
.team .lists main .name header { padding: 10px 30px 30px 30px }
.team .lists main .photo figure img { width: 90%; margin-right: auto; }
.team .lists aside .box { padding: 30px; }
.team .lists main .name { width: 100%; order: 2; position: relative; }
.team .lists aside .warpper { padding: 20px 0; }
.team .lists aside .box:nth-child(2) { padding-top: 0; }


.service main h1 { padding-top: 15px;  }
.service main h4 { font-weight: 300; }
.service main .text-1 { padding: 30px; }
.service main .text-2 { margin: 0 0 0 30px; padding: 30px; }
.service main .text-3 { width: 100%; padding: 0 30px; }
.service main .box-100 .warpper { padding: 30px 0 }
.service main .text-4 { padding: 30px; margin-left: 30px; margin-bottom: 0; }
.service main .text-5 { padding: 30px }
.service main .text-6 { width: 100%; padding: 0 30px 0 30px; }
.service main .text-7 { margin-left: 30px; margin-bottom: 0; padding: 30px }
.service main .text-8 { padding: 30px; width: 100%; }
.service main .text-9 { padding: 30px; margin-top: 330px; }
.service main .text-10 { width: 100%; padding: 0 30px 10px 30px; }
.service main .photo-1 { height: 300px; }
.service main .photo-2 { position: relative; height: 300px; }
.service main .photo-3 { position: relative; height: 300px; margin-top: -50px;  top: 0;  }
.service main .photo-4 { height: 300px; }


.treatment-fees main .warpper  { padding: 30px 0; }
.treatment-fees .box-row { padding-bottom: 40px; }
.treatment-fees .box-row table { border-top: 4px solid #acc6cc  }
.treatment-fees .box-row table thead { display: none; }
.treatment-fees .box-row table thead tr th { }
.treatment-fees .box-row table tbody tr { display: flex; flex-wrap: wrap; }
.treatment-fees .box-row table tbody tr td { width: 100%;  padding: 10px 20px; }
.treatment-fees .box-row table tbody tr td:first-child { border-bottom: none; padding-bottom: 0; }
.treatment-fees .box-row table tbody tr td:first-child span { font-size: 20px; }
.treatment-fees .box-row table tbody tr td:last-child { display: flex; text-align: right; }
.treatment-fees .box-row table tbody tr td:last-child span { margin-right: auto; font-weight: 300 }
.treatment-fees .box-row .fix-thead-1 { display: block; width: 120px; }
.treatment-fees .box-row .fix-thead-2 { display: inline-flex; width: 120px; }


.technology:after { height: 150px; }
.technology main .vdo .warpper { padding-top: 30px; }
.technology main .text-1 { padding: 30px; margin-left: 30px; margin-top: 60px; }
.technology main .photo-1 { height: 300px; margin-top: 30px; }
.technology main .text-2 { padding: 30px; }
.technology main .photo-2 { height: 300px; margin-top: -100px !important; }
.technology main .box-100 .warpper { padding: 60px 30px; }
.technology main .photo-2 { margin-right: 30px; margin-top: -150px; }
.technology main .text-3 { margin-top: 60px; right: inherit; margin-right: 30px; padding: 30px; }
.technology main .photo-3 { margin-left: 30px; height: 300px; }
.technology main .text-4 { padding: 30px; }
.technology main .photo-4 { height: 300px; margin-top: -110px; }
.technology main .youtube-embed { height: 240px; }

.article main .warpper { padding-top: 30px; }
.article main .text { padding: 30px; }
.article:after { height: 360px; }

.landing-detail .warpper { padding-top: 0; }
.landing-detail .warpper h1 { font-size: 24px; }
.landing-detail .box-faqs li  { width: 100%; }

.contactus .photo { height: 290px; }
.contactus .photo img { position:relative; }
.contactus .address { padding: 30px 30px 50px 30px; }
.contactus .box-form .warpper { padding: 30px 30px 50px 30px; }
.contactus .address h4 { font-size:18px; }

.contactus .box-form .personal li,.contactus .box-form .treatment li { width: 100%; padding-bottom: 0; }
.carousel-nav .carousel-cell { min-width:160px;}
.carousel-nav .carousel-cell .name { font-size:16px;  padding: 13px 10px 15px 10px  }

footer main .footer-contact ul {  grid-template-columns: max-content; grid-gap: 0px; }
footer main .footer-contact ul li { width: 100%; padding: 7px 15px; }
footer main .footer-contact { padding-top: 15px; }
footer main .warpper { padding: 30px }
footer aside .warpper { padding: 0; }
footer main .footer-contact { width: 296px; }
footer aside { padding-bottom:30px; }

.btn-back { padding: 10px; }

.editor ul.horizontal li { width: 100%; }

}


/*True Vertical*/
@media screen and (max-width: 425px) {

.header-fixed aside { display: none; right: 70px; }
.header-fixed aside ul li:nth-child(2),.header-fixed aside ul li:nth-child(3),.header-fixed aside ul li:nth-child(4) { display: none; }

.banner .warpper { order: 2; align-items: flex-start; }
.banner main .bg { position: relative; height: 380px; background-size: cover !important; order: 1; }

}

/*True*/
@media screen and (max-width: 375px) {

.start .warpper { padding-top: 255px; }

footer h1,footer main h3 { font-size: 24px; }

}

@media screen and (max-width: 320px) { 

h1 { font-size: 24px; }
h2 { font-size: 22px; }
h3 { font-size: 19px; }

.nav-mobile aside dl { padding: 60px 20px 40px 20px }
.nav-mobile aside dd:last-child { padding-left: 10px; }
/*.nav-mobile aside dd:nth-child(2) { padding-right: 10px; }*/

.banner { height: 500px; }

.start .warpper { padding-top: 250px; }

footer main .footer-contact ul li a { font-size: 14px; }

.pagination a { width: 30px; height: 30px; min-width: 30px; }

}
