@font-face {
    font-family: 'notosanskr-bold_0';
    src: url('webfont/notosanskr-bold_0.otf') format('opentype');
}
@font-face {
    font-family: 'notosanskr-regular_0';
    src: url('webfont/notosanskr-regular_0.otf') format('opentype');
}
@font-face {
    font-family: 'notoserifkr-light';
    src: url('webfont/notoserifkr-light.otf') format('opentype');
}
@keyframes move {
    from {
        transform: translateX(100px) scale(1.2);
        animation-timing-function: cubic-bezier(.2,0,.8,1);
    }

    to {
        transform: translateX(0px) scale(1);
    }
}
@-webkit-keyframes updown {
    0% {
        bottom: 0;
    }

    100% {
        bottom: 30px;
    }
}

@-webkit-keyframes spinspin {0% {-webkit-transform: rotate(0deg);}100% {-webkit-transform:rotate(180deg);}}
@keyframes spinspin {0% {transform: rotate(0deg);}100% {transform:rotate(180deg);}}

:root{--gap1:55px;--gap2:65px;--gap3:30px;}

body *{font-family: 'notosanskr-regular_0';}
.notosanskrBold{font-family: 'notosanskr-bold_0';}
.notosanskrLight{font-family: 'notoserifkr-light';}

/* common */
a{text-decoration:none!important;color:inherit;}
#main-slider{position:relative;}
.nav-tabs {border-bottom:none;}
.plus { position:absolute; top:0; right:0;}
.plus:hover { opacity:0.8; transition:0.3s all ease;}
.slider .move-btn{top:50%!important;}
.slider .slider-wrapper .slide p{display: flex;}
.slider .slider-wrapper .slide img{width: 100%;}
.box{display:inline-block; position:relative; opacity:0; top:50px; }
.flexBox{display: inline-flex;flex-direction: column;flex-wrap: wrap;align-content: center;justify-content: center;align-items: center;text-align:center;}
.black{color:#000!important;text-decoration:none;}
.white{color:#fff!important;text-decoration:none;}

#main-slider .mainQM{position: absolute;top: 70%;text-align: center;width: 100%;transform: translate(0,-50%);
display: inline-flex;justify-content: center;align-items: center;gap:var(--gap1);}
#main-slider .mainQM a{padding: 72.5px;position: relative;display: inline-block;background-color:#fff;text-decoration:none;color:#000;border:1px solid #000;}
#main-slider .mainQM a:hover{position:relative;
animation-name: updown;animation-duration:1s;animation-duration: leaner;animation-iteration-count:infinite;animation-direction:alternate;animation-fill-mode: forwards;}
#main-slider .mainQM a .QM{position: absolute;top: 50%;left: 0;
text-align: center;width: 100%;transform: translate(0,-50%);}
#main-slider .mainQM a .QM .QIMG{display: inline-block;}
#main-slider .mainQM a .QM h1{margin: 0;font-size: 18px;letter-spacing: 1px;line-height: 1.5;font-weight:bold;}

