﻿.direct-popup .visible-popups > .each { max-width:700px!important; }
#fp-nav.right { right:25px; }
.fullpage-mouse { position: fixed; bottom: 7%; z-index: 50; left: 50%; display: block; transform: translate(-50%, 0); }
.fullpage-mouse img { animation: MoveUpDown 1.2s ease-in-out infinite; position: relative; z-index: 10; }
@keyframes MoveUpDown { 0%, 100% { transform: translateY(0rem); } 50% { transform: translateY(1rem);}}

#fp-nav { background: transparent; z-index:0!important;  top:50%!important; display:inline-block; height:15%;}
#fp-nav ul li, .fp-slidesNav ul li { margin:25px 7px; }
#fp-nav ul li:last-child { display:none; }
#fp-nav ul li .fp-tooltip { color:#333!important; opacity:1!important; width:115px!important; text-align:left; font-size:16px; top:-5px;     transform: skew(-0.05deg); }
#fp-nav ul li.white .fp-tooltip { color:#fff!important; }
#fp-nav ul li.white a span, .fp-slidesNav ul li.white a span { background: #fff; }
#fp-nav ul li.white a.active { border: 1px solid #fff; }
#fp-nav ul li a.active { border: 1px solid #000; text-decoration: none; padding: 15px; border-radius: 100%; top: -10px; left: -9px; position:relative; transition:.3s all; }
#fp-nav ul li a.active span, .fp-slidesNav ul li a.active span, #fp-nav ul li:hover a.active span, .fp-slidesNav ul li:hover a.active span { width:4px; height:4px; margin: -2px 0 0 -2px; }

#section-1 { position:relative; }
#section-1 > div > img:first-child { width:100%; height:100%; }
#section-1 .text-center {  position:absolute; top:50%; left:50% ; transform:translate(-50%, -50%); }
#slideText { -webkit-animation: zoomin 9s 1; animation: zoomin 9S 1; }
@-webkit-keyframes zoomin { 0% { -webkit-transform: scale(1.2); } 100% { -webkit-transform: scale(1); }}

#section-2 { position:relative; background:url(../../../Layouts/sdfc_Layout/Images/2_bg.png) no-repeat; background-position:center; background-size:100% 100%; }
#section-2 a { text-decoration:none; }
#section-2 h1 { color:#fff; margin:0; font-size:50px; font-weight:normal; margin:30px 0; font-family: 'Arita-buri-SemiBold'; }
#section-2 h3 { color:#fff; margin:30px 0 0; font-size:27px; font-weight:100; }
#section-2 .view-more { display:inline-block; padding:15px 60px; font-size:14px; border:1px solid #fff; color:#fff; text-decoration:none; font-weight:bold; }
#section-2 .section2-box { margin-top:55px; }
#section-2 .section2-box:hover .section2-desc { background:rgba(0,0,0,0.8); transition:.3s all; }
#section-2 .section2-desc { background:rgba(0,0,0,0.5); padding:25px 30px; overflow:hidden; }
#section-2 .section2-desc p { font-size:22px; color:#fff; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal !important; width: 100%; }
#section-2 .section2-desc span { font-size:15px; transform: skew(-0.05deg); color:#fff; }
#section-2 .section2-desc .section2-bible { float:left; }
#section-2 .section2-desc .section2-date { float:right; }
.section-image >img { min-width:420px; max-height: 235px;}

 

