.itopplus-background {

}
.navbar-default {
    background: linear-gradient(to bottom, #fdb813 0%,#fba818 20%,#f8981d 50%,#fba818 80%,#fba818 80%,#fdb813 100%); 
}
.navbar-default .navbar-nav>li>a {
    font-size: 18px;
}
.navbar-default .navbar-nav .open>.dropdown-menu {
    font-size: 14px;
}

.custom_canonical_content,
.bItpCanonical {
  display:block!important;
}
                                
/*เมนูกึ่งกลาง*/
/* Medium Devices, Desktops */
@media only screen and (min-width : 1024px) {
h1,.h1 { font-size: 2.250em;}
h2,.h2 { font-size: 1.875em;}
h3,.h3 { font-size: 1.500em;}
h4,.h4 { font-size: 1.125em;}
h5,.h5 { font-size: 0.875em;}
h6,.h6 { font-size: 0.750em;}
p { margin: 0 0 10px;}
.navbar .nav,
.navbar .nav > li {
    float:none;
    display:inline-block;
    *display:inline; /* ie7 fix */
    *zoom:1; /* hasLayout ie7 trigger */
    vertical-align: top;
}
#main-navbar-collapse{
  text-align:center ;
}
.nav>li>a {
    padding: 10px 36px;
}
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1366px) {
h1,.h1 { font-size: 2.250em;}
h2,.h2 { font-size: 1.875em;}
h3,.h3 { font-size: 1.500em;}
h4,.h4 { font-size: 1.125em;}
h5,.h5 { font-size: 0.875em;}
h6,.h6 { font-size: 0.750em;}
p { margin: 0 0 10px;}
.navbar .nav,
.navbar .nav > li {
    float:none;	
    display:inline-block;
    *display:inline; /* ie7 fix */
    *zoom:1; /* hasLayout ie7 trigger */
    vertical-align: top;
}
#main-navbar-collapse{
  text-align:center ;
}
.nav>li>a {
    padding: 16px 36px;
}
}


/*เมนูกึ่งกลาง*/
/* Medium Devices, Desktops */
@media only screen and (min-width : 1024px) {
h1,.h1 { font-size: 2.250em;}
h2,.h2 { font-size: 1.875em;}
h3,.h3 { font-size: 1.500em;}
h4,.h4 { font-size: 1.125em;}
h5,.h5 { font-size: 0.875em;}
h6,.h6 { font-size: 0.750em;}
p { margin: 0 0 10px;}
.navbar .nav,
.navbar .nav > li {
    float:none;
    display:inline-block;
    *display:inline; /* ie7 fix */
    *zoom:1; /* hasLayout ie7 trigger */
    vertical-align: top;
}
#main-navbar-collapse{
  text-align:center ;
}
.nav>li>a {
    padding: 16px 36px;
}
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1366px) {
h1,.h1 { font-size: 2.250em;}
h2,.h2 { font-size: 1.875em;}
h3,.h3 { font-size: 1.500em;}
h4,.h4 { font-size: 1.125em;}
h5,.h5 { font-size: 0.875em;}
h6,.h6 { font-size: 0.750em;}
p { margin: 0 0 10px;}
.navbar .nav,
.navbar .nav > li {
    float:none;	
    display:inline-block;
    *display:inline; /* ie7 fix */
    *zoom:1; /* hasLayout ie7 trigger */
    vertical-align: top;
}
#main-navbar-collapse{
  text-align:center ;
}
.nav>li>a {
    padding: 16px 36px;
}
}


.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover {
    background-color: #e68c1e!important;
    background-image: none;
    color: #fff!important;
}
figure.effect-steve h2, figure.effect-steve p {
    display: none;
}
.fancybox-skin {
    background: #fdb6148f;
}
.thumbnail:hover {
    box-shadow: 3px 3px 2px #0000004a;
}
.form-horizontal .control-label {
    padding-top: 2px!important;
    font-size: 18px!important;
    font-weight: normal!important;
}
figure.effect-steve {
    background: #0000;
}

#pd-bot{
	padding-bottom:3%;
}


@media (max-width:768px) {
/*Hide Menu Phone*/
          .navbar-default .navbar-toggle {
              border-color: #f68e1f00;
          }
          .navbar-inline .text-bar {
              display: none;
          }
          .navbar-inline {
              margin-top: 9px;
              margin-right: 2px;
              margin-left: -2px;
              margin-bottom: 9px;
          }
           .glyphicon-phone-alt:before {
                content: "\e182";
          }
          p.search_urlSearch {
               word-wrap: break-word;
          }
          .text-justify {
              text-align: inherit;
          }
          .col-sm-12, .col-md-12, .col-lg-12 {
                  padding-right: 5px;
              padding-left: 5px;
          }
/*Hide Menu Phone*/
  #pd-bot{
	padding-bottom:6%;
}
}
label.col-xs-12.col-sm-3.col-md-3.control-label {
   width: 35%;
}



/* ==========================================================================
   1. ตั้งค่าพื้นฐาน (ใช้งานร่วมกันทั้ง .main-style-rp และ .post-style-rp)
   ========================================================================== */
