@media screen and (min-width: 360px) and (max-width: 374px) { /* -ขนาดหน้าจอโทรศัพท์บางขนาด */
    .text-jukkul { /*ชิ่อ class ของ text_1 */
        padding-left: auto;
        padding-right: auto;
    }
    .right-side h5 { /*h5 ของ ฟอร์มป้อนข้อมูล ของ text_1 */
        font-size: 1.125rem;
    }
    p { 
        word-wrap: break-word;
        word-break: break-word;
    }
    .left-side { /*ฟอร์มข้อมูลของ Contact */
        padding-left: 1rem;
        padding-right: 1rem;
        transform: scale(0.7);
        font-size: 1.125rem;
    }
    .contact-div { /*ชื่อ class ของคำว่า ContactUS */
        text-align: center;
    }
    .right-side { /* ฟอร์มกรอกข้อมอูลอีเมล */
        margin-top: -4rem;
        width: 100%;
    }
    .slides { /* รูปภาพแบนเนอร์ */
        text-align: center;
        width:100%; /* จัดภาพตรงกลางในแนวนอน */
    }
    .text-jukkul h1 { /* ขนาด font text_1 */
        font-size: 1.125rem;
    }
    .maill-text {
        font-size: 1.125rem;
    }
    #contactForm input, #message { /* ไอดีของฟอร์ม right-side */
        width: 100% !important;
        display: flex;
        flex-direction: column;
    }
    .head1 { /* คำว่า Our Location */
        text-align: center;
        margin-bottom: 30px;
    }
    .maill-text { /* คำว่า text_2 */
        padding-top: 2rem;
        padding-left: 2rem;
        padding-right: 2rem;
    }
    .mail-form { /* ฟอร์มทั้ง left-side และ right-side */
        width: 100%;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        background-attachment: fixed;
        background-position: center;
        position: relative;
        background-size: auto 100% ;
    }
    #name { /* ไอดีของฟอร์มที่ป้อนข้อมูล */
        display: flex;
        flex-direction: column;
        width:  100%;
    }
    #send-mail-btn { /* ปุ่ม button ส่งข้อมูล */
        width: 100%
    }
    .left-group { /* ฟอร์ม firstname */
        width: 100% !important;
    }
    .right-group { /* ฟอร์ม lastname */
        width: 100% !important;
    }
    .map-embed iframe { /* แผนที่ */
        aspect-ratio: 4/3 !important; /* ปรับ aspect-ratio ตามที่ต้องการ */
    }
}
@media screen and (min-width: 375px) and (max-width: 390px) { /*iphone SE และ  iphone 12 pro */
    .text-jukkul { /*ชิ่อ class ของ text_1 */
        padding-left: auto;
        padding-right: auto;
    }
    .normal-logo {
        width: 2.5rem !important;
        height: 2.5rem !important;
    }
    .right-side h5 { /*h5 ของ ฟอร์มป้อนข้อมูล ของ text_1 */
        font-size: 1.125rem;
    }
    p { 
        word-wrap: break-word;
        word-break: break-word;
    }
    .left-side { /*ฟอร์มข้อมูลของ Contact */
        padding-left: 1.4rem;
        padding-right: 1.4rem;
        transform: scale(0.75);
        font-size: 1.125rem;
    }
    .contact-div { /*ชื่อ class ของคำว่า ContactUS */
        text-align: center;
    }
    .right-side { /* ฟอร์มกรอกข้อมอูลอีเมล */
        margin-top: -4rem;
        width: 100%;
    }
    .slides { /* รูปภาพแบนเนอร์ */
        text-align: center;
        width:100%; /* จัดภาพตรงกลางในแนวนอน */
    }
    .text-jukkul h1 { /* ขนาด font text_1 */
        font-size: 1.125rem;
    }
    #contactForm input, #message { /* ไอดีของฟอร์ม right-side */
        width: 100% !important;
        display: flex;
        flex-direction: column;
    }
    .head1 { /* คำว่า Our Location */
        text-align: center;
        margin-bottom: 30px;
    }
    .maill-text { /* คำว่า text_2 */
        font-size: 1.125rem;
        padding-top: 2rem;
        padding-left: 2rem;
        padding-right: 2rem;
    }
    .mail-form { /* ฟอร์มทั้ง left-side และ right-side */
        width: 100%;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        background-attachment: fixed;
        background-position: center;
        position: relative;
        background-size: auto 100% ;
    }
    #name { /* ไอดีของฟอร์มที่ป้อนข้อมูล */
        display: flex;
        flex-direction: column;
        width:  100%;
    }
    #send-mail-btn { /* ปุ่ม button ส่งข้อมูล */
        width: 100%
    }
    .left-group { /* ฟอร์ม firstname */
        width: 100% !important;
    }
    .right-group { /* ฟอร์ม lastname */
        width: 100% !important;
    }
    .map-embed iframe { /* แผนที่ */
        aspect-ratio: 4/3 !important; /* ปรับ aspect-ratio ตามที่ต้องการ */
    }
    .text-jukkul h1 { /* ขนาด font text_1 */
        font-size: 1.125rem;
    }
}
@media screen and (min-width: 391px) and (max-width: 413px) {  /* ขนาดหน้าจอมือถือรองรองรับ android บางขนาด */
    .text-jukkul { /*ชิ่อ class ของ text_1 */
        padding-left: auto;
        padding-right: auto;
    }
    .text-jukkul h1 { /* ขนาด font text_1 */
        font-size: 1.125rem;
    }
    .right-side h5 { /*h5 ของ ฟอร์มป้อนข้อมูล ของ text_1 */
        font-size: 1.125rem;
    }
    p { 
        word-wrap: break-word;
        word-break: break-word;
    }
    .left-side { /*ฟอร์มข้อมูลของ Contact */
        padding-left: 1rem;
        padding-right: 1rem;
        transform: scale(0.75);
        font-size: 1.125rem;
    }
    .contact-div { /*ชื่อ class ของคำว่า ContactUS */
        text-align: center;
        padding-left: 5rem;
    }
    .right-side { /* ฟอร์มกรอกข้อมอูลอีเมล */
        margin-top: -4rem;
        width: 100%;
    }
    .slides { /* รูปภาพแบนเนอร์ */
        text-align: center;
        width:100%; /* จัดภาพตรงกลางในแนวนอน */
    }
    #contactForm input, #message { /* ไอดีของฟอร์ม right-side */
        width: 100% !important;
        display: flex;
        flex-direction: column;
    }
    .head1 { /* คำว่า Our Location */
        text-align: center;
        margin-bottom: 30px;
    }
    .maill-text { /* คำว่า text_2 */
        font-size: 1.125rem;
        padding-top: 2rem;
        padding-left: 2rem;
        padding-right: 2rem;
    }
    .mail-form { /* ฟอร์มทั้ง left-side และ right-side */
        width: 100%;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        background-attachment: fixed;
        background-position: center;
        position: relative;
        background-size: auto 100% ;
    }
    #name { /* ไอดีของฟอร์มที่ป้อนข้อมูล */
        display: flex;
        flex-direction: column;
        width:  100%;
    }
    #send-mail-btn { /* ปุ่ม button ส่งข้อมูล */
        width: 100%
    }
    .left-group { /* ฟอร์ม firstname */
        width: 100% !important;
    }
    .right-group { /* ฟอร์ม lastname */
        width: 100% !important;
    }
    .mail { /* class ใหญ่ของ h2 และ text_2 */
        padding-left: 2rem;
        padding-right: 2rem;
    }
    .map-embed iframe { /* แผนที่ */
        aspect-ratio: 4/3 !important; /* ปรับ aspect-ratio ตามที่ต้องการ */
    }
}
@media screen and (min-width: 414px) and (max-width: 430px) { /*iphone XR และ  iphone 14 pro */
    .text-jukkul { /*ชิ่อ class ของ text_1 */
        padding-left: auto;
        padding-right: auto;
    }
    .text-jukkul h1 {
        font-size: 1.125rem;
    }
    .right-side h5 { /*h5 ของ ฟอร์มป้อนข้อมูล ของ text_1 */
        font-size: 1.125rem;
    }
    p { 
        word-wrap: break-word;
        word-break: break-word;
    }
    .left-side { /*ฟอร์มข้อมูลของ Contact */
        padding-left: 1rem;
        padding-right: 1rem;
        transform: scale(0.8);
        font-size: 1.125rem;
        margin-left: 0;
    }
    .contact-div { /*ชื่อ class ของคำว่า ContactUS */
        text-align: center;
    }
    .right-side { /* ฟอร์มกรอกข้อมอูลอีเมล */
        width: 100%;
        margin-top: -3rem;
    }
    .slides { /* รูปภาพแบนเนอร์ */
        text-align: center;
        width:100%; /* จัดภาพตรงกลางในแนวนอน */
    }
    #contactForm input, #message { /* ไอดีของฟอร์ม right-side */
        width: 100% !important;
        display: flex;
        flex-direction: column;
        width:  100%;
    }
    .head1 { /* คำว่า Our Location */
        text-align: center;
        margin-bottom: 30px;
    }
    .maill-text { /* คำว่า text_2 */
        font-size: 1.125rem;
        padding-top: 2rem;
        padding-left: 2rem;
        padding-right: 2rem;
    }
    .mail-form { /* ฟอร์มทั้ง left-side และ right-side */
        width: 100%;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        background-attachment: fixed;
        background-position: center;
        position: relative;
        background-size: auto 100% ;
    }
    #name { /* ไอดีของฟอร์มที่ป้อนข้อมูล */
        display: flex;
        flex-direction: column;
        width:  100%;
    }
    #send-mail-btn { /* ปุ่ม button ส่งข้อมูล email */
        width: 100%
    }
    .left-group { /* ช่อง firstname*/
        width: 100% !important;
    }
    .right-group { /* ช่อง lasttname*/
        width: 100% !important;
    }
    .map-embed iframe { /* แผนที่ */
        aspect-ratio: 4/3 !important; /* ปรับ aspect-ratio ตามที่ต้องการ */
    }
}
@media screen and (min-width: 431px) and (max-width: 470px) { 
    .text-jukkul { /*ชิ่อ class ของ text_1 */
        padding-left: auto;
        padding-right: auto;
    }
    .text-jukkul h1 {
        font-size: 1.125rem;
    }
    .right-side h5 { /*h5 ของ ฟอร์มป้อนข้อมูล ของ text_1 */
        font-size: 1.125rem;
    }
    p { 
        word-wrap: break-word;
        word-break: break-word;
    }
    .left-side { /*ฟอร์มข้อมูลของ Contact */
        padding-left: 1rem;
        padding-right: 1rem;
        transform: scale(0.8);
    }
    .contact-div { /*ชื่อ class ของคำว่า ContactUS */
        text-align: center;
        padding-left: 5rem;
    }
    .right-side { /* ฟอร์มกรอกข้อมอูลอีเมล */
        width: 100%;
        margin-top: -3rem;
    }
    .slides { /* รูปภาพแบนเนอร์ */
        text-align: center;
        width:100%; /* จัดภาพตรงกลางในแนวนอน */
    }
    #contactForm input, #message { /* ไอดีของฟอร์ม right-side */
        width: 100% !important;
        display: flex;
        flex-direction: column;
    }
    .head1 { /* คำว่า Our Location */
        text-align: center;
        margin-bottom: 30px;
    }
    .maill-text { /* คำว่า text_2 */
        font-size: 1.125rem;
        padding-top: 2rem;
        padding-left: 2rem;
        padding-right: 2rem;
    }
    .mail-form { /* ฟอร์มทั้ง left-side และ right-side */
        width: 100%;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        background-attachment: fixed;
        background-position: center;
        position: relative;
        background-size: auto 100% ;
    }
    #name { /* ไอดีของฟอร์มที่ป้อนข้อมูล */
        display: flex;
        flex-direction: column;
        width:  100%;
    }
    #send-mail-btn { /* ปุ่ม button ส่งข้อมูล email */
        width: 100%
    }
    .left-group { /* ช่อง firstname*/
        width: 100% !important;
    }
    .right-group { /* ช่อง lasttname*/
        width: 100% !important;
    }
    .map-embed iframe { /* แผนที่ */
        aspect-ratio: 16/9 !important; /* ปรับ aspect-ratio ตามที่ต้องการ */
    }
}

