﻿/*music*/
#bgm-player { position:fixed; bottom:30px; left:30px; z-index:50; width:295px; box-shadow: rgba(113, 113, 113, 0.28) 5px 7px 7px;}
#bgm-player h5 { background:#4CA9EA; color:#fff; text-align:center; font-size:15px; margin:0; padding:8px 0; border-radius: 4px 4px  0 0;}
.green-audio-player .controls span { width:80px; }
.green-audio-player .controls { font-size:13px!important; margin:0 5px; }
.green-audio-player { width:295px; height:40px; border-radius: 0 0 4px 4px; padding:0 10px; min-width:250px; box-shadow:none; }
.green-audio-player svg { width: 17px; height: 15px;}
.green-audio-player .controls .controls__slider { margin:0 5px; }


#main-slider { background:none; margin:25px 0 0;}
.each-img img { width:100%; }
.detail-video { max-width:600px; margin:0 auto; }

#main-quick { padding:30px 0px; cursor:pointer;}
#main-quick ul { width:100%; text-align:center; }
#main-quick ul li { display:inline-block; text-align:center; padding:0 60px;}
#main-quick ul li p { font-size:17px; color:#535353; font-weight:600; margin:10px 0px 0px;}
#main-quick ul li:hover p { color:#005D9A; transition:0.3s all ease; font-weight:bold;}

