#dimodePage {display:inline-flex !important;flex-wrap:wrap;}
#dimodePage .page-content {position:relative;width:100%;overflow: hidden;}

/* common */
#main-slider{position:relative;width: 100%;overflow-x: hidden;}
.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{width: 100%;}
.slider .slider-wrapper .slide img{width: 100%;}
.box{display:inline-block; position:relative; opacity:0; top:50px; }
#main-slider .swiper-pagination {bottom: 10px !important;}

#loginForm .form-heading{margin-top:125px!important;}
/* main1 s */ 
.slider .move-btn{ background:rgba(0,0,0,0)!important;}
.slider .move-btn.prev-btn,
.slider .move-btn.next-btn,
.slider .slider-dots{ /*display: none!important;*/}
.slider .slider-dots .each-dot.active { background: white !important; border: 4px solid #4B4837 !important; width: 15px; height: 15px; border-radius: 15px; transition: all 0.3s; }
.slider .slider-dots .each-dot{background:#4B4837 !important; border: 1px solid #4B4837 !important;}

#main-1{background: url(../Images/003_about_bg01.png) no-repeat;background-size: 50% 100%;background-position: left top;}
#main1-bg {height: 380px; width:120%;}
#main1-bg .main1-1 .main1-1-leftbox{display:none;}
#main1-bg .main1-2{position: relative;height: 100%;overflow: hidden;display: block;float: left;}
#main1-bg .main1-2 .main1-1-rightbox{position: absolute; top: 52%; left: 50%;transform: translate(-50%, -50%);width: 100%;}
#main1-bg .main1-2 .main1-1-rightbox .sermon-time-title{/*font-size: 2rem; font-weight: bold;*/ font-size: 2.3rem;text-align: center; line-height: 1.2;}
#main1-bg .main1-2 .main1-1-rightbox .sermon-time{width: 85%; border: none;}
#main1-bg .main1-2 .main1-1-rightbox .sermon-time tbody tr td{font-size: 17px;padding: 3px 0px;}
#main1-bg .main1-2 .main1-1-rightbox .sermon-time-menteu{margin: 15px 0 0 0; font-size: 17px; color:#365BC1;}
/*#main1-bg .main1-2 .main1-1-rightbox h6{text-align: center;font-size: 0.8rem;margin-top: 25px;letter-spacing: 0;line-height: 1.5;}*/
#main1-bg .main1-2 .main1-1-rightbox h6{text-align: center;font-size: 1rem;margin-top: 25px;letter-spacing: 0;line-height: 1.5;word-break:keep-all;}



/* main1 e */

/* main2 s */
#main-2{background: url(../Images/003_about_bg02.png) no-repeat; background-size: 50% 100%; background-position: right top;}
#main2-bg{height: 380px;width: 120%;left: -20%;position: relative;}
#main2-bg .main2-2 .main2-1-rightbox{display:none;}
#main2-bg .main2-1{position: relative;height: 100%;/*overflow: hidden;*/display: block;float: left;}
#main2-bg .main2-1 .main2-1-leftbox{position: absolute;top: 52%;left: 50%;transform: translate(-50%, -50%);width: 100%;}
#main2-bg .main2-1 .main2-1-leftbox .school-time-title{font-size: 2rem; font-weight: bold; text-align: center;line-height: 1.3;}
#main2-bg .main2-1 .main2-1-leftbox .school-time{width: 85%; border: none;}
#main2-bg .main2-1 .main2-1-leftbox .school-time tbody tr td{font-size: 17px;padding: 3px 0px;}
/*#main2-bg .main2-1 .main2-1-leftbox h6{text-align: center;font-size: 0.8rem;margin-top: 25px;letter-spacing: 0;line-height: 1.5;}*/
#main2-bg .main2-1 .main2-1-leftbox h6{text-align: center;font-size: 1rem;margin-top: 25px;letter-spacing: 0;line-height: 1.5;}

/* main2 e */



/* main3 s */
#main-3{background: url(../Images/004_board_bg.png) no-repeat; background-size: cover; background-position: right top; background-attachment: fixed;}        
#main-3 > .container {width: 100%; display: flex; align-items: baseline; padding: 100px 150px; box-sizing: border-box; justify-content: space-betwwen;}
#main-3 .main3 {position:relative;}
#main-3 .main3 .main3-div{ /*margin: 30% 0;*/ text-align: center;}
#main-3 .main3 .main3-div .main3-title{font-size: 1.6rem;color: #113173;font-weight: bold;letter-spacing: 0;margin: 0;}
#main-3 .main3 .main3-div .main3-btn {font-size: 0.9rem; color: #237BE7; font-weight: 600; letter-spacing: 1px; margin: 15px 0;display: inline-block;text-decoration:none;}
#main-3 .main3 .main3-div .main3-btn:hover { transform: scale(1.05); transition: all .25s ease;}
#main-3 .main3 .main3-div .main3-box {display: inline-block;width: 100%; font-size: 18px;color: #000;margin: 7px 0;}
#main-3 .main3 .main3-div .main3-box span {width: 100%; text-overflow: ellipsis; word-break: keep-all; overflow: hidden; }
#main-3 .main3 .main3-div ul li {padding: 5px 0;}
#main-3 .main3 .main3-div ul li a span {font-size: 1.0rem; font-weight: normal; color:#252732;}

/* main3 e */

/* main4 s */
#main-4 {
    position: relative;
    bottom: 0;
    width: 100%;
    background: -webkit-linear-gradient(90deg, rgb(16, 45, 85), rgb(22, 79, 137));
    background: linear-gradient(90deg, rgb(16, 45, 85), rgb(22, 79, 137));
}
#main4-bg{height: 345px;}
.main4-1 .main4-1-leftbox .video-main a{width: 500px;position: relative;height: 255px;overflow: hidden;background-color: transparent;display: block;
float: right;margin: 45px 0;}
.main4-1 .main4-1-leftbox .video-main a .youtube-img{max-width: 100%;max-height: 100%; width:100%;}
.main4-1 .main4-1-leftbox .video-main a img{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);}
.main4-1 .main4-1-leftbox .video-main a:hover .Videotitle2,
.main4-1 .main4-1-leftbox .video-main a:focus .Videotitle2{opacity:0; transition:0.5s all ease;}
.main4-2{width: 50%;position: relative;height: 255px;overflow: hidden;display: block;float: left;margin: 45px 0;}
.main4-2 .sermon-box{position: absolute;top: 50%;left: 55%;transform: translate(-50%, -50%);width: 100%;}
.main4-2 .sermon-box .sermon-title-day{width: 100%;display: inline-block;position: relative;}
.main4-2 .sermon-box .sermon-title-day .sermon-title{color: #fff;font-size: 1.5rem; text-align: left; font-weight: bold; letter-spacing: .15rem; -ms-word-break: keep-all;word-break: keep-all;}
.main4-2 .sermon-box .sermon-day .sermon-day-span{text-align: right;font-size: 1.2rem; color: #fff;display: inline-block; margin-bottom: 10px;}
.main4-2 .sermon-box .sermon-bible-Pastor{margin-top: 10px;color: #fff; font-size: 1rem; }
.main4-2 .sermon-box .sermon-href {padding: 10px 30px;display: inline-block;background-color: #CD1932;margin: 15px 0;font-size: 13px;color: #fff;font-weight: bold;letter-spacing: 0; text-decoration:none; border-radius:5px;}
.main4-2 .sermon-box .sermon-href:hover {transform: scale(.98); transition: all .25s ease;} 
.main4-2 .sermon-box .sermon-href img{margin-right: 10px;}
/* main4 e */
/* main5 s */
#main-5 .main-5-titme { text-align: center;font-size: 34px; margin: 50px 0; margin-top: 65px;}
#main-5 .main5-div {text-align: center; padding: 0; margin: 120px 0;}
#main-5 .main5-div img:hover {transition: all .35s ease; transform: translateY(-10%);}

#main-5 a {text-align:center; }
#main-5 .main5-div h6 {font-size: 1.1rem; /*font-weight: bold;*/ margin-top: 30px; color: black; }
#main-5 .main5-div h4 { padding: 5px 10px; transition: color ease .3s; display: inline-block; position:relative; font-size: 1.5rem; font-weight: bold; color: #0970B5; /*border-bottom: 2px solid; padding-bottom: 5px;*/ }
#main-5 .main5-div h4::after {content: '';position: absolute;left: 0;bottom: 0;background-color: #0970B5;z-index: -1;width: 100%;height: 5%;transition: all ease 0.3s;}
#main-5 .main5-div h4:hover {color: white;}
#main-5 .main5-div h4:hover::after {height: 100%;}

.main5-div p {margin: 30px 0; font-size: 19px;}
/* main5 e */



/* main6 s */
#main-6 {overflow: hidden;}
/* main6 s */
#main-6 ul {display: flex; flex-wrap: wrap; align-items: stretch; justify-content: center;}
#main-6 li {float:left; width:25%; text-align:center; overflow:hidden; background-size: cover!important; height: 265px; background-position: center!important;}
#main-6 li a { transition: all .3s ease-in-out; background-color: #000; opacity: .3;  display:block; height:100%; width:100%; }
#main-6 li a:hover {opacity: 0;}


/*다음세대*/
.next-generation-wrapper .next-generation {
    position: relative;
    padding: 24px;
    height: 350px;
}
.next-generation-wrapper .next-generation > .next-generation-title {margin-bottom:5px;color:white; display:block;text-decoration:none; font-size:25px;}
.next-generation-wrapper .next-generation > .next-generation-btn { float:right;}
.next-generation-wrapper .next-generation > .next-generation-btn > img { position:absolute;top:0;right:0;}
.next-generation-wrapper .next-generation .documents a{display:inline-block;padding-left:5px;padding-right:5px;}
.next-generation-wrapper .next-generation .documents .generation_img {margin:5px 0px; width:100%; height:210px;}

.next-generation-wrapper .next-generation .documents .tab-content p { font-size:16px; color:white; text-align:center }
.next-generation-wrapper .next-generation .documents .generation_date {word-break:keep-all; font-size:14px!important;color:#D7D9D8!important; }
.next-generation-wrapper .next-generation .nav-tabs > li { text-align:center; float:inherit;}
.next-generation-wrapper .tab-dots {text-align:center; width: 100%;    position: absolute;  left: 0;  bottom: 15px;}
.next-generation-wrapper .tab-dots > li {margin-left:3px;margin-right:3px;}
.next-generation-wrapper .tab-dots > li > a {display: inline-block;width: 12px;height: 12px;background: #e7e4df;cursor: pointer;border-radius: 50%; padding: 0;}


/* 다음세대 css */
/*#main2 .text-center span:hover { display:inline-block; padding: 5px 20px; background-color: #B8E6FF; border:1px solid #BEBEBE; border-radius:10px; margin:0px 3px; color:#fff; transition:0.2s all ease;}*/
#main-quick { text-align:center; background:rgba(30,60,98,1);}
#main-quick a { text-decoration:none; color:#fff; }
#main-quick img { display:inline-block; margin-right:15px;}
#main-quick p { display:inline-block;vertical-align:middle; font-size:18px; margin:0;}
#main-quick > div > div > a > div { padding: 15px 0px; border-right: 1px solid white; position:relative; }
#main-quick > div > div  div {background:rgba(30,60,98,1); height:115px;}
#main-quick > div > div > a > div:first-child{border-left:1px solid white;}
#main-quick > div > div > a > div:hover {opacity: 0.9 !important;transition: 0.4s all ease;}
#main-quick > div > div > a > div> span {    font-size: 18px; display: inline-block; width: 100%;position: absolute;top: 50%;left: 50%;transform: translateX(-50%) translateY(-50%);}



/*메인 공지사항 성가대찬양*/
.bottom-latest .latest-wrapper {
    padding: 30px;
    width: 100%;
    height: 100%;
    position: relative;
}
    .latest-third {
        overflow: hidden;
        padding: 0;
        position: relative;
        margin-bottom: 30px;
        height: 350px;
    }
.latest-wrapper a.latest-title {
    font-size: 28px;
    color: #eee;
    text-decoration: none;
    margin-bottom: 35px;
    display: inline-block;
}
.latest-wrapper a.latest-title2 {
    font-size: 28px;
    color: #000;
    text-decoration: none;
}
.latest-wrapper a.latest-btn {
    position: absolute;
    right: 0;
    top: 0;
}
.background-color {
    background: url('/UserData/bonaembadeun/Layouts/bonaembadeun_Layout/Images/praise_bg.png');
}
.background-color2 {
    background:white;
}
.background-color3 {
    background: rgb(84,111,180);
}
.background-color4 {
    background: #37485C;
}


.background-color2 .latest-wrapper ul > li {border-bottom: 1px solid #000;font-weight: normal;
margin-top: 4px;width: 100%;display: inline-block;}
.latest-wrapper ul > li a{
    text-decoration:none;
}

    .latest-wrapper ul > li > a > span.choir_title {
        display: inline-block;
        text-overflow: ellipsis;
        white-space: normal;
        overflow: hidden;
        width: 100%;
        padding-right:15px;
        word-break:keep-all;
        color: white;
        font-size: 25px;
    }
    .latest-wrapper ul > li > a > span.choir_date {
        display: inline-block;
        margin-bottom: 10px;
        font-size: 20px;
        color: white;
    }
.latest-third .latest-wrapper ul > li > a > div > span.community_title {
    font-size: 16px;
    color: black;
    text-decoration: none;
}
.latest-third .latest-wrapper ul > li > a > div > span.community_date {
    font-size: 15px;
    color: black;
    text-decoration: none;
}
.main-1-right .latest-wrapper .tab-content {
   position:absolute;
   top:50%;
   margin-top:-50px;
}
.main-1-right .latest-wrapper .tab-content2 {
    position: absolute;
    top: 45%;
    margin-top: -80px;
    width:80%;
}
/* 성가대 찬양 css End*/
.font-color4 {
    color: #fff !important;
}
.latest-third .latest-wrapper ul > li > a >div >span.community_title {
    display: inline-block;
    width: 210px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


.document-widget.gallery .document a img {height: 100%;}


@media (max-width:1699px) {
	#main1-bg {width: 105%;}
	#main2-bg {width: 90%;left:0;}
}
@media (max-width:1499px) {
	#main-1{background-image:none;}
	#main-1 .main1 .container{width:100%;padding:0;margin:0;}
	#main-1 .main1 #main1-bg{display: flex;flex-direction: column;width:100%;height:inherit;}
	#main-1 .main1 #main1-bg .main1-1{width:100%;}
	#main-1 .main1 #main1-bg .main1-1 .main1-1-leftbox{display:block;}
	#main-1 .main1 #main1-bg .main1-1 .main1-1-leftbox img{width:100%;}
	#main-1 .main1 #main1-bg .main1-2{width:100%;}
	#main-1 .main1 #main1-bg .main1-2 .main1-1-rightbox{position:relative;top: 0;left: 0;transform: none;padding: 30px 0 40px;}
	
	#main-2{background-image:none;}
	#main-2 .main2 .container{width:100%;padding:0;margin:0;}
	#main-2 .main2 #main2-bg{display: flex;flex-direction: column;width:100%;height:inherit;left:0;}
	#main-2 .main2 #main2-bg .main2-2{width:100%;order:1;}
	#main-2 .main2 #main2-bg .main2-2 .main2-1-rightbox{display:block;}
	#main-2 .main2 #main2-bg .main2-2 .main2-1-rightbox img{width:100%;}
	#main-2 .main2 #main2-bg .main2-1{width:100%;order:2;}
	#main-2 .main2 #main2-bg .main2-1 .main2-1-leftbox{position:relative;top: 0;left: 0;transform: none;padding: 30px 0 40px;}
}
@media (max-width:1199px) {
	#main-3 > .container{padding:30px;}
	#main-5 .main5-div {margin: 40px 0;}
}
@media (max-width:992px) {
    
}
@media (max-width:767px) {
	#main-1 .main1 #main1-bg .main1-1,
	#main-2 .main2 #main2-bg .main2-2{padding:0;}
	#main-1 .main1 #main1-bg .main1-2 .main1-1-rightbox,
	#main-2 .main2 #main2-bg .main2-1 .main2-1-leftbox{padding:20px 0;}
	#main-3 > .container{padding:20px 0;flex-direction: column;gap: 20px;}
	#main-3 > .container:before,
	#main-3 > .container:after{display:none;}
	#main-5 a{width:50%;}
} 
@media (max-width:320px) {
}