/* sub */
.page-title {padding-top:90px;}
.page-title-content p {color: #fff; font-size: 14px; margin-bottom: 10px;}
.bg_fixed {min-height: 350px;}



.bd_tit {text-align: center; margin-bottom: 40px;}
.bd_tit .big {font-size: 44px; font-weight: 700;}
.bd_tit .small {font-size: 16px; margin-top: 30px;}




/* about */
.about_map > div {padding-top: 0 !important;}
.about_map iframe {position: unset !important; height: 350px !important;}



.about_ci .img_box {background: #F8F9FB; padding:120px 40px; display: flex; align-items: center; justify-content: center; text-align: center;}
.about_ci .img_box img {mix-blend-mode: darken}
.about_ci .text_box {font-size: 18px; margin-top: 40px;}



.about_cert .cert_list {display: flex; flex-wrap: wrap; gap: 40px;}
.about_cert .cert_list li {width: calc(20% - 32px);}
.about_cert .cert_list .img {font-size: 0; border: 1px solid var(--border);}
.about_cert .cert_list .text {font-size: 16px; margin-top: 15px;}




.about_int .inner {max-width: 1200px;}
.about_int .intro .tit .big {font-size: 45px; font-weight: 700;}
.about_int .intro .tit .small {font-size: 20px; margin-top: 10px;}
.about_int .intro .text {font-size: 18px; margin-top: 60px; line-height: 1.6;}
.about_int .intro .sign {display: flex; justify-content: flex-end; align-items: center; gap: 10px; margin-top: 60px;}
.about_int .intro .sign span {font-weight: 700; font-size: 18px;}
.about_int .intro .sign img {width: 130px; margin-bottom: 5px;}
.about_int .info {margin-top: 90px; border-top: 1px solid var(--border);}
.about_int .info > div {padding: 25px 0; display: flex; align-items: center; gap: 10px; font-size: 18px; border-bottom: 1px solid var(--border)}
.about_int .info .gu {width: 150px; flex-shrink: 0; font-weight: 700;}





.about_ser .info_box {display: flex; gap: 80px;}
.about_ser .tit_box {flex: 2; display: flex; flex-direction: column; gap: 10px;}
.about_ser .tit_box .cate {font-size: 18px; color: var(--mainColor1);}
.about_ser .tit_box .tit {font-size: 40px; font-weight: 700;}
.about_ser .text_box {flex: 3; font-size: 16px; display: flex; flex-direction: column; gap: 30px;}
.about_ser .text_box .text {line-height: 1.6;}
.about_ser .text_box .list {display: flex; flex-direction: column; gap: 15px;}
.about_ser .text_box .list li {padding-left: 12px; position: relative; display: flex; flex-direction: column; gap: 5px;}
.about_ser .text_box .list li::before {display: block; content: "กค"; position: absolute; left: 0;}




/* service */
.ser_sec .info_box {display: flex; gap: 80px;}
.ser_sec .tit_box {flex: 2; display: flex; flex-direction: column; gap: 10px;}
.ser_sec .tit_box .text {font-size: 18px;}
.ser_sec .tit_box .tit {font-size: 40px; font-weight: 700;}
.ser_sec .text_box {flex: 3; font-size: 16px; line-height: 1.6; display: flex; flex-direction: column; gap: 30px;}
.ser_sec .cont_box {margin-top: 120px; padding-top: 90px; border-top: 1px solid var(--border)}



.ser_sec .table .table_tit {font-size: 24px; font-weight: 700; margin-bottom: 10px;}
.ser_sec .table table {width: 100%;}
.ser_sec .table th,
.ser_sec .table td {padding: 20px; border-right: 1px solid var(--border); font-size: 18px; vertical-align: middle;}
.ser_sec .table th:last-child,
.ser_sec .table td:last-child {border-right: 0;}
.ser_sec .table th {background: var(--mainColor1); text-align: center; color: #fff}
.ser_sec .table td {border-bottom: 1px solid var(--border)}
.ser_sec .table .list p {padding-left: 12px; position: relative;}
.ser_sec .table .list p::before {
    display: block; content: "กค"; position: absolute; left: 0;
}



.ser_m_1 .cont_box .list {display: flex; flex-wrap: wrap; gap: 40px;}
.ser_m_1 .cont_box .item {width: calc(50% - 20px); padding: 40px 30px; display: flex; flex-direction: column; border: 1px solid var(--border)}
.ser_m_1 .cont_box .item .number {
    font-size: 20px; font-weight: 700; width: 40px; height: 40px; line-height: 40px; text-align: center;
    color: #fff; background: var(--mainColor1);
}
.ser_m_1 .cont_box .item .tit {font-size: 24px; margin-top: 20px; font-weight: 700}
.ser_m_1 .cont_box .item .text {font-size: 18px; color: #333; margin-top: 15px;}



.ser_m_2 .cont_box .list {display: flex; flex-direction: column; gap: 10px;}
.ser_m_2 .cont_box .list > div {display: flex; gap: 10px;}
.ser_m_2 .cont_box .box {width: 100%; display: flex; flex-direction: column; justify-content: center;}
.ser_m_2 .cont_box .top .box {background: var(--mainColor1); color: #fff; text-align: center; font-size: 20px; padding: 10px;}
.ser_m_2 .cont_box .item .box {border: 1px solid var(--border); padding: 30px;}
.ser_m_2 .cont_box .item .box .tit {font-size: 24px; font-weight: 700; color: var(--mainColor1); margin-bottom: 10px;}
.ser_m_2 .cont_box .item .box .titn {font-weight: 700; color: var(--mainColor1); font-size: 18px; margin-bottom: 5px; display: none;}
.ser_m_2 .cont_box .item .box ul {display: flex; flex-direction: column; gap: 5px;}
.ser_m_2 .cont_box .item .box li {padding-left: 13px; position: relative}
.ser_m_2 .cont_box .item .box li::before {display: block; content: "กค"; position: absolute; left: 0;}
.ser_m_3 .cont_box .cont {margin-top: 90px;}
.ser_m_3 .cont_box .cont .tit {font-size: 32px; margin-bottom: 40px; text-align: center}
.ser_m_3 .cont_box .cont .list {display: flex; gap: 40px;}
.ser_m_3 .cont_box .cont .item {padding: 40px 20px; text-align: center; width: 100%; border: 1px solid var(--border)}
.ser_m_3 .cont_box .cont .item .big {font-size: 24px; font-weight: 700; color: var(--mainColor1);}
.ser_m_3 .cont_box .cont .list .small {font-size: 16px; margin-top: 10px;}
.ser_e_1 .cont_box {display: flex; flex-direction: column; gap: 60px;}
.ser_e_1 .table .note {padding-left: 45px; position: relative;}
.ser_e_1 .table .note span {position: absolute; left: 0;}




 /* rnd */
.rnd_intro .tit {font-size: 44px; font-weight: 700; margin-bottom: 40px;}
.rnd_intro .list {display: flex; flex-direction: column; gap: 40px;}
.rnd_intro .item {padding-left: 45px; position: relative;}
.rnd_intro .item .gu {position: absolute; left: 0; top: -4px; width: 30px; height: 30px; line-height: 30px; font-size: 14px; text-align: center; border-radius: 100px; background: #000; color: #fff;}
.rnd_intro .item .nae {line-height: 1.6;}
.rnd_bg {text-align: center; color: #fff; position: relative;}
.rnd_bg:after {
    display: block; content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background: #000; opacity: .4;
}
.rnd_bg > div {position: relative; z-index: 1;}
.rnd_bg .tit {font-size: 40px; font-weight: 700; line-height: 1.2;}
.rnd_bg .text {font-size: 20px; margin-top: 20px;}
.rnd_cur .tit {font-size: 32px; font-weight: 700; margin-bottom: 20px;}
.rnd_cur .list {display: flex; flex-direction: column; gap: 20px;}
.rnd_cur .item {background: var(--bgColor); padding: 30px; width: 100%;}
.rnd_cur .item .gu {font-size: 24px; color: var(--mainColor1); font-weight: 700;}
.rnd_cur .item .nae {font-size: 18px; margin-top: 10px; line-height: 1.6;}




/* support */
.bd_g_wrap .tableB-list table>tbody>tr>td {display: flex;}
.bd_g_wrap .tableB-list table>tbody>tr>td a {aspect-ratio: 1/1; overflow: hidden;}
.bd_g_wrap .tableB-list table>tbody>tr>td img {width: 100%; height: 100%; object-fit: cover; max-width: unset;}
.bd_g_wrap .tableB-list .gallery_subject {display: block; margin-top: 10px;}



.sup_par .inner {display: flex; flex-direction: column; gap: 50px; max-width: 1200px;}
.sup_par .bnn {background: var(--bgColor); padding:60px 40px;}
.sup_par .bnn .tit {font-size: 32px; margin-bottom: 30px; font-weight: 700; text-align: center;}
.sup_par .bnn .list {display: flex; gap: 20px;}
.sup_par .bnn .item {
    border-radius: 20px; background: var(--mainColor1); width: 100%; padding:30px 20px; text-align: center; color: #fff;
    display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 10px; position: relative; overflow: hidden;
}
.sup_par .bnn .item .bg {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.5;
}
.sup_par .bnn .item .bg img {width: 100%; height: 100%; object-fit: cover;}
.sup_par .bnn .item .gu {font-size: 22px; font-weight: 700; position: relative; z-index: 1;}
.sup_par .bnn .item .nae {font-size: 16px; position: relative; z-index: 1;}
.sup_par .cmnt {font-size: 16px; text-align: center;}



.sup_ct .ct_box {display: flex; gap: 40px; padding-top: 40px;} 
.sup_ct .info {display: flex; flex-direction: column; gap: 40px; width: 30%; flex-shrink: 0;}
.sup_ct .info .gu {padding-left: 40px; position: relative; font-size: 20px; font-weight: 700;}
.sup_ct .info .gu .icon {width: 30px; position: absolute; left: 0;}
.sup_ct .info .nae {margin-top: 10px; padding-left: 40px;}
.sup_ct .form {flex: 1 0 0;}
.sup_ct .form textarea { min-height: unset; height: 150px !important;}
.sup_ct .form .button {background: var(--mainColor1);}



/* way */
.main-map-info li {display: flex; align-items: center;}
.main-map-info li span {flex-shrink: 0;}



.login_wrap .form-style:not([type="image"]) {background-color: #fff !important; padding: 10px !important;}





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



    /* about */
    .about_ser .info_box {flex-direction: column; gap: 40px;}



    /* service */
    .ser_sec .info_box {flex-direction: column;  gap: 40px;}



    .ser_m_1 .cont_box .list {gap: 20px;}
    .ser_m_1 .cont_box .item {width: calc(50% - 10px);}
    .ser_m_1 .cont_box .item .number {font-size: 18px; height: 35px; width: 35px; line-height: 35px;}
    .ser_m_1 .cont_box .item .tit {font-size: 20px;}
    .ser_m_1 .cont_box .item .text {font-size: 16px;}



    /* support */
    .sup_par .bnn .list {flex-wrap: wrap;}
    .sup_par .bnn .item {width: calc(50% - 10px);}
    .sup_ct .ct_box {flex-direction: column;}
    .sup_ct .info {flex-direction: row; width: 100%;}
    .sup_ct .info .item {width: 100%;}



}





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



    /* sub */
    .bd_tit .big {font-size: 28px;}




    /* support */
    .bd_g_wrap .table-cols-4>tbody>tr {width: 50% !important;}




    /* about */
    .about_cert .cert_list {gap:40px 20px;}
    .about_cert .cert_list li {width: calc(33.333% - 13.333px);}



    .about_int .intro .tit .big {font-size: 30px}
    .about_int .intro .tit .small {font-size: 18px;}
    .about_int .intro .text {font-size: 16px; margin-top: 40px;}
    .about_int .intro .sign {margin-top: 40px;}
    .about_int .intro .sign span {font-size: 16px;}
    .about_int .info {margin-top: 60px;}
    .about_int .info > div {font-size: 15px;}
    .about_int .info .gu {width: 75px;}
    
    .about_ser .info_box {gap: 25px;}
    .about_ser .tit_box .cate {font-size: 16px;}
    .about_ser .tit_box .tit {font-size: 28px;}
    .about_ser .text_box {font-size: 14px;}
    




    /* service */
    .ser_sec .info_box {gap: 25px;}
    .ser_sec .tit_box .text {font-size: 16px;}
    .ser_sec .tit_box .tit {font-size: 28px;}
    .ser_sec .text_box {font-size: 14px;}
    .ser_sec .cont_box {margin-top: 60px; padding-top: 60px; }
    .ser_sec .table th,
    .ser_sec .table td {font-size: 14px; padding: 15px;}
    .ser_sec .table .list p {padding-left: 10px;}
    .ser_e_1 .table .note {padding-left: 35px;}




    .ser_m_1 .cont_box .item {width: 100%; padding: 30px 20px;}    
    .ser_m_2 .cont_box .list {gap: 20px;}
    .ser_m_2 .cont_box .list .top {display: none;}
    .ser_m_2 .cont_box .list > div {flex-direction: column; gap: 20px;}
    .ser_m_2 .cont_box .item {padding: 20px; border: 1px solid var(--border)}
    .ser_m_2 .cont_box .item .box {padding: 0; border: 0}
    .ser_m_2 .cont_box .item .box .titn {display: block}
    .ser_m_3 .cont_box .cont {margin-top: 60px;}
    .ser_m_3 .cont_box .cont .tit {font-size: 24px;}
    .ser_m_3 .cont_box .cont .list {flex-direction: column; gap: 20px;}
    .ser_m_3 .cont_box .cont .item .big {font-size: 20px;}



    /* rnd */
    .rnd_intro .tit {font-size: 28px;}
    .rnd_bg .tit {font-size: 28px;}
    .rnd_bg .text {font-size: 16px;}
    .rnd_cur .tit {font-size: 20px;}
    .rnd_cur .item {padding: 20px;}
    .rnd_cur .item .gu {font-size: 18px;}
    .rnd_cur .item .nae {font-size: 14px; margin-top: 5px;}




    /* support */
    .sup_par .bnn {padding: 40px 20px;}
    .sup_par .bnn .tit {font-size: 24px;}
    .sup_par .bnn .item {padding: 20px 10px;}
    .sup_par .bnn .item .gu {font-size: 18px;}
    .sup_par .bnn .item .nae {font-size: 14px;}
    .sup_ct .info {flex-wrap: wrap; border-top: 1px solid var(--border); padding-top: 40px;}



    /* way */
    .main-map-info li {flex-direction: column; align-items: flex-start;}
    .main-map-info li span br {display: none;}



}






@media screen and (max-width:599px) {
    
    /* sub */
    .bg_fixed {min-height: 200px;}
    .style-rounded .sul_menu.cate_menu a {font-size: 14px; line-height: 20px;}



    /* support */
    .bd_g_wrap .table-cols-4>tbody>tr {width: 100% !important;}



    /* about */
    .about_ci .img_box {padding:60px 40px;}
    .about_ci .text_box {font-size: 16px;}
    .about_cert .cert_list {gap: 30px 10px;}
    .about_cert .cert_list li {width: calc(50% - 5px);}
    .about_cert .cert_list .text {font-size: 14px; margin-top: 10px;}




    /* support */
    .sup_par .bnn .item {width: 100%;}
    .sup_par .cmnt {font-size: 14px;}



    
}