#main-1{background-repeat:no-repeat;background-position:center;background-size:cover;}
#main-1 .main1TM{display: inline-flex;align-items: flex-end;margin: -85px 0 0;gap:var(--gap2);width:100%;position:relative;padding:0 0 150px;}
#main-1 .main1TM .sermonBG{display: inline-block;float: left;width: 54%;position:relative;}
#main-1 .main1TM .sermonBG a .sermonPLAY{position: absolute;border-radius: 50%;display: inline-flex;
width: 100px;height: 100px;background-color: #C83C40;right: 5%;bottom: 0;transform: translate(0,50%);
flex-wrap: nowrap;justify-content: center;align-items: center;}
#main-1 .main1TM .sermonM{display: inline-block;float: left;width: 42%;}
#main-1 .main1TM .sermonM .sermonMPLAY{display:inline-flex;gap:10px;}
#main-1 .main1TM .sermonM > a:nth-child(1) h1{margin: 0;font-size: 46px;width: 100%;color:#fff;
word-break: break-word;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;float: left;}
#main-1 .main1TM .sermonM > a:nth-child(1) h5{margin: 0;line-height: 1.5;font-size: 42px;color:#867762;padding:0 0 35px;}
#main-1 .main1TM .sermonM .sermonMPLAY .Live{ position: relative;border: 3px solid #fff;border-radius: 15px;display:inline-block;background-color:#fff;}
#main-1 .main1TM .sermonM .sermonMPLAY .Live h1{display: inline-block;font-size: 20px;line-height: 1.5;font-weight: bold;margin:0;
color: #fff;position: absolute;top: 50%;left: 0;text-align: center;width: 100%;transform: translate(0,-50%);}
#main-1 .main1TM .sermonM .sermonMPLAY .Weekend{padding: 57px;position: relative;border: 3px solid #fff;border-radius: 15px;display:inline-block;}
#main-1 .main1TM .sermonM .sermonMPLAY .Weekend:before{background-color:#fff;}
#main-1 .main1TM .sermonM .sermonMPLAY .Weekend:hover h1{color:#000; transition:0.3s all ease;}
#main-1 .main1TM .sermonM .sermonMPLAY .Weekend h1{display: inline-block;font-size: 20px;line-height: 1.3;font-weight: bold;margin:0;
color: #fff;position: absolute;top: 50%;left: 0;text-align: center;width: 100%;transform: translate(0,-50%);}
#main-1 .main1BM .main1BT{margin: 0 0 45px;}
#main-1 .main1BM .main1BT h1{margin: 0;line-height: 2;font-size: 48px;color:#A4A4A4;}
#main-1 .main1BM .main1BT h1 strong{color:#000;}
#main-1 .main1BM .NewsM{width:100%;display: inline-flex;gap:var(--gap3);padding: 0 0 115px;}
#main-1 .main1BM .NewsM a{width: calc(100% / 3);display: inline-block;}
#main-1 .main1BM .NewsM a:hover .more{animation: spinspin 1s ease-out; -webkit-animation: spinspin 1s ease-out;}
#main-1 .main1BM .NewsM .NewsBOX .NewsSBOX{width: 78%;position: relative;margin: -40px 0 0;}
#main-1 .main1BM .NewsM .NewsBOX .NewsSBOX .NewsT{}
#main-1 .main1BM .NewsM .NewsBOX .NewsSBOX .NewsT h7{font-size: 20px;display: inline-block;margin: 0;line-height: 1.5;color:#CE5A5C;}
#main-1 .main1BM .NewsM .NewsBOX .NewsSBOX .NewsT h1{margin: 0;font-size: 32px;line-height: 1.5;color:#000;}
#main-1 .main1BM .NewsM .NewsBOX .NewsSBOX .NewsT h5{font-size: 17px; margin: 0;color:#000;line-height:1.5;}
#main-1 .main1BM .NewsM .NewsBOX .NewsSBOX .more{position: absolute;right: 15%;top: 0%;}
.slider .slider-dots{bottom:10% !important;}
#main-2{background-repeat:no-repeat;background-position:center;background-size:cover;}
#main-2 .main2T h2{margin: 0;text-align: center;font-size: 40px;letter-spacing: 5px;line-height: 2;padding:70px 0 0;color:#2279ED;}
#main-2 .main2T h1{margin: 0;text-align: center;font-size: 60px;font-weight:bold;color:#131963;}
#main-2 .main2T h5{margin: 0;text-align: center;font-size: 25px;line-height:3;color:#111961;}
#main-2 .main2M{display: inline-flex;width: 100%;justify-content: center;gap: 40px;padding: 75px 0 150px;}
#main-2 .main2M a{padding: 100px;position: relative;display: inline-block;border-radius: 50%;background-color:rgba(42, 67, 161, .6);}
#main-2 .main2M a:hover{position:relative;
animation-name: updown;animation-duration:1s;animation-duration: leaner;animation-iteration-count:infinite;animation-direction:alternate;animation-fill-mode: forwards;}
#main-2 .main2M .view-more:before{background-color:rgba(228, 171, 72, .6);}
#main-2 .main2M a h1{position: absolute;top: 50%;margin:0;font-size:32px;color:#fff;font-weight:bold;
text-align: center;width: 100%;border: none;display: block;transform: translate(-50%,-50%);}

