@keyframes aaa {
    from { transform: rotate(0deg); }

    to { transform: rotate(360deg); }
}

@keyframes bbb {
    from { top: -10px }

    to { top: -2px; }
}

a { color: black; text-decoration: none; transition: transform all .3s linear; }
a:hover { color: black; text-decoration: none; }
#main { width: 100%; height: 100%; /*margin-top: 95px;*/ /*background-color: red;*/ }
#section { /*font-family: 'Noto Sans KR', sans-serif;*/ font-family: NanumSquare, sans-serif; width: 100%; margin: 0 auto; overflow: hidden; }
.mainContainer { width: 100%; margin: 0 auto; padding: 3% 0; box-sizing: border-box; background-color: white; }


/*½½¶óÀÌ´õ*/
#main .dimode-slider .slider-dots { bottom: 50px; }
#main .dimode-slider .slider-dots .each-dot { margin: 0 5px; height: 16px; width: 16px; }
#main .dimode-slider .slider-dots .each-dot.active { width: 42px; border-radius: 10px; background: black; border: 1px solid black; }
#main .dimode-slider .slider-wrapper .slick-list .slick-track .slide > div > h1 { font-size: 4.2vw; padding-top: 7%; letter-spacing: 3px; font-weight: bold; text-align: left; font-family: ui-sans-serif; }
#main .dimode-slider .slider-wrapper .slick-list .slick-track .slide { width: 100% !important; }
.move-btn { /*display: none;*/ background: unset !important; }



/*¸Ç óÀ½ Èò ºÎºÐ*/
.sermon { padding: 0%; background-color: #9AA9B0; }
.sermon-bottom {  width: 100%; height: auto; padding: 0; text-align: center; }
.today_sermon { padding: 5% 0; display: flex; flex-wrap: nowrap; align-items: center; /*width: 1500px;*/ width: 80vw; height: auto; margin: auto; }

.sb-1 { text-align: left; padding: 3%; color: white; /*line-height: 3;*/ height: 90%; height: 22.5vw; }
.sb-1 .sermon-content { position: absolute; bottom: 5%; width: 100%; }
.sb-1 a { color: white; }
.sb-1 h4 { font-size: 22px; }
.sb-1 h2 { font-size: 40px; margin: 2.3vw 0 1vw; }
.sb-1 p { font-size: 22px; }
.sb-1 h2, .sb-1 h4, .sb-1 p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.sb-2 { position: relative; padding: 0 !important; /*height: calc(216 / 320 * 100%);*/ }
.sb-2 > a { position: relative; display: block; height: 22.5vw; }
.sb-2 .sermon-thumbnail { transition: all 0.3s ease-out; top: 50%; position: absolute; transform: translate(-50%, -50%); left: 50%; width: 100%; object-fit: cover; max-width: unset; height: 22.5vw; }
.sb-2 .sermon-youtube { transition: all 0.3s ease-out; bottom: 0; position: absolute; transform: translate(-50%, 50%); right: 0; }
.sb-2 .sermon-thumbnail:hover { /*width: 105%; height: 23.625vw;*/ /*transform:scale(1.05);*/ /*z-index:2;*/ }
.sb-2 .sermon-youtube:hover { }

.sb-3 {position: absolute; top: 0; right: 0; }
.sb-3 > a { display: inline-block; position: relative; float: left; transition: all 0.3s ease-out; }
.sb-3 > a > p { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); font-size: 22px; line-height: 1.2; font-weight: bold;text-align:center; }
.sb-3 #sermon-more { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
.sb-3 > a:nth-of-type(2) > p { color: white; }
.sb-3 > a:hover { transform: scale(1.05); z-index: 2; }
.sermon-icon { padding: 0% 7%; display: flex; flex-wrap: nowrap; justify-content: space-around; align-items: center; font-weight: bold; }
.sermon-icon > div { padding: 3%; }
.sermon-icon p { }
.sermon-icon h4 { font-weight: bold; }
.sermon-icon > div > a { position: relative; transition: all 0.3s ease-out; }
.sermon-icon > div > a:hover, .si-1 > div > a:hover { transform: translateY(-10px); }
.sermon-icon > div > a > p { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); margin: 0; }