@media screen and (max-width: 520px) { 
    .mail-form { 
        padding: 0 !important;
    }
    .contact-div h1 {
        font-size: 48px !important;
    }
}

@media screen and (min-width: 471px) and (max-width: 576px) { 
    .text-jukkul { /*ชิ่อ class ของ text_1 */
        padding-left: auto;
        padding-right: auto;
    }
    .text-jukkul h1 {
        font-size: 1.125rem;
    }
    .right-side h5 { /*h5 ของ ฟอร์มป้อนข้อมูล ของ text_1 */
        font-size: 1.125rem;
    }
    p { 
        word-wrap: break-word;
        word-break: break-word;
    }
    .left-side { /*ฟอร์มข้อมูลของ Contact */
        padding-left: 1rem;
        padding-right: 1rem;
        transform: scale(0.9);
    }
    .contact-div { /*ชื่อ class ของคำว่า ContactUS */
        text-align: center;
        padding-left: 5rem;
    }
    .right-side { /* ฟอร์มกรอกข้อมอูลอีเมล */
        width: 100%;
        margin-top: -3rem;
    }
    .slides { /* รูปภาพแบนเนอร์ */
        text-align: center;
        width:100%; /* จัดภาพตรงกลางในแนวนอน */
    }
    #contactForm input, #message { /* ไอดีของฟอร์ม right-side */
        width: 100% !important;
        display: flex;
        flex-direction: column;
    }
    .head1 { /* คำว่า Our Location */
        text-align: center;
        margin-bottom: 30px;
    }
    .maill-text { /* คำว่า text_2 */
        font-size: 1.125rem;
        padding-top: 2rem;
        padding-left: 2rem;
        padding-right: 2rem;
    }
    .mail-form { /* ฟอร์มทั้ง left-side และ right-side */
        width: 100%;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        background-attachment: fixed;
        background-position: center;
        position: relative;
        background-size: auto 100% ;
    }
    #name { /* ไอดีของฟอร์มที่ป้อนข้อมูล */
        display: flex;
        flex-direction: column;
        width:  100%;
    }
    #send-mail-btn { /* ปุ่ม button ส่งข้อมูล email */
        width: 100%
    }
    .left-group { /* ช่อง firstname*/
        width: 100% !important;
    }
    .right-group { /* ช่อง lasttname*/
        width: 100% !important;
    }
    .map-embed iframe { /* แผนที่ */
        aspect-ratio: 16/9 !important; /* ปรับ aspect-ratio ตามที่ต้องการ */
    }
}
@media screen and (min-width: 577px) and (max-width: 767px) { 
    .text-jukkul { /*ชิ่อ class ของ text_1 */
        padding-left: auto;
        padding-right: auto;
    }

    .text-jukkul h1 {
        font-size: 1.25rem;
    }
    .right-side h5 { /*h5 ของ ฟอร์มป้อนข้อมูล ของ text_1 */
        font-size: 1.125rem;
    }
    p { 
        word-wrap: break-word;
        word-break: break-word;
    }
    .left-side { /*ฟอร์มข้อมูลของ Contact */
        padding-left: 1rem;
        padding-right: 1rem;
        transform: scale(0.9);
    }
    .contact-div { /*ชื่อ class ของคำว่า ContactUS */
        text-align: center;
        padding-left: 5rem;
    }
    .right-side { /* ฟอร์มกรอกข้อมอูลอีเมล */
        width: 100%;
        margin-top: -3rem;
    }
    .slides { /* รูปภาพแบนเนอร์ */
        text-align: center;
        width:100%; /* จัดภาพตรงกลางในแนวนอน */
    }
    #contactForm input, #message { /* ไอดีของฟอร์ม right-side */
        width: 100% !important;
        display: flex;
        flex-direction: column;
    }
    .head1 { /* คำว่า Our Location */
        text-align: center;
        margin-bottom: 30px;
    }
    .maill-text { /* คำว่า text_2 */
        font-size: 1.125rem;
        padding-top: 2rem;
        padding-left: 2rem;
        padding-right: 2rem;
    }
    .mail-form { /* ฟอร์มทั้ง left-side และ right-side */
        width: 100%;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        background-attachment: fixed;
        background-position: center;
        position: relative;
        background-size: auto 100% ;
    }
    #name { /* ไอดีของฟอร์มที่ป้อนข้อมูล */
        display: flex;
        flex-direction: column;
        width:  100%;
    }
    #send-mail-btn { /* ปุ่ม button ส่งข้อมูล email */
        width: 100%
    }
    .left-group { /* ช่อง firstname*/
        width: 100% !important;
    }
    .right-group { /* ช่อง lasttname*/
        width: 100% !important;
    }
    .map-embed iframe { /* แผนที่ */
        aspect-ratio: 16/9 !important; /* ปรับ aspect-ratio ตามที่ต้องการ */
    }
}