#main-3{position: relative;width: 100%;overflow: hidden;height: 620px;display: inline-block;float: left;}
#main-3 .main3M{overflow:hidden;padding: 120px 0 0;}
#main-3 .main3M > .container{position: absolute;right: -10%;top: 50%;transform: translate(0,-50%);}
#main-3 .main3M .main3L{overflow:hidden;position:relative;}
#main-3 .main3M .main3L .main3S{padding:85px 0 10px;}
#main-3 .main3M .main3L .main3S .swiper-slide{box-shadow: 7px 7px 5px rgba(0,0,0,0.3);}
#main-3 .main3M .main3L .main3S .swiper-slide a{display: inline-block;width: 100%;overflow: hidden;float:left;}
#main-3 .main3M .main3L .main3S .swiper-slide a .galleryIMG {display: inline-flex;width: 100%;
position: relative;height: 270px;overflow: hidden;
margin: 0 auto;background-size: cover;background-position: 50% 50%;background-origin: border-box;background-repeat: no-repeat;align-items: center;justify-content: center;}
#main-3 .main3M .main3L .main3S .swiper-slide:hover .galleryIMG{transform:scale(1.2); transition:0.3s all ease;}
#main-3 .main3M .main3L .main3S .swiper-slide a .galleryIMG .galleryT h1{margin: 0;line-height: 1.5;font-size: 24px;word-wrap: break-word;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;overflow:hidden;width: 100%;text-align: center;}
#main-3 .main3M .main3L .main3S .swiper-slide a .galleryIMG .galleryT h5{margin: 0;font-size: 20px;}
#main-3 .main3M .main3L .main3S .swiper-slide .galleryT{opacity: 0;width: 100%;height: 100%;display: inline-flex;color:#fff;
align-items: center;justify-content: center;flex-direction: column;}
#main-3 .main3M .main3L .main3S .swiper-slide:hover .galleryT{opacity:1; transition:0.3s all ease;background-color:rgba(0,0,0,.5);}

#main-3 .main3M .main3L .main3P{display: inline-flex;justify-content: space-between;gap: 15px;position: absolute;top:10%;}
#main-3 .main3M .main3L .main3P .swiper-pagination-bullet-active{background-color:#fff!important;width:40px!important; transition:0.3s all ease;}
#main-3 .main3M .main3L .main3P .swiper-pagination-bullet{background-color:#000;width:20px;height:20px;opacity:1;border-radius:15px; transition:0.3s all ease;}

#main-3 .main3M .main3R{text-decoration:none;color:inherit;}
#main-3 .main3M .main3R h1{margin: 0;font-size: 58px;line-height: 1.5;color:#2E4161;}
#main-3 .main3M .main3R h2{margin: 0;color: #7F685C;font-size: 54px;}
#main-3 .main3M .main3R h5{margin: 0;font-size: 24px;line-height: 1.2;color:#2e4161;}

.view-more {
    display: inline-block;
    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: 1;
    font-weight: 100;
}

.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: 135%;height: 105%;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;}

@media(min-width:1440px) {
    .container {
        width: 1440px;
    }
}

@media (max-width:1699px) {
	#main-3 .main3M > .container{right: -20%;}
}

@media (max-width:1499px) {
	#main-1 .main1TM{margin: -25px 0 0;padding: 0 0 100px;}
	#main-1 .main1TM .sermonM .sermonMPLAY{gap:5px;}
	#main-1 .main1TM .sermonM .sermonMPLAY .Live{padding:20px;}
	#main-1 .main1TM .sermonM .sermonMPLAY .Weekend{padding:50px;}
	#main-2 .main2M a{padding:90px;}
	#main-2 .main2M a h1{font-size:27px;}
}
@media (max-width:1199px) {
	:root {--gap1: 30px;}
	#main-slider .mainQM a {padding: 64.5px;}
	#main-1 .main1TM{flex-direction: column;}
	#main-1 .main1TM .sermonBG{width:100%;text-align:center;}
	#main-1 .main1TM .sermonBG > a > img{width:75%;}
	#main-1 .main1TM .sermonBG a .sermonPLAY{right:15%;}
	#main-1 .main1TM .sermonM{width:90%;}
	#main-1 .main1BM .NewsM .NewsBOX .NewsSBOX{margin: -25px 0 0;}
	#main-2 .main2M{flex-wrap: wrap;gap:30px;}
	#main-2 .main2M a{padding:115px;}
	#main-3 .main3M > .container {right: -25%;}

}

