


.logo-bkp74{ width: 100px; margin: 0 auto; padding-bottom: 30px; }

.campaign--74_anniversary .bg-highlight-campaign{ background-image: url('../images/specials/74_anniversary/bg_newnormal2.jpg'); padding: 40px 20px; }
.campaign--74_anniversary .campaign-title{ text-align: center; padding-bottom: 40px; display: inline-block; }
.campaign--74_anniversary .campaign-title .bg-logo-bkp{ width: 135px; float: left; }
/*.campaign--74_anniversary .campaign-title .chanel{ float: left; padding-top: 3px; padding-left: 10px; }*/
.campaign--74_anniversary .campaign-title a{ font-size: 18px; }

.campaign-highlight-newnormal_quote.campaign--74_anniversary .chanel{  font-size: 22px; color: #0D2147; padding-top: 0;  }
.campaign-highlight-newnormal_quote.campaign--74_anniversary .campaign-title{ padding-bottom: 0; }

.list_campaign-hover { position: relative; overflow: hidden; }
.list_campaign-hover a { color: #fff; }
.list_campaign-hover a:hover { text-decoration: underline; }
.list_campaign-hover figure { display: block; overflow: hidden; }
.list_campaign-hover figcaption { position: absolute; left: 10px; right: 10px; -webkit-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; -webkit-transform: translateY(0%); -ms-transform: translateY(0%); transform: translateY(0%); }
.list_campaign-hover figcaption h4 { font-size: 16px; line-height: 20px; position: absolute; -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); text-align: center; color: #fff; padding: 0 0 15px; left: 0; right: 0; }
.list_campaign-hover:hover figcaption { -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); }
.list_campaign-hover .view-all { text-align: center; font-size: 12px; line-height: 16px; padding-top: 15px; text-transform: none; }
.list_campaign-hover .overlay { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-image: -webkit-linear-gradient(rgba(19, 47, 101, 0), #132F65); background-image: -o-linear-gradient(rgba(19, 47, 101, 0), #132F65); background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(19, 47, 101, 0)), to(#132F65)); background-image: linear-gradient(rgba(19, 47, 101, 0), #132F65); opacity: 0.95; }

.logo_sponsor--74_anniversary{ text-align: center; }
.logo_sponsor--74_anniversary ul{ display: inline-block; }
.logo_sponsor--74_anniversary ul li{ float: left; width: 100px; margin: 0 10px; }
.logo_sponsor--74_anniversary ul li a{ display: block; }


@media (max-width: 576px){

  .campaign--74_anniversary .campaign-title{ padding-bottom: 20px; }


}
@media (max-width: 420px){

  .logo_sponsor--74_anniversary{ max-width: 300px; width: 100%; margin: 0 auto; }
  .logo_sponsor--74_anniversary ul li{ margin: 0; width: 50%; padding: 10px; }

}




/**********************************************************/
/**********************************************************/
/**********************************************************/

.campaign-newnormal--leading{ padding-top: 50px; }
.leading-intime{ background-color: #0D315E; padding: 40px 20px; margin-top: 15px; text-align: center; }

.newnormal-title h3 a{ color: #fff; }
.newnormal-title i{ color: #fff; font-size: 12px; }


.leading--img{ height: 140px; }
.leading--img-border{ width: 125px; height: 125px; border-radius: 50%; overflow: hidden; border:2px solid transparent; padding: 3px; margin: 0 auto; transition: all .3s; }
.leading--img-circle{ width: 100%; height: 100%; border-radius: 50%; overflow: hidden; transition: all .3s; opacity: 0.55; }
.leading-name{ font-size: 12px; line-height: 20px; font-weight: bold; color: #fff; text-transform: uppercase; }
.box-leading a:hover .leading--img-border{ border:2px solid #2B63D1; width: 135px; height: 135px; }
.box-leading a:hover .leading--img-circle{ opacity: 1; }
.box-leading a:hover .leading-name{ color: #2B63D1; }



.campaign-highlight-newnormal_quote{ padding: 50px 0; }
.newnormal_quote-title h2{ font-family: Arial,Helvetica Neue,Helvetica,sans-serif; font-size: 28px; line-height: 42px; font-weight: bold; color: #0D2147; text-transform: uppercase; text-align: center; padding-bottom: 20px; }
.newnormal_quote-title2{ font-size: 18px; line-height: 20px; color: #0D2147; text-align: center; }

.campaign-highlight-newnormal_quote .container{ position: relative; }
.box-share--newnormal_quote{ position: absolute; top: 130px; right: 0; padding: 0; z-index: 5; }
.box-share--newnormal_quote.box-share a{ border:0; color: #0D2147; font-size: 24px; }
.box-share--newnormal_quote.box-share a:hover{ color: #fff; }

.newnormal_quote-content{ padding-top: 50px; }
.box-leader{ padding-bottom: 30px; }
.box-leader-detail h3{ font-size: 18px; line-height: 24px; color: #121212; padding-top: 13px; padding-bottom: 5px; }
.box-leader-detail p{ font-size: 12px; line-height: 20px; color: #666; }
.box-leader-photo{ transform: scale(1); transition: .5s ease; }
.box-leader a:hover .box-leader-detail h3{ color: #2B62CF; }
.box-leader a:hover .box-leader-photo{
  transform: scale(1.01); transition: .5s ease; 
  -webkit-box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.3);
  -moz-box-shadow:    0px 5px 15px 0px rgba(0, 0, 0, 0.3);
  box-shadow:         0px 5px 15px 0px rgba(0, 0, 0, 0.3);
}




.content-quote{ overflow: hidden; position: relative; }
.box-leader--photo{ float: left; width: 216px; }
.box-quote--detail{ float: left; width: calc(100% - 216px); padding-left: 25px; }
.quote--detail p{ font-size: 15px; line-height: 20px; font-weight: bold; color: #2B62CF; padding-bottom: 20px; }
.quote--detail p:first-of-type:before{ content: '\201C'; }
.quote--detail p:last-of-type:after{ content: '\201D'; }
.leader--modal{ position: absolute; bottom: -4px; }


.btn-close{ position: absolute; right: 8px; top: 5px; width: 15px; z-index: 5; }

.modal-quoteContent{ max-width: 800px; }
.modal-quoteContent .modal-content{ border-radius: 0; }
.modal-quoteContent .modal-body{ padding: 45px; }

/*.modal-backdrop.show{ opacity: 1; background-color: #F5F5F5; }*/


.boxlogo{ text-align: center; padding-bottom: 20px; }
.boxlogo .logo1{ width: 100px; display: inline-block; margin-right: 10px; }
.boxlogo .logo2{ width: 33px; display: inline-block; }


.leader--readmore{ position: absolute; right: 0; bottom: 0; }
.leader--readmore a{ display: block; border:1px solid #132F65; font-size: 12px; color: #132F65; padding: 6px 10px; }
.leader--readmore a:hover{ background-color: #132F65; color: #fff; }


.modal-arrow{ position: absolute; width: 100%; height: 60px; top: 50%; transform: translateY(-50%); }
.modal-arrow .btn-prev, .modal-arrow .btn-next{ width: 31px; height: 60px; position: absolute; border: 0; cursor: pointer; background-repeat: no-repeat; }
.modal-arrow .btn-prev{ left: 7px; background-image: url('../../assets/images/icon/icon-prev.svg'); }
.modal-arrow .btn-next{ right: 7px; background-image: url('../../assets/images/icon/icon-next.svg'); }
.modal-arrow .btn-prev:hover{ background-image: url('../../assets/images/icon/icon-prev-h.svg'); }
.modal-arrow .btn-next:hover{ background-image: url('../../assets/images/icon/icon-next-h.svg'); }



@media (max-width: 991px) {

  .box-share--newnormal_quote{ position: relative; text-align: center; padding-bottom: 20px; top: auto; }

  .modal-quoteContent .modal-body{ padding: 30px; }

}
@media (max-width: 767px) {

  .leader--modal{ position: relative; }
  .leader--readmore{ position: relative; margin-top: 20px; }
  .leader--readmore a{ display: inline-block; }
  
}
@media (max-width: 576px) {

  .campaign-highlight-newnormal_quote{ padding-top: 30px; padding-bottom: 0; }
  .newnormal_quote-content{ padding: 30px 20px; }
  .newnormal_quote-content .row{ margin-right: -10px; margin-left: -10px; }
  .newnormal_quote-content .col-50{ padding-right: 10px; padding-left: 10px; }

  .newnormal_quote-title h2{ font-size: 24px; line-height: 30px; }

  .box-leader--photo{ float: none; width: 100%; overflow: hidden; width: 216px; margin: 0 auto; }
  .box-quote--detail{ float: none; width: 100%; padding-left: 0px; padding-top: 20px; }

  .modal-quoteContent .modal-body{ padding: 25px; }

  .modal-arrow{ top: 187px;  }

}
@media (max-width: 400px) {

  .campaign-newnormal--leading .newnormal-title h3{ font-size: 14px; }

}
@media (max-width: 360px) {

  .campaign-newnormal--leading .newnormal-title h3{ font-size: 13px; }

}






/**********************************************************/
/**********************************************************/
/**********************************************************/


.bar-promote-epaper{ position: fixed; bottom: 0; left: 0; width: 100%; background-color: #17469e; z-index: 555; }
.bar-promote-epaper .bar-promote-bg{ padding: 10px 0; overflow: inherit; }
.special-promote--epaper{ overflow: hidden; }
.special-promote--epaper .promote-01{ float: left; width: 160px; }
.special-promote--epaper .promote-02{ float: left; width: calc(100% - 240px); text-align: center; font-family: charis_silbold, Georgia,Times,Times New Roman,serif; font-size: 32px; color: #fff; }
.special-promote--epaper .promote-02 span{ color: #ee1a26; text-shadow: 0px 3px 6px rgba(0, 0, 0, 1); }
.special-promote--epaper .promote-03{ float: right; width: 50px; margin-right: 30px; }

.btn-special-promote--subscribe{
  display: inline-block;
  border: 1px solid #fff;
  background-color: transparent;
  color: #fff;
  font-size: 12px;
  line-height: 20px;
  border-radius: 0;
  padding: 3px 5px;
  width: 120px;
	text-align: center;
	cursor: pointer;
  transition: all 0.8s ease;
  vertical-align: middle; margin-left: 20px;
} 
.btn-special-promote--subscribe:hover{ background-color: #2B63D1; color: #fff; border: 1px solid #2B63D1; transition: all 0.8s ease; }
.bar-promote-epaper  .promote-031{ position: absolute; top: -40px; right: 50px; width: 100px; }


@media (max-width: 1199px) {

  .btn-special-promote--subscribe{ display: block; margin: 0 auto;}
  .bar-promote-epaper  .promote-031{ top: -30px; right: 40px; width: 90px; }

}
@media (max-width: 991px) {

  .special-promote--epaper .promote-02{ font-size: 22px; }
  .bar-promote-epaper  .promote-031{ top: -30px; right: 30px; width: 80px; }

}
@media (max-width: 767px) {

  .special-promote--epaper .promote-01{ width: 120px; }
  .special-promote--epaper .promote-02{ font-size: 16px; line-height: 22px; width: calc(100% - 200px); }
  .bar-promote-epaper  .promote-031{ width: 60px; }

}
@media (max-width: 576px) {

  .special-promote--epaper .promote-01{ float: none; margin: 0 auto; }
  .special-promote--epaper .promote-02{ font-size: 14px; line-height: 16px; width: 100%; padding-top: 18px; }
  .btn-special-promote--subscribe{ display: inline-block; width: 100px; font-size: 10px; margin-left: 5px; }
  .special-promote--epaper .promote-03{ display: none;}
  .bar-promote-epaper  .promote-031{ right: auto; left: 20px; width: 80px; }

}
@media (max-width: 360px) {

  .special-promote--epaper .promote-01{ width: 100px; }
  .special-promote--epaper .promote-02{ padding-top: 14px; }
  .bar-promote-epaper  .promote-031{ width: 70px; }
  .btn-special-promote--subscribe{ margin: 10px auto 0; display: block; }

}




/**********************************************************/
/**********************************************************/
/**********************************************************/

.section-spectial--guru{ padding-bottom: 40px; }
.box-guru--bg{ position: relative; background-color: #0B144B; padding: 165px 30px 30px; }
.box-guru--logo{ position: absolute; top: -60px; right: 0; }
.box-guru--content{ background-color: #fff; width: 100%; padding: 50px 0 30px; }
.box-guru--container{ max-width: 960px; width: 95%; margin: 0 auto; }
.box-guru--container h2{ font-family: 'Kanit',Arial,Helvetica Neue,Helvetica,sans-serif; font-size: 36px; font-weight: 200; font-style: italic; margin-bottom: 30px;}
.box-guru--container h2 span{ position: relative; background-color: #fff; padding-right: 10px; z-index: 9; }
.box-guru--container h2:after{ content: ''; position: absolute; width: 100%; height: 1px; top: 50%; left: 0;  background-color: #000; }

.item--guru .guru--updatedate{ padding: 10px 0; }
.item--guru .guru--updatedate span{ font-family: 'Kanit',Arial,Helvetica Neue,Helvetica,sans-serif; font-size: 12px; font-weight: 200; background-color: #F9F9F9; padding: 5px; border-radius: 5px; }
.item--guru h3{ font-family: 'Kanit',Arial,Helvetica Neue,Helvetica,sans-serif; font-size: 18px; line-height: 25px; font-weight: 300;}
.item--guru a:hover{ color: inherit; transition: .5s ease; }
.item--guru a:hover h3{ text-decoration: underline; }
.item--guru a .guru--img{ position: relative; padding-right: 10px;}
.item--guru a .guru--img img{ z-index: 2; position: relative; }
.item--guru a .guru--img:after{ content: ''; position: absolute; width: calc(100% - 10px); height: 100%; right: 0; bottom: -10px; background-color: #fff; z-index: 0; transition: background-color .5s linear; }
.item--guru a:hover .guru--img:after{ background-color: #F09C84; }


.owl-spectial--guru.owl-carousel .owl-nav{ top: calc(50% - 47px); margin-top: -24px; height: 48px; }
.owl-spectial--guru.owl-carousel .owl-nav button.owl-prev{ background: url(../images/specials/guru/arrow-prev.svg) no-repeat 0 0; background-size: cover; width: 38px; height: 48px; left: -13px; }
.owl-spectial--guru.owl-carousel .owl-nav button.owl-next{ background: url(../images/specials/guru/arrow-next.svg) no-repeat 0 0; background-size: cover; width: 38px; height: 48px; right: -3px; }



@media (max-width: 1440px) {

  .box-guru--bg{ padding-top: 140px; }
  .box-guru--logo{ top: -55px; width: 480px; }

}
@media (max-width: 991px) {

  .box-guru--bg{ padding-top: 110px; }
  .box-guru--logo{ top: -40px; width: 360px; }

}
@media (max-width: 576px) {

  .box-guru--bg{ padding: 75px 20px 20px; }
  .box-guru--logo{ top: -25px; width: 240px; }
  .box-guru--content{ padding: 30px 0;}
  .box-guru--container h2{ font-size: 30px;}
  /* .item--guru a:hover .guru--img:after{ right: -5px; bottom: -5px;  } */
  .item--guru{ padding-left: 10px; }
  .owl-spectial--guru.owl-carousel .owl-nav button.owl-prev{ left: -3px; }

}


/**********************************************************/
/**********************************************************/
/**********************************************************/

.campaign--holiday2020 .bg-highlight-campaign{ background-image: url('../images/campaign/holiday_time2020/bg_holiday_home.jpg'); padding: 70px 0 120px; position: relative; }
.campaign--holiday2020 .bg-highlight-campaign::before{ content: ''; position: absolute; top: 15px; left: 20px; background-image: url('../images/campaign/holiday_time2020/snow.png'); background-repeat: no-repeat; width: 100%; height: 100%; }
.campaign--holiday2020 .bg-highlight-campaign::after{ content: ''; position: absolute; bottom: 0; left: 0; right: 0; background-image: url('../images/campaign/holiday_time2020/snow_bottom.png'); background-repeat: no-repeat; background-size: cover; background-position: right bottom; width: 100%; height: 25px; }
.campaign--holiday2020 .campaign-title a{ color: #166189; z-index: 2; }
.campaign--holiday2020 .campaign-title .chanel i{ color: #166189; }
.holiday-tree{ position: absolute; bottom: 13px; right: 35px; }

.campaign--holiday2020 .bg-highlight-campaign .list-detail-mt h3{ margin-bottom: 10px; }
.campaign--holiday2020 .bg-highlight-campaign .list-detail-mt h3 a{ color: #166189; }
.campaign--holiday2020 .bg-highlight-campaign .list-detail-mt p{ color: #105777; }
.campaign--holiday2020 .bg-highlight-campaign .list-detail-mt h3 a:hover{ color: #132F65; }



.bg-topic-holiday2020{ background-image: url('../images/campaign/holiday_time2020/bg_holiday_home.jpg'); padding: 30px 0 120px; position: relative; background-position: center top; }
.bg-topic-holiday2020::before{ content: ''; position: absolute; top: 30px; right: 30px; background-image: url('../images/campaign/holiday_time2020/snow2.png'); background-repeat: no-repeat; width: 843px; height: 100%; }
.bg-topic-holiday2020::after{ content: ''; position: absolute; bottom: 0; left: 0; right: 0; background-image: url('../images/campaign/holiday_time2020/snow_bottom.png'); background-repeat: no-repeat; background-size: cover; background-position: center bottom; width: 100%; height: 25px; }

.topic-detail-holiday2020{ color: #4F92B7; position: relative; z-index: 2; }
.topic-detail-holiday2020 .topics-page-content{ color: #105777; }
.topic-detail-holiday2020 .topics-page-content h2{ color: #166189; }
.bg-topic-campaign .topic-detail-holiday2020 p{ color: #105777; }
.bg-topic-campaign .topic-detail-holiday2020 .box-share-h a{ background-color: #76B9DD; border-color:#76B9DD; }
.bg-topic-campaign .topic-detail-holiday2020 .box-share-h a:hover{ background-color: #166189; border-color:#166189; }
.holiday-tree--center{ position: absolute; bottom: 13px; left: 40%; }
.bg-topic-campaign .topic-detail-holiday2020 .topics-page-content{ text-shadow: none; }

.logo-sponser--campaign{ padding-top: 30px; }
.logo-sponser--campaign a{ display: inline-block; margin-bottom: 8px; margin-right: 5px;}



@media (max-width: 1199px) {

  .campaign--holiday2020 .bg-highlight-campaign{ padding: 50px 0px 120px; }
  .holiday-tree--center{ left: 50%; transform: translateX(-50%); }

}
@media (max-width: 576px) {

  .holiday-tree{ right: 15px }
  .campaign--holiday2020 .bg-highlight-campaign{ padding: 50px 20px 120px; }

  .bg-topic-holiday2020::after{ background-position: right bottom; }
  .bg-topic-holiday2020{ background-position: 30% top;}

  .logo-sponser--campaign a img{ width: 130px;}

}
@media (max-width: 400px) {
  .campaign--holiday2020 .campaign-title a{ font-size: 14px; }

  .bg-topic-holiday2020{ padding-bottom: 80px; }
}

/**********************************************************/
/**********************************************************/
/**********************************************************/

.snowdown {
	width: 100%;
	position: relative;
	overflow: hidden;
  padding-bottom: 0;
  margin-bottom: 60px;
}
.snow1 {
	background: url('../images/campaign/holiday_time2020/snow_flake.png');
	background-repeat: repeat;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
  animation: snowOne 20s infinite linear;
  background-size: 500px;
  filter: blur(2px);
  z-index: 1;
}
.snow2 {
	background: url('../images/campaign/holiday_time2020/snow_flake.png');
	background-repeat: repeat;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	animation: snowTwo 25s infinite linear;
	background-size: 300px;
	filter: blur(1px);
  z-index: 1;
}
.snow3 {
	background: url('../images/campaign/holiday_time2020/snow_flake.png');
	background-repeat: repeat;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	animation: snowThree 15s infinite linear;
	background-size: 600px;
	filter: blur(3px);
  z-index: 1;
}

@keyframes snowOne{
	0%
	{
		background-position: 0px 0px;
    opacity: 0;
	}
  15%
  {
    background-position: 10px 50px;
    opacity: 1;
  }
	99%
	{
		background-position: 100px 550px;
    opacity: 0;
	}
  100%
  {
    background-position: 0px 0px;
    opacity: 0;
  }
}
@keyframes snowTwo{
	0%
	{
		background-position: 0px -100px;
    opacity: 0;
	}
  15%
  {
    background-position: 0px 0px;
    opacity: 1;
  }
	99%
	{
		background-position: 0px 950px;
    opacity: 0;
	}
  100%
  {
    background-position: 0px -100px;
    opacity: 0;
  }
}
@keyframes snowThree{
	0%
	{
		background-position: -10px 0px;
    opacity: 0;
	}
  15%
  {
    background-position: 10px 100px;
    opacity: 1;
  }
	99%
	{
		background-position: 300px 750px;
    opacity: 0;
	}
  100%
  {
    background-position: 0px 100px;
    opacity: 0;
  }
}



@media (max-width: 767px){

  .owl-campaignHoliday.owl-carousel .owl-stage{ left: -30px; }
  .owl-campaignHoliday.owl-carousel .owl-stage.pos-right{ left: inherit!important; right: -30px!important; }

}



@media (min-width: 1200px) {

  .owl-campaignHoliday .owl-item{
    position: relative;
    float: left;
    width: 35% !important;
  }
  .owl-campaignHoliday .owl-item:nth-child(1),
  .owl-campaignHoliday .owl-item:nth-child(2){
    width: 30% !important;
  }
  .owl-campaignHoliday .owl-item:nth-child(3){
    margin-bottom: 20px;
  }

  .owl-campaignHoliday .owl-item .list-detail-mt{
    width: 50%; float: left; margin-top: 0; padding-left: 15px;
  }
  .owl-campaignHoliday .owl-item:nth-child(1) .list-detail-mt,
  .owl-campaignHoliday .owl-item:nth-child(2) .list-detail-mt{
    width: 100%; padding-left: 0;
  }

  .owl-campaignHoliday .owl-item figure{
    width: 50%; float: left;
  }
  .owl-campaignHoliday .owl-item:nth-child(1) figure,
  .owl-campaignHoliday .owl-item:nth-child(2) figure{
    width: 100%;
  }

}


