﻿
/*서브탑*/ 
#subtop{position:relative; margin-top:95px;}

#subgnb { text-align: left; background: transparent; width: 100%; margin-bottom: 20px; }
#subgnb > .container { background: #fff; padding: 0 15px; border-radius: 5px; z-index: 10; }
#subgnb span, #subgnb a { font-size: 18px; color: #777; font-weight: bold; position: relative; text-decoration: none; transform: skew(-0.05deg); }
#subgnb > div > div > div > img { float: left; padding: 11px 15px 15px 5px; position: relative; top: 2px; max-width: 45px; }
#subgnb a.active { color: #294553; font-weight: bold; }
#subgnb .subgnb-home { float: left; margin-top: 15px; margin-right: 0; }

.sub-top-2 { position: relative; }
.sub-top-2 .subtop-bottom { background-color: rgba(255,255,255,1); position: relative; bottom: 0; padding: 2% 0 0%; width: 100%; }
.sub-top-2 .subtop-bottom .subtop-menu ul { text-align: center; display: flex; flex-wrap: wrap; justify-content: center; }
.sub-top-2 .subtop-bottom .subtop-menu ul li { display: inline-block; }
.sub-top-2 .subtop-bottom .subtop-menu ul li a { display: inline-block; padding: 52px 13px 25px; font-size: 17px; font-weight: 700; text-decoration: none; color: #343434; position: relative; }
.sub-top-2 .subtop-bottom .subtop-menu ul li p { display: inline-block; padding: 52px 0px 25px; font-size: 17px; font-weight: 700; text-decoration: none; color: #343434; position: relative; }
.sub-top-2 .subtop-bottom .subtop-menu ul li a .btn-plus { position: absolute; top: 40%; left: 45%; background: #f1592a; width: 6px; height: 6px; border-radius: 50%; text-align: center; opacity: 0; transition: all .3s linear; }
.sub-top-2 .subtop-bottom .subtop-menu ul li a:hover .btn-plus,
.sub-top-2 .subtop-bottom .subtop-menu ul li.active a .btn-plus,
.sub-top-2 .subtop-bottom .subtop-menu ul li a:focus .btn-plus { opacity: 1; }

.subtop-bottom2 { background-color: rgba(255,255,255,1); height: 140px; position: relative; bottom: 0; left: 10px; width: 100%; }
.subtop-bottom2 .subtop-menu ul { text-align: center; display: flex; flex-wrap: wrap; justify-content: center; }
.subtop-bottom2 .subtop-menu ul li { display: inline-block; }
.subtop-bottom2 .subtop-menu ul li a { display: inline-block; margin: 30px 0; width: 420px; padding: 15px 70px; border: solid 1px #dfdfdf; font-size: 17px; font-weight: 700; text-decoration: none; color: #343434; position: relative; }
.subtop-bottom2 .subtop-menu ul li p { display: inline-block; padding: 52px 0px 25px; font-size: 17px; font-weight: 700; text-decoration: none; color: #343434; position: relative; }
.subtop-bottom2 .subtop-menu ul li a:hover, .subtop-bottom2 .subtop-menu ul li.active a, .subtop-bottom2 .subtop-menu ul li a:focus { border: solid 1px #123369; color: #123369; }
.subTitle { position: relative; text-align: center; display:none; }
#sub_title { font-size: 40px; font-weight: 600; border-bottom: 4px solid black; display: inline-block; padding-bottom: 10px; }


/*구파발교회 참고하여 서브메뉴 버튼 추가*/
.sub4-wrapper .sub4 { display: flex; margin-top: 10px; margin-bottom: 50px; }
.sub4-wrapper .sub4 > li { border: 1px solid #DDDDDD; text-align: center; width: 15%; padding: 17px 0; border-bottom: #046CB3 solid 1px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.sub4-wrapper .sub4 .blank-space { flex: 1 0 auto; border: unset; border-bottom: #046CB3 solid 1px; width: unset !important; }
.sub4-wrapper .sub4 > li.active { border: #046CB3 solid 1px; border-bottom: unset; }
.sub4-wrapper .sub4 > li > a { text-decoration: none; color: #878787; font-size: 18px; }
.sub4-wrapper .sub4 > li.active > a { color: #046CB3; font-weight: bold; }



/**/
.board-title{margin-top: 30px;margin-bottom: 30px; position: relative; display: inline-block; transform: translateX(-50%);left: 50%; text-align: center; padding-bottom: 15px; text-align: center; border-bottom: 3px solid #000; font-size: 40px;}
.img-wrap{word-break:keep-all;text-align: center;}
.page-content{word-break:keep-all!important;}

/*버튼*/
.section6-more-btn {display:inline-block; position:relative; text-align: center; transition:0.3s all;border: 3px solid #000;color:#FC5D33; font-size:18px; text-decoration:none;  background:black;border: 3px solid #000;width: 180px;height: 60px;}
.section6-more-btn:hover{ text-decoration:none;color:#FC5D33; }
.section6-more-btn span{position: absolute;top: 50%;left: 50%;width: 100%;transform: translateX(-50%) translateY(-50%);}

/*탭 페이지 S*/
.sub-section1{  height: 620px; background-size: cover;position:relative; min-height:200px; background:url(/UserData/pcltvhp/Layouts/pcltvhp_Layout/Images/sub/four/1.2_titleimg.jpg);}
.sub-section2-back{  height: 620px; background-size: cover;position:relative; min-height:200px; background:url(/UserData/pcltvhp/Layouts/pcltvhp_Layout/Images/sub/outsideview/outsideview.jpg);}
.tab-content-right{transition:0.3s all; position: absolute; top: 0;left: auto; right: 0;height:100%;width:50%;background-size: cover!important; background-position: 50% 50%!important;background-repeat: no-repeat;}

.active-tab{display:block; opacity:1;  transition:150ms all;}
.tab-wrap{position:relative; background-color: #fdb723; width: 260px; padding: 40px 0; text-align: center; position: absolute; top: 140px; left: 50%; z-index: 10; -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);transform: translateX(-50%);}
.tab-top{display: none;padding: 35px 0 0 100px;color: #fdb723; margin: 0 0 30px;}
.tab-header{cursor:pointer;color: #fff;position: relative;-webkit-transition: color .2s ease-in-out;-moz-transition: color .2s ease-in-out;
            -o-transition: color .2s ease-in-out;  transition: color .2s ease-in-out; font-size: 24px; letter-spacing: .72px;}
.tab-header.active-tab, .tab-header:hover{color:#000;}
.tab-header.active-tab:before{content: '';position: absolute; border-bottom: 10px solid transparent; border-top: 10px solid transparent; border-right: 10px solid #fdb723;
    top: 50%; left: -10px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out;}
.tab-content-wrap{min-height:700px; background:black; }
.tab-content-wrap:after{content: "";display: table; clear: both;}
.tab-content-left{word-break:keep-all;padding:75px;height:100%; width:50%;float: left;padding-top: 125px; padding-right: 170px; color:white;}

.each-tab {opacity:0; min-height: 700px;float: left;position: relative;top: 0;left: 0; width: 100%; height: 100%;}

.title{ font-weight:bold; margin-bottom:30px;}
.sub-title{font-size:23px;margin-bottom:30px;}
.content{font-size:20px;}

/*원서클*/
.section2-2-circle {width: 140px;height: 140px;position: relative;display: inline-block;border: 6px solid #fff;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;}
.section2-2-circle p{font-size: 20px; color:white;position: absolute;left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%);}
.circletime-wrap {width: 900px;}
/*탭 페이지 E*/
/*슬라이드 페이지 S*/
.slide-head-title {
    font-size: 35px;
    margin-bottom: 20px;
}
.slide-body-content{font-size:25px; line-height:1.5;margin-bottom:20px;} 
.slide-footer-add li{font-size:25px; line-height:1.5;}

.awana-wrap{position:absolute;left:0;top:0;height:100%;width:100%;display:table;}
.awana-wrap2{display:table-row;}
.awana-wrap3{display:table-cell;vertical-align:middle;}
.sub-slide-section1-back1{  height: 620px; background-size: cover;position:relative; min-height:200px; background:url(/UserData/pcltvhp/Layouts/pcltvhp_Layout/Images/sub//kids/kids_back.jpg);}
.sub-slide-section1-back2{  height: 620px; background-size: cover;position:relative; min-height:200px; background:url(/UserData/pcltvhp/Layouts/pcltvhp_Layout/Images/sub/awana/awana_back.jpg);}
.sub-slide-section1-back3{  height: 620px; background-size: cover;position:relative; min-height:200px; background:url(/UserData/pcltvhp/Layouts/pcltvhp_Layout/Images/sub/discipleship/discipleship_back.jpg);}

.sub-slide-section2{padding-top: 90px; padding-bottom: 90px;   background-color: #fdb723; text-align:center; font-size:25px; color:white;}
.sub-slide-section2 .inner-content p{margin:0px;}

#custom_carousel .item {color: #000; padding: 0px 0; }
#custom_carousel .controls {overflow-x: auto;overflow-y: hidden;padding: 30px 0px; margin: 0; white-space: normal; text-align: center; position: relative;  background: #000}
#custom_carousel .controls li {display: inline-block;}
#custom_carousel .controls li:before { content: '/'; position: absolute;  left: -4px; top: 15px; color: #fff; font-size: 20px; z-index: 999; }
#custom_carousel .controls li:first-child:before {display: none;}
#custom_carousel .controls li.active a {color: white;font-size: 20px; }
#custom_carousel .controls li a { overflow: hidden;display: block; font-size: 20px; margin-top: 5px; font-weight: bold; color: orange;}
/*슬라이드 페이 E*/
.text-clean li{counter-increment: chapter;    padding-left: 1em;  text-indent: -1.1em;}
.text-clean li:before{content: counter(chapter)". "; }
.center-padding p img{padding:0px 5px!important;}
.slide__content{padding-top:50px;}
.ul-secondary li{line-height:1.5;}
.margin-15px{margin:15px 0px;}

.root_daum_roughmap_landing {
    width:100% !important;
}


/*장년교육 > 장년교육*/
#unit6818 > div { text-align: center; }
.edu_01 {left:0 !important;}


@media (max-width:1900px) { }
@media(max-width:1700px){
}
@media(max-width:1400px){
    #unit5748 .col-sm-5 { height: 400px; }
    #unit5748 .col-sm-5 > img { height: 100%; object-fit: cover; }
    #unit5748 .col-sm-7 { padding: 30px !important; }
    #unit27622 > div {padding:30px !important;}

}
@media(max-width:1300px){

    
}
@media(max-width:1199px){
    .circletime-wrap {
        width: 700px;
    }
    /*게시판 subtop 반응형*/
    .board-title-padding {
        padding-bottom: 45px!important;
    }

    /*교회소개 > 새가족 안내*/
    .edu_01 > li > div { font-size: 0.9rem; }
    .edu_01 .edu_011 { width: 160px !important; height: 160px !important; padding-top: 18px !important; margin:auto; }
    .edu_01 .edu_011 > span { font-size: 1.2rem; }

    /*장년교육 > 장년교육*/
    .edu_01 li { width: 210px !important; height: 210px !important; }
}
@media(max-width:991px) {
    /*서브탑*/
    .sub4-wrapper .sub4 > li { width: 20%; }
    .sub4-wrapper .sub4 > li > a { font-size: 14px; }

	/*슬라이드페이지*/
	.awana-wrap{position:relative; padding:15px;}
		
    /*탭페이지 S*/
    .open{left:0px!important;}
    #sub_title{font-size:30px;}
    .tab-wrap{width: 320px; height: 100%;top: 0; z-index: 10; text-align: left; padding: 35px 12px 35px 35px;
    -webkit-transform: none;-ms-transform: none; transform: none; -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out;transition: all .2s ease-in-out; left: -260px;}
    .tab-content-left{padding-top:250px;padding-right:75px;width:100%; height:50%;}
    .tab-content-right{position:relative;width:100%;padding: 35px 20px 50px 90px;height: 250px;}
    .arrow{width: 20px;height: 20px;background-color: #fff;position: absolute; right: 25px;top: 39px; -webkit-border-radius: 50%;
    -moz-border-radius: 50%;border-radius: 50%;}
    .arrow:before {font-family: FontAwesome,FontAwesome;content: '\f104'; position: absolute; color: #fdb723;line-height: 20px;font-size: 18px;font-weight: 700;left: 6px;}
    .be-arrow:before{font-family: FontAwesome,FontAwesome;content: '\f105'; position: absolute; color: #fdb723;line-height: 20px;font-size: 18px;font-weight: 700;left: 8px;}
    .tab-wrap:before{content: ''; position: absolute;  right: -10px; top: 39px; border-bottom: 10px solid transparent; border-top: 10px solid transparent;
    border-left: 10px solid #fdb723;  opacity: 1; -webkit-transition: opacity .2s ease-in-out; -moz-transition: opacity .2s ease-in-out;
    -o-transition: opacity .2s ease-in-out;  transition: opacity .2s ease-in-out;}
    .tab-top{display:block;margin-bottom: 40px;padding-right: 50px;line-height: 1;}
    .tab-header{ max-width: 200px;}
    /*탭페이지 E*/

    /*교회소개 > 예배안내*/
    .worship_01 td { font-size: 13px; padding: 10px !important; }

    /*교회소개 > 새가족 안내*/
    .edu_01 {left:0 !important;}
    .edu_01 > li > div { font-size: 0.9rem; }
    .edu_01 .edu_011 { width: 150px !important; height: 150px !important; padding-top: 18px !important; }
    .edu_01 .edu_011 > span { font-size: 1.2rem; }

    /*교회소개 > 오시는길*/
    #unit2620 > div { padding: 10px !important; }
    #unit2620 > div .col-sm-8 { /*margin-top: 0 !important;*/ font-size: 15px; }
    #unit3044 > div { padding: 40px !important; }
    .map_01 > li {margin-bottom:10px;}

    /*장년교육 > 장년교육*/
    #unit6818 .edu_01 { width: 100%; }
    #unit6818 .edu_01 li { width: 18vw; height: auto; padding-top: 30px; }
    #component9098 #unit2915 > div { padding: 20px !important; }
    .edu_01:before { display: none !important; }
    .board-num_63 .edu_01 > li { width: 18vw !important; height: 18vw !important; }

    /*선교지 > 남아프리카공화국 더반*/
    #unit5748 .col-sm-5, #unit5748 .col-sm-7 { height: 320px !important; }
    .mission_02 { padding: 30px !important; }
    #unit27622 > div { padding: 18px !important; height: auto !important; }
    #unit4531 {margin-top:0 !important;}

    /*부설기관 > 효성어린이집*/
    #unit3044 > div { padding: 20px !important; }
    #unit2142 > div > img { height: 300px; object-fit: cover; object-position: right; }
    #unit1915 > div { height: 300px !important; padding: 20px !important; }
    #unit1915 > div > div:last-of-type { font-size: 0.9rem !important; margin-top: 0 !important; }
    #unit1915 > div > div:first-of-type { font-size: 1.8rem !important; }
    #unit2063 > div {padding:20px !important;}
    
}

@media(max-width:767px){
    
    /*서브탑*/
    #subtop { overflow: hidden; margin-top: 50px; }
    #subtop > img { width: 120vw; max-width: unset; transform: translate(-50%, 0); left: 50%; position: relative; }
    #subgnb a { font-size: 16px; }
    .sub4-wrapper .sub4 > li { width: 20%; }
    .sub4-wrapper .sub4 > li > a { font-size: 12px; }

	/*슬라이드탭*/
	.slide-head-title{font-size:30px; margin-bottom:20px;}
	.slide-body-content{font-size:20px; line-height:1.5;margin-bottom:20px;} 
	.slide-footer-add li{font-size:20px; line-height:1.5;}

    /*서브탑 공통*/
    .sub4-wrapper .sub4 { flex-wrap: wrap; }
    .sub4-wrapper .sub4 > li { width: 50%; border-bottom: 1px solid #DDDDDD; }
    .sub4-wrapper .sub4 .blank-space { border-bottom: unset; }
    .sub4-wrapper .sub4 > li.active { border: #046CB3 solid 1px; border-bottom: #046CB3 solid 1px; }

    /*교회소개 > 오시는 길*/
    .root_daum_roughmap_landing { }
    .wrap_map { height: 300px !important; }
    .map_01 > li img {display:block;}

    /*교회소개 > 원로목사 인사말*/
    #component1793 #unit1748 > div { padding: 10px !important; }
    #component1793 #unit1748 .col-sm-4 { margin-top: 15px; }
    #component1793 #unit1748 .col-sm-4 > div { text-align: center !important; }

    /*교회소개 > 담임목사 인사말*/
    #component3400 #unit1442 > .font-xl { white-space: nowrap; font-size: 1.1rem; }
    #component8652 #unit1247 .row .col-sm-9 { padding: 0; }
    #component8652 #unit1247 .row .col-sm-3 { margin-top: 15px !important; }
    #component8652 #unit1247 .row .col-sm-3 > div { text-align:right; }
    #component8652 #unit1247 .row .col-sm-3 > div > img { width: 50%; }

    /*교회소개 > 당의원 및 선교사 소개*/
    #component5533 > div { display: flex; /*flex-wrap: wrap;*/ }
    #component5533 > div > .col-sm-3 { text-align: center; padding: 0px 5px; line-height: 1; }
    #component5533 > div > .col-sm-3#unit7432 > div > span { font-size: 9px; }
    #component5533 > div > .col-sm-3#unit7432 > div > span.font-l { font-size: 1.125rem; }

    /*교회소개 > 새가족 안내*/
    .edu_01 { flex-wrap: wrap; justify-content: space-around !important; }
    .edu_01:before {display:none !important;}
    .edu_01 > li { width: 45%; margin-bottom: 15px; }
    .edu_01 li + li {margin:0 !important;}
    .edu_01 > li > div { font-size: 0.9rem; }
    .edu_01 .edu_011 { width: 120px !important; height: 120px !important; padding-top: 18px !important; }
    .edu_01 .edu_011 > img {width:30px;}
    .edu_01 .edu_011 > span { font-size: 1.2rem; }

    /*교회소개 > 오시는길*/
    #unit2620 > div .col-sm-8 { text-align: center; margin-bottom: 15px; }

    /*기관소개 공통*/
    #component5327 #unit2828 > div > div:last-of-type { padding: 0 !important; }
    #component5327 #unit2828 > div > div:last-of-type > div { padding: 30px !important; margin-top: 0 !important; }

    /*장년교육 > 장년교육*/
    #unit6818 .edu_01 li { width: 45vw; height:auto; }
    #component9098 #unit2915 > div { padding: 20px !important; }
    .board-num_63 .edu_01 > li { width: 40vw !important; height: 40vw !important; }
    .board-num_63 #unit6818 .edu_01 li { padding-top: 0; justify-content: center; align-items: center; display: flex; flex-wrap: wrap; flex-direction: column; }

    /*다음세대 공통*/
    #unit2063 > div { padding: 20px !important; }

    /*선교지 > 남아프리카공화국 더반*/
    #unit5748 .col-sm-5, #unit5748 .col-sm-7 { height: auto !important; padding: 10px !important; }
    .mission_02 { padding: 30px !important; }
    #unit27622 > div { padding: 18px !important; height: auto !important; }
    #unit4531 { margin-top: 0 !important; }

    /*부설기관 > 효성어린이집*/
    #unit2142 > div > img {height:auto;}
    #unit3044 > div { padding: 20px !important; }
    #unit1915 > div { height: auto !important; padding: 20px !important; }
}