.elementor-254 .elementor-element.elementor-element-7cdc13b{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--overlay-opacity:0.5;--padding-top:200px;--padding-bottom:250px;--padding-left:100px;--padding-right:100px;}.elementor-254 .elementor-element.elementor-element-7cdc13b:not(.elementor-motion-effects-element-type-background), .elementor-254 .elementor-element.elementor-element-7cdc13b > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://ufa18k.fun/wp-content/uploads/2025/06/ufa18k-bg1.jpg");background-size:cover;}.elementor-254 .elementor-element.elementor-element-7cdc13b::before, .elementor-254 .elementor-element.elementor-element-7cdc13b > .elementor-background-video-container::before, .elementor-254 .elementor-element.elementor-element-7cdc13b > .e-con-inner > .elementor-background-video-container::before, .elementor-254 .elementor-element.elementor-element-7cdc13b > .elementor-background-slideshow::before, .elementor-254 .elementor-element.elementor-element-7cdc13b > .e-con-inner > .elementor-background-slideshow::before, .elementor-254 .elementor-element.elementor-element-7cdc13b > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#000000;--background-overlay:'';}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-254 .elementor-element.elementor-element-08bdafc{text-align:center;}.elementor-254 .elementor-element.elementor-element-08bdafc .elementor-heading-title{font-family:"Kanit", Sans-serif;font-weight:400;color:#FFFFFF;}.elementor-254 .elementor-element.elementor-element-208526a{text-align:center;}.elementor-254 .elementor-element.elementor-element-208526a .elementor-heading-title{font-family:"Kanit", Sans-serif;font-size:25px;font-weight:300;line-height:53px;color:#FFFFFF;}.elementor-254 .elementor-element.elementor-element-df631cb{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;border-style:solid;--border-style:solid;border-color:#FFA300;--border-color:#FFA300;--border-radius:2px 2px 2px 2px;}.elementor-254 .elementor-element.elementor-element-df631cb:not(.elementor-motion-effects-element-type-background), .elementor-254 .elementor-element.elementor-element-df631cb > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#000000;background-image:url("https://ufa18k.fun/wp-content/uploads/2025/06/ufa18k-bg6.jpg");}.elementor-254 .elementor-element.elementor-element-a0ab11b .elementor-image-carousel-wrapper .elementor-image-carousel .swiper-slide-image{border-style:solid;border-width:5px 5px 5px 5px;border-color:#00000000;}.elementor-254 .elementor-element.elementor-element-17dccfe{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--overlay-opacity:0.5;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:100px;--padding-bottom:100px;--padding-left:100px;--padding-right:100px;}.elementor-254 .elementor-element.elementor-element-17dccfe:not(.elementor-motion-effects-element-type-background), .elementor-254 .elementor-element.elementor-element-17dccfe > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#000000;background-image:url("https://ufa18k.fun/wp-content/uploads/2025/06/ufa18k-6.png");}.elementor-254 .elementor-element.elementor-element-17dccfe::before, .elementor-254 .elementor-element.elementor-element-17dccfe > .elementor-background-video-container::before, .elementor-254 .elementor-element.elementor-element-17dccfe > .e-con-inner > .elementor-background-video-container::before, .elementor-254 .elementor-element.elementor-element-17dccfe > .elementor-background-slideshow::before, .elementor-254 .elementor-element.elementor-element-17dccfe > .e-con-inner > .elementor-background-slideshow::before, .elementor-254 .elementor-element.elementor-element-17dccfe > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:#000000;--background-overlay:'';}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-254 .elementor-element.elementor-element-b370028{font-family:"Roboto", Sans-serif;font-weight:400;line-height:11px;color:#FFFFFF;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-254 .elementor-element.elementor-element-cebf43c{font-family:"Roboto", Sans-serif;font-weight:400;line-height:6px;color:#FFFFFF;}@media(max-width:1024px){.elementor-254 .elementor-element.elementor-element-7cdc13b{--padding-top:50px;--padding-bottom:50px;--padding-left:50px;--padding-right:50px;}.elementor-254 .elementor-element.elementor-element-17dccfe{--padding-top:50px;--padding-bottom:50px;--padding-left:50px;--padding-right:50px;}.elementor-254 .elementor-element.elementor-element-b370028{line-height:1.9em;}.elementor-254 .elementor-element.elementor-element-b370028 p{margin-bottom:5px;}}@media(max-width:767px){.elementor-254 .elementor-element.elementor-element-7cdc13b{--padding-top:30px;--padding-bottom:30px;--padding-left:15px;--padding-right:15px;}.elementor-254 .elementor-element.elementor-element-208526a .elementor-heading-title{font-size:20px;line-height:2em;}.elementor-254 .elementor-element.elementor-element-17dccfe{--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-254 .elementor-element.elementor-element-cebf43c{line-height:2.1em;}.elementor-254 .elementor-element.elementor-element-cebf43c p{margin-bottom:0px;}}/* Start custom CSS for text-editor, class: .elementor-element-cebf43c */.animated-blue-border {
  /* 1. ทำให้ตัวหลักมีตำแหน่ง relative (เพื่อให้ ::before ใช้งานได้) */
  position: relative;
  background-color: #ffffff; /* พื้นขาว */
  z-index: 1; /* ให้เนื้อหาด้านในอยู่เหนือ pseudo-element */
}

/*——————— สร้าง pseudo-element (::before) เพื่อทำเป็นกรอบหมุนรอบๆ ———————*/
.animated-blue-border::before {
  content: "";
  position: absolute;
  /* ขยายออกมาจากกล่องหลัก 2px (เท่าความหนาของ border) */
  top: -2px;
  left: -2px;
  right: -2px;
  bottom: -2px;

  /* กำหนด border ให้โปร่งใสไว้ก่อน (#FFFFFF00 = white transparent) */
  border: 2px solid transparent;

  /* ใช้ border-image เป็น conic-gradient ที่มีสีน้ำเงินเล็กน้อย (0–10%) 
     ส่วนที่เหลือเป็นโปร่งใส (10%–100%) */
  border-image: 
    conic-gradient(
      from 0deg,
      #007bff 0%   /* เริ่มที่สีน้ำเงิน */
      10%,         /* ลากสีน้ำเงินไปจนครบ 10% ของเส้นขอบทั้งหมด */
      transparent 10%  /* หลังจากนั้นโปร่งใสไปจนสุด */
      100%
    )
    1; /* border-image-slice = 1 (ยืดเต็มขอบ) */

  /* ตั้งค่า slice ให้เต็ม border */
  border-image-slice: 1;

  /* หมุน pseudo-element แบบวนลูป 0→360° ทุก ๆ 2 วินาที */
  animation: rotate-border 2s linear infinite;

  /* ให้ pseudo-element อยู่ด้านหลังเนื้อหา (แต่ยังอยู่เหนือ background จริง) */
  z-index: -1;

  /* ถ้าหากกล่องหลักมี border-radius ก็สืบทอดโค้งมาด้วย */
  border-radius: inherit;
}

/*——————— กำหนด keyframes ให้หมุนแบบเรียบ (0° → 360°) ———————*/
@keyframes rotate-border {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}/* End custom CSS */