.main-style-rp h1, .post-style-rp h1 {
  font-size: clamp(28px, 5vw, 42px);
  line-height: 1.2;
  font-weight: 700;
  margin: 0 0 24px 0;
}

.main-style-rp h2, .post-style-rp h2 {
  font-size: clamp(22px, 4vw, 28px); 
  line-height: 1.3;
  font-weight: 600; 
  margin: 32px 0 16px 0; 
}

.main-style-rp h3, .post-style-rp h3 {
  font-size: clamp(20px, 3vw, 26px);
  line-height: 1.4;
  font-weight: 600;
  margin: 24px 0 12px 0;
}

.main-style-rp h4, .post-style-rp h4 {
  font-size: clamp(18px, 2.5vw, 22px);
  line-height: 1.5;
  font-weight: 600;
  margin: 24px 0 12px 0;
}

.main-style-rp p, .post-style-rp p,
.main-style-rp ul, .post-style-rp ul,
.main-style-rp ol, .post-style-rp ol,
.main-style-rp li, .post-style-rp li {
  font-size: clamp(16px, 2vw, 18px);
  line-height: 1.6;
  font-weight: 400;
  color: #4a4a4a; 
  margin-top: 0;
  margin-bottom: 16px;
}

.main-style-rp ul, .post-style-rp ul,
.main-style-rp ol, .post-style-rp ol {
  padding-left: 24px;
}

.main-style-rp li, .post-style-rp li {
  margin-bottom: 8px; 
}

.main-style-rp b, .post-style-rp b,
.main-style-rp strong, .post-style-rp strong {
  font-weight: 600; 
  color: #1a1a1a; 
}

/* 🌟 แก้ไข: การตั้งค่าลิงก์ (a) ให้ขีดเส้นใต้เสมอและดึงค่าตามเนื้อหา */
.main-style-rp a, .post-style-rp a {
  color: inherit; /* ดึงสีตามเนื้อหา (p) หรือหัวข้อ (h) ที่ครอบมันอยู่ */
  font-weight: inherit; /* ดึงความหนาตามเนื้อหา เช่น ถ้าอยู่ใน <b> หรือ h1 ก็จะหนาตาม */
  text-decoration: underline !important; /* บังคับขีดเส้นใต้เสมอ (ใส่ !important ทับระบบเว็บเดิม) */
  text-underline-offset: 4px; 
  transition: opacity 0.2s ease;
}

.main-style-rp a:hover, .post-style-rp a:hover {
  opacity: 0.7; 
}


/* ==========================================================================
   2. ตั้งค่าสีเฉพาะของ .main-style-rp
   ========================================================================== */
.main-style-rp h1, .main-style-rp h1 a {
  color: #f8951e;
}

.main-style-rp h2, .main-style-rp h2 a,
.main-style-rp h3, .main-style-rp h3 a,
.main-style-rp h4, .main-style-rp h4 a {
  color: #000;
}


/* ==========================================================================
   3. ตั้งค่าสีเฉพาะของ .post-style-rp
   ========================================================================== */
.post-style-rp h2, .post-style-rp h2 a {
  color: #f8951e;
}

.post-style-rp h1, .post-style-rp h1 a,
.post-style-rp h3, .post-style-rp h3 a,
.post-style-rp h4, .post-style-rp h4 a {
  color: #000;
}


/* ==========================================================================
   4. สไตล์สำหรับ H1 หน้าหลัก (2 บรรทัด 2 สี แบบพิเศษ)
   ========================================================================== */
.main-style-h1-rp {
  text-align: center;
  margin: 0 0 24px 0;
}

.main-style-h1-rp .line-1 {
  font-size: clamp(32px, 7vw, 48px);
  color: #f8951e;
  line-height: 1.2;
  font-weight: 700;
  display: block;
}

.main-style-h1-rp .line-2 {
  font-size: clamp(22px, 4.5vw, 32px);
  color: #000;
  line-height: 1.4;
  font-weight: 700;
  display: block;
  margin-top: 10px;
}


/* ==========================================================================
   5. สไตล์สำหรับเส้นคั่นสีส้ม (ปรับความยาวได้อิสระ)
   ========================================================================== */
.divider-orange-rp {
  border-bottom: 2px solid #f8951e;
  width: var(--line-width, clamp(60px, 15vw, 100px)); 
  margin: 0 auto 32px auto; 
}


/* ==========================================================================
   6. การจัดการรูปภาพ (ให้รูปภาพยืดหยุ่น ไม่ล้นจอ)
   ========================================================================== */
.main-style-rp img, .post-style-rp img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  margin-bottom: 24px;
}


/* ==========================================================================
   7. สไตล์สำหรับหัวข้อบอกตำแหน่งหน้า (Page Title / Breadcrumb ด้านบนสุด)
   ========================================================================== */
.header-style-rp {
  font-size: clamp(20px, 3vw, 26px); 
  color: #333333; 
  font-weight: 600; 
  text-align: left; 
  margin: 24px 0 24px 0; 
  padding-bottom: 12px; 
  border-bottom: 1px solid #eaeaea; 
  line-height: 1.4;
}