﻿@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%;}
.slider .slider-dots .each-dot{width:20px!important;height:20px!important;background-color:rgba(255,255,255,.5)!important;transition:0.3s all ease;border:none!important;}
.slider .slider-dots .each-dot.active{width:55px!important;height:20px!important;background-color:#fff!important;transition:0.3s all ease;border-radius:50px;border:1px solid #fff!important;}
.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;}
.headerT .white{background-color: rgba(0, 0, 0, .3) !important;}



#main-1{display: inline-flex;width: 100%;flex-direction: row;padding: 0 0 55px;background-color:#fff;}
#main-1 .main1R{width: 50%;display: grid;grid-template-columns: 1fr 1fr;position:relative;}
#main-1 .main1R .intro{display: inline-flex;flex-direction: column;align-items: center;border: 1px solid #EEEEEE;background-color:#fff;
justify-content: flex-start;padding-top: 75px;text-decoration:none;color:inherit;}
#main-1 .main1R .intro .introIMG{position:relative;padding:44px;display:inline-block;}
#main-1 .main1R .intro .introIMG .on,
#main-1 .main1R .intro .introIMG .off{background-repeat:no-repeat;background-position:center;background-size:cover;position:absolute;width:100%;height:100%;top:0;right:0;}
#main-1 .main1R .intro h1{margin: 0;font-size: 24px;line-height: 2.5;font-weight: bold;letter-spacing: 1px;}
#main-1 .main1R .intro h3{margin: 0;padding-bottom: 30px;font-size: 18px;line-height: 1.3;word-break: keep-all;color:#9c9c9c;}
#main-1 .main1R .intro .introBTN{padding: 22.5px 72.5px;position: relative;display: inline-block;border: 1px solid rgba(230,230,230,1);border-radius: 50px;}
#main-1 .main1R .intro .introBTN:before{background-color:#9b6d55;}
#main-1 .main1R .intro .introBTN h5{position: absolute;top: 50%;right:50%;text-align: center;border: none;display: block;transform: translate(50%,-50%);margin:0;font-size:20px;color:#848484;}
#main-1 .main1R .intro:hover .introBTN{border:1px solid rgba(0,0,0,0);}
#main-1 .main1R .intro:hover .introBTN h5{color:#fff; transition:0.3s all ease;}
#main-1 .main1L{width:50%;text-decoration:none;color:inherit;border-bottom:1px solid #EEEEEE;}
#main-1 .main1L .sermonBG{height:535px;position:relative;background-repeat: no-repeat;background-position: center;background-size: cover;}
#main-1 .main1L .sermonBG .sermonPLAY{padding: 24px 35px;position: absolute;top: 50%;right: 50%;text-align: center;transform: translate(50%,-50%);}
#main-1 .main1L .sermonBG .sermonPLAY .on,
#main-1 .main1L .sermonBG .sermonPLAY .off{background-repeat:no-repeat;background-position:center;background-size:cover;position:absolute;width:100%;height:100%;top:0;right:0;}
#main-1 .main1L .sermonBT{height: 245px;display: inline-flex;width: 100%;align-items: center;justify-content: center;background-color:#fff;}
#main-1 .main1L .sermonBT .sermonBTT{text-align:center;}
#main-1 .main1L .sermonBT .sermonBTT h2{margin: 0;font-size: 20px;letter-spacing: 0px;color: #a5856e;display: inline-flex;gap: 10px;align-items: baseline;}
#main-1 .main1L .sermonBT .sermonBTT h2 span:nth-child(1){font-size:27px;}
#main-1 .main1L .sermonBT .sermonBTT h1{margin: 0;font-size: 36px;font-weight: bold;letter-spacing: 1px;line-height: 2.5;color:#000;word-break:keep-all;}
#main-1 .main1L .sermonBT .sermonBTT h5{display: inline-flex;align-items: center;justify-content: center;gap: 10px;font-size: 15px;margin:0;}
#main-1 .main1L .sermonBT .sermonBTT h5 span{font-size:20px;color:#666666;}
#main-1 .main1L .sermonBT .sermonBTT h5{}

