﻿/*fullpage scroll - hidden*/
body {
    -ms-overflow-style: none !important; /* IE and Edge */
    scrollbar-width: none !important; /* Firefox */
}
body::-webkit-scrollbar {
    display: none !important; /* Chrome, Safari, Opera*/
}




.slider .move-btn { z-index:2;}


.direct-popup .visible-popups > .each { max-width:700px!important; }
/*#fp-nav.right { right:110px; }*/
.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; display:none;}
@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:#fff!important; opacity:1!important; width:115px!important; text-align:right; font-size:16px; top:-5px;     transform: skew(-0.05deg); }
#fp-nav ul li.white .fp-tooltip { color:#fff!important; }
#fp-nav ul li .fp-tooltip.right {    right: 40px;}
    #fp-nav ul li a span, .fp-slidesNav ul li a span {
        border: 1px solid white;
        background: #fff0;
    }
/*#fp-nav ul li.white a.active { border: 1px solid #fff; }*/
#fp-nav ul li a.active { /*border: 1px solid #fff;*/ text-decoration: none; padding: 15px; border-radius: 100%; top: -10px; left: -9px; position:relative; transition:.3s all; }
#fp-nav ul li a span, .fp-slidesNav ul li a span {/*background:white;*/ border:1px solid white; height: 6px;    width: 6px;}
#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 { height: 6px; width:6px;     margin: 0px;  background:white;}

/*#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/knambu_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;}*/

#section-2{ position:relative; background:url(../../../Layouts/knambu_Layout/Images/2.sermon_bg.png) no-repeat; background-position:center; background-size:100% 100%; text-align:center;}
#section-2 h1{ font-size:50px; font-weight:bold; }

