/************* worship_config ***************/
@import url('https://fonts.googleapis.com/css?family=Nanum+Gothic:400,700&subset=korean');
:root{
  --bg:#F6F4EF;
  --card:#FFFFFF;
  --line:#E6E2D8;
  --ink:#26241F;
  --muted:#8A8578;
  --navy:#39456B;
  --navy-ink:#2B3455;
  --sage:#7E9587;
  --sage-bg:#EEF2ED;
  --danger:#B5533C;
  --danger-bg:#F7EAE6;
  --radius:14px;
}
.sol_worship_area {max-width:1200px; margin:0 auto;}

@media screen and (max-width:1200px) {
	.sol_worship_area {max-width:100%;}
}

.worship_config_area {position: relative; width:100%; max-width: 1200px; padding:30px 15px; box-sizing: border-box;}
.wrsp_sbj_val.entry_window {width:300px; height:50px; font-size:22px; text-align: left; vertical-align:middle;}
.wrsp_sbj_val.wrsp_sub_sbj {font-weight:bold; font-size:25px;}
.wrsp_sbj_val {margin-left: 10px;}
.wrsp_sbj_regi_btn.wrsp_btn {padding-top: 15px; padding-bottom: 15px; vertical-align: middle;}
.wrsp_admin_list_btn.wrsp_btn {position:absolute; top:15px; right:120px; vertical-align: middle;}
.wrsp_list_btn {position: absolute; top: 15px; right: 120px; padding: 6px 14px; color: #666666; background: linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%); border: 1px solid #dcdcdc; border-radius: 6px; font-weight: bold; font-size: 15px; text-decoration: none; text-shadow: 0px 1px 0px #ffffff; box-shadow: inset 0px 1px 0px 0px #ffffff; cursor: pointer;}

.wrsp_img_list_btn {position:absolute; top:15px; right:120px; padding: 6px 14px; color: #666666; background: linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%); border: 1px solid #dcdcdc; border-radius: 6px; font-weight: bold; font-size: 15px; text-decoration: none; text-shadow: 0px 1px 0px #ffffff; box-shadow: inset 0px 1px 0px 0px #ffffff; cursor: pointer;}
.wrsp_view_btn {position: absolute; top: 25px; right: 20px; z-index: 9;}
.wrsp_view_btn.wrsp_btn {background: #3199c9;}

.wrsp_cnfg_tbl {width:100%; margin: 20px 0;}
.wrsp_cnfg_tbl th {padding: 10px 0; font-size: 18px; color: #444;}
.wrsp_cnfg_tbl td {padding: 5px 0; text-align: center;}

.wrsp_cnfg_tbl .wrsp_sample td {color:#bbb;}

.wrsp_col_size.entry_window {height: 25px;}
.wrsp_row_edit {font-size: 0;}
.wrsp_row_edit .wrsp_btn {margin: 0 2px;}
.edit_area {display: inline-block; font-size: 0;}
.seq_area {display: inline-block; font-size: 0;}
.wrsp_cnfg_tbl .wrsp_row:first-child .wrsp_row_up_btn {pointer-events: none; cursor: default;}
.wrsp_cnfg_tbl .wrsp_row:last-child .wrsp_row_down_btn {pointer-events: none; cursor: default;}
.wrsp_row_regi_btn.wrsp_btn {width:100%; padding: 10px 6px; font-size: 13px; text-align:center; box-sizing:border-box;}
.wrsp_row_del_btn.wrsp_btn {padding: 6px 6px;font-size: 13px;}

.wrsp_msg {font-size: 13px; color: #dc6b20;}

/* 테이블 구분 */
.wrsp_admin_img_btn {display:block; width:100%; margin:25px auto; padding:15px 0; border:2px solid #eee; border-radius:10px; color:#666; background: linear-gradient(to bottom, #ffffff 5%, #ccc 100%); font-weight:bold; font-size:25px; text-align:center; text-decoration:none; box-shadow: 0px 0px 5px #ccc; box-sizing:border-box;}
.wrsp_admin_img_btn:hover {color:#fff; text-shadow:0px 0px 5px #333;}

.wrsp_tbl_sec_area {}
.wrsp_tbl_sec_admin {padding-bottom:50px;}
.wrsp_tbl_sec_admin:after {contetn:""; display:block; clear:both;}
.wrsp_tbl_sec_admin:last-child {margin-bottom:50px; border-bottom:1px solid #ccc;}
.wrsp_tbl_section_tit {float:left; width:50%; height:35px; margin:0; line-height:35px;}
.wrsp_admin_tbl_btn {float:left; width:calc(15% - 10px); height:35px; margin:0 5px; color:#777; background: linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%); font-weight:bold; font-size: 16px; text-align:center; text-decoration: none; line-height:35px; border: 1px solid #dcdcdc; border-radius:5px; box-sizing: border-box; cursor:pointer;}
.wrsp_row_btn_area {float:left; width:20%; height:35px; line-height:35px;}
.wrsp_row_btn {float:left; width:33.33%; margin:7px 0; color:#888; cursor:pointer}
.wrsp_row_btn i {display:block; width:21px; margin:0 auto; font-size:18px;;}
.wrsp_row_btn:hover i {color:#333;}
.wrsp_tbl_sec_area:first-of-type .wrsp_up_tbl_btn {color:#ccc; pointer-events: none; cursor: default;}
.wrsp_tbl_sec_area:last-of-type .wrsp_down_tbl_btn {color:#ccc; pointer-events: none; cursor: default;}


.wrsp_tbl_sec_add {overflow:hidden;}
.wrsp_tbl_tit_sec {float:left; width:calc(80% - 10px); margin:0 10px 0 0;}
.wrsp_tbl_tit_sec input {width:100%; height:30px; padding-left:10px; line-height:30px;}
.wrsp_add_tbl_btn {float:left; width:50%; height:35px; line-height:35px; color:#777; background: linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%); font-weight:bold; font-size: 16px; text-align:center; border: 1px solid #dcdcdc; border-radius:5px; box-sizing: border-box; cursor:pointer;}



/* 버튼 공통 */
.wrsp_btn {
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #f6f6f6));
	background:-moz-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-webkit-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-o-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:-ms-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
	background:linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0);
	background-color:#ffffff;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #dcdcdc;
	display:inline-block;
	cursor:pointer;
	color:#666666;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 14px;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffffff;
}
.wrsp_btn:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f6f6f6), color-stop(1, #ffffff));
	background:-moz-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-webkit-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-o-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:-ms-linear-gradient(top, #f6f6f6 5%, #ffffff 100%);
	background:linear-gradient(to bottom, #f6f6f6 5%, #ffffff 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f6f6', endColorstr='#ffffff',GradientType=0);
	background-color:#f6f6f6;
}
.wrsp_btn:active {
	position:relative;
	top:1px;
}
.wrsp_view_btn {
  color: rgba(255,0,0,0.6);
}
.wrsp_view_btn:hover {
	background: #3c528c;
  border: 1px solid #3c528c;
  color: #fff;
}

.wrsp_add_row_btn {width: 100%; margin: 10px 0; padding: 10px 0; background-color: #ddd; color: #777; border:none; box-shadow: 0px 1px 1px #ccc; font-size: 13px; text-align: center; border-radius:3px; font-weight:bold; cursor:pointer;}
.wrsp_add_row_btn:hover {box-shadow: inset 0px 1px 1px #ccc;}

/* 입력창 공통 */
.entry_window {width:98%; box-shadow: 0px 2px 2px inset rgba(0,0,0,0.1); background-color:#f9f9f9; height:37px; border-radius:2px; border:1px solid #d1d1d1; padding:0 10px; box-sizing:border-box; font-size:15px; text-align: center; color: #444;}

/* 컬러 피커 */
.sp-replacer.sp-light.full-spectrum {position: absolute; top: 17px; right: 190px;}
.full-spectrum .sp-palette {max-width: 200px;}

/* 이미지 등록 */
.wrsp_img_regi_area {margin:60px 0 0; border:1px solid #ccc; padding:10px; box-sizing:border-box; border-radius:3px;}
.wrsp_img_tit {margin-bottom:10px; font-size:15px; font-weight:bold; color:#444;}
.wrsp_img_add_btn {margin:10px 0;}
.wrsp_img_file_list {padding:0;}
.wrsp_img_file_list > li {position:relative; padding:5px 0; border-bottom:1px dashed #ddd; list-style:none;}
.wrsp_img_file_row {position:absolute; top:0; right:0;}

@media screen and (max-width:1020px){
	.worship_config_area {padding:60px 15px 40px;}
	.wrsp_view_btn {top:15px; right:8px; left:auto;}
	.wrsp_img_file {width:200px; margin-bottom:10px;}
	.wrsp_col_size_regi_btn {font-size:13px; padding:5px;}
	.wrsp_row_edit .wrsp_btn {padding:3px;}
	.wrsp_sbj_val.entry_window {width:100%; margin:50px auto 0;}
	.wrsp_sbj_regi_btn.wrsp_btn {display:block; width:100%; padding:5px 0; text-align:center;}
	.wrsp_sbj_regi_btn.wrsp_btn.wrsp_admin_btn {display:inline-block; width:calc(50% - 5px); padding:5px 0; text-align:center;}
	.wrsp_admin_list_btn.wrsp_btn {display:inline-block; width:calc(50% - 5px); padding:5px 0; text-align:center;}
}

@media screen and (max-width:500px){
	.wrsp_tbl_section_tit {width: 40%;}
	.wrsp_admin_tbl_btn {width: calc(20% - 10px);}
}


/************* worship_view ***************/
.worship_view_area {position:relative; padding-bottom:30px;}
/*.wrsp_view_tit {margin:0; height: 80px; line-height: 90px; font-size: 30px; font-weight: 600; font-family:"Nanum Gothic", "맑은 고딕", Malgun Gothic;; color: #333;}*/

.wrsp_view_tbl_tit {font-size:20px;}
.wrsp_view_tbl {width: 100%; margin: 15px 0 50px; border-top:2px solid #ababab; text-align: center; border-collapse:collapse; border-spacing:0px;}
.wrsp_view_tbl caption {margin-bottom: 15px; color: #555; font-weight: bold; font-size: 24px; text-align: left;}
.wrsp_view_tbl thead th {padding: 10px 0; border: 1px solid #e5e5e5; background-color: #f3f3f3; color: #333; font-size: 16px; font-weight: bold; vertical-align:middle;}
.wrsp_view_tbl thead th:first-child {border-left: none !important;}
.wrsp_view_tbl thead th:last-child {border-right: none !important;}
.wrsp_view_tbl tbody th {padding: 11px 0; border: 1px solid #e5e5e5; color: #333; font-size: 16px; font-weight: bold; vertical-align:middle; line-height:1.2;}
.wrsp_view_tbl tbody th:first-child {border-left: none !important;}
.wrsp_view_tbl tbody th:last-child {border-right: none !important;}
.wrsp_view_tbl tbody th:first-child {background-color: #f3f3f3;}
.wrsp_view_tbl tbody td {padding: 11px 0; border: 1px solid #e5e5e5; color: #333; font-size: 15px; vertical-align:middle; line-height:1.2; word-break:keep-all;}
.wrsp_view_tbl tbody td:first-child {border-left: none !important;}
.wrsp_view_tbl tbody td:last-child {border-right: none !important;}
.wrsp_view_tbl tbody tr:nth-of-type(even) td {background-color: #f3f3f3;}

@media screen and (max-width:1020px){
	.wrsp_view_tbl thead th {font-size:13px;}
	.wrsp_view_tbl tbody th {font-size:13px;}
	.wrsp_view_tbl tbody td {font-size:13px;}

	.worship_view_area .wrsp_view_btn {top: 30px; right: 20px; left:auto;}
}
@media screen and (max-width:768px){
	/*.wrsp_view_tit {font-size:18px; text-align:center;}*/
}


/* swiper */
.worship_view_area .swiper-container {margin-bottom:20px;}
.worship_view_area .swiper-container .swiper-button-prev {background-image:url("../img/arrow_left.png"); opacity:0.4;}
.worship_view_area .swiper-container .swiper-button-next {background-image:url("../img/arrow_right.png"); opacity:0.4;}
.worship_view_area .swiper-slide-img {display:block; position: inherit; top: 50%; left: 50%; width:auto; max-width:100%; transform:translate(-50%, -50%);}
.worship_view_area .swiper-wrapper {height:auto;}
.worship_view_area .swiper-slide {width:100%; height:auto;}
/*.swiper-container-3d .swiper-slide-shadow-left {background-image:none !important;}
.swiper-container-3d .swiper-slide-shadow-right {background-image:none !important;}*/

/* mini */
.wrsp_view_tbl_mini col:nth-of-type(1) {width:20%;}
.wrsp_view_tbl_mini col:nth-of-type(2) {width:30%;}
.wrsp_view_tbl_mini col:nth-of-type(3) {width:30%;}
.wrsp_view_tbl_mini col:nth-of-type(4) {width:20%;}


/* 예배안내 환경설정 */
.wrsp_config_cont {
  width: 100%; margin:0 auto;
}
.sol_wrsp_topbar{
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:26px; gap:16px; flex-wrap:wrap;
}
.sol_wrsp_topbar .sol_wrsp_tit{
  position: relative; font-size:2.2rem; padding-left: 15px;
}
.sol_wrsp_topbar .sol_wrsp_tit::before {
  position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  display:inline-block; width:8px; height:8px; border-radius:50%; background: var(--base-color-darkblue); content: '';
}
.wrsp_mode_toggle{
  display:inline-flex;background:#EFEBE2;border-radius:999px;padding:3px;gap:2px;
}
.wrsp_mode_toggle button{
  border:none;background:transparent;padding:8px 18px;border-radius:999px;
  font-size: 1.4rem; font-weight:600;color:var(--muted);cursor:pointer;
  font-family:inherit;transition:.15s;
}
.wrsp_mode_toggle button.active{
  background: var(--base-color-darkblue);color:#fff;
}
.wrsp_mode_toggle button:focus-visible{
  outline:2px solid  var(--base-color-darkblue);outline-offset:2px;
}
.sol_wrsp_cont {
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:22px 24px;margin-bottom:18px;
}
.sol_wrsp_item {
  margin-top: 30px;
}
.sol_wrsp_sub_tit {
  display:flex; justify-content: space-between; align-items: center; font-size: 1.6rem; color:var(--muted); 
  margin-bottom: 15px;
}
.sol_wrsp_cont .ipt_txt {
  width: 100%;
}
/* 이미지 업로드 */
.wrsp_config_cont .ipt_file {
  display: none;
}
.wrsp_img_drop{
  border:1.5px dashed var(--line);border-radius:12px;padding:22px;text-align:center;
  background:#FCFBF8;cursor:pointer;position:relative;margin-top:6px;
}
.wrsp_img_drop:hover{
  border-color: var(--base-color-darkblue);
}
.wrsp_img_drop .ipt_file{
  position:absolute;inset:0;opacity:0;cursor:pointer;
}
.wrsp_img_drop .hint{
  font-size:1.4rem; color:var(--muted);
}
.wrsp_img_drop .hint b{
  color: var(--base-color-darkblue);
}
.wrsp_img_preview {
  display:flex; align-items:center; gap: 5px; margin-top:12px;padding:10px 12px;
  background:#FCFBF8;border:1px solid var(--line);border-radius:10px;
}
.wrsp_img_preview img {
  width:64px; height:44px; object-fit:cover; border-radius:6px; border:1px solid var(--line);
}
.wrsp_img_preview .name {
  flex:1; font-size:1.4rem; padding-left: 10px; color:var(--ink);
}
.sol_worship_area .ap_btn.rect {
  line-height: 26px;
}
/* Group cards */
.wrsp_group{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  margin-bottom:16px;overflow:hidden;position:relative;
}
.wrsp_group::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:5px;
  background:var(--tab-color,  var(--base-color-darkblue));
}
.wrsp_group_head{
  display:flex; align-items:center; gap:5px; padding:16px 20px 16px 24px; cursor:pointer;
}
.wrsp_group_head .grip{
  color:var(--muted); font-size: 1.4rem;
}
.wrsp_group_head .count{
  font-size:1.2rem; color:var(--muted); white-space:nowrap;
}
.chev{
  color:var(--muted);
}
.wrsp_group_body{
  padding:4px 24px 22px 24px;border-top:1px solid var(--line);
}
.wrsp_group.collapsed .wrsp_group_body{
  display:none;
}
.settings_row{
  display:flex;gap:22px;flex-wrap:wrap;margin:16px 0 20px;padding:14px 16px;
  background:#FBFAF7;border:1px solid var(--line);border-radius:10px;
}
.settings_block{
  display:flex;flex-direction:column;gap:6px;
}
.settings_block .lbl{
  font-size:12px;font-weight:700;color:var(--muted);
}
.color_swatches{
  display:flex;gap:6px;align-items:center;
}
.swatch{
  width:22px;height:22px;border-radius:6px;border:1.5px solid var(--line);cursor:pointer;
}
.swatch.selected{
  outline:2px solid var(--ink);outline-offset:2px;
}
input[type=color]{
  width:34px;height:26px;border:1px solid var(--line);border-radius:6px;padding:0;cursor:pointer;background:none;
}
.width_inputs{
  display:flex;gap:6px;align-items:center;
}
.width_inputs .ipt_txt.num {
  width: 80px;
}
.width_sum{
  font-size: 1.2rem; font-weight:700; padding:3px 8px; border-radius:6px; background:var(--sage-bg); color:var(--sage);
}
.width_sum.bad{
  background:var(--danger-bg);color:var(--danger);
}

table.wrsp_editor_tbl{
  width:100%;border-collapse:collapse;margin-top:6px;
}
table.wrsp_editor_tbl th{
  font-size:1.4rem; color:var(--muted); font-weight:700;
  padding:4px 6px; line-height: 1.3;
}
table.wrsp_editor_tbl td{
  padding:4px 6px;
}
.row_actions{
  display:flex;gap:4px;justify-content:flex-end;
}
.wrsp_addrow_btn, .wrsp_save_btn{
  width:100%; margin-top:10px;
}
.add_group_btn{
  width:100%; padding:14px; border:1.5px dashed var(--line);background:transparent;border-radius:var(--radius);
  color: var(--base-color-darkblue);font-weight:700; font-size:1.4rem; cursor:pointer; font-family:inherit;
}
.add_group_btn:hover{
  background:#FBFAF7;
}
/* 저장 바 */
.sol_wrsp_savebar {
  position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid var(--line);
  padding:14px 20px;display:flex;justify-content:center;gap:10px;z-index:20;
}
.sol_wrsp_savebar .inner{
  max-width: 1200px; width:100%;display:flex;justify-content:flex-end;gap:10px;align-items:center;
}
.save_msg {
  font-size: 1.4rem; color:var(--sage);font-weight:600;margin-right:auto;opacity:0;transition:opacity .3s;
}
.save_msg.show {
  opacity:1;
}
.hidden{display:none !important;}

@media screen and (max-width: 768px) {
  .sol_wrsp_cont {
    padding: 20px 15px;
  }
  .wrsp_group_head, .wrsp_group_body {
    padding: 15px;
  }
  .settings_row {
    padding: 10px; margin-top: 0;
  }
  .width_inputs .ipt_txt.num {
    width: 23%;
  }
  .sol_worship_area .ap_btn.rect {
    width: 20px; height: 20px; line-height: 18px;
    font-size: 1rem; margin-top: 5px;
  }
  .sol_worship_area .ap_btn.rect i {
    font-size: 10px;
  }
  table.wrsp_editor_tbl td {
    padding: 3px;
  }
  .wrsp_img_preview {
    flex-wrap: wrap;
  }
  .wrsp_img_file {
    width: 100%;
  }
  .wrsp_img_preview .name {
    width: 180px;
    word-break: break-all;
    line-height: 1.3;
  }
}