@media screen  and (min-width: 521px) and (max-width: 1023px) { 
    .mail-form { 
        padding: 0 5%;
    }
    .contact-div h1 {
        font-size: 54px !important;
    }
}

@media screen and (min-width: 768px) and (max-width: 1023px) { 
    .text-jukkul { /*ชิ่อ class ของ text_1 */
        padding-left: auto;
        padding-right: auto;
    }
    .contact-div hr {
        width: 50% !important;
        margin: auto;
    }
    .text-jukkul h1 {
        font-size: 1.25rem;
    }
    .left-side { /*ฟอร์มข้อมูลของ Contact */
        margin-top: 5rem;
        margin-bottom: 1rem;
        transform: scale(1.1);
    }
    .right-side { /* ฟอร์มกรอกข้อมอูลอีเมล */
        width: 100%;
        margin-top: -5rem;
    }
    #contactForm input, #message { /* ไอดีของฟอร์ม right-side */
        width: 100% !important;
        display: flex;
        flex-direction: column;
    }
    .head1 { /* คำว่า Our Location */
        text-align: center;
        margin-bottom: 30px;
    }
    .maill-text { /* คำว่า text_2 */
        font-size: 1.25rem;
        padding-top: 2rem;
        padding-left: 2rem;
        padding-right: 2rem;
    }
    .mail-form { /* ฟอร์มทั้ง left-side และ right-side */
        width: 100%;
        flex-direction: column;
    }
    #name { /* ไอดีของฟอร์มที่ป้อนข้อมูล */
        display: flex;
        flex-direction: column;
        width:  100%;
    }
    #send-mail-btn { /* ปุ่ม button ส่งข้อมูล email */
        width: 100%
    }
    .left-group { /* ช่อง firstname*/
        width: 100% !important;
    }
    .right-group { /* ช่อง lasttname*/
        width: 100% !important;
    }
    .map-embed iframe { /* แผนที่ */
        aspect-ratio: 16/9 !important; /* ปรับ aspect-ratio ตามที่ต้องการ */
    }
}
@media screen and (min-width: 1024px) and (max-width: 1200px) {  /* ipad pro เป็นต้นไป */
    .mail-form { /* ฟอร์มทั้ง left-side และ right-side */
        width: 100%;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        background-attachment: fixed;
        background-position: center;
        position: relative;
        background-size: auto 100% ;
    }
    .right-side { /* ฟอร์มกรอกข้อมอูลอีเมล */
        width: 50%;
    }
    .map-embed iframe { /* แผนที่ */
        aspect-ratio: 16/9 !important; /* ปรับ aspect-ratio ตามที่ต้องการ */
    }
}