.si-1 { width: 50%; }
.si-2, .si-3, .si-4 { width: 15%; }
.si-2 > a, .si-3 > a, .si-4 > a { margin-bottom: 19.5%; display: block; }
.si-2 > h4, .si-3 > h4, .si-4 > h4 { padding-bottom: 20%; }
.si-1 > div { padding: 1% 5%; display: flex; flex-wrap: nowrap; justify-content: space-around; align-items: center; }
.si-1 > div > a { padding: 3% 5%; position: relative; display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-evenly; transition: all 0.3s ease-out; }
.si-1 > div > a > p { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); margin: 0; }



/*°¶·¯¸®*/
.gallery { height: 550px; padding: 0; }
.gallery .gallery-container { width: 85%; }
.gallery .gallery-container .galleryb .gallery-content { position: relative; transition: 0.4s; }
.gallery .gallery-container .galleryb .gallery-content img { width: 100%; height: 230px; /*box-shadow: 0px 0px 10px #444;*/ /*box-shadow: 0px 0px 15px #646464;*/ background-position: center !important; background-repeat: no-repeat; background-size: cover; }
.gallery .gallery-container .galleryb .gallery-content .gallery-text { position: absolute; top: 50%; left: 50%; visibility: hidden; transform: translate(-50%, -50%); width: 70%; }
.gallery .gallery-container .galleryb .gallery-content .gallery-text > h3 { color: #fff; font-size: 18px; margin: 0; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gallery .gallery-container .galleryb .gallery-content:hover { top: -15px }
.gallery .gallery-container .galleryb .gallery-content:hover img { filter: brightness(0.5); top: -15px }
.gallery .gallery-container .galleryb .gallery-content:hover .gallery-text { visibility: visible; }

/*°°ÀÌ ºÎºÐ*/
.together { width: 100%; height: auto; padding: 0; text-align: center; color: white; position: relative; display: flex; flex-wrap: nowrap; }
.together hr { width: 15%; z-index: 3; position: relative; }
.together h3 { font-size: 36px; font-weight: bold; z-index: 3; position: relative; }
.together p { font-size: 23px; z-index: 3; position: relative; }
.to1 { background: url(../../../Layouts/hyosungchurch_Layout/Images/3_box01_off.jpg) no-repeat; background-position: center !important; }
.to2 { background: url(../../../Layouts/hyosungchurch_Layout/Images/3_box02_off.jpg) no-repeat; background-position: center !important; }
.to3 { background: url(../../../Layouts/hyosungchurch_Layout/Images/3_box03_off.jpg) no-repeat; background-position: center !important; }
.to4 { background: url(../../../Layouts/hyosungchurch_Layout/Images/3_box04_off.jpg) no-repeat; background-position: center !important; }
.blackBox1 { background: url(../../../Layouts/hyosungchurch_Layout/Images/3_box01_on.jpg) no-repeat; background-position: center !important; filter: brightness(0.7); }
.blackBox2 { background: url(../../../Layouts/hyosungchurch_Layout/Images/3_box02_on.jpg) no-repeat; background-position: center !important; filter: brightness(0.7); }
.blackBox3 { background: url(../../../Layouts/hyosungchurch_Layout/Images/3_box03_on.jpg) no-repeat; background-position: center !important; filter: brightness(0.7); }
.blackBox4 { background: url(../../../Layouts/hyosungchurch_Layout/Images/3_box04_on.jpg) no-repeat; background-position: center !important; filter: brightness(0.7); }
.blackBox { display: block; position: absolute; top: 0; left: 0; width: 100%; /*height: 25vw;*/ height: 100%; visibility: hidden; z-index: 1; background-position: center !important; background-size: cover !important; }
.together > a { padding: 8.8% 3%; width: 25%; height: auto; color: white; transition: transform all .7s linear; text-decoration: none; overflow: hidden; background-position: center !important; background-size: cover !important; }
.together > a:hover .blackBox { visibility: visible; }


/*°¶·¯¸® ºÎºÐ*/
.gallery { width: 100%; height: auto; padding: 3% 0 5%; text-align: left; display: flex; flex-wrap: nowrap; }
.gallery-container > p { font-size: 28px; color: #888888; font-weight: bold; padding-left: 15px; }
.gallery-container > h1 { font-size: 48px; margin: 0 0 2%; font-weight: bold; padding-left: 15px; }
.gallery-container > div { padding: 3% 0 0%; position: relative; display: block; }
.gallery-container > div > h3 { font-size: 22px; font-weight: bold; }
.gallery-container > div > div { font-size: 18px; color: #585858; line-height: 1.7; }
.gallery-container > div > a { margin-top: 3%; display: block; width: max-content; }
.gallery-container > div > a > img:nth-of-type(2) { display: none; position: absolute; bottom: 0; left: 0; }
.gallery-container > div > a:hover > img:nth-of-type(2) { display: initial; }

.main2Content { padding: 0; display: flex; flex-wrap: wrap; text-align: center; }


.worship .worship-container { width: 70%; margin: auto; display: flex; justify-content: center; align-items: baseline; }
.worship .worship-container > a {width:20%;}
.worship .worship-container > a > .worship-wrap { text-align: center;transition:.3s; }
.worship .worship-container > a > .worship-wrap:hover { transform: translateY(-15px); }
.worship .worship-container > a > .worship-wrap h3 { margin: 0 0 30px; font-weight:bold;}
.worship .worship-container .worship-wrap-bottom { position: relative; }
.worship .worship-container .worship-wrap-bottom p, .worship .worship-container .worship-wrap-bottom .worship-img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);font-weight:bold; }

.notice { height: 550px; padding: 0; background-color: #F6F8F7; width: 100%; height: auto; padding: 3% 0 5%; text-align: left; display: flex; flex-wrap: nowrap; }
.notice .notice-container {width: 80%;margin:auto; }
.notice .notice-title { width: 100%; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #000; margin-bottom: 15px; }
.notice .notice-title > h3 { font-size: 26px; font-weight: bold; }
.notice .galleryList { width: 100%; }
.notice .galleryList .galleryList-slide { border-bottom: solid 1px #C5C7C6; padding:10px 0;}
.notice .galleryList a { display: flex; justify-content: space-between; align-items: center; }
.notice .galleryList a p { margin: 0; color: #555555; white-space:nowrap; text-overflow:ellipsis;overflow:hidden;}
.notice .galleryList a p:nth-of-type(1) {width:60%;text-align:left; }
.notice .galleryList a p:nth-of-type(2){width:30%;text-align:right;}

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

@media(max-width:1499px) and (min-width:1200px) {
    .container{width:1170px;}

    .sb-3 {width:30%;}
    .sb-3 > a { width: 50%; }
    .sb-3 #sermon-more { width:50%;}
    .sb-3 > a > p { font-size: 12px; width: 100%; }
    .sb-1 h2 { font-size: 30px; }
    .sb-1 h4, .sb-1 p { font-size: 18px; }
    .sb-2 .sermon-youtube { width: 59px; }


    .gallery-container > p { font-size: 19px; }
    .gallery-container > h1 { font-size: 40px; }
    .gallery .gallery-container .galleryb .gallery-content img { height: 13vw; }
}

@media(max-width:1199px) and (min-width:992px) {
    .today_sermon { /*height: 440px;*/ }
    .sb-1 .sermon-content { bottom: 10%; }
    .sb-1 h2 { font-size: 28px; }
    .sb-1 h4 { font-size: 17px; }
    .sb-1 p { font-size: 15px; }
    .sb-3 a img { width: 125px; }
    .sb-3 { width: 30%; }
    .sb-3 > a { width: 50%; }
    .sb-3 #sermon-more { width: 50%; }
    .sb-3 > a > p { font-size: 12px; width: 100%; }
    .sb-1 h2 { font-size: 22px; }
    .sb-1 h4, .sb-1 p { font-size: 15px; margin: 0; }
    .sb-2 .sermon-youtube { width: 48px; }

    .together h3 { font-size: 30px; }
    .together p { font-size: 19px; }

    .worship .worship-container { width: 80%; }
    .worship .worship-container > a > .worship-wrap h3 { font-size: 21px; margin: 0 0 15px; }

    .gallery-container > p { font-size: 16px; }
    .gallery-container > h1 { font-size: 34px; }
    .gallery .gallery-container .galleryb .gallery-content img { height: 13vw; }
}

@media(max-width:991px) and (min-width:768px) {
    .today_sermon { /*height: 440px;*/ }
    .sb-1 .sermon-content { bottom: 10%; }
    .sb-1 h2 { font-size: 28px; }
    .sb-1 h4 { font-size: 17px; }
    .sb-1 p { font-size: 15px; }
    .sb-3 a img { width: 125px; }
    .sb-3 { width: 30%; }
    .sb-3 > a { width: 50%; }
    .sb-3 #sermon-more { width: 50%; }
    .sb-3 > a > p { font-size: 10px; width: 100%; }
    .sb-1 h2 { font-size: 20px; }
    .sb-1 h4, .sb-1 p { font-size: 13px; margin: 0; }
    .sb-2 .sermon-youtube { width: 48px; }


    .together h3 { font-size: 27px; }
    .together p { font-size: 17px; }

    .worship .worship-container { width: 80%; }
    .worship .worship-container > a > .worship-wrap h3 { font-size: 18px; margin: 0 0 15px; }
    .worship .worship-container .worship-wrap-bottom > img:nth-of-type(1) {width:70%;}
    .worship .worship-container .worship-wrap-bottom p { font-size: 14px; }
    .worship .worship-container .worship-wrap-bottom .worship-img { width: 37%; }

    .notice .notice-title > h3 { font-size: 22px; }
    .notice .galleryList a p { font-size: 14px; }
    .notice .notice-container .notice-left { margin-bottom: 20px; }

    .gallery-container > p { font-size: 16px; }
    .gallery-container > h1 { font-size: 34px; margin-top: 0; }
    .gallery .gallery-container .galleryb .gallery-content { margin-bottom: 20px; }
}

@media(max-width:767px) {
    #main .dimode-slider .slider-dots { bottom: 10px !important; }
    #main .dimode-slider .slider-dots .each-dot { height: 10px; width: 10px; }
    #main .dimode-slider .slider-dots .each-dot.active { width: 22px; }
    #main .slider .move-btn { width: 25px; }

    .today_sermon { width: 90vw; height: auto; flex-direction: column; }
    .sermon { padding: 10px 0; }
    .sb-1 {height:auto;}
    .sb-1 .sermon-content { position: relative; bottom: 10%; width: 75%; }
    .sb-1 h2 { font-size: 17px; }
    .sb-1 h4 { font-size: 15px; margin: 10px 0 0; }
    .sb-1 p { font-size: 14px; margin: 0; }
    .sb-2 { margin-bottom: 40px; }
    .sb-2 > a { height:auto;}
    .sb-2 .sermon-youtube { width: 50px; }
    .sb-2 .sermon-thumbnail { position: relative; top: unset; left: unset; transform: unset; }
    .sb-2 .sermon-thumbnail { height: 50vw; }
    .sb-2 .sermon-thumbnail:hover { height: 50vw; width: 100%; }
    .sb-3 { top: 50%; transform: translateY(-50%); height: 100%; }
    .sb-3 > a { display: block; float: unset; height: 50%; }
    .sb-3 a img { /*width: 76px;*/height:100%; }
    .sb-3 #sermon-more { width: 50%; height: auto; }
    .sb-3 > a > p { font-size: 10px; }

    .together { display: block; flex-direction: column; }
    .together h3 { font-size: 25px; }
    .together p { font-size: 17px; }
    .together > a { padding: 5% 3%; width: 50%; }
    .blackBox { width: 100vw; }

    .worship .worship-container { width: 90%; flex-wrap: wrap; padding-top: 30px; }
    .worship .worship-container > a { width: 30%; margin-bottom: 20px; }
    .worship .worship-container > a > .worship-wrap h3 { font-size: 13px; margin: 0 0 15px; }
    .worship .worship-container > a > .worship-wrap:hover {transform:unset;}
    .worship .worship-container .worship-wrap-bottom > img:nth-of-type(1) { width: 70%; }
    .worship .worship-container .worship-wrap-bottom p { font-size: 11px; }
    .worship .worship-container .worship-wrap-bottom .worship-img { width: 37%; }

    .notice .notice-container { width: 90%; }
    .notice .notice-title { margin-bottom: 5px; }
    .notice .notice-title > h3 { font-size: 20px; }
    .notice .galleryList a p { font-size: 12px; }
    .notice .notice-container .notice-left { margin-bottom: 20px; }

    .gallery { padding: 5% 0 5%; }
    .gallery .gallery-container { width: 95%; }
    .gallery-container > p { font-size: 12px; }
    .gallery-container > h1 { font-size: 23px; margin-top: 0; }
    .gallery .gallery-container .galleryb .gallery-content { margin-bottom: 20px; }
    .gallery .gallery-container .galleryb .gallery-content img { height: 25vw; }
    .gallery .gallery-container .galleryb .gallery-content .gallery-text > h3 { }
}

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