/* ------------------------------------------------------------------------------------------------------------
|  Start  | 
------------------------------------------------------------------------------------------------------------ */

@font-face {
    font-family: 'THSarabunNew';
    src: url('../fonts/thsarabunnew/THSarabunNew.eot?#iefix') format('embedded-opentype'), 
    url('../fonts/thsarabunnew/THSarabunNew.woff') format('woff'), 
    url('../fonts/thsarabunnew/THSarabunNew.ttf') format('truetype'),
    url('../fonts/thsarabunnew/THSarabunNew.svg#THSarabunNew') format('svg');
    font-weight: normal;
    font-style: normal;
}



body { font-family:'THSarabunNew', Arial, Helvetica, sans-serif; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; font-weight: normal; font-size: 24px; color: #555; background: #fff; overflow-x: hidden; }
a { display: block; color: #a92928; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
a:hover { color: #a92928; text-decoration: none;  }

h1, h2, h3, h4, h5, h6 { position: relative; margin: inherit; padding: 15px 0 ; font-weight: normal;  }
h1 { font-size: 42px; text-transform: uppercase; font-weight: 900; }
h2 { font-weight: 700;  }

p { margin: 0; padding: 15px 0;  }

figure { position: relative; }

/* ------------------------------------------------------------------------------------------------------------
|  All  |
------------------------------------------------------------------------------------------------------------ */
header {  }
section { float: left; width: 100%; position: relative; }

.warpper { position: relative; margin: 0 auto; width:100%; max-width: 1170px; height: inherit; padding: 0 15px;  }
.content { position: relative; }

/* ------------------------------------------------------------------------------------------------------------
|  Header Bar  |
------------------------------------------------------------------------------------------------------------ */

.header-less header figure { -webkit-transition: all 0.3s ease;  -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }

.header-fixed { position: fixed; display: table; width: 100%; height: 100px; background: #a92928; overflow: inherit;  z-index: 999999; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;  }

.header-fixed header { float: left; display: table; width: 80px; height: 100%; margin-right: 15px; z-index: 9;  }
.header-fixed header a { display: block; position: relative; width: 100%; height: 100%; padding: 10px 0; vertical-align: middle;  }
.header-fixed header figure { position: relative; display: inline-block; width: 100%;  height: 100%; vertical-align: middle; -webkit-transition: all 0.2s ease;  -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; }
.header-fixed header img { position: absolute; width: 100%; left: 0; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; margin-left: auto; -webkit-transition: all 0.2s ease;  -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease;  transition: all 0.2s ease; }
.header-fixed header span { display: inline-block; vertical-align: middle; padding-left: 15px; }

.header-fixed main { position: relative; float: left; width: auto; height: 100%; color: #fff;  }
.header-fixed main h1 { padding-bottom: 0; line-height: 1; }
.header-fixed main p { padding: 0; color: #ffb100; }

.header-fixed aside { position: relative; float: right; width: auto; height: 100%; z-index: 8; }
.header-fixed aside ul { height: 100%; }
.header-fixed aside li { float: left; display: table; position: relative; height: 100%; padding: 15px 0 15px 10px; text-align: center; }
.header-fixed aside li a { position: relative; width: 44px; height: 60px; padding: 5px 5px 0 5px; color: #fff; vertical-align: middle; border: 1px solid #8c1514; background: #dc3230; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; }
.header-fixed aside li a:hover,.header-fixed aside li a.current { background: #a92a28; }
.header-fixed aside li:first-child a  { padding: 5px;  }
.header-fixed aside li span { display: table-cell; position: relative;  width: 100%; vertical-align: middle; z-index: 1; }


/*.header-fixed aside { position: absolute; width: auto; height: 70px; right: 15px; bottom: 0; top: 0; margin-bottom: auto; margin-top: auto; }
.header-fixed aside ul { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;  flex-wrap:wrap;  align-content: flex-start;  }
.header-fixed aside li { display: table; padding-left: 10px; height: 100%; text-align: center; background: #fff; }
/*.header-fixed aside li a { display: table-cell; width: 70px; height: 100%; padding: 5px 5px 0 5px; color: #fff; vertical-align: middle; border: 1px solid #8c1514; background: #dc3230; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; }
.header-fixed aside li span { vertical-align: middle; }
.header-fixed aside li small { display: block; font-size: 18px; }*/

.header-fixed aside i { display: inline-block; width: 30px; height: 30px; vertical-align: middle; border: 1px solid #a21b19; -webkit-border-radius: 90px; -moz-border-radius: 90px; border-radius: 90px; }
.header-fixed aside small { display: inline-table; width: 100%; vertical-align: middle; line-height: .7; font-size: 18px; }
.header-fixed aside .icon-speaker { border: none; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; background: url(../images/icon-speaker.png) no-repeat center top; background-size: 100%; }
.header-fixed aside .no-speaker { background-position: center bottom  }
.header-fixed aside .icon-tha { background: url(../images/flag-tha.png) no-repeat center; background-size: 100%; }
.header-fixed aside .icon-eng { margin-right: 0; background: url(../images/flag-eng.png) no-repeat center; background-size: 100%; }

.header-full { background: rgba(255,255,255,1) !important; }
.header-full nav li a { position: relative; display: table-cell; height: 100%; color: #333 !important; font-size: 18px; text-transform: uppercase; font-weight: 500; vertical-align: middle;  }
.header-full li a:hover { color: #0089eb !important; }
.header-full li a.current { color: #0089eb !important;  }
.header-full nav li a span:before { opacity: 0 !important; content: ''; position: absolute; width: 0; height: 1px; left: 0; right: 0; bottom: -10px; margin-top: auto; margin-left: auto; margin-right: auto; background: #1b1464; -webkit-transition: all 0.3s ease;  -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease;  transition: all 0.3s ease; }


/* ------------------------------------------------------------------------------------------------------------
|  About Full  |
------------------------------------------------------------------------------------------------------------ */
.full-detail { width: 100%; min-height: 100%; min-height: calc(100vh - 54px); padding-top: 100px; background: #f0f0f0; }
.full-detail h3.ti { color: #a92928; font-weight: bold; }
.full-detail h3 { padding-bottom: 5px; }

.full-detail main { margin: 0 auto; width: 100%; max-width: 700px; height: 80%; padding: 60px 0 30px 0; }
.full-detail main ul { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;  flex-wrap:wrap;  align-content: flex-start; justify-content: center;  }
.full-detail main li { -ms-flex: 0 0 30%; flex: 0 0 30%; width: 30%; padding: 10px; text-align: center; }
.full-detail main li:nth-child(2) { -ms-flex: 0 0 40%; flex: 0 0 40%; width: 40%;  }
.full-detail main li img { display: block; width: 100%; }

.full-detail main .number {  padding-top: 30px; }

.full-detail main dl { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;  flex-wrap:wrap;  align-content: flex-start; justify-content: center; margin-left: -10px; margin-right: -10px; }
.full-detail main dt { -ms-flex: 0 0 33.3333%; flex: 0 0 33.3333%; width: 33.3333%; padding: 10px; text-align: center; }
.full-detail main dt a { display: inline-table; width: 100%; height: 100%; padding: 20px; color: #555; font-family: Arial, Helvetica, sans-serif; font-size: 24px; font-weight: bold; background: #fff; border: 1px solid #ddd; border-radius: 6px; }
.full-detail main dt a:hover { color: #a92928; border:1px solid #a92928; }
.full-detail main dt h3 { padding: 0; font-weight: bold; font-size: 22px; }
.full-detail main dt article { position: relative; }
.full-detail main dt figure { text-align: center; }
.full-detail main dt figure img { display: inline-block; width: 100%; position: relative; border-radius: 3px; overflow: hidden; }

.full-detail main aside { padding: 15px 20px; border: 1px solid #ddd; background: #fff; border-radius: 6px; }

.full-detail .title { border-bottom: 1px solid #ddd; }
.full-detail .title span { float: right; color: #a92928 }

.full-detail input { padding: 15px; font-size: 40px; color: #a92928; }
.full-detail .followme { position: relative; }
.full-detail .followme input[type="submit"] { position: absolute; padding-top: 18px; margin-right: 0; height: 54px; right: 12px; top: 12px; width: 60px; max-width: inherit; min-width: inherit; }
.full-detail .followme input[type="button"] { position: absolute; padding-top: 18px; margin-right: 0; height: 54px; right: 12px; top: 12px; width: 60px; max-width: inherit; min-width: inherit; }


.full-detail .list-follow dl { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;  flex-wrap:wrap;  align-content: flex-start; justify-content: center; margin-left: -10px; margin-right: -10px; }
.full-detail .list-follow dt { -ms-flex: 0 0 50%; flex: 0 0 50%; width: 50%; padding: 10px; text-align: center; }
.full-detail .list-follow dt:nth-child(odd) { background: #fff; }

.full-detail .round dl { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;  flex-wrap:wrap;  align-content: flex-start; justify-content: center; margin-left: -10px; margin-right: -10px; }
.full-detail .round dd { -ms-flex: 0 0 50%; flex: 0 0 50%; width: 50%; padding:0 10px; text-align: left; }
.full-detail .round span { position: relative; display: block; width: 100%; min-height: 40px; padding: 10px 10px 8px 10px; text-align: center; border-radius: 6px; border: 1px solid #ddd; background: #fff; }

.full-detail .section-day {  }
.full-detail .section-day dl { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;  flex-wrap:wrap;  align-content: flex-start; justify-content: center; margin-left: -5px; margin-right: -5px; }
.full-detail .section-day dt { -ms-flex: 0 0 33.3333%; flex: 0 0 33.3333%; width: 33.3333%; padding:0 5px; text-align: center; }
.full-detail .section-day span { position: relative; display: block; width: 100%; min-height: 40px; padding: 10px 10px 8px 10px; border-radius: 6px; border: 1px solid #ddd; background: #fff; }


.date-time { position: absolute; width: 260px; height: 36px; padding: 5px 15px; text-align: center; font-family: arial; font-size: 14px; line-height: 26px; font-weight: bold; color: #333; top: 15px; left: 0; right: 0; margin-left: auto; margin-right: auto;  background: #ffb100; border-radius: 4px; }

.full-detail .button-zone { padding: 30px 0; text-align: center; }


.full-detail input[type="submit"] { display: inline-block; margin-right: 10px; font-family:'THSarabunNew', Arial, Helvetica, sans-serif; color: #333; font-weight: bold; font-size: 30px; background: #ffb100; border: none; }
.full-detail input[type="submit"]:hover { background: #a92928; color: #fff; }
.full-detail input[type="button"] { display: inline-block; margin-right: 10px; font-family:'THSarabunNew', Arial, Helvetica, sans-serif; color: #333; font-weight: bold; font-size: 30px; background: #ffb100; border: none; }
.full-detail input[type="button"]:hover { background: #a92928; color: #fff; }

.full-detail input[type="reset"] { display: inline-block; margin-left: 10px; font-family:'THSarabunNew', Arial, Helvetica, sans-serif; color: #333; font-weight: bold; font-size: 30px; background: #ccc; border: none; }
.full-detail input[type="reset"]:hover { background: #a92928; color: #fff; }

option { padding: 0; font-family: Arial; font-size: 14px; }

.full-share { float:left; width:100%; padding:15px 0; text-align:center; }
.facebook-share { display:inline-block; height:32px; padding:5px 10px; background:#3a569a; color:#fff; vertical-align:middle; }
.twitter-share { display:inline-block; height:32px; padding:5px 10px; background:#4b97c5; color:#fff; vertical-align:middle; }
.line-share { display:inline-block; height:28px; padding: 4px 0 0 8px; border-radius: 4px; background:#00b900; color:#fff; vertical-align:middle; }
.google-share { display:inline-block; height:32px; padding:5px 10px; background:#dd5044; color:#fff; vertical-align:middle; }
.pinterest-share { display:inline-block; height:32px; padding:5px 10px; background:#c61f21; color:#fff; vertical-align:middle; }
.email-share { display:inline-block; height:32px; padding:5px 10px; background:#a27329; color:#fff; vertical-align:middle; }


.detail-table { width:100%;  border-left:1px solid #ddd; border-bottom:1px solid #ddd; border-right:1px solid #ddd;
 -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px; overflow:hidden;
}.detail-table table{
    border-collapse: collapse;
    border-spacing: 0;
    width:100%;
    margin:0px;padding:0px;
}.detail-table tr:last-child td:last-child { 
}
.detail-table table tr:first-child td:first-child {
    -webkit-border-top-left-radius: 8px;
-moz-border-radius-topleft: 8px;
border-top-left-radius: 8px; background: #ddd;
}
.detail-table table tr:first-child td:last-child {  -webkit-border-top-right-radius: 8px;
-moz-border-radius-topright: 8px;
border-top-right-radius: 8px; background: #ddd;
}.detail-table tr:last-child td:first-child{ }
.detail-table tr:hover td{
}
.detail-table tr:nth-child(odd){ background-color:#fefefe; }
.detail-table tr:nth-child(even)    { background-color:#f9f9f9; }
.detail-table td {
    vertical-align:middle;
    border:1px solid #ddd;
    border-width:0px 1px 1px 0px;
    text-align:center;
    padding: 10px 10px 8px 10px;
}
.detail-table td:first-child { text-align:left; }
.detail-table tr:last-child td{
    border-width:0px 1px 1px 0px;
}.detail-table tr td:last-child{
    border-width:0px 0px 1px 0px;
}.detail-table tr:last-child td:last-child{
    border-width:0px 0px 1px 0px;
}
.detail-table tr:first-child td{
    background-color:#fff;
    border:1px solid #ddd;
    color: #555;
    text-align:center;
    padding:10px 0;
    border-width:1px 1px 1px 1px; font-weight: bold;
}
.detail-table tr:first-child:hover td{

}
.detail-table tr:first-child td:first-child{
    border-width:1px 0px 1px 0px;
}
.detail-table tr:first-child td:last-child{
    border-width:1px 0px 1px 1px;
}

/* ------------------------------------------------------------------------------------------------------------
|  Title Page  |
------------------------------------------------------------------------------------------------------------ */
.title-page { margin-top: 50px; }
.title-page:before { content: ''; position: absolute; width: 100%; height: 100%; background: rgba(0,0,0,.2); left: 0; top: 0;  }
.title-page main { display: table; width: 100%; height: 360px; padding: 30px 0; color: #fff; }
.title-page header { position: relative; display: table-cell; vertical-align: middle; padding: 70px 0 10px 0;  text-align: center; }
/*.title-page header:after { content: ''; position: absolute; width: 80px; height: 3px; background: #a92928; left: 0; right: 0; bottom: 0; margin-left: auto; margin-right: auto; }*/
.title-page header small { font-size: 14px; font-weight: 700; text-transform: uppercase; text-align: center;  }


/* ------------------------------------------------------------------------------------------------------------
|  Navigation Page  |
------------------------------------------------------------------------------------------------------------ */
.navigation { padding: 15px 0; border-bottom: 1px solid #f2f5fa; }
.navigation main { float: left; padding: 5px 0 8px 0; }
.navigation main li { display: inline-block; vertical-align: middle; }
.navigation main li a {  }
.navigation main li i { display: inline-block; width: 20px; height: 10px; background: url(../images/icon-miniarrow.png) no-repeat center; }
.navigation main li:last-child { min-width: 30px;  max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.navigation aside { float: right; width: 150px; }

/* ------------------------------------------------------------------------------------------------------------
|  Footer  |
------------------------------------------------------------------------------------------------------------ */
footer { float: left; position: relative; width:100%; color: #fff; text-align: center; font-size: 20px; background:#a92928; }

/* ------------------------------------------------------------------------------------------------------------
|  Other Class  |
------------------------------------------------------------------------------------------------------------ */
.fix-gototop { position:fixed; width:30px; height:30px; bottom:0; right:5px; z-index:9; }
.fix-gototop a { display:inline-table; width:100%; height:100%; font-size: 20px; color:#fff !important; text-align:center; text-transform:uppercase; background:#333 url(../images/icon-top.png) no-repeat center center; border-radius: 50%; }
.fix-gototop a:hover { color:#fff; background:#383b3d  url(../images/icon-top.png) no-repeat center center; }
.fix-gototop i { display:table-cell; vertical-align:middle; }


.fancybox-enabled #header-fixed { padding-right:17px; }


.error { color: #ff0000; }

/* ------------------------------------------------------------------------------------------------------------
|  Button Style  |
------------------------------------------------------------------------------------------------------------ */
.btn-s1 a { display: inline-block; min-width: 200px; padding: 15px 0; text-transform: uppercase; font-weight: 500; line-height:1; text-align: center; color: #a92928; background: #fff url(../images/icon-arrow-right.png) no-repeat center right; border: 1px solid #a92928; }
.btn-s1 a:hover { color: #fff;  }
.btn-s1 a:before { content: ''; position: absolute; width: 0; height: 100%; background: #a92928; left: 0; top: 0; z-index: 0; -webkit-transition: all .7s cubic-bezier(0.19, 1, 0.22, 1) ;
    -moz-transition: all .7s cubic-bezier(0.19, 1, 0.22, 1);
    -o-transition: all .7s cubic-bezier(0.19, 1, 0.22, 1);
    transition: all .7s cubic-bezier(0.19, 1, 0.22, 1); }
.btn-s1 a:hover:before { width: 100%; -webkit-transition: all .7s cubic-bezier(0.19, 1, 0.22, 1) ;
    -moz-transition: all .7s cubic-bezier(0.19, 1, 0.22, 1);
    -o-transition: all .7s cubic-bezier(0.19, 1, 0.22, 1);
    transition: all .7s cubic-bezier(0.19, 1, 0.22, 1); }
.btn-s1 a span { position: relative; }

.btn-s2 a { display: inline-block; width: 100%; max-width: 280px; min-width: inherit; padding: 20px 0; font-size: 16px; text-transform: uppercase; font-weight: 500; line-height: 1; text-align: center; color: #fff; background: #0089eb;  }
.btn-s2 a:hover { color: #fff; background: #1946ba; }

.btn-s3 a { display: block; width: 100%; padding: 5px  10px; color: #3a3d45 ; font-size: 16px; text-align: center; background: none; border: 1px solid #919399;  border-radius: 3px; }
.btn-s3 a:hover { color:#fff; background: #3a3d45; border: 1px solid #3a3d45; }

.btn-s4 { padding-bottom: 60px; }
.btn-s4 a { display:inline-block; position: relative; width: auto; height: 40px; padding:7px 20px; color: #fff !important; text-align: center; background: #ceb071;  border-radius: 3px; }
.btn-s4 a:hover { color: #fff; background: #b58e3e; }

.btn-s4 a span::before { content: attr(data-text-open); display: block; }
.btn-s4 a span::after { content: attr(data-text-close); display: none; }
.btn-s4 a.on span::before { content: attr(data-text-open); display: none; }
.btn-s4 a.on span::after { content: attr(data-text-close); display: block; }

.link-more { position: absolute; width: 90px; height: 34px; right: 15px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; }

.but-more-all { position: relative; width: 200px; margin: 0 auto; text-align: center; }

.loading-ajax { position: absolute; width: 100%; text-align: center; left: 0; right: 0; }
.loading-ajax img { display: inline-block; width: 20px; height: 20px; } 


/* ------------------------------------------------------------------------------------------------------------
|  Enjoy  |
------------------------------------------------------------------------------------------------------------ */