/*교회소개*/
.about{position:relative; }
.about > p{font-size:18px; line-height:145%; }

.about .inner_about1{overflow:hidden; margin:30px 0}
.about .inner_about1 > p{float:left; width:30%; font-size:65px; color:#2a3d4e; font-weight:700;}
.about .inner_about1 > ul{float:left; width:70%;}
.about .inner_about1 > ul li{font-size:20px; color:#2a3d4e; padding:8px 0}

.about .inner_about2 ul{text-align:center; margin-top:30px;}
.about .inner_about2 ul li{display:inline-block; margin:1%;}
.about .inner_about2 ul li p{margin-top:8px; font-size:17px;}

@media screen and (max-width:1024px) {
	.about .inner_about1 > p{width:30%;}
    .about .inner_about1 > ul{float:right; width:65%; margin-left:20px;}

	.about .inner_about2 ul li{width:30%;}
	.about .inner_about2 ul li img{width:100%;}
}
@media screen and (max-width:780px) {
    .about .inner_about1{width:80%; margin:50px auto;}
	.about .inner_about1 > p{float:none; width:100%; margin-bottom:20px;}
    .about .inner_about1 > ul{float:none; width:100%; margin-left:0px;}

	.about .inner_about2 ul li{width:30%;}
	.about .inner_about2 ul li img{width:100%;}
}
@media screen and (max-width:480px) {
    .about > p{font-size:16px;}
	.about .inner_about2 ul li p{font-size:14px;}
}
@media screen and (max-width:320px) {
    .about .inner_about1 > p{font-size:45px;}
	.about .inner_about1 > ul li{font-size:18px;}
}

.work_man .box{margin-bottom:30px;}
.work_man .box > div{display:table-cell; width:38%; color:#555}
.work_man .box > p{display:table-cell; padding-left:30px;}
.work_man .box > p img{border:8px solid #52616f}
.work_man .box > div h3{font-size:24px; font-weight:600; margin-bottom:20px;}
.work_man .box > div p span{color:#666; font-size:13px; display:block; padding:8px 0}
.work_man .box > div p{margin-bottom:10px;font-size:14px; border-bottom:1px solid #ddd; padding-bottom:15px; width:100%;}
.work_man .box > div li{font-size:16px; padding:5px 0}

@media screen and (max-width:1024px) {
	.work_man .box > p img{box-sizing:border-box; }
}
@media screen and (max-width:600px) {
  .work_man .box > div{display:block; width:100%; color:#555; margin-bottom:20px;}
  .work_man .box > p{display:block; padding-left:0px;}
}

.map div{border:1px solid #ddd;}
.map ul{border-top:1px solid #222;margin-top:20px;}
.map ul li{border-bottom:1px solid #ddd; border-bottom:1px solid #ddd;  padding:10px;}
.map ul li span{display:inline-block; width:100px;}

@media screen and (max-width:420px) {
   .map ul li span{display:block;}
}

/*지교회 소개*/
.church h3{font-size:22px; color:#243748; margin-bottom:20px; position:relative; text-indent:60px;}
.church h3:before{position:absolute; content:""; background:#d84b3a; width:50px; height:2px; top:8px; left:0;}
.inner_church{margin-bottom:40px;}
.inner_church div p{display:table-cell; vertical-align:middle;}
.inner_church div p:first-child{padding-right:50px;}
.inner_church div strong{display:block; margin-bottom:10px; font-size:20px; font-weight:normal}
.inner_church div a{display:inline-block; padding:8px 15px; color:#fff; background:#d84b3a; border-radius:50px;}

@media screen and (max-width:420px) {
   .inner_church div p:first-child{padding-right:20px;}
   .inner_church div strong{font-size:18px;}
}
@media screen and (max-width:360px) {
   .inner_church div p{display:block; text-align:center;}
   .inner_church div p:first-child{padding-right:0px;}
   .inner_church div p:last-child{padding:20px;}
}

/*worship*/
.worship table{width:100%;}
.worship table th,
.worship table td{padding:12px 0; font-family:'Noto Sans KR'; font-size:14px; text-align:center; vertical-align:middle;}
.worship table th{background:#576673; color:#fff; font-size:16px;}
.worship table tr:nth-child(odd){background:#ededed;}
.worship table tr:last-child{border-bottom:1px solid #ededed;}

/*introduction*/
#introduction{position:relative;}
#introduction .grid{width:200px; min-height:100px; background:#fff; margin:8px auto; font-size:12px; float:left; border:1px solid #ddd;
	-webkit-transition: top 1s ease, left 1s ease;
	-moz-transition: top 1s ease, left 1s ease;
	-o-transition: top 1s ease, left 1s ease;
	-ms-transition: top 1s ease, left 1s ease;
}
#introduction .grid strong {margin:10px 0; display:block; padding:5px 10px; font-size:16px; color:#222; text-align:center; font-weight:normal}
#introduction .grid p{padding:15px; font-size:16px; text-align:center; color:#555}
#introduction .grid .meta{text-align:right;color:#777;}
#introduction .grid .imgholder img{width:100%; display:block; opacity:1
    -webkit-transform:scale(1);
    transform:scale(1);
    -webkit-transition:0.6s;
     transition:0.6s;
}
#introduction .grid .imgholder{background:#333}

#introduction .grid:hover{border:1px solid #ddd;
   background:rgba(0,0,0,0.5);
   -webkit-transition: background 0.3s;
   -moz-transition: background 0.3s;
   -o-transition: background 0.3s;
   transition: background 0.3s;
   background:#333
}
#introduction .grid:hover .imgholder img{
    opacity:0.7;
    -webkit-transition: opacity 0.6s;
	transition: opacity 0.6s;

   -webkit-transform:scale(0.88,0.88);
   transform:scale(0.88,0.88);


   -webkit-transition:0.4s;
   transition:0.4s;
}
#introduction .grid:hover a strong{color:#fff;}
#introduction .grid:hover a p{color:#fff}

/*찬양*/
.ccm ul {margin:20px 0;}
.ccm ul li{padding:10px 20px; border-bottom:1px solid #ededed;}
.ccm ul li:first-child{color:#d94c3b; line-height:145%;}

/*세대*/
.generation .title{margin-top:30px; background:#2a3d4e; padding:20px; margin-bottom:30px; border-radius:10px;}
.generation .title h4{font-size:16px; color:#fff; font-weight:400; margin-bottom:10px;}
.generation .title h4 span{display:block;}
.generation .title h3{font-size:20px; color:#fff; font-weight:600; margin-bottom:10px;}
.generation .title p{font-size:20px; color:#fff; font-family:'Noto Sans KR'; font-weight:400;}
.generation > ul > li{padding:10px 0; position:relative; text-indent:20px; font-size:18px;}
.generation > ul > li:before{position:absolute; content:""; background:#d84b3a; width:10px; height:2px; top:15px; left:0;}
.generation ul > li > ul > li{padding:5px 20px; font-size:16px;}

.generation table{width:100%; margin-top:20px; border-top:2px solid #2a3d4e}
.generation table th,
.generation table td{padding:10px;  font-family:'Noto Sans KR'; font-weight:400; border-bottom:1px solid #ededed; font-size:15px; vertical-align:middle;}
.generation table th{background:#f3f3f3;}