.sermon-title{color:black; }
.sermon-title h1{ color:#fff; font-weight:bold; margin:10px 0; padding: 3% 0 0;}
.sermon-title h4{font-size:30px; color:#bbb; font-weight:bold; margin:10px 0;margin-bottom:50px; }

.sermon-top {
    position: relative;
    display: flex;
    justify-content: space-around;
    background-position: center;
    background-size: 100% 100%;
    text-align: center;
}
.sermon-top .st-1{/*width:65%; */ background:url(../../../Layouts/knambu_Layout/Images/2.sermon_bg_2.png) no-repeat; background-position:center; background-size:100% 100%; text-align:center;}
.sermon-top h4, .sermon-top h1{ color: black; margin: 20px 0 10px;  font-size: 24px; }
.sermon-top hr{ width: 54px;    color: black;    border: 1px solid; margin-top:10px; }
.sermon-top a{text-decoration:none;}
.st-1 >h4{font-weight:bold; margin-top:40px;}
.sermon-box2{margin: 30px 0 80px;    display: block;}
.sermon-btn {    position: absolute;    top: 0;    left: 0;}

.sermon-bottom{display: flex;    justify-content: space-around;}
.sermon-bottom >div{ /*width:65%; */    padding: 0; display: flex;    justify-content: space-between;}
.sermon-bottom > div > div {
    background: white;
    height: 140px;
    margin: 20px 0px;
    text-align: center;
    padding: 35px 0;
    width:312px;
}

.sermon-bottom .sb-1{background:url(../../../Layouts/knambu_Layout/Images/2.sermon_1Live_bg.png) no-repeat;  padding: 45px 0;}
.sermon-bottom .sb-2{background:url(../../../Layouts/knambu_Layout/Images/2.sermon_2MS_bg.png) no-repeat;}
.sermon-bottom .sb-3{/*background:url(../../../Layouts/knambu_Layout/Images/2.sermon_3Youtube.png) no-repeat;*/}
.sermon-bottom .sb-4{background:url(../../../Layouts/knambu_Layout/Images/2.sermon_4FEBC_bg.png) no-repeat;}



#section-3 {
    position: relative;
    background: url(../../../Layouts/knambu_Layout/Images/3.welcome_bg.png) no-repeat;
    background-position: center;
    background-size: 100% 100%;
}
/*#section-3 h1 { color:#fff; margin:0; font-size:50px; font-weight:bold; 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 h1{ font-size:50px; font-weight:bold; }
 
.info-title h1{ color:#fff; font-weight:bold; margin:10px 0; padding: 3% 0 0;}
.info-title h4{font-size:30px; color:#ccc; font-weight:bold; margin:10px 0;margin-bottom:50px; }

.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:#081564; }
.section-3-box p { margin:20px 0 10px; font-size:19px; font-weight:bold; word-break: keep-all; }
.section-3-box span { font-size:17px; }


#section-4 { position:relative; background:url(../../../Layouts/knambu_Layout/Images/4.community_bg.png) no-repeat; background-position:center; background-size:100% 100%; }
#section-4 a { text-decoration:none; } 
#section-4 h1{ font-size:50px; font-weight:bold; }
.com-title h1{ color:#fff; font-weight:bold; margin:10px 0; padding: 3% 0 0;}
.com-title h4{font-size:30px; color:#666; font-weight:bold; margin:10px 0;margin-bottom:50px; }

.com-1 >div{background:white; padding: 20px;}
.com-1 {margin-top:4%;}
.com-1 h2{font-weight:bold; margin-bottom: 25px;     font-size: 27px; }
.com-1 h4{ font-size: 20px;   }
.com-1 >div>h2{text-align:center;}
.com-1 hr{    border-top: 2px solid #ddd;}
.com-1 a {   display:block;  text-align: right;    transform: translate(20px, 20px);}

.section4-box { padding: 1% 4%;}
.section4-box .cont-desc , .section4-box .cont-title{ overflow: hidden;    text-overflow: ellipsis;    white-space: nowrap;}


/*#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; }*/

@keyframes aaa{
    from{left:-5px}to{left:5px;}
}
.moreV >a:hover {
    animation: aaa 0.4s infinite alternate;
    position: relative;
}


.footer {
    background: black;
}
.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:19px; line-height: 1.8; padding:5% 13%; color:#fff; transform: skew(-0.05deg);}
.footer .footer-bottom a { text-decoration:none; color:#fff; }






/* 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;
}

#section-1 p {margin:0!important; background:black;}
#section-1 .fp-tableCell {background:black;}

@media (min-width:1700px) and (max-width:1920px) {
    video.s1-video{height:116vh!important;}
}

@media(max-width:1820px) {
	 
}
@media(max-width:1720px) {
	 
}

@media(max-width:1620px) {
	 
	.sermon-bottom > div > div { 
    margin: 15px 0px; padding: 35px 5px;  	}
	.sermon-bottom .sb-1 {margin: 15px 3px;     padding: 45px 8px; }
	
	#fp-nav ul li .fp-tooltip.right {
    text-shadow: 2px 1px 3px #000;
    right: 25px;
	}
}

@media(max-width:1500px) {
	 
	.sermon-bottom > div > div { 
    width: 270px;
	}
}
@media(max-width:1200px) {
	 
	.sermon-bottom > div > div { 
    width: 223px;
	}
	.section-3-box span {    font-size: 15px;}
}





@media(max-width:1025px) {
	video.s1-video{max-width:100%; height: 56.1vw!important;}
	#section-1 p {margin:0!important;}
	
	.sermon-top .st-1 {height: 30vw;}
	
	.sermon-bottom >div {flex-wrap:wrap;}
	.sermon-bottom > div > div { width: 49%; margin: 10px 0px;	}
	.sermon-bottom .sb-1 {margin: 10px 3px; }
	
	.sermon-bottom .sb-1, .sermon-bottom .sb-2, .sermon-bottom .sb-3, .sermon-bottom .sb-4{background-size: 100% 100%; margin: 15px 0px 0px;}
	.sermon-top h4{font-size: 19px; margin: 5px 0;}
	.st-1 >h4 {  margin-top: 20px;}
	

	
	#section-2, #section-3, #section-4{padding: 5% 0;}
	
	.homeLNAV{top:90%; right: 23px}
	
	/*동영상이 바닥에 붙게*/
	#section-1 { height:auto!important;}
	#section-1 p {position:absolute;bottom:0;}
	#section-1 .fp-tableCell {position:relative;  height:52.72vw!important;}
}

@media(max-width:565px) {
	.container {    width: 90vw; }
	 
	 
	#section-1 p {margin:0!important;}
	
	.sermon-btn img{max-width:50%;}
	.sermon-btn{left: -25px;}
	 
	.sermon-top .st-1{padding-top:3vw; height: 34vw;/*width:300px;*/}
	.sermon-top h4  {  font-size: 3.5vw;     margin: 10px 0;}
	.sermon-top hr { margin-top: 1vw; margin-bottom: 1vw; }


	#section-2 h1 { font-size: 4vw; }
	.sermon-bottom >div {flex-wrap:wrap; /*width:300px;*/}
	.sermon-bottom > div > div { width: 100%; margin: 5px 0px;	}
	 
	 .sermon-box2 {    margin: 2vw 0;}
	
	#section-2, #section-3, #section-4{padding: 5% 0;}
	
	#section-3 p{font-size:15px;}
	
	#section-4 .moreV img{max-width:60%;}
	#section-4 h2{ font-size: 21px;}
	  #section-3 h4, #section-4 h4{ font-size: 18px;}
}

 


/*원래 있던 것 */

@media (min-width:1200px) and (max-width:1499px) {
    #section-2 .section2-desc { padding:25px 15px; }
	.section-image >img { min-width:360px;}
}

@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;}
	
    #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;}
	
    #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; word-break: keep-all;}
    .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:2vw; }
    #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; }
	 
}

