﻿@-webkit-keyframes spinspin2 {0% {-webkit-transform: rotate(0deg);}100% {-webkit-transform:rotate(180deg);}}
@keyframes spinspin2 {0% {transform: rotate(0deg);}100% {transform:rotate(180deg);}}
@-webkit-keyframes array1 {0%,100% {-webkit-transform:translateX(0);}50% {-webkit-transform:translateX(10px);}}
@keyframes array1 {0%,100% {transform:translateX(0);}50% {transform:translateX(10px);}}
@-webkit-keyframes array2 {0%,100% {-webkit-transform:translateX(0);}50% {-webkit-transform:translateX(-10px);}}
@keyframes array2 {0%,100% {transform:translateX(0);}50% {transform:translateX(-10px);}}
/* common */

.nav-tabs {
    border-bottom: none;
}

.plus {
    position: absolute;
    top: 0;
    right: 0;
}

.plus:hover {
    opacity: 0.8;
    transition: 0.3s all ease;
}

.box {
    display: inline-block;
    position: relative;
}

.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;}

.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;}


#main-1{padding:110px 0 30px;display: inline-flex;flex-direction: row;flex-wrap: wrap;justify-content: space-evenly;align-items: stretch;width: 100%;}
#main-1 .main1L{width:74.375%; display:inline-block;}
#main-1 .main1R{width:25.625%; display:inline-block;float:right;overflow:hidden;}
#main-1 .main1R .main1RT{margin: 0 0 15px 30px;height: 78%; padding: 45px 25px;position:relative;background-size:cover;background-repeat:no-repeat;}
#main-1 .main1R .main1RT a{text-decoration: none;}
#main-1 .main1R .main1RT h6{margin: 0;font-size: 24px;color: #fff;font-weight: bold;letter-spacing: 0;}
#main-1 .main1R .main1RT .sermonM h1{font-size: 40px;color: #fff;line-height: 2.5;margin: 90px 0 0;font-weight: bold;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;width: 100%;float: left;}
#main-1 .main1R .main1RT .sermonM h5{margin: 0;font-size: 20px;color: #fff;line-height: 1.3;}
#main-1 .main1R .main1RT .sermonM p{margin: 0;font-size: 20px;color: #fff;}
#main-1 .main1R .main1RT .sermonM p span{margin: 0 5px;font-size: 22px;color: #fff;}
#main-1 .main1R .main1RT .sermonHRF{position: absolute;top: 85%;text-align: center;right: 25%;border: none;display: block;transform: translate(50%,-50%);width:160px;height:80px;}
#main-1 .main1R .main1RT .sermonHRF .playBTN{left:0;}
#main-1 .main1R .main1RT .sermonHRF .HV{opacity:1;}
#main-1 .main1R .main1RT .sermonHRF .NHV{opacity:0;}
#main-1 .main1R .main1RT .sermonHRF .HV:hover{opacity:0; transition: 0.3s all ease;}
#main-1 .main1R .main1RT .sermonHRF .NHV:hover{opacity:1; transition: 0.3s all ease;}
#main-1 .main1R .main1RT .sermonHRF .liveBTN{right:0;}
#main-1 .main1R .main1RT .sermonHRF .playBTN,
#main-1 .main1R .main1RT .sermonHRF .liveBTN{width: 50%;height: 100%;position: absolute;display: inline-block;float: left;}
#main-1 .main1R .main1RB{display: inline-block;float: left;position:relative;overflow: hidden;width:100%;}
#main-1 .main1R .main1RB .main1RSDM{margin: 15px 0 0 30px;padding: 25px 30px;background-color: #30A16C; }
#main-1 .main1R .main1RB .main1RSDM .main1RSD{overflow:hidden;}
#main-1 .main1R .main1RB .main1RSDM .main1RSD .contentSlideWrapper .contentSlide .sermonSUBT .sermonSITET{display: inline-block;
float: left;width: 100%;font-size: 22px;line-height: 3;color: #fff;font-weight: bold;}
#main-1 .main1R .main1RB .main1RSDM .main1RSD .contentSlideWrapper .contentSlide .sermonSUBT h1{display: inline-block;font-size: 17px;width: 50%;margin: 0; color:#fff;text-overflow: ellipsis;
white-space: nowrap;overflow: hidden;}
#main-1 .main1R .main1RB .main1RSDM .main1RSD .contentSlideWrapper .contentSlide .sermonSUBT .title{float: left;}
#main-1 .main1R .main1RB .main1RSDM .main1RSD .contentSlideWrapper .contentSlide .sermonSUBT .regdate{float: right;text-align: right;}
#main-1 .main1R .main1RB .swiper-pagination-clickable{display: inline-block; position: absolute; transform: translate(50%,-50%);right: 10%;z-index:999;}
#main-1 .main1R .main1RB .swiper-pagination-clickable .swiper-pagination-bullet{margin:5px; background-color:#fff; opacity:.2;width:12px;height:12px;}
#main-1 .main1R .main1RB .swiper-pagination-clickable .swiper-pagination-bullet-active{background-color:#fff; opacity:1;}
#main-2{ background-color:#EDF2F9}
#main-2 .main2 .main2L{padding-top:40px; padding-bottom:40px;}
#main-2 .main2 .main2L h1{margin: 0 0 10px;line-height: 1.4;font-size: 38px;font-weight: bold;}
#main-2 .main2 .main2L h5{margin: 0 0 30px;font-size: 15px;line-height: 1.5;word-break: keep-all;}
#main-2 .main2 .main2L .main2THRF{display: inline-block;padding: 10px;font-size: 17px;background-color:#000; color:#fff;text-decoration:none;font-weight:bold;}
#main-2 .main2 .main2L .main2THRF:before{background-color:#fff;}
#main-2 .main2 .main2L .main2THRF:hover{color:#000; font-weight:bold;}
#main-2 .main2 .main2L .main2THRF .arrow{width: 30px;height: 15px;background-position: center;background-size: contain;background-repeat: no-repeat;display: inline-block;margin: 0 5px;}
#main-2 .main2 .main2R .main2RM{height:325px;display: flex;flex-direction: row;flex-wrap: nowrap;align-content: center;justify-content: space-evenly;align-items: center;}
#main-2 .main2 .main2R .main2RM a{text-decoration:none; color:#000;}
#main-2 .main2 .main2R .main2RM .main2BTN{display:inline-block;}
#main-2 .main2 .main2R .main2RM .main2BTN .IMGM{width:98px; height:97px;margin:15px;position:relative;}
#main-2 .main2 .main2R .main2RM .main2BTN .IMGM .IMG{position:absolute;width:100%;height:100%;background-size:cover;background-repeat:no-repeat;background-position:center;}
#main-2 .main2 .main2R .main2RM .main2BTN .IMGM .NHV{opacity:1;}
#main-2 .main2 .main2R .main2RM .main2BTN .IMGM .HV{opacity:0;}
#main-2 .main2 .main2R .main2RM .main2BTN .IMGM:hover .NHV{opacity:0; transition: 0.3s all ease;}
#main-2 .main2 .main2R .main2RM .main2BTN .IMGM:hover .HV{opacity:1; transition: 0.3s all ease;}
#main-2 .main2 .main2R .main2RM .main2BTN .Title h1{margin: 0;font-size: 24px;font-weight: bold;letter-spacing: .5px;text-align:center;}
#main-3 .main3{display: inline-flex;width: 100%;flex-direction: row;align-content: center;justify-content: space-between;align-items: flex-start;}
#main-3 .main3 .main3L,
#main-3 .main3 .main3C,
#main-3 .main3 .main3R{max-width:425px;}
#main-3 .main3 .main3T{padding: 50px 0;}
#main-3 .main3 .main3T a{text-decoration:none;}
#main-3 .main3 .main3T .boardT{margin: 0;font-size: 20px;font-weight: bold;letter-spacing: 0.5px;line-height: 1;color: #000;font-family: 'S-CoreDream-3Bold';}
#main-3 .main3 .main3T .boardST{margin: 0;font-size: 22px;letter-spacing: 0.5px;line-height: 2;padding: 0 0 5px;border-bottom: 2px solid #000; display:inline-block; width:100%;}
#main-3 .main3 .main3T .boardST span:nth-child(1){color: #aaa;float:left; width:70%;text-align:left;letter-spacing: -1px;}
#main-3 .main3 .main3T .boardST span:nth-child(2){color: #000;float:right; width:30%; text-align:right;font-weight:bold;letter-spacing:0;}
#main-3 .main3 .main3T ul a{color:#000; text-decoration:none;}
#main-3 .main3 .main3T ul a:hover li h1{font-weight:bold;transition: 0.3s all ease;}
#main-3 .main3 .main3T ul a li{border-bottom: 1px solid #000; line-height: 4;}
#main-3 .main3 .main3T ul a li:last-child{border:none;}
#main-3 .main3 .main3T ul a li h1{margin: 0;line-height: 2;font-size: 19px;display: inline-block;left: initial;}
#main-3 .main3 .main3T ul a li .title{text-align: left;width: 65%;display: inline-flex;align-items: center;justify-content: flex-start;}
#main-3 .main3 .main3T ul a li .title span{text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
#main-3 .main3 .main3T ul a li .regdate{width: 34%;display: inline-flex;align-items: center;justify-content: space-between;}
#main-3 .main3 .main3T ul a li svg{text-align:right;}
#main-4 .main4{height:240px;position:relative;}
#main-4 .main4:hover .main4BG{-webkit-filter: brightness(1);-o-filter: brightness(1);filter: brightness(1);transition: 0.3s all ease;}
#main-4 .main4 .main4BG{position:absolute;background-size:cover;background-repeat:no-repeat; background-position:center;width:100%; height:100%;
-webkit-filter: brightness(0.7);-o-filter: brightness(0.7);filter: brightness(0.7);}
#main-4 .main4 .main4TM{position: absolute;left: 50%;top: 50%;text-align: center;border: none;display: block;transform: translate(-50%,-50%);}
#main-4 .main4 .main4TM h1{margin: 0;font-weight: bold;color: #fff;font-size: 20px;}
#main-4 .main4 .main4TM hr{border-color: #fff;border-width: 3px;margin: 15px auto;width: 30%;}
#main-4 .main4 .main4TM h5{color: #fff;font-size: 15px;letter-spacing: .5px;}