#section-3 { position:relative; background:url(../../../Layouts/sdfc_Layout/Images/3_quick_bg.png) no-repeat; background-position:center; background-size:100% 100%; }
#section-3 h1 { color:#fff; margin:0; font-size:50px; font-weight:normal; margin:50px 0; font-family: 'Arita-buri-SemiBold'; }
#section-3 h3 { color:#fff; margin:30px 0 0; font-size:27px; font-weight:100; }
#section-3 h2 { color:#fff; margin:0; font-size:27px; font-weight:100; }
.section-3-box { margin-top:100px; }
.section-3-box a { color:#fff; text-decoration:none; display:inline-block; position:relative; top:0; }
.section-3-box a:hover { top:-15px; transition:.3s top; }
.section-3-box a:hover p { color:#0EA1DB; }
.section-3-box p { margin:20px 0 10px; font-size:19px; font-weight:bold; }
.section-3-box span { font-size:17px; }

#section-4 { position:relative; background:url(../../../Layouts/sdfc_Layout/Images/4_notice_bg.png) no-repeat; background-position:center; background-size:100% 100%; }
#section-4 a { text-decoration:none; }
#section-4 h1 { color:#fff; margin:0; font-size:50px; font-weight:normal; margin:30px 0; font-family: 'Arita-buri-SemiBold'; }
#section-4 h3 { color:#fff; margin:30px 0 0; font-size:27px; font-weight:100; }
#section-4 .view-more { display:inline-block; padding:15px 60px; font-size:14px; border:1px solid #fff; color:#fff; text-decoration:none; font-weight:bold; }
#section-4 ul a { color:#fff; text-decoration:none; }
#section-4 li { overflow:hidden; border-bottom:1px solid #fff; padding:25px 15px; }
#section-4 li div { float:left;}
#section-4 li img { float:right; margin-top:18px; }
#section-4 li div.section4-box-date p { font-size:17px; margin:0; }
#section-4 li div.section4-box-date p strong { font-size:40px; }
#section-4 li div.section4-box-cont { margin-top:13px; margin-left:50px; }
#section-4 li div.section4-box-cont p { margin:0; font-size:18px; line-height:33px; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal !important; width: 900px;}
#section-4 li div.section4-box-cont p.cont-title { font-weight:bold; }

.footer { background:#fff; }
.footer ul { padding:20px 0; border-bottom:1px solid #cecece; }
.footer li { display:inline-block; font-size:17px; color:#989898; border-right:1px solid #cecece; }
.footer li:last-child { border-right:none; }
.footer li a { color:#989898; text-decoration:none; padding:0 50px; }
.footer li a:hover { color:#70AE62; transition:.3s color; }
.footer .footer-bottom { font-size:15px; padding:40px 0; color:#989898; transform: skew(-0.05deg);}
.footer .footer-bottom a { text-decoration:none; color:#989898; }

/* btn */

.view-more {
  display: inline-block;
  padding: 17px 50px;
  color: #00A9E0;
  font-size: 17px;
  border: 5px solid #fff;
  text-decoration: none;
  overflow: hidden;
  vertical-align: middle;
  background: transparent;
  overflow: hidden;
  -webkit-transition: 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  position: relative;
  z-index: 10;
 border: 1px solid #00A9E0; 
 font-weight:100;
}

.view-more:hover {
  color: #fff;
}

.view-more:hover:before {
  -webkit-transform: translateX(0) skewX(-17.62deg);
  -ms-transform: translateX(0) skewX(-17.62deg);
  transform: translateX(0) skewX(-17.62deg);
  -webkit-transform-origin: left top;
  -ms-transform-origin: left top;
  transform-origin: left top;
}

.view-more:before {
  z-index: -1;
  content: "";
  display: block;
  width: 120%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  -webkit-transform-origin: right top;
  -ms-transform-origin: right top;
  transform-origin: right top;
  -webkit-transform: translateX(-101%) skewX(-17.62deg);
  -ms-transform: translateX(-101%) skewX(-17.62deg);
  transform: translateX(-101%) skewX(-17.62deg);
  -webkit-transition: -webkit-transform 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: -webkit-transform 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: transform 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: transform 1s cubic-bezier(0.165, 0.84, 0.44, 1),
    -webkit-transform 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.view-more1:before {
	background: #C7B1E6;
}

.view-more2:before {
	background: #737069;
}


@media (min-width:1200px) and (max-width:1499px) {
    #section-2 .section2-desc { padding:25px 15px; }
	.section-image >img { min-width:360px;     max-height: 200px;}
}

@media (min-width:993px) and (max-width:1199px) {
    #section-2 h3 { font-size:20px; }
    #section-2 h1 { font-size:40px; }
    #section-2 .section2-desc p { font-size:17px; }
    #section-2 .section2-desc .section2-bible { display:none; }
    #section-2 .section2-desc .section2-date { float:left; }
	.section-image >img { min-width:293.33px; max-height: 165px;}
	
    #section-3 h3 { font-size:20px; }
    #section-3 h1 { font-size:40px; }
    #section-3 h2 { font-size:20px; }
    #section-4 h3 { font-size:20px; }
    #section-4 h1 { font-size:40px; }
    #section-4 li div.section4-box-cont p { width:700px; }
    .footer li a { padding:0 30px; }
}

@media (min-width:768px) and (max-width:992px) {
		#fp-nav { display:none!important; }
    #slideText { max-width:300px; }
    #section-2 h3 { font-size:17px; }
    #section-2 h1 { font-size:25px; }
    #section-2 .section2-desc p { font-size:17px; }
    #section-2 .section2-desc .section2-bible { display:none; }
    #section-2 .section2-desc .section2-date { float:left; }
    #section-2 .section2-desc { padding:25px 20px; }
	.section-image >img { min-width:220px; max-height: 123px;}
	
    #section-3 h3 { font-size:17px; }
    #section-3 h1 { font-size:25px; }
    #section-3 h2 { font-size:20px; }
    .section-3-box span { font-size:15px; }
    .section-3-box { margin-top:50px; }
    #section-4 h3 { font-size:17px; }
    #section-4 h1 { font-size:25px; }
    #section-4 li div.section4-box-cont p { font-size:17px; width:500px; }
    .footer li a { padding:0 15px; }
}

@media (max-width: 767px) {
    #section-2 h3 { font-size:17px; }
    #section-2 h1 { font-size:20px; margin:15px; }
    #section-2 .view-more { padding:10px 40px; margin-bottom:15px; }
    #section-2 .section2-desc p { font-size:17px; margin-bottom:5px; }
    #section-2 .section-image { display:none; }
    #section-2 .section2-desc .section2-bible { display:none; }
    #section-2 .section2-desc .section2-date { float:left; }
    #section-2 .section2-desc { padding:10px 15px; }
    #section-2 .section2-box { margin-top:15px; }
    #section-2 .view-more { font-size:12px; }
    #section-3 h3 { font-size:17px; }
    #section-3 h1 { font-size:20px; margin:15px; }
    #section-3 h2 { font-size:15px; }
    .section-3-box span { display:none; }
    .section-3-box { margin-top:30px; }
    .section-3-box img { max-width:90px; }
    .section-3-box p { font-size:17px; margin:10px 0;}
    #section-4 h3 { font-size:17px; }
    #section-4 h1 { font-size:20px; margin:15px; }
    #section-4 .view-more { padding:10px 40px; margin-bottom:10px;  }
    #section-4 ul { padding:0 15px; }
    #section-4 li img { display:none; }
    #section-4 li div.section4-box-cont { margin-top:0; margin-left:15px; width:75%; }
    #section-4 li div.section4-box-cont p { font-size:15px; width:100%; line-height:26px; transform: skew(-0.05deg); }
    #section-4 li div.section4-box-date p { font-size:14px; transform: skew(-0.05deg);}
    #section-4 li div.section4-box-date p strong { font-size:20px; }
    #section-4 li { padding:15px; }
    .footer li { font-size:14px; transform: skew(-0.05deg); margin:5px 0; }
    .footer ul { padding:10px 0; }
    .footer li a { padding:0 15px; }
    .footer .footer-bottom { font-size: 14px; padding: 15px 15px; color: #989898; transform: skew(-0.05deg); }
    #section-2, #section-3, #section-4 { background-size:auto 100%; }
    #fp-nav { display:none; }
}