.new-gall { margin:20px 0 0; background:#fff; padding:25px 20px; border-radius: 10px;}
.new-gall h3 { margin:0 0 10px; font-size:25px; font-weight:bold; color:#008CEA;}
.new-gall h4 { margin:0 0 30px; font-size:20px; font-weight:bold; color:#000;}
#main-bg {background:url(../Images/bg.png) no-repeat;  background-size:100%; background-position:center; padding:50px 0 90px; margin:0px 0; box-shadow: 1px 1px 5px #a5a5a5; }
#main-1 > div > div > .col-md-3 { padding:0; }
#main-1 .sermon { background-image:url(../Images/pas_bg_2022.png); border-radius:10px; padding:35px 10px;  text-align:right; height:296.5px;}
.sermon > a{width:100%;height:100%; display:inline-block;}
#main-1 .sermon #pastor { position:absolute; bottom:0px; left:5px;}
#main-1 .sermon #play { position:absolute; bottom:30px; left:50px;}
#main-1 .sermon .sermon-cont { position:absolute; display:inline-block; text-align:left; top:10%; left:30px;}
#main-1 .sermon .sermon-cont h4 {font-size:22px; color:#fff; margin:0; font-weight:normal; line-height:30px; }
#main-1 .sermon .sermon-cont h5 { color:#fff; margin:20px 0px; font-weight:normal; overflow: hidden; word-wrap: normal !important; display: block; width:270px; line-height:40px; }
#main-1 .sermon .sermon-cont h6 {font-size:20px; color:#000; margin:0; font-weight:normal;}
#main-1 .sermon .sermon-cont h5 { text-decoration:none; color:#000; font-size:24px; }
#main-1 .sermon .sermon-cont h5:hover { font-weight:bold; }
#main-1 .main1-box { border:1px solid #e5e5e5; border-radius:10px; padding:25px 25px; position:relative; height:191px; margin:0 0 10px;}
#main-1 .notice {background-image:url(../Images/notice_bg.png); cursor:pointer; }
#main-1 .new {background-image:url(../Images/new_bg.png); cursor:pointer;}
#main-1 .main1-box h3 { font-size:23px; font-weight:bold; margin:0px; display:block; float:left; clear:both; overflow:hidden; color:#333;}
#main-1 .main1-box p { font-size:20px; margin:15px 0px 30px; display:inline-block; color:#333; line-height:30px;}
#main-1 .main1-box hr { width:40px; text-align:left; display:block; color:#333;}
#main-1 .main1-box #plus { float:right;}
#main-1 .main1-box .line { float:left; margin:5px 0px 0px; display:none;}
#main-1 .main1-box .icon { position:absolute; bottom:20px; right:30px;}
#main-1 .notice:hover, #main-1 .new:hover { opacity:0.7; transition:0.4s all ease; cursor:pointer;}

#main-2 { padding:20px 0px;}
#main-1 .main2-1 { background: url(../Images/banner1.png) no-repeat; background-size:100% 100%; background-position:center; height:191px; width:100%; padding:34px 25px; margin:0 0 10px;}
#main-1 .main2-2 { background: url(../Images/banner22.png) no-repeat; background-size:100% 100%; background-position:center; height:191px; width:100%; padding:34px 25px; margin:0 0 10px;}
#main-1 .main2-3 { background: url(../Images/banner3.png) no-repeat; background-size:100% 100%; background-position:center; height:191px; width:100%; padding:25px 25px;}
#main-1 .main2-4 { background: url(../Images/banner4.png) no-repeat; background-size:100% 100%; background-position:center; height:191px; width:100%; padding:25px 25px;}

#main-1 h2 { margin:0px; color:#000; font-size:24px;}
#main-1 .new-gall h2 { color:#000; font-size:24px; margin:15px 0; font-weight:bold; }
#main-1 .new-gall h2 span { color:#0073C0;}
#main-1 p { margin:8px 0px 0px; font-size:17px; color:#fff;}
.main2-1:hover, .main2-2:hover { opacity:0.7; transition:0.4s all ease; cursor:pointer;}
#main-1 .main2-3 h3 { font-size:24px; color:#fff; margin:0px; font-weight:bold;}
#main-1 .main2-3 a { text-decoration:none; color:#fff;}
#main-1 .main2-3 a:hover { text-decoration:none; color:#fff; }
#main-1 .main2-3 ul { margin:10px 0px 0px;}
#main-1 .main2-3 ul a { color:#fff; text-decoration:none; font-size:15px;}
#main-1 .main2-3 ul a:hover { font-weight:bold;}
#main-1 .main2-3 li { padding:0px 0px 8px; overflow:hidden;}
#main-1 .main2-3 li span { float:right;}
#main-1 .main2-3 li p { text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal !important; display: block; width:170px; float:left; margin:0px;}
#main-1 .main2-4 h3 { font-size:24px; color:#fff; margin:0px; font-weight:bold;}
#main-1 .main2-4 ul { margin:10px 0px 0px;}
#main-1 .main2-4 a { text-decoration:none; }
#main-1 .main2-4 ul a { color:#fff; text-decoration:none; font-size:17px;}
#main-1 .main2-4 ul a:hover { font-weight:bold;}
#main-1 .main2-4 li { padding:0px 0px 8px; overflow:hidden;}
#main-1 .main2-4 li span { float:right;}
#main-1 .main2-4 li p { text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal !important; display: block; width:170px; float:left; margin:0px;}

#main-new { padding:0 0 50px; }
#main-new h3 { font-size:30px; margin:30px 0 15px; font-weight:bold; color:#005D9A;}
#main-new h4 { font-size:23px; margin:0 0 30px; font-weight:bold; }
#mainsection-2 .row { margin-top:50px; text-align:center; margin-bottom:40px;}
#new-gellary { margin:0 auto 0; overflow:hidden; text-align:center;}
.contentSlide, swiper-slide, swiper-slide-active { display:inline-block; }
.contentSlide a { text-decoration:none; }
#main-new #new-gellary .contentSlideWrapper img:hover { opacity:0.5; transition:0.3s;}
#new-left { position:absolute; top:30%; left:-30px;}
#new-right { position:absolute; top: 30%; right: -30px;}
#new-left:hover, #new-right:hover { cursor:pointer;}
.new-cont { font-size:17px; color:#000; bottom:0px; width:100%; height:20%; text-align:center; padding:5px 0px; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal !important; display: block; text-decoration:none; }
.new-cont a { text-decoration:none; }
.new-cont a:hover { text-decoration:none; }


#main-gallery { background-color:#eaeaea; padding:30px 0px; }
#main-gallery h1 { margin:0px; font-size:28px;}
#main-gallery .gallery-content { position:relative; margin:25px 0px 0px; overflow:hidden;}
#main-gallery .gallery-content img { width:100%; overflow:hidden; height:190px!important;}
#main-gallery .gallery-content img:hover {opacity:0.5; transition:0.5s all ease; transform:scale(1.05);}
#main-gallery .no-padding { padding:0px 5px; }
#main-gallery p { position:absolute; bottom:0px; background-color:rgba(0,0,0,0.8); display:block; width:100%; margin:0px; padding:10px; text-overflow: ellipsis; width:100%; overflow: hidden; white-space: nowrap; word-wrap: normal !important;}
#main-gallery a { text-decoration:none; color:#fff; font-size:16px; text-overflow: ellipsis; -o-text-overflow: ellipsis; overflow: hidden; white-space: nowrap; word-wrap: normal !important;}

@media (min-width:1200px) and (max-width:1499px) {

}

@media (min-width:993px) and (max-width:1199px) {
    #main-quick ul {width:100%; text-align:center;}
    #main-quick ul li { padding:0px 42px;}
    #main-1 .sermon .sermon-cont { margin:0px;}
    #main-1 .main1-box h3 { font-size:18px;}
    #main-1 .main1-box { padding:25px;}
    #main-1 .main1-box .icon { right:15px;}
    #main-1 .main1-box p { font-size:17px; line-height:30px;}
    #main-1 h2 { font-size:20px;}
    #main-1 .main2-3 li p, #main-2 .main2-4 li p { width:130px;}
    #main-1 .main2-3 h3 { font-size:20px; }
    #main-1 .main2-4 h3 { font-size:20px; }
    #main-1 .main2-4 li p { width:130px;}
    #main-1 .new-gall h2 { margin:24px 0; }
}

@media (min-width:768px) and (max-width:992px) {
	#main-1 > div > div > .col-md-3 > a > div {display: inline-block;
    width: 33%;float: left;padding:0 15px;}
	#main-slider > div { padding:0; margin:0; width: 100%;}
    #main-1 .main2-3 li p {width:115px; }
    #new-left { position:absolute; top:35%; left:-10px; display:none!important; }
    #new-right { position:absolute; top: 35%; right: -10px; display:none!important;}
    .new-gall { margin:25px 0; }
    #main-1 .main2-4 li p { width:65px; }
    #gnb-wrap > div { text-align:left; }
    #main-slider {margin:0;}
    #main-1 .sermon { margin:0px 0px 25px; height:340px; background-size: 100% 100%;}
    #main-quick ul {width:100%;}
    #main-quick ul li { padding:0px; width:15%; margin:15px 0px 0px;}
    #main-2 .main2-1, #main-2 .main2-2, #main-2 .main2-3, #main-2 .main2-4 { margin:0px auto 20px;}
    #main-gallery .no-padding { padding:0px 25px;}
    #main-1 .main2-1 { display:inline-block; width:100%; }
    #main-1 .main2-2 { display:inline-block; width:100%; }
    #main-1 > div > div > .col-md-3 { padding:0 15px; margin:0 0 15px;}
    #main-1 > div > div > .col-md-3 > div { float:left; width:33%; padding:0 10px;}
    #main-1 .sermon .sermon-cont { right:75px; }
}

@media (max-width:767px) {
	.swiper-slide { height:200px!important; }
	.swiper-slide img { max-height:155px!important; }
	#main-1 > div > div > .col-md-3 > a > div {
	    display: inline-block;
    width: 50%;
    float: left;
    padding:0 15px;
  }
	#main-gallery .gallery-content img { width:100%; overflow:hidden; height:150px!important; }
	#main-slider > div { padding:0; margin:0; width: 100%;}
	.slider .move-btn.prev-btn, .slider .move-btn.next-btn { display:none; }
    #main-new h3 { font-size:22px;}
    #main-new h4 { font-size:18px; }
        #new-left { display:none;}
#new-right { display:none;}
    #main-slider {margin:0;}
    #main-1 .sermon .sermon-cont h5 { width:100%;     margin: 10px 0px;}
    #main-1 .sermon .sermon-cont h5 { font-size:25px;}
    #main-1 .sermon .sermon-cont h4, #main-1 .sermon .sermon-cont h6 { font-size:18px; }
    #main-quick ul {width:100%;}
    #main-quick ul li { padding:0px; width:33.333%; margin:5px 0; float: left; padding:10px; }
    #main-quick ul li p { font-size:15px; }
    #main-1 .sermon #pastor { width:65%; }
    #main-1 .sermon { height:230px; }
    #main-1 .sermon { background-color: #74beef; border-radius: 10px; padding: 35px 30px; position: relative; text-align: right; margin:0px; }
    #main-1 .main1-box { margin:20px 0px 0px;}
    #main-2 .main2-1, #main-2 .main2-2, #main-2 .main2-3, #main-2 .main2-4 { margin:0px auto 20px;}
    #main-gallery .no-padding { padding:0px 15px;}
    #main-gallery a { font-size:14px;}
    #main-1 > div > div > .col-md-3 > div { padding:0 15px; margin:15px 0;}
    #main-quick img { width:40px;}
    #main-1 .main2-1 {width:100%; display:inline-block;}
    #main-1 > div > div > .col-md-3 > div { display:inline-block; width: 50%;
    float: left;}
    #main-1 .main2-2 {width:100%; display:inline-block;}
    #main-1 p { display:none; }
    #main-1 .main2-1 { height:120px; margin:0; }
    #main-1 .main2-2 { height:120px; margin:0; }
    #main-1 h2 { font-size:19px; }
    #main-quick { padding:30px 0 15px ;}
    .m-100 { width:100%!important;}
    #main-1 .main2-3 h3 { font-size:20px;}
    #main-1 .main2-3 li p { font-size:15px;}
    #main-1 .main2-3 { height:176px; }
    #main-1 > div > div > .col-md-3 > div { margin:0 0 15px;}
    #main-1 .sermon { padding:15px 0; }
    #main-1 .sermon .sermon-cont { bottom:40%; left:25px; }
    #main-1 .sermon .sermon-cont h5 { font-size:20px; }
    #main-1 .sermon #pastor { left: 45%; width:50%; }
    .new-gall h3 { font-size:20px;}
    .new-gall h4 { font-size:17px;}
    .new-cont { font-size:16px; padding:20px 0 0;}
    #main-gallery h1 { font-size:24px; }
    #main-1 .main1-box p { display:none; }
    #main-1 .main1-box h3 { font-size:24px; line-height: 130%; word-break:keep-all;}
    #main-1 .main1-box {height:120px;}
    #main-1 .main2-4 h3 { font-size:20px;}
    #main-1 .main2-4 ul a { font-size:15px; }
    #main-1 .main2-4 ul { margin:20px 0 0; }
    #main-1 .main2-4 li p { font-size:15px; }
    #main-bg { padding:50px 0 40px;}
    #main-gallery p { text-overflow: ellipsis; width:100%; overflow: hidden; white-space: nowrap; word-wrap: normal !important;}
    .mobile-li li { display:inline-block;  width:32%; text-align:center;}
    .mobile-li a { font-size:17px!important;}
    #bgm-player h5 { font-size:13px; line-height:17px; padding:5px 0; }
	.green-audio-player .holder { margin:0 auto; }
	#bgm-player  { bottom:15px; left:15px; width:80px; }
	#player1 .controls { display:none; }
    .green-audio-player {width: 80px;min-width: 80px;height: 30px;}
}