@media (min-width:1430px) {
    .container{width:1430px;}}
@media (min-width:1700px) and (max-width:1999px) {
	#main-1 .main1R .main1RT{height:78%;}
}
@media (min-width:1500px) and (max-width:1699px) {
	#main-1 .main1R .main1RT{height:72%;}
	#main-1 .main1R .main1RB .main1RSDM{padding: 30px 30px;}
	#main-1 .main1R .main1RT .sermonM h1{margin: 60px 0 0;}
}
@media (min-width:1200px) and (max-width:1499px) {
	#main-1 .main1L{width:100%;}
	#main-1 .main1R{width:100%;}
	#main-1 .main1R .main1RT{margin: 15px 15px 0 0;width: 66.5%;display:inline-block;height:auto;}
	#main-1 .main1R .main1RB{width: 32%; float: right; height:100%;}
	#main-1 .main1R .main1RB .main1RSDM{margin: 15px 0 0 15px;height: 100%;display:inline-grid;align-items: center;}
	#main-1 .main1R .main1RT .sermonHRF{right: 15%;top: 80%;}
	#main-1 .main1R .main1RT .sermonM h1{margin: 40px 0 0;}
	#main-1 .main1R .main1RB .swiper-pagination-clickable{top:15%;}
	#main-1 .main1R .main1RB .main1RSDM .main1RSD .contentSlideWrapper .contentSlide .sermonSUBT .title{width:100%;}
	#main-1 .main1R .main1RB .main1RSDM .main1RSD .contentSlideWrapper .contentSlide .sermonSUBT h1{width:100%;}
	#main-2 .main2 .main2R .main2RM .main2BTN .IMGM{margin: 10px;}
	#main-3 .main3 .main3T{padding: 50px 10px;}
	#main-4 .main4{height:140px;}
}

