﻿@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');
}

@font-face {
    font-family: 'nanumsquareneo-brg';
    src: url('fonts/nanumsquareneo-brg.ttf') format('truetype');
}
@font-face {
    font-family: 'nanumsquareneo-cbd';
    src: url('fonts/nanumsquareneo-cbd.ttf') format('truetype');
}
@font-face {
    font-family: 'nanumsquareneo-deb';
    src: url('fonts/nanumsquareneo-deb.ttf') format('truetype');
}
@keyframes rotate {
    100% {
        transform: rotate(360deg);
    }
}
@keyframes move {
    from {
        transform: translateX(20px) 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: 15px;
    }
}

@-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';}

.nanumsquareneoBrg{font-family: 'nanumsquareneo-brg';}
.nanumsquareneoCbd{font-family: 'nanumsquareneo-cbd';}
.nanumsquareneoDeb{font-family: 'nanumsquareneo-deb';}

/* 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;}

#gate-logo{width: 100%;text-align: center;padding: 30px 0;background-color:#E8EFF5;}
#gate-slider{padding-bottom:20px;background-color:#E8EFF5;}
#gate-slider #SliderS {position:relative;overflow:hidden;border-radius:25px;}
#gate-slider #SliderS .contentSlideWrapper .contentSlide .each-img{margin:0;border-radius: 25px;}
#gate-slider #SliderS .swiper-container-horizontal > .swiper-pagination-bullets { position:relative;top:0; }
#gate-slider #SliderS .swiper-pagination-bullet { width: 30px; height: 5px; display: inline-block; background: #000; opacity: 0.2;border-radius: unset; }
#gate-slider #SliderS .swiper-pagination-bullet-active { opacity: 1; background: #000; }
#gate-slider #SliderS .swiper-button-prev, #gate-slider #SliderS .swiper-button-next {margin-top:unset; width:4%; height:12%;}
#gate-slider #SliderS .swiper-button-prev { background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); }
#gate-slider #SliderS .swiper-button-next { background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E"); }
/*#gate-slider #SliderS .swiper-button-prev.swiper-button-disabled, #gate-slider #SliderS .swiper-button-next.swiper-button-disabled {opacity: 1;cursor: auto;pointer-events: auto;}*/

#gate-1{padding-bottom:0px;background-color:#E8EFF5;}
#gate-1 .gate1M{display: inline-flex;gap: 20px;width: 100%;  padding-bottom:20px}
#gate-1 .gate1M .home{background-color: #F4A767;width: 37%;height: 215px;border-radius: 25px;}

#gate-1 .gate1M .home .homeM{padding: 35px 30px;height: 100%;width:100%;display: inline-flex;flex-direction: column;align-items: baseline;justify-content: space-between;}
#gate-1 .gate1M .home .homeM h1{margin: 0;font-size: 27px;font-weight: bold;letter-spacing: 0px;line-height: 1.5;color:#fff;}
#gate-1 .gate1M .home .homeM h5{margin: 0;line-height: 1.5;display: inline-flex;align-items: baseline;gap: 5px;color:#fff;font-size: 15px;font-weight: bold;letter-spacing: 0px;}
#gate-1 .gate1M .home .homeM h5 img{}
#gate-1 .gate1M .home:hover .homeM h5 img{animation: move 1.5s ease-in-out infinite alternate-reverse;}



#gate-1 .gate1M .gido{background-color: #8BBEE5;width: 37%;height: 150px;border-radius: 25px;}

#gate-1 .gate1M .gido .homeM{padding: 27px 30px;height: 100%;width:100%;display: inline-flex;flex-direction: column;align-items: baseline;justify-content: space-between;}
#gate-1 .gate1M .gido .homeM h1{margin: 0;font-size: 27px;font-weight: bold;letter-spacing: 0px;line-height: 1.5;color:#fff;}
#gate-1 .gate1M .gido .homeM h5{margin: 0;line-height: 1.5;display: inline-flex;align-items: baseline;gap: 5px;color:#fff;font-size: 15px;font-weight: bold;letter-spacing: 0px;}
#gate-1 .gate1M .gido .homeM h5 img{}
#gate-1 .gate1M .gido:hover .homeM h5 img{animation: move 1.5s ease-in-out infinite alternate-reverse;}






#gate-1 .gate1M .sermon{background-color: #0C2D65;width: 63%;height: 215px;padding: 35px 30px;border-radius: 25px;}
#gate-1 .gate1M .sermon .sermonM{width:100%;height:100%;display: inline-flex;flex-direction: column;align-items: baseline;justify-content: space-between;position:relative;}
#gate-1 .gate1M .sermon .sermonM h1{margin: 0;font-size: 27px;font-weight: bold;letter-spacing: 0px;line-height: 1.5;color:#fff;}
#gate-1 .gate1M .sermon .sermonM h1 img{position:absolute;right:0;bottom:0;}
#gate-1 .gate1M .sermon .sermonM h5{margin: 0;line-height: 1;display: inline-flex;align-items: baseline;gap: 5px;color:#fff;font-size:20px;}
#gate-1 .gate1M .sermon:hover .sermonM h1 img{animation: rotate 1.5s linear infinite;transform-origin: 50% 50%;}



