/******** common ********/
body {max-width: 100%;}
.wrap {overflow: hidden; position: relative; width: 100%; font-size: 1.6rem; font-family: 'KingSejong', serif; color: #333;}
.wrap .pc_area {display: block;}
.wrap .mobi_area {display: none;}
.cont_size_cover {width: 1200px; margin: 0 auto; background:#fff;}
.cont_size {width: 1200px; margin: 0 auto;}
.f_str {font-weight:bold;}

@media screen and (max-width:1200px) {
	.wrap .cont_size {width: 100%;}
	.wrap .pc_area {display: none;}
	.wrap .mobi_area {display: block;}
}

/******** header ********/
.header {position:relative; z-index: 99999;}
.header_cont {background: #fff;}
.header_cont01 {max-width: 1200px; display: flex; justify-content: space-between; align-items: center; padding: 10px 0;}
.header_cont02 {position: relative; display: flex; justify-content: space-between; align-items: center;}

/* header_cont01 */
.menu_page {padding: 0 1em;}
.menu_page > img {display: inline-block; vertical-align: middle;}
.menu_page > span {display: inline-block; color:#9b9b9b; font-size: 1.3rem;}
.menu_page:hover > span {color: #0083c7; font-weight:600;}

.menu_user {display: flex; align-items: center;}
.menu_user > li {position:relative; padding:0 1em;}
.menu_user > li:last-of-type {padding-right:0;}
.menu_user > li+li:before {content:''; position:absolute; top:50%; left:0; width:1px; height:10px; background:#ccc; transform:translateY(-50%);}
.menu_user > li > .link {color:#9b9b9b; font-size: 1.3rem;}
.menu_user > li > .link.login_btn {color:#333;}
.menu_user > li > .link.admin {color:#333; font-weight:600;}
.menu_user > li:hover > .link {color:#0083c7; font-weight:600;}

/* header_cont02 */
.main_top_bg {padding: 10px 0 20px; margin-top: 3px;}
.logo {width: 20%;z-index: 9999999;}
.logo .logo_img {max-width: 200px;}
.menu_top {position: relative; width: 80%; z-index: 9999999;}
.menu_top_fst {display: flex; justify-content: space-between;  color:#444;}
.menu_top_fst > li {position: relative; width: 25%;}
.menu_top_fst > li > .link {display: block; position:relative; padding: 0 23px; line-height: 65px; color:#444; font-size: 2rem; font-weight: 400; text-align: center;}
.menu_top_fst > li:hover > .link {color: #0083c7; font-weight: 600;} 
.menu_top_fst:hover > li > .link:after {content:""; position:absolute; left: 50%; bottom: 0; width:75px; height:1px; background:rgba(0,0,0,0.1); transform: translateX(-50%);}
.menu_top_fst:hover > li:hover > .link:after {background:#0083c7;}

.menu_top_scd {display: none; position: absolute; top: 65px; left: 50%; width: 170px; padding: 15px 0px; box-sizing: border-box; font-size: 1.7rem; text-align:center; transform: translateX(-50%); z-index: 99;}
.menu_top_scd > li {position: relative; padding: 0 15px; box-sizing: border-box;}
.menu_top_scd > li > .link {position: relative; display: block; padding: 10px 3px 6px; box-sizing: border-box;}
.menu_top_scd > li > .link:hover {color: #0083c7; font-weight: 600;}
.menu_top_scd .icon {position: absolute; top: 13px; right: 0; color: #bbb; font-size: 1.6rem;}
.menu_top_scd .icon.fa-plus {font-size: 1.1rem;}
.menu_top_scd > li > .link:hover .icon {color: #016ea7;}


.menu_top_trd {/*display: none;*/ background-color: rgba(255,255,255,0.7); font-size: 1.4rem; box-shadow:1px 1px 2px rgba(0,0,0,0.3); z-index: 99999;}
.menu_top_trd.show {display: block;}
.menu_top_trd > li {border-bottom: 1px solid #eee;}
.menu_top_trd > li > .link {display: block; padding: 8.5px 0; box-sizing: border-box;}
.menu_top_trd > li > .link:hover {color: #016ea7;}

.menu_scd_bg {display:none; position:absolute; top:40px; width:100%; min-height:385px; background:url('../img/main/top_menu_bg.jpg') no-repeat left bottom #fff; z-index:9;}

@media screen and (max-width:1200px) {
	.main_top_bg {padding-top: 0;}
	.logo .logo_img {max-width: 150px;}
	.header_cont01 {display: none;}
	.header_cont02 {padding: 1em 0;}
}

/******** main ********/
.banner_area {position: relative; width: 100%; height: 0; margin-top: 10px; padding-bottom: 38.33%;}
.banner_cont {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.banner_cont img {width:100%;}
.banner_img_tmp {display: block; width: 100%;}
@media screen and (max-width:1200px) {
  .banner_area {margin-top:0;}
}

/* section common */
.main_sec_tit {display:block; margin-bottom: 35px; color:#a50e03; font-size: 3.6rem; text-align: center; transition:all 0.5s;}
.main_sec_tit:hover {letter-spacing: 5px;}


/* section 01 */
.main_sec01 {margin-bottom: 1.5em;}
.main_sec01_cont {padding: 1em 0; background: #021f62;}
.menu_quick {display: flex; justify-content: space-around; align-items: center;}
.menu_quick > li {}
.menu_quick > li > .link {}
.menu_quick > li > .link > .icon {display: block; margin: 0 auto 5px; transition: all 0.7s;}
.menu_quick > li:hover > .link > .icon {transform:rotateY(360deg);}
.menu_quick > li > .link > .txt {display: block; color:rgba(255,255,255,0.5); text-align: center;}
.menu_quick > li:hover > .link > .txt {color:rgba(255,255,255,0.9);}

@media screen and (max-width:768px) {
	.menu_quick > li > .link > .icon {max-width: 45px;}
	.menu_quick > li > .link > .txt {font-size: 1.4rem;}
}

/* section 02 */
.main_sec02 {position: relative; padding: 50px 0; background:#f4f4f4;}
.main_sec02_cont {}
.menu_srm {display: flex; justify-content: space-between;}
.menu_srm > li {position:relative; width: calc((100% - 20px) / 4); padding:25px 15px; background: #fff; border: 1px solid #c9c9c9; box-sizing: border-box;}
.menu_srm > li:before {content:""; position:absolute; top:0; left:50%; width:40%; height:4px; background:#021f62; transform:translateX(-50%); transition: all 0.7s;}
.menu_srm > li:hover:before{width:100%;}
.menu_srm_tit {display:block; margin-bottom: 2em; font-weight: 600; font-size: 2rem; text-align:center;}
.menu_srm_vod {position: relative; height: 120px; margin-bottom: 20px;}
.menu_srm_vod > .srm_video {width: 100%; height: 120px;}
.menu_srm_vod > .bg_play {position: absolute; top:0; width:204px; max-width:100%; height:120px;}
.menu_srm_info {font-size: 1.4rem; line-height: 1.3;}
.menu_srm_info > .sbj {overflow:hidden; width:100%; font-weight:bold; text-overflow:ellipsis; white-space: nowrap; word-wrap:normal;}
.menu_srm_info > .sbj:hover {color:#056561;}
.menu_srm_info > .body {overflow:hidden; width:100%; text-overflow:ellipsis; white-space: nowrap; word-wrap:normal;}
.menu_srm_info > .body:hover {color:#056561;}
.menu_srm_info > .info {margin-top: 1em; margin-top: 10px;}
.menu_srm_info > .info:hover {color:#056561;}
.menu_srm_info > .info > .name {position:relative; padding-right:10px;}
.menu_srm_info > .info > .name:after {content:""; position:absolute; top:11px; right:0; width:1px; height:12px; background:#555; transform:translateY(-50%);}
.menu_srm_info > .info:hover > .name:after {background:#056561;}
.menu_srm_info > .info > .date {padding-left:5px;}

.main_sec02 .swiper-button-next, 
.main_sec02 .swiper-container-rtl .swiper-button-prev {display:none; background-image:url('../img/main/arw_r.png') !important;}
.main_sec02 .swiper-button-next,
.main_sec02 .swiper-button-prev {width: 34px !important; height: 33px !important; background-size: auto !important;}
.main_sec02 .swiper-button-prev, 
.main_sec02 .swiper-container-rtl .swiper-button-next {display:none; background-image:url('../img/main/arw_l.png') !important;}

@media screen and (max-width:1200px) {
	.menu_srm_info > .info > .date {padding-left:0px; display: block;}
}
@media screen and (max-width:768px) {
	.main_sec02 {padding:50px ;}
	.menu_srm > li {max-width:250px;}
	.menu_srm_vod > .bg_play {width:100%; max-width:100%; height: 120px;}
	.main_sec02 .swiper-button-next,
	.main_sec02 .swiper-container-rtl .swiper-button-prev {display:block;}
	.main_sec02 .swiper-button-prev, 
	.main_sec02 .swiper-container-rtl .swiper-button-next {display:block;}
}
@media screen and (max-width:500px) {
	.menu_srm_info > .info > .date {padding-left:5px; display: inline-block;}
	.main_sec02 {padding:50px 80px;}
	.menu_srm > li {width:100%; max-width:100%;}
}
@media screen and (max-width:400px) {
	.main_sec02 {padding:50px;}
}

/* section 03 */
.main_sec03 {padding: 4em 0; background:#3a3a3a;}
.main_sec03_cont {}
.menu_board {display: flex; justify-content: space-between; align-items: center;}
.menu_board > li {width: 30%;}
.menu_board_tit {display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 1em;}
.menu_board_tit > .txt {color:#fff; font-size: 3rem;}
.menu_board_tit > .more {display: flex; padding: 3px 7px 5px; color:rgba(255,255,255,0.5); background:rgba(201,201,201,0.3); border-radius: 25px; transition:all 0.3s;}
.menu_board_tit > .more:hover {color:rgba(255,255,255,1); background:rgba(201,201,201,0.8);}
.menu_board_tit > .more > a {font-size: 1.4rem;}
.menu_board_list {line-height: 1.6;}
.menu_board_list > li {padding-top: 5px; border-bottom: 1px solid rgba(255,255,255,0.2);}
.menu_board_list > li:after {content: ''; display:block; padding-bottom: 5px; border-bottom: 1px solid rgba(255,255,255,0.8); transform: scaleX(0); transition: transform 0.4s ease-in-out; transform-origin:  0% 50%;}
.menu_board_list > li:hover:after {transform: scaleX(1);}
.menu_board_list > li > .link {display:flex; justify-content: space-between; font-size: 1.5rem;}
.menu_board_list > li > .link > .sbj {overflow:hidden; width:calc(100% - 90px); color:rgba(255,255,255,0.6); text-overflow:ellipsis; white-space: nowrap; word-wrap:normal;}
.menu_board_list > li:hover > .link > .sbj {color:rgba(255,255,255,0.8);}
.menu_board_list > li > .link > .date {color:rgba(255,255,255,0.4);}

@media screen and (max-width:768px) {
	.menu_board {flex-direction: column; padding: 0 1em; box-sizing: border-box;}
	.menu_board > li {width:100%; margin-bottom: 2em;}
	.menu_board > li:last-of-type {margin-bottom: 0;}
}

/* section 04 */
.main_sec04 {padding: 4em 0;}
.main_sec_cont {}
.menu_gal_tit {display: flex; justify-content: space-between; margin-bottom: 15px; font-size: 3rem;}
.menu_gal_tit > .more {font-size: 1.8rem; transition: transform 0.7s}
.menu_gal_tit:hover > .more {border-bottom:1px solid #333;}
.menu_gal_list {font-size: 0;}
.menu_gal_list > li {display: inline-block; position: relative; width: calc(100%/4 - 1px); margin-right: 1px; margin-bottom: 1px; font-size: 1.4rem;}
.menu_gal_list > li:last-of-type {margin-right: 0;}
.menu_gal_list > li > .link {position: relative; overflow: hidden; display: block; width: 100%; height: 0; padding-bottom: 62.62%;}
.gal_list_info {display: flex; flex-direction: column; justify-content: flex-end; position: absolute; position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 8%; box-sizing: border-box; background-color: rgba(0,0,0,0.7); color: #fff; line-height: 1.3; font-size: 1.3rem; z-index: 99; opacity: 0; transition: opacity 0.2s;}
.gal_list_info_date {padding-top: 10px;}
.menu_gal_list > li .thumbnail {position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: transform 0.2s; z-index: 9;}
.menu_gal_list .centered {position: absolute; top: 0; left: 0; right: 0; bottom: 0; -ms-transform: translate(50%, 50%); transform: translate(50%, 50%);}
.gal_list_img {display: block; position: absolute; top: 0; left: 0; width: auto; height: 100%; transform: translate(-50%,-50%);}
.gal_list_img.portrait {width: 100%; height: auto;}

/* ¾Ù¹ü È£¹ö È¿°ú */
.menu_gal_list > li:hover .gal_list_info {opacity: 1;}
.menu_gal_list > li .gal_list_info:before,
.menu_gal_list > li .gal_list_info:after {width: 5px; height: 0;}
.menu_gal_list > li .gal_list_info:before {right: 0;top: 0;}
.menu_gal_list > li .gal_list_info:after {left: 0; bottom: 0;}
.menu_gal_list > li:before,
.menu_gal_list > li:after,
.menu_gal_list > li .gal_list_info:before,
.menu_gal_list > li .gal_list_info:after {position: absolute; content: ''; background-color: #fff; z-index: 1; transition: all 0.4s ease-in; opacity: 0.8;}
.menu_gal_list > li:before,
.menu_gal_list > li:after {height: 5px; width: 0%;}
.menu_gal_list > li:before {top: 0; left: 0;}
.menu_gal_list > li:after { bottom: 0; right: 0;}
.menu_gal_list > li:hover .gal_list_info,
.menu_gal_list > li.hover .gal_list_info {opacity: 1;}
.menu_gal_list > li:hover .gal_list_info:before,
.menu_gal_list > li.hover .gal_list_info:before,
.menu_gal_list > li:hover .gal_list_info:after,
.menu_gal_list > li.hover .gal_list_info:after {height: 100%;}
.menu_gal_list > li:hover:before,
.menu_gal_list > li.hover:before,
.menu_gal_list > li:hover:after,
.menu_gal_list > li.hover:after {width: 100%;}
.menu_gal_list > li:hover:before,
.menu_gal_list > li.hover:before,
.menu_gal_list > li:hover:after,
.menu_gal_list > li.hover:after,
.menu_gal_list > li:hover .gal_list_info:before,
.menu_gal_list > li.hover .gal_list_info:before,
.menu_gal_list > li:hover .gal_list_info:after,
.menu_gal_list > li.hover .gal_list_info:after {opacity: 0.1;}

@media screen and (max-width:768px) {
	.main_sec04 {padding: 2em 1em; background: #fff; box-sizing: border-box;}
	.menu_gal_list > li {width:calc(100%/2 - 1px);}
}

#banner-box {padding:1em 0;}

/******** footer ********/
.footer {padding: 3em 0px; background-color: #e5e5e5;}
.footer_cont {display: flex; justify-content: space-between; align-items: center;}
.copy_area {display: flex; flex-wrap: wrap; align-items: center;}
.copy_btn {max-width:340px; margin-right: 2em;}
.copy_btn > span {display: inline-block; padding: 10px 15px; color:#fff; background:#656565;}
.copy_btn > span > .bott_info_link {margin-right: 10px; font-size:1.4rem;}
.copy_info {color: #595959; font-size:1.4rem; line-height: 1.2;}
.copy_info > .copy_txt {}
.copy_info > .copy_txt > .txt {margin-right: 5px;}
.copy_info > .copy_txt.eng {text-transform: uppercase;}
.copy_area > i {}

@media screen and (max-width:1200px) {
	.footer {padding: 2em 1em; box-sizing: border-box;}
}
@media screen and (max-width:768px) {
	.copy_area {flex-direction: column; align-items: flex-start; width: 100%;}
	.copy_btn {display: flex; justify-content: space-between; width: 100%; max-width:100%; margin: 0 0 2em 0; font-size:1.3rem;}
	.copy_btn > span {display: flex; justify-content: space-between; width: calc(50% - 5px); padding:10px; box-sizing: border-box;}
	.copy_info .copy_txt {margin-bottom:1em;}
	.copy_info .copy_txt.eng {margin-bottom:0;}
	.copy_info .pc_hide {display:block;}
}

/******** mobile ********/
.menu_user_mobi {display: none; align-items: center; padding-right: 15px; box-sizing: border-box;}
.menu_user_mobi > li {position:relative; color: #989898; font-size: 1.2rem; font-weight: bold;}
.menu_user_mobi > li+li {color: #686868;}
.menu_user_mobi > li+li:before {content:""; position:absolute; top:50%; left:0; width:1px; height:10px; background: #989898; transform: translateY(-50%);}
.menu_user_mobi > li > .link {padding: 0 5px;}
.menu_user_mobi > li > .link:hover {font-weight:600;}

@media screen and (max-width:1200px) {
	.menu_user_mobi {display: flex; position: absolute; top: 50%; right: 20px; transform: translateY(-50%);}
}

.btn_sand_mobi {position: absolute; top: 50%; right: 5px; padding: 0; background: none; border: 0; transform: translateY(-50%); cursor: pointer;}
.top_menu_mobi_btn_cls {position: absolute; top: 40px; right: 5%; padding: 0; box-sizing: border-box; background: none; border: 0; transform: translateY(-50%);cursor: pointer;}
.btn_sand_mobi > img, .top_menu_mobi_btn_cls > img {}


/* top menu mobile */
.wrap .menu_top_mobi {position: absolute; top: 0; right: -100%; width: 100%; background-color: #fff; box-sizing: border-box; box-shadow: 0px 3px 5px rgba(0,0,0,0.5); z-index: 99999999;}
.menu_top_mobi_logo {position: absolute; top: 15px; left: 2%;}
.menu_top_mobi_logo > .link {display: block;}
.menu_top_mobi_logo .logo_img {display: block; width:auto; max-width:150px;}

.menu_top_fst_mobi {width:90%; margin: 6em auto;}
.menu_top_fst_mobi > li {cursor: pointer;}
.menu_top_fst_mobi > li {border-bottom: 1px solid #e2e2e2;}
.menu_top_fst_mobi > li > .txt {position: relative; display: block; padding: 20px 0; color:#000; font-weight:500; font-size: 2.4rem; border-bottom: 1px solid #e2e2e2;}
.menu_top_fst_mobi > li > .txt:hover {font-weight:600;}
.menu_top_fst_mobi > li > .txt .icon_arw {position: absolute; top: 50%; right: 6%; transform: translateY(-50%); font-size: 1.4rem; opacity: 0.3;}
.menu_top_fst_mobi > li > .txt .icon_arw.active {transform: translateY(-50%) rotate(180deg); opacity: 1;}

.menu_top_scd_mobi {display: none; background: #f3f3f3;}
.menu_top_scd_mobi > li {}
.menu_top_scd_mobi > li > .link {display: block; padding: 10px 5%; font-weight:600; font-size: 1.7rem; color:rgba(36,36,36,0.7);}
.menu_top_scd_mobi > li > .link:hover {color:#fff; background-color: #555;}

.menu_top_trd_mobi {}
.menu_top_trd_mobi > li {}
.menu_top_trd_mobi > li > .link {position: relative; display: block; padding: 10px calc(6% + 20px); font-size: 1.5rem; border-top: 1px solid #e2e2e2; opacity: 0.6;}
.menu_top_trd_mobi > li > .link:hover {color:#fff; background-color: #333;}
.menu_top_trd_mobi > li > .link:before {content: ''; position: absolute; top: 50%; left: 7%; display: block; width: 8px; height: 1px; background-color: #999; transform: translateY(-50%);}


/* footer mobile */
.footer_btn_area {width: 100%; margin-bottom: 10px; text-align: center; font-size: 1.4rem;}
.footer_btn_area > .link {display: inline-block; width: 100px; padding: 5px 15px; border-radius: 20px; border: 1px solid #ccc; color: #999;}
.footer_btn_area > .link:first-of-type {margin-right: 10px;}

/******** top (sub) ********/
.main.sub {}
.main_sub_cont {min-height: 600px;}

/* sub top */
.sub_top_tit_area {height: 110px; text-align: center; border-bottom: 1px solid #ccc;}
.sub_top_tit_area .tit {font-weight: 500; font-size: 3rem; line-height: 110px;}

@media screen and (max-width:768px) {
  .sub_top_tit_area {height: 70px;}
  .sub_top_tit_area .tit {line-height: 70px; font-size: 2.2rem;}
}

/* sub page */
.main_sub_cont .content {padding-bottom: 50px;}
#solution_title_comm {margin-bottom: 20px !important; padding: 0 !important; font-family: 'KingSejong' !important; font-weight: 300 !important; font-size: 3rem !important; color: #333 !important;
}
#solution_title_comm * {margin-bottom: 20px !important; padding: 0 !important; font-weight: 300 !important; font-size: 3rem !important; color: #333 !important;}
#solution_title_comm .top_tit_img {height: auto !important;}
@media screen and (max-width:1200px) {
  .main_sub_cont {min-height: 450px;}
  .main_sub_cont .content {padding: 20px 10px; box-sizing: border-box;}
  #solution_title_comm {min-height: auto !important; text-align: left !important; font-size: 2.5rem !important; line-height: inherit !important;}
  #solution_title_comm * {text-align: left !important; font-size: 2.5rem !important;}
  #solution_title_comm.document_tit {height: 30px;}
}

/* ¹ÝÀÀÇü Å¬·¡½º */
.uotc_100 {width:100% !important;}
.s_board_100 {width:100% !important;}
.media_board_100 {width:100% !important;}
.history_100 {width:100% !important;}
.steward_100 {width:100% !important;}
.member_100 {width:100% !important;}
.yearend_100 {width:100% !important;}
.worship_100 {width:100% !important;}
.weekly_100 {width:100% !important;}
.shichal_100 {width:100% !important;}
.work_100 {width:100% !important;}
.table_100 {width:100% !important;}