@media (min-width:993px) and (max-width:1199px) {
	#main-1 .main1L{width:100%;}
	#main-1 .main1R{width:100%;}
	#main-1 .main1R .main1RT{margin: 15px 15px 0 0;width: 66%;display:inline-block;height:auto;}
	#main-1 .main1R .main1RB{width: 32%; float: right; height:100%;}
	#main-1 .main1R .main1RB .main1RSDM{margin: 15px 0 0 15px;height: 100%;display:inline-grid;align-items: center;}
	#main-1 .main1R .main1RT .sermonHRF{right: 15%;top: 80%;}
	#main-1 .main1R .main1RT .sermonM h1{margin: 40px 0 0;}
	#main-1 .main1R .main1RB .swiper-pagination-clickable{top:15%;}
	#main-1 .main1R .main1RB .main1RSDM .main1RSD .contentSlideWrapper .contentSlide .sermonSUBT .title{width:100%;padding: 0 0 10px;}
	#main-2 .main2 .main2L,
	#main-2 .main2 .main2R{width:100%;}
	#main-2 .main2 .main2R .main2RM{height: auto; padding: 50px 0;}
	#main-2 .main2 .main2R .main2RM .main2BTN .IMGM{margin: 10px;}
	#main-3 .main3{display: inline-flex; flex-wrap: wrap;}
	#main-3 .main3 .main3L, #main-3 .main3 .main3C, #main-3 .main3 .main3R{max-width:100%;}
	#main-3 .main3 .main3L, 
	#main-3 .main3 .main3C{width:50%;}
	#main-3 .main3 .main3R{width:100%;}
	#main-3 .main3 .main3L .main3T{padding: 30px 10px 0 0;}
	#main-3 .main3 .main3C .main3T{padding: 30px 0 0 10px;}
	#main-3 .main3 .main3R .main3T{padding: 30px 0 30px;}
	#main-4 .main4{width:50%;}
}