#gate-1 .gate1M .youtube{background-color: #738199;width: 63%;height:150px;padding: 27px 30px;border-radius: 25px;}
#gate-1 .gate1M .youtube .sermonM{width:100%;height:100%;display: inline-flex;flex-direction: column;align-items: baseline;justify-content: space-between;position:relative;}
#gate-1 .gate1M .youtube .sermonM h1{margin: 0;font-size: 27px;font-weight: bold;letter-spacing: 0px;line-height: 1.5;color:#fff}
#gate-1 .gate1M .youtube .sermonM h1 img{position:absolute;right:0;bottom:0;}
#gate-1 .gate1M .youtube .sermonM h5{margin: 0;line-height: 1;display: inline-flex;align-items: baseline;gap: 5px;color:#fff;font-size:20px;}
#gate-1 .gate1M .youtube:hover .sermonM h1 img{animation: rotate 1.5s linear infinite;transform-origin: 50% 50%;}





#gate-2{padding-bottom:20px;background-color:#E8EFF5;}
#gate-2 .gate2M{display: grid;grid-template-columns: 1fr 1fr 1fr ;padding: 30px 15px;gap: 20px  10px;background-color: #fff;border-radius: 20px;}
#gate-2 .gate2M .quickHF{display: inline-flex;align-items: center;flex-direction: column;justify-content: center;color:#000;text-decoration:none;}
#gate-2 .gate2M .quickHF:hover{animation-name: updown;animation-duration: 1s;animation-duration: leaner;animation-iteration-count: infinite;animation-direction: alternate;animation-fill-mode: forwards;position:relative;}
#gate-2 .gate2M .quickHF h1{margin: 0;font-size: 19px;line-height: 1.5;}

#gate-3{padding-bottom:30px;background-color:#E8EFF5;}
#gate-3 .gate3M{display: grid;grid-template-columns: 1fr 1fr 1fr;gap: 15px;}
#gate-3 .gate3M .subPage{padding: 20px;height: 130px;display: inline-flex;flex-direction: column;justify-content: space-between;align-items: flex-end;width: 100%;border-radius:25px;}
#gate-3 .gate3M .subPage:hover{animation-name: updown;animation-duration: 1s;animation-duration: leaner;animation-iteration-count: infinite;animation-direction: alternate;animation-fill-mode: forwards;position:relative;}
#gate-3 .gate3M .subPage h1{margin:0;font-size: 20px;letter-spacing:0px;width:100%;color:#fff;}

#gate-footer{padding: 55px 0;text-align: center;background-color:#000;}
#gate-footer .gatefooterM{}
#gate-footer .gatefooterM ul{}
#gate-footer .gatefooterM ul li{font-size:13px; line-height:1.5;color:#fff;}

.bcolor1{background-color: #8BBEE5;}
.bcolor2{background-color: #0C2D65;}
.bcolor3{background-color: #738199;}
.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:610px) {
    .container {
        width: 610px;
    }
}

@media (max-width:1699px) {
}

@media (max-width:1499px) {
}

@media (max-width:1199px) {
}

@media (max-width:992px) {


}

@media (max-width:767px) {
#gate-slider{padding-bottom: 10px}
#gate-logo{width: 100%;text-align: center;padding: 20px 0;background-color:#E8EFF5;}
#gate-logo img{width: 160px;}
#gate-1 .gate1M{gap:10px; padding-bottom: 10px;}
    #gate-1 .gate1M .home{height: 130px;}
    #gate-1 .gate1M .home .homeM{padding:15px;}
    #gate-1 .gate1M .home .homeM h1{font-size:20px;}
    #gate-1 .gate1M .home .homeM h5{font-size:13px;}

    #gate-1 .gate1M .gido .homeM{padding:15px;}
    #gate-1 .gate1M .gido .homeM h1{font-size:20px;}
    #gate-1 .gate1M .gido .homeM h5{font-size:13px;}

    #gate-1 .gate1M .sermon{padding:15px;height: 130px;}
    #gate-1 .gate1M .sermon .sermonM h1{font-size:20px;}
    #gate-1 .gate1M .sermon .sermonM h5{font-size:13px;}

    #gate-1 .gate1M .youtube{padding:15px;height: 130px;}
    #gate-1 .gate1M .youtube .sermonM h1{font-size:20px;}
    #gate-1 .gate1M .youtube .sermonM h5{font-size:13px;}


    #gate-2 .gate2M .quickHF h1{font-size:13px;}
    #gate-3 .gate3M .subPage{padding:15px;}
    #gate-3 .gate3M .subPage h1{font-size:15px;}
	#gate-3 .gate3M {gap:10px;}
    #gate-footer{padding:20px 0;}
}

@media (max-width:320px) {
}