#main-2{padding: 60px 0 70px;background-color:#F9F9F9;}
#main-2 .main2M .main2T{}
#main-2 .main2M .main2T h1{margin: 0;font-size: 28px;color: #000;letter-spacing: 1px;}
#main-2 .main2M .main2T hr{display: inline-block;width: 3%;margin: 20px 0 45px;border: 1px solid #000;}
#main-2 .main2M{position:relative;}
#main-2 .main2M .GalleryS{overflow:hidden;}
#main-2 .main2M .GalleryS .galleryIMG{display: block;position: relative;height: 200px;
overflow: hidden;background-color: #000;margin: 0 auto;background-size: cover;background-position: 50% 50%;
background-origin: border-box;background-repeat: no-repeat;}
#main-2 .main2M .GalleryS .galleryT{position: absolute;height: 100%;width: 100%;
background: rgba(0,0,0,0.5);z-index: 3;top: 0;left: 0;display: none;}
#main-2 .main2M .GalleryS .galleryT h1{font-size: 20px;margin: 0;color: #fff;position: absolute;
top: 40%;text-align: left;left: 0%;width: 100%;border: none;display: block;transform: translate(0,-50%);text-align:center;}
#main-2 .main2M .GalleryS .galleryT h5{font-size: 17px;color: #fff;margin: 0;position: absolute;
top: 55%;text-align: left;left: 0%;width: 100%;border: none;display: block;transform: translate(0,-50%);text-align:center;}
#main-2 .main2M .galleryP{position: absolute;z-index: 2;top: 50%;text-align: center;left: -5%;
border: none;display: block;transform: translate(0,-50%);}
#main-2 .main2M .galleryN{position: absolute;z-index: 999;top: 50%;text-align: center;right: -5%;
border: none;display: block;transform: translate(0,-50%);}

#main-3{background-color:#F4F0EC;}
#main-3 .main3M{display: grid;gap: 40px;padding: 100px 0;width: 100%;grid-template-columns: 1fr 1fr 1fr;}
#main-3 .main3M .noteM{padding: 50px;height: 390px;overflow: hidden;position:relative;background-color:#fff;}
#main-3 .main3M .noteM .noteHF{display: inline-block;position: absolute;right: 0;top: 0;}
#main-3 .main3M .noteM .noteHF div{padding: 25px;display: inline-block;background-color: #9b6d55;background-repeat: no-repeat;background-position: center;}
#main-3 .main3M .noteM .noteT{}
#main-3 .main3M .noteM .noteT h1{margin: 0;font-size: 32px;font-weight: bold;letter-spacing: 0px;color:#000;}
#main-3 .main3M .noteM .noteT hr{border: 1px solid #000;width: 10%;margin: 20px auto 20px 0;}
#main-3 .main3M .noteM ul{}
#main-3 .main3M .noteM ul a{line-height: 2.2;}
#main-3 .main3M .noteM ul a li{font-size: 24px;text-align: left;word-wrap: break-word;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;overflow: hidden;color:#000;}
#main-3 .main3M .noteM ul a:hover li{font-weight:bold; transition:0.3s all ease;}




.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;}

a:hover .view-more: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) {
}

@media (max-width:1499px) {
    #main-1 .main1L .sermonBG{height:inherit;}
    #main-1 .main1L .sermonBT{height: inherit;padding: 30px 0;}
    #main-1 .main1L .sermonBT .sermonBTT h1{line-height:1.5;}
    #main-1 .main1R .intro{padding:0;justify-content: center;}
}

@media (max-width:1199px) {
    #main-1{flex-direction: column;}
    #main-1 .main1L,
    #main-1 .main1R{width:100%;}
    #main-1 .main1R .intro{padding: 20px 0;}
    #main-3 .main3M{grid-template-columns: 1fr;}
}

@media (max-width:992px) {
    #main-slider{padding:70px 0 0;}
}

@media (max-width:767px) {
    #main-slider{padding:60px 0 0;}
    #main-1 .main1L .sermonBT .sermonBTT h2 span:nth-child(1){font-size:17px;}
    #main-1 .main1L .sermonBT .sermonBTT h2{font-size:15px;}
    #main-1 .main1L .sermonBT .sermonBTT h1{font-size:24px;}
    #main-1 .main1L .sermonBT .sermonBTT h5{font-size:10px;}
    #main-1 .main1L .sermonBT .sermonBTT h5 span{font-size:15px;}
    #main-1 .main1R .intro{padding:15px 0;}
    #main-1 .main1R .intro h1{font-size:20px;line-height: 2;}
    #main-1 .main1R .intro h3{font-size:15px;text-align:center;padding-bottom: 15px;}
    #main-1 .main1R .intro .introBTN {padding: 15.5px 60.5px;}
    #main-1 .main1R .intro .introBTN h5{font-size:15px;}
    #main-1 .main1R .intro .introIMG{padding:35px;}
    #main-3 .main3M{padding: 20px 0;}
    #main-3 .main3M .noteM{padding:20px;height: 250px;}
    #main-3 .main3M .noteM .noteT hr{margin: 10px auto 10px 0;}
    #main-3 .main3M .noteM .noteT h1{font-size:20px;}
    #main-3 .main3M .noteM ul a li{font-size:17px;}
    #main-2{padding:20px 0;}
    #main-2 .main2M .main2T h1{font-size:20px;}
    #main-2 .main2M .main2T hr {margin: 10px 0 20px;}
}

@media (max-width:320px) {
}