@media (min-width:768px) and (max-width:992px) {

	#main-1 .main1L{width:100%;}
	#main-1 .main1R{width:100%;}
	#main-1 .main1R .main1RT{margin: 15px 15px 0 0;width: 66%;display:inline-block;height:auto;}
	#main-1 .main1R .main1RB{width: 32%; float: right; height:100%;}
	#main-1 .main1R .main1RB .main1RSDM{margin: 15px 0 0 15px;height: 100%;display:inline-grid;align-items: center;padding: 25px 20px;}
	#main-1 .main1R .main1RT .sermonHRF{right: 20%;top: 80%;}
	#main-1 .main1R .main1RT .sermonM h1{margin: 40px 0 0;}
	#main-1 .main1R .main1RB .swiper-pagination-clickable{top:15%;right: 15%;}
	#main-1 .main1R .main1RB .main1RSDM .main1RSD .contentSlideWrapper .contentSlide .sermonSUBT .title{width:100%;padding: 0 0 10px;}
	#main-2 .main2 .main2L,
	#main-2 .main2 .main2R{width:100%;}
	#main-2 .main2 .main2R .main2RM{height: auto; padding: 50px 0;}
	#main-2 .main2 .main2R .main2RM .main2BTN .IMGM{margin: 10px;}
	#main-3 .main3{display: inline-flex; flex-wrap: wrap;}
	#main-3 .main3 .main3L, #main-3 .main3 .main3C, #main-3 .main3 .main3R{max-width:100%;}
	#main-3 .main3 .main3L, 
	#main-3 .main3 .main3C{width:50%;}
	#main-3 .main3 .main3R{width:100%;}
	#main-3 .main3 .main3L .main3T{padding: 30px 10px 0 0;}
	#main-3 .main3 .main3C .main3T{padding: 30px 0 0 10px;}
	#main-3 .main3 .main3R .main3T{padding: 30px 0 30px;}
	#main-4 .main4{width:50%;display: inline-block; float: left; height: 190px;}
}