@media (max-width:992px) {
	:root {--gap1: 20px;--gap2: 30px;}
	#main-slider .mainQM {top: 75%;}
	#main-slider .mainQM a {padding: 52.5px;}
	#main-slider .mainQM a .QM h1{font-size:15px;}
	#main-1 .main1TM {padding: 0 0 30px;}
	#main-1 .main1TM .sermonBG > a > img{width:85%;}
	#main-1 .main1TM .sermonBG a .sermonPLAY{right:10%;}
	#main-1 .main1TM .sermonM > a:nth-child(1) h1{font-size:32px;}
	#main-1 .main1TM .sermonM > a:nth-child(1) h5{font-size:27px;padding: 0 0 20px;}
	#main-1 .main1TM .sermonM .sermonMPLAY .Live h1,
	#main-1 .main1TM .sermonM .sermonMPLAY .Weekend h1{font-size:17px;}
	#main-1 .main1BM .main1BT {margin: 0 0 20px;}
	#main-1 .main1BM .main1BT h1{font-size:32px;}
	#main-1 .main1BM .NewsM .NewsBOX .NewsSBOX .NewsT h7{font-size:17px;}
	#main-1 .main1BM .NewsM .NewsBOX .NewsSBOX .NewsT h1{font-size:24px;}
	#main-1 .main1BM .NewsM .NewsBOX .NewsSBOX .NewsT h5{font-size:15px;}
	#main-1 .main1BM .NewsM {padding: 0 0 50px;}
	#main-2 .main2T h2{font-size:27px;}
	#main-2 .main2T h1{font-size:32px;}
	#main-2 .main2T h5{font-size:20px;}
	#main-2 .main2M{padding: 20px 0 30px;}
	#main-2 .main2M a {padding: 85px;}
	#main-2 .main2M a h1 {font-size: 20px;}
	#main-3{height: 475px;}
	#main-3 .main3M .main3R h2{font-size:27px;}
	#main-3 .main3M .main3R h1{font-size:32px;}
	#main-3 .main3M .main3R h5{font-size:20px;}
	#main-3 .main3M .main3L .main3S .swiper-slide a .galleryIMG{height: 235px;}
	#main-3 .main3M > .container {right: -30%;}
}

@media (max-width:767px) {
	#main-slider .mainQM{display:none;}
	#main-1 .main1TM .sermonM {width: 100%;}
	#main-1 .main1TM .sermonM > a:nth-child(1) h1{font-size:24px;}
	#main-1 .main1TM .sermonM > a:nth-child(1) h5{font-size:20px;padding: 0 0 20px;}
	#main-1 .main1TM .sermonM .sermonMPLAY {gap: 10px;}
	#main-1 .main1TM .sermonM .sermonMPLAY .Live{padding:5px;}
	#main-1 .main1TM .sermonM .sermonMPLAY .Weekend{padding:35px;}
	#main-1 .main1TM .sermonM .sermonMPLAY .Live h1, 
	#main-1 .main1TM .sermonM .sermonMPLAY .Weekend h1{font-size:15px;}
	#main-1 .main1TM .sermonBG a .sermonPLAY{width:75px;height:75px;}
	#main-1 .main1BM .main1BT h1{font-size:24px;}
	#main-1 .main1BM .NewsM{flex-direction: column;}
	#main-1 .main1BM .NewsM a {width: calc(100% / 1);}
	#main-1 .main1BM .NewsM .NewsBOX .NewsSBOX .NewsT h1{font-size:20px;}
	#main-2 .main2T h2{font-size:20px;padding: 20px 0 0;}
	#main-2 .main2T h1{font-size:24px;line-height: 2;}
	#main-2 .main2T h5{font-size:17px;line-height: 1.5;}
	#main-2 .main2M {padding: 20px 0 20px;gap: 15px;}
	#main-2 .main2M a {padding: 50px;}
	#main-2 .main2M a h1 {font-size: 15px;}
	#main-3 .main3M {padding: 20px 0 0;}
	#main-3 .main3M .main3R h2{font-size:20px;}
	#main-3 .main3M .main3R h1{font-size:24px;}
	#main-3 .main3M .main3R h5{font-size:17px;}
	#main-3 .main3M > .container{right: inherit;transform: inherit;position:relative;}
}

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