@media (max-width:767px) {
	.row{margin:0;}
	#main-1{padding: 110px 0 20px;}
	#main-1 .main1L{width:100%;}
	#main-1 .main1R{width:100%;}
	#main-1 .main1R .main1RT{margin: 15px 0 0;width: 100%;display:inline-block;height:auto;height: 280px;}
	#main-1 .main1R .main1RT h6{font-size:20px;}
	#main-1 .main1R .main1RT .sermonM h5,
	#main-1 .main1R .main1RT .sermonM p{font-size:15px;}
	#main-1 .main1R .main1RT .sermonM h1{margin: 20px 0 0; line-height: 2;font-size: 24px;}
	#main-1 .main1R .main1RT .sermonHRF{right: 50%; top: 80%;width: 120px; height: 60px;}
	#main-1 .main1R .main1RT .sermonHRF .playBTN, #main-1 .main1R .main1RT .sermonHRF .liveBTN{background-position: center; background-size: cover; background-repeat:no-repeat;}
	#main-1 .main1R .main1RB{width: 100%; float: right; height:100%;}
	#main-1 .main1R .main1RB .main1RSDM{margin: 15px 0 0;height: auto;display:inline-grid;align-items: center;padding: 25px 20px;}
	#main-1 .main1R .main1RB .swiper-pagination-clickable{top:15%;right: 15%;}
	#main-1 .main1R .main1RB .main1RSDM .main1RSD .contentSlideWrapper .contentSlide .sermonSUBT .title{width:100%;padding: 0 0 10px;}
	#main-2 .main2 .main2L{padding:20px 0;}
	#main-2 .main2 .main2L h1{font-size:24px;}
	#main-2 .main2 .main2L,
	#main-2 .main2 .main2R{width:100%;}
    #main-2 .main2 .main2R{text-align:center;}
	#main-2 .main2 .main2L h5{font-size: 15px;margin: 0 0 20px;}
	#main-2 .main2 .main2R .main2RM{height: auto; padding: 20px 0;display: inline-flex;flex-wrap: wrap;}
    #main-2 .main2 .main2R .main2RM a{width:33%;text-align:center;}
	#main-2 .main2 .main2R .main2RM .main2BTN .IMGM{margin: 10px;width: 60px;height: 60px;}
	#main-3 .main3{display: inline-flex; flex-wrap: wrap;}
	#main-2 .main2 .main2R .main2RM .main2BTN .Title h1{font-size:17px;}
	#main-3 .main3 .main3L, #main-3 .main3 .main3C, #main-3 .main3 .main3R{max-width:100%;}
	#main-3 .main3 .main3L, 
	#main-3 .main3 .main3C,
	#main-3 .main3 .main3R{width:100%;}
	#main-3 .main3 .main3L .main3T{padding: 20px 0 0;}
	#main-3 .main3 .main3C .main3T{padding: 20px 0 0;}
	#main-3 .main3 .main3R .main3T{padding: 20px 0 20px;}
	#main-3 .main3 .main3T .boardT{font-size:17px;}
	#main-3 .main3 .main3T .boardST{font-size:17px;}
    #main-3 .main3 .main3T ul a li{line-height:3;}
	#main-3 .main3 .main3T ul a li .title{width:68%; font-size:15px;}
	#main-3 .main3 .main3T ul a li .regdate{width:30%; font-size:15px;}
	#main-4 .main4{width:50%;display: inline-block; float: left; height: 110px;}
	#main-4 .main4 .main4TM{width:100%;}
	#main-4 .main4 .main4TM h1{font-size:17px;}
    #main-4 .main4 .main4BG{background-size:100% 100%;}
}

@media (max-width:320px) {
}
