@charset "utf-8";

@import url("board.css");
/*
  Project _ CSS Init
  FileName _ sub.css - (신규 서브 레이아웃 영역)
  Author _ 쮸양~★
  Date _ 2025. 07. 22
  Last _ 
*/


.sub {overflow:hidden;}
#wrap {position:relative; width:100%; box-sizing:border-box;}
/******************************************************************************************************************************************
	subVisual CSS (서브비주얼) - 쮸양~★
*******************************************************************************************************************************************/
.hidden {display:none;}

.txtBox {background: #fafafa; padding: 20px 20px; border: 1px solid #ddd; border-radius: 20px 0px; font-size: 18px; margin-bottom: 10px;}

#subVisualBox {position:relative; height:400px; width:100%; box-sizing:border-box; z-index:0;}
#subVisualBox .subVisual {position:relative; top:200px; left:0px; width:95%; max-width:1400px; margin:0px auto; display:flex; align-items:center;}

/* 신규비주얼이미지- 25.07.22 */
.new_attraction {background:url("../images/main/mainVi_01.jpg") no-repeat center 0; background-size:cover;}
.subVisual .visualTxt {line-height:1.5;}
.subVisual .visualTxt .subTitle {color: #000; font-size: 35px; text-shadow:5px 3px 10px #fff;}
.subVisual .visualTxt .subTitle02 {color: #000; font-size: 35px; display: flex; flex-wrap:wrap; align-items:flex-end; text-shadow:5px 3px 10px #fff;}
.subVisual .visualTxt .pointTxt {color: #00a439;}
.subVisual .visualTxt .numTxt {font-size: 28px; color: #fff; margin-left: 10px; border-radius: 50px; padding: 5px 20px; background: rgba(0,0,0,0.3); text-shadow: none;}

@media screen and (max-width:460px) {
	#subVisualBox {height: 320px;}
	#subVisualBox .subVisual {top: 120px;}
	
	.subVisual .visualTxt .subTitle {color: #000; font-size: 20px; text-shadow:5px 3px 10px #fff;}
	.subVisual .visualTxt .subTitle02 {color: #000; font-size: 20px; display: flex; flex-wrap:wrap; align-items:flex-end; text-shadow:5px 3px 10px #fff;}
	.subVisual .visualTxt .pointTxt {display: block;}
	.subVisual .visualTxt .numTxt {font-size: 18px;}
}




/******************************************************************************************************************************************
	subMenuBox CSS (서브메뉴박스)
*******************************************************************************************************************************************/
.subMenuBox {position:relative; top:-35px; width:95%; max-width:1400px; background:#007877; border-radius:50px; margin:0px auto;}
.subMenuBox .contents_tools {position:absolute; top:10px; right:30px;}

/* 내려오는 메뉴(수정-24.08.06) */
.pagetinfo {position:relative;}
#path {position:relative; width:100%; height:75px; display:block;}
#path p {position:relative; display:flex; flex-wrap:wrap; align-items:center; height:100%;}
#path a {position:relative; width:20%; height:100%; display:flex; align-items:center; box-sizing:border-box; font-size:1.2em; color:#fff; padding:0px 20px;}
#path a::after { content:""; position:absolute; top:0px; right:0px; width:1px; height:100%; display:block; background:rgba(255,255,255,0.2);}
#path a:nth-child(2) {background:none;}
#path a.home {width:75px; background:url("../images/common/icon_home.png") no-repeat center center; padding:0 0px; display:block;}
#path a.home span {text-indent:-5000px; display:block; float:left; background:url("/images/tour/sub/path_line.gif") no-repeat right 4px;}
#path a.select_menu {position:relative; width:calc(90% / 3 - 75px);}
#path a.select_menu span {padding-right:20px; margin-right:20px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
#path a.select_menu span::before { position:absolute; top:50%; right:30px; margin-top:-13px; width:25px; height:25px; content:""; background:rgba(255,255,255,0.2); border-radius:100px;}
#path a.select_menu span::after {position:absolute; top:50%; right:36px; width:13px; height:8px; margin-top:-4px; background:url("../images/common/icon_dropdown.png") no-repeat 0 0px; transition:all 0.3s ease-out; content:''}
#path a.select_menu.on span::after {transform:rotate(180deg)}

.snb_level {width:calc(90% / 3 - 75px); z-index:99; position:absolute; top:76px !important; left: 75px;}
.snb_level ul {border-radius:0px 0px 20px 20px; border:1px solid #00a439; border-top:none; background:rgba(255,255,255,0.9);}
.snb_level li {border-bottom:1px solid #ddd; margin-top:-1px;}
.snb_level li:last-child {border-bottom:none;}
.snb_level li a {padding:6px 21px; color:#111111; font-size:1em; display:block; text-align:left;}
.snb_level li a:hover {color:#fff; background-color:#00a439;}
.snb_level li:last-child a:hover {border-radius:0px 0px 18px 18px;}
.snb_level li.on a {color:#fff; background-color:#00a439;}

.snb_level li.gnbA1on a,
.snb_level li.gnbA2on a,
.snb_level li.gnbA3on a,
.snb_level li.gnbA4on a,
.snb_level li.gnbA5on a,
.snb_level li.gnbA6on a {background-color:#163391; color:#fff;}
.snb_level li:last-child.on a {color:#fff; background-color:#163391; border-radius:0px 0px 18px 18px;}
.snb_level.sbmu {left:419px;}

@media screen and (max-width:769px) {
	/* 서브로테이션메뉴 */
	.subMenuBox {top:-55px;}
	.subMenuBox {border-radius:0px; background:none;}
	.pagetinfo {background:#007877; border-radius:20px 20px 0px 0px; margin:0px auto;}
	
	#path {height:55px;}
	#path a {width:42%; font-size:1em; padding:0px 20px;}
	#path a.select_menu {width:42%;}
	#path a.select_menu span::before {right:10px;}
	#path a.select_menu span::after {right:16px;}
	#path a:nth-child(4n) {position:relative; width:100%; height:50px; border:1px solid #00a439; border-top:none; color:#000; margin:0px auto; border-radius:0px 0px 10px 10px; background:#fff;}
	#path a:nth-child(4n) span::before { background:#00a439;}
	#path a:nth-child(3n)::after {display:none;}
	.snb_level {width:42%; top:56px !important;}
	.snb_level.sbmu { left:380px;}
	.snb_level li a {font-size:0.9em;}
	
	#snb_level3.snb_level {width:100%; top:95px !important;}
}

@media screen and (max-width:460px) {
	#path a.home {width:55px; background-size:20px;}
	.snb_level {left: 55px;}
	.snb_level.sbmu {left:225px;}
}

@media screen and (max-width:360px) {
	#path a.select_menu {width:calc(100% - 55px);}
	.snb_level {width:calc(100% - 55px);}
	#path a.select_menu:first-of-type {width:calc(100% - 55px);}
	#path a:nth-child(3) {display:none;} 
	#path a:last-child {position:relative; width:100%; height:50px; display:flex; border:1px solid #000846; border-top:none; color:#000; margin:0px auto; border-radius:0px 0px 10px 10px; background:#fff;}
	#path a:last-child span::before {background:#000846;}
	.snb_level:last-child {width:100%; top:95px !important;}
}

@media screen and (max-width:320px) {
	
}


/******************************************************************************************************************************************
	container_wrap CSS (서브컨텐츠박스)
*******************************************************************************************************************************************/
#content {position: relative; width:95%; max-width: 1400px; margin: 0px auto; padding: 50px 0px;}
.h3_titleBox {position: relative; width: 95%; max-width: 1400px; margin: 0px auto; margin-bottom:20px;}
.conBox {position: relative; width: 95%; max-width: 1400px; margin: 0px auto;}
h3, h4, h5, h6 {font-weight:500;}
h3 {position:relative; font-size:3em; line-height:1.2; color:#222; clear:both; padding-top:10px; margin-bottom:50px;}
h3 span {color:#00a439;}
h4 {color:#000; font-size:2em; margin-bottom:15px; font-weight:500;}

h3.dotTit {width:100%; display: inline-block; background: url("../images/sub/h4_bl_25.png") no-repeat scroll 0 3px; font-size:25px; font-weight: 700; line-height: 1.2em; margin: 15px 0 20px 0; padding: 0 0 0 35px; color:#005f5e;}
h3.boxTit {position:relative; font-size:25px; text-align: center; font-weight: 700; line-height: 1.2em; margin: 15px 0 0 0; color:#111; border-top: 2px solid #111; border-bottom: 2px solid #111; border-radius: 20px 0px; padding:20px 0px; background: #edf0f9; margin-bottom: 30px;}
h4.dotTit {background: url("../images/sub/h4_bl_25.png") no-repeat scroll 0 3px; font-size:25px; font-weight: 700; line-height: 1.2em; margin: 15px 0 0 0; padding: 0 0 0 35px; color:#005f5e;}
h4.dotTit02 {background: url("../images/sub/h4_bl_25.png") no-repeat scroll 0 3px; background-size:20px; font-size:20px; font-weight: 700; line-height: 1.2em; margin: 15px 0 0 0; padding: 0 0 0 30px; color:#005f5e;}
#content h5 { color: #0074E4; display: block; font-size: 25px; line-height: 1.2em; font-weight: 700; margin: 15px 0;}

.sub_cont_tit {position: relative; padding: 60px 0 30px;}
.cen_h3 {text-align: center; background: none;}
.subText {text-align: center; font-size:18px; color:#111; font-weight: 500; border-bottom: 2px dashed #ddd; padding-bottom: 20px; margin-bottom: 30px;}

.timeNameBox { background: #fafafa; border-radius:10px; padding: 20px; border:1px solid #ddd; display: flex; flex-wrap:wrap; justify-content:space-between; margin-bottom: 30px;}
.timeNameBox p {font-size: 15px;}
.timeNameBox .tit {position: relative; margin-right:10px; color: #111;}
.timeNameBox .tit::after { content: ":"; display: inline-block; color: #111; padding-left:10px;}
.timeNameBox .name {margin-right: 10px;}
.timeNameBox .time,
.timeNameBox .name02 {color: #959595;}

.subConBox { background: #fafafa; border-radius:10px; padding: 20px; border:1px solid #ddd; display: inline-block; flex-wrap:wrap; justify-content:space-between; margin-bottom: 30px; width:100%;}
.subConBox .tit {position: relative; margin-right:10px; color: #111; line-height:200%;}
.subConBox .tit::after { content: ":"; display: inline-block; color: #111; padding-left:10px;}
.subConBox .stit {font-size:16px; font-weight:bold; line-height:30px;}
.subConBox .scon {margin-left:18px;}

/* 타이틀 */
.h_dot02 {position:relative; color:#000; padding-left:60px; font-weight:500; line-height:45px; margin-bottom:15px;}
.h_dot02:before {position:absolute; top:0px; left:0px; width:45px; height:45px; content:""; background:#eee url("../images/sub/h_dot02.png") no-repeat center center; background-size:50%; border-radius:50px;}
.h_dot02 span {font-size:0.92em; color:#555; font-weight:400}


/* 타이틀(텍스트 타입) */
.titleBox { border-top:2px solid #111; padding-top: 10px; border-bottom:2px dashed #ddd; margin-bottom:30px; text-align:center;}
.sub_tit {padding:60px 0px 0px 0px; text-align:center;}
.sub_tit h2 {font-size:calc(1.8rem + 2vw); font-weight:700; color:#222; line-height:1.3;}

.titT1 {line-height:120%; font-weight:500; color:#222;}
.titT2 {font-size:20px !important; line-height:160%; font-weight:400; color:#10297f; letter-spacing:-1px;}
.titT3 {font-size:18px; line-height:160%; font-weight:400; color:#333; letter-spacing:-1px;}

.color_green {color: #00a367 !important;}
.color_org {color: #ff8900 !important;}

/* 도트텍스트타입 */
.dotT1 {padding-left:30px; font-size:18px; background:url("../img/sub/bu_tit02.png") no-repeat left top; margin-bottom:10px; color:#414141;}

/* dl 타입 */
dl.b_tit1 {padding:0 0 0 0; background:none;}
dl.b_tit1 dt {color:#414141; padding-left:30px; margin-bottom:10px; font-size:18px; line-height:160%; background:url("../img/sub/bu_tit02.png") no-repeat left 3px; margin-top:20px;}
dl.b_tit1 dd {color:#555; padding-left:20px; margin-left:30px; font-size:16px; line-height:160%; background:url("../img/sub/bu_tit03.png") no-repeat left 8px; margin-bottom:10px;}

dl.d_dot1 {padding:0 0 0 0; background:none;}
dl.d_dot1 dt {color:#000; padding-left:20px; font-size:18px; background:url("../images/sub/b_dot01.png") no-repeat left 7px; background-size:14px; margin-top:20px; margin-bottom:5px;}
dl.d_dot1 dd {color:#333; padding-left:14px; font-size:15px; background:url("../images/sub/b_dot03_gray.png") no-repeat left 8px; background-size:8px; margin-bottom:5px; margin-left:25px;}


/* ul 타입 */
/* 변경전도트 (20220329)
.b_dot1 {padding:0 0 0 0; background:none;}
.b_dot1 li {color:#414141; padding-left:30px; font-size:18px; line-height:160%; background:url("../images/sub/b_dot01.png") no-repeat left 3px; margin-bottom:15px;}
.b_dot1 li > ul {margin-top:10px;}
*/

.b_dot1 {padding:0 0 0 0; background:none;}
.b_dot1 li {color:#414141; padding-left:20px; font-size:18px; background:url("../images/sub/b_dot_s_03.png") no-repeat 5px 8px; background-size:6px; margin-bottom:5px;}
.b_dot1 li span {position:relative; color:#000; display:inline-block;}
.b_dot1 li span.tit {padding-right:20px; margin-right:15px;}
.b_dot1 li span.stit { font-size:1em; color:#333;}
.b_dot1 li span.tit:before {content:""; width:5px; height:1px; background:#666; display:block; position:absolute; right:0px; top:50%;}
.b_dot1 li > ul {margin-top:7px; margin-bottom: 13px;}
.b_dot1 li > ul> li {padding-left:14px; background:url("../images/sub/ul_dot_03.png") no-repeat left 11px; margin-bottom:2px; background-size: 8.5px; font-size: .9em;}
.b_dot1 li > ul> li > ul {margin-top:10px;}
.b_dot1 li > ul> li > ul >li {padding-left:14px; background:url("../images/sub/ul_dot_01.png") no-repeat left 6px;  margin-bottom:5px;}

.b_dot2 {padding:0 0 0 0; background:none; display:inline-block;}
.b_dot2 li {color:#333; padding-left:20px; font-size:18px; background:url("../images/sub/b_dot03.png") no-repeat left 5px; background-size:15px; margin-bottom:5px;}

.b_dot2_gray {padding:0 0 0 0; background:none; display:inline-block;}
.b_dot2_gray li {color:#333; padding-left:20px; font-size:18px; background:url("../images/sub/b_dot03_gray.png") no-repeat left 5px; background-size:15px; margin-bottom:5px;}

.b_dot2 li span {position:relative; font-size:18px; color:#000; font-weight:400;}
.b_dot2 li > span.ti{width:20% !important; max-width:200px !important; display:inline-block;}
.b_dot2 li > span.ti:before {content:''; position:absolute; top:15px; right:20px; width:1px; height:15px; background:#eee;}

.b_dot3 {padding:0 0 0 0; background:none;}
.b_dot3 li {position:relative; margin-bottom:10px; font-size:15px; line-height:160%; color:#7a7a7a; padding-left:15px; font-weight:500;}
.b_dot3 li::before {content:""; display:block; position:absolute; top:0; left:0; width:7px; height:7px; background:#41a7e1}

.s_dot1 {padding:0 0 0 0; background:none;}
.s_dot1 > li {position:relative; padding-left:12px; list-style:none; font-size:15px; line-height:160%; color:#555; background:none;}
.s_dot1 > li:before {content:''; position:absolute; top:10px; left:0; width:3px; height:3px; border-radius:50%; background:#959595;}

.s_dot2 {padding:0 0 0 0; background:none;}
.s_dot2 > li {position:relative; padding-left:15px; list-style:none; line-height:1.6; color:#959595; background:none;}
.s_dot2 > li:before {content:''; position:absolute; top:10px; left:0; width:4px; height:4px; border-radius:50%; background:#7a9eca;}

/* 교회소개 */
.boxBg_gray { position: relative; padding: 50px 0px; background: #f9f9f9;}
.greetings_Box {width: 95%;display: flex;flex-wrap: wrap;max-width: 1400px; margin: auto;justify-content: space-between;padding: 30px 0;}
.greetings_back {width: 42.5%;/* height: 600px; */padding: 26% 0;border-radius:100px 0px;}
.greetings_Box .picBox {width: 45%; padding: 50px 0px 0px 0px; background: #f9f9f9; border-radius: 50px 0px;}
.greetings_Box .picBox img {width: 100%;}
.greetings_tBox {width: 49.5%;/* padding: 20px 0 0 0px; */text-align: left; line-height: 1.4;  align-items: baseline;display: flex;flex-wrap: wrap;align-items: center;flex-direction: row; align-content: flex-start;}
.greetings_tBox p {font-size: 18px;}
.greetings_tBox>h4 { position: relative; width: 100%;}
.greetings_tBox>h4::before {content: ''; display: block; width: 1.1em; height: 1.1em; margin-right: 10px; vertical-align: middle; background: url(../images/sub/bt_s.png) no-repeat 0 0px / contain;}
h4 span {color:#00a439; font-weight:500;}

.greetings_tBox h5 {position:relative; color:#000;  padding-left:19px; font-size: calc(0.8rem + 0.6vw); margin-bottom:15px;}

.greetings_tBox h5::before {position:absolute; top:-2px; left:-1px; content:""; display:inline-block; width:20px; height:100%; background:url("../images/sub/b_dot_s_04.png") no-repeat left 0px; background-size:16px; margin-bottom:10px;}
.greetings_tBox>h5::before {display: none;}

.greetings_tBox h5 span {font-size:1em; color:#555; font-weight:400}

.greetings_tBox h6 { font-size:1.2em; margin-bottom:15px;}


@media all and (max-width: 1024px) {
  .greetings_Box { padding: 0;}
  .greetings_tBox>h4 {width: 100%;}
 }

@media all and (max-width: 769px) {
	.greetings_Box { padding: 0; justify-content:center;}
	.greetings_back {width: 100%; margin-bottom: 30px;}
	.greetings_tBox {width: 100%;}
 }

@media all and (max-width: 460px) {
	.greetings_Box .picBox {width: 100%; margin-bottom: 20px;}
	
	.sub_tit {padding-top: 0px;}
	
}

/* 핵심 */
h3.tit { text-align: center; width: 100%;}
p.stit { text-align: center; width:100%; font-size: 20px;}
.boxListBox {width: 95%; margin: 0px auto; max-width: 1400px; display: flex; flex-wrap:wrap;}
.boxListBox >li {width: calc(100% / 4 - 20px); margin: 10px 10px; padding: 30px 30px; box-sizing: border-box; border-radius: 20px 0px; background: #007877; color: #fff; font-size:20px; text-align: center;}
.boxListBox >li .num {border-radius: 50px; padding: 5px 30px; color: #fff; background: rgba(0,0,0,0.5); display: inline-block; margin-bottom: 10px;}
.boxListBox >li .num >i {display: block; font-size: 20px; color: #fff000; text-align: center; margin-bottom: 5px;}
.boxListBox >li .pointTxt {color: #00ffff; font-size: 25px;}

/* 섬기는 사람들 */
.peopleBox {position: relative; width: 95%; margin: 0px auto; max-width: 1400px;}
.peopleBox .type05 { display: flex; flex-wrap:wrap;}
.peopleBox .type05 li {width: calc(100% / 5 - 20px); margin: 0px 10px;}
.peopleBox >h3 {text-align: left; border-bottom: 1px solid #111; font-size: 25px; padding-bottom: 10px; margin-bottom: 20px;}
.peopleBox >h3 >i {color: #208600; display: none;}
.peopleBox .picBox { border: 1px solid #ddd; border-radius: 15px 0px;}
.peopleBox .picBox img {width:100%; height: 100%; object-fit: cover; border-radius: 15px 0px;}
.peopleBox .txtBox {padding: 20px 20px; background: #fafafa; border:1px solid #ddd; border-top: none; border-radius: 0px 15px 15px 0px;}
.peopleBox .txtBox h4 {font-size: 18px; color: #111; font-weight: 600; margin-bottom: 5px; border-bottom: 1px solid #111; padding-bottom: 5px;}
.peopleBox .txtBox .btnBox {background: #007877; color: #fff; padding: 5px 15px; border-radius: 50px; display: inline-block; margin-top: 10px; font-size: 13px;}
.peopleBox .txtBox .btnBox a {color: #fff;}

.peopleBox_view { position: relative; width: 95%; margin: 0px auto; max-width: 1400px; display: flex; flex-wrap:wrap;}
.peopleBox_view .picBox {width:40%; margin-right: 50px;}
.peopleBox_view .picBox img {border: 1px solid #ddd; border-radius: 50px 0px; width: 100%; height: 100%; object-fit: cover;}
.peopleBox_view .txtBox {width: calc(100% - 40% - 50px);}
.peopleBox_view .txtBox h3{text-align: left; margin-bottom: 20px; padding-bottom: 10px; border-bottom: 1px solid #111;}
.peopleBox_view .txtBox .txt_email {margin-top: 20px; background: #fafafa; border-radius: 5px; padding: 20px;}
.peopleBox_view .txtBox .txt_email .tit {position: relative; font-weight: 600; margin-right: 10px; padding-left: 10px;}
.peopleBox_view .txtBox .txt_email .tit::before { position: absolute; top: 7px; left:0px; content: ""; background: #222; display: block; border-radius: 100%; width:5px; height: 5px;}
.peopleBox_view .txtBox .txt_email .tit::after { content: ":"; color: #222; display:inline-block; margin-left: 5px;}

@media all and (max-width: 1025px) {
	.peopleBox .type05 li {width: calc(100% / 3 - 20px); margin: 0px 10px; margin-bottom: 20px;}	
}

@media all and (max-width: 460px) {
	.peopleBox .type05 li {width: calc(100% / 2 - 20px);}
	.peopleBox_view .picBox {width: 100%; margin-right: 0px; margin-bottom: 20px;}
	.peopleBox_view .txtBox {width: 100%;}
}

@media all and (max-width: 425px) {
	.peopleBox .type05 li {width:100%; margin: 0px 0px; margin-bottom: 10px;}	
}


/* 예은사역 */
.picList_box { position: relative; width: 95%; margin: 0px auto; max-width: 1400px; display: flex; flex-wrap:wrap;}

.picList_box .picBox {width:100%; margin-bottom: 50px; display: flex; flex-wrap:wrap;}

.picList_box .picBox li {width:calc(100% / 4 - 20px); margin: 0px 10px; margin-bottom: 20px;}
.picList_box .picBox.type03 li {width:calc(100% / 3 - 20px);}
.picList_box .picBox img {border: 1px solid #ddd; border-radius: 50px 0px; width: 100%; height: 100%; object-fit: cover;}
.picList_box .txtBox {width: 100%;}
.picList_box .txtBox h3{text-align: left; margin-bottom: 20px; padding-bottom: 10px; border-bottom: 1px solid #111;}
.picList_box .txtBox p {font-size: 18px; margin-bottom: 10px;}

.picList_box.type2 li .img {height: 200px;}
.picList_box.type2 li img {border-radius:20px 0px 0px 0px;}
.picList_box.type2 li .txt {background: #fafafa; text-align: center; padding:8px 10px; border-bottom: 1px solid #111; border-radius: 0px 0px 20px 20px; font-size: 18px;}

.picList_box.type3 li {width:calc(100% / 3 - 20px);}
.picList_box.type3 li .img {}
.picList_box.type3 li img {border-radius:20px 0px 0px 0px; border: none;}
.picList_box.type3 li .tit { font-size: 20px; color: #00BD33; border-bottom: 2px dashed #ddd; padding-bottom: 10px; border-top: 1px solid #ddd; background: #fff; padding-top: 10px; border-radius: 20px 0px 0px 0px;}
.picList_box.type3 li .t_Box {text-align: center; border-bottom: 1px solid #111; border-radius: 0px 0px 20px 20px; background: #fafafa;}
.picList_box.type3 li .t_Box .stxt {padding:15px 15px;}

@media all and (max-width:769px) {
	.picList_box .picBox li {width:calc(100% / 2 - 20px); margin-bottom: 10px;}
}

@media all and (max-width: 460px) {
	.picList_box .picBox li {width:100%;}
}


/* 어린이집 */
/* 절차스타일 */
.stepBox {}
.stepBox .listBox {display:flex; flex-wrap:wrap; justify-content:flex-start;}
.stepBox .listBox >li {width:100%; margin-bottom:10px; position:relative; box-sizing:border-box;}
.stepBox .listBox >li >i {margin-bottom:10px; border-bottom:2px dashed #ddd; display:block;}
.stepBox .listBox >li .textBox {font-size:18px; display:block; margin-bottom:0px; text-align:center; border:1px solid #ddd; padding: 20px 20px; border-radius: 0px 0px 20px 0px;}
.stepBox .listBox >li ul {text-align:left;}

.stepBox .listBox >li >h4 {text-align: center; font-size: 22px; background: #ee8a39; color: #fff; padding: 10px 15px; border-radius:20px 0px 0px 0px; border-top:2px solid #111; margin-bottom: 0px;}
.stepBox .listBox >li >h4.title02 {background: #42b762;}

/* 2개일경우 */
.stepBox.type2 .listBox >li {width:calc(100% / 2 - 40px); margin:0px 20px; margin-bottom:20px;}
.stepBox .dot_line {margin-bottom:10px; border-bottom:1px dashed #ddd; display:block; padding-bottom:10px;}

@media all and (max-width: 460px) {
	.stepBox.type2 .listBox >li {width:100%; margin-bottom:10px; position:relative; box-sizing:border-box;}
}

/* 공동체 */
.center_guide_box {padding: 35px 35px 35px 230px; background-color: rgba(233, 244, 255, 1); border-radius: 15px; position: relative; width: 95%; margin: 0px auto; max-width: 1400px;}
.center_guide_box::before {content: ""; position: absolute; top: 50%; left: 63px; transform: translateY(-50%); width: 110px; height: 110px; background-color: #fff; border-radius: 300px; }

.center_guide_box.guide_01::before {content: ""; background: #fff url(../images/sub/guide_icon_01.png)no-repeat center; background-size: 60px;}
.center_guide_box.guide_02::before {content: ""; background: #fff url(../images/sub/guide_icon_02.png)no-repeat center; background-size: 60px;}

.center_guide_box span.guide_line {width: 100%; height: 1px; border-top: 1px dashed #b4b4b4; padding: 0; margin: 20px 0; display: block;}

.center_guide_box .btns {width: auto !important;}

.center_guide_box .guide_txt {}
.center_guide_box .guide_txt p {font-size: 18px;}
.center_guide_box .guide_txt span.txt_big {font-size:25px; font-weight: 700; color: #0074E4;}
.overview_info { display: flex; flex-wrap: wrap; justify-content: space-between;}
.overview_info.type2 li {border: 1px solid #ddd; position: relative; width: 24%; margin-right: 1%; margin-bottom: 1%;  padding: 30px 40px; border-radius:20px; text-align: center; transition: .3s;
}

.pro_detailslider {position:relative; padding-bottom:85px; margin:30px 0;}
.pro_detailslider > #detailslider{max-width:1400px; overflow:visible; width:80%;}
.pro_detailslider.fullwidth{width:100vw; left: 50%; transform: translateX(-50%); min-width:1000px;}

.pro_detailslider .swiper-slide {display:flex; flex-wrap:wrap;}

.pro_detailslider .pro_imgBox {width:100%; height:0; padding-bottom: 54.3%; padding-right:50px; position: relative; border-radius: 30px; overflow:hidden;}
.pro_detailslider .pro_imgBox img {position:absolute;top:0;left:0;width:100%; height:100%;object-fit:cover}

.pro_detailslider .swiper-pagination {left:50%; bottom:0; transform: translateX(-50%);}
.pro_detailslider .swiper-pagination span + span {margin-left:10px}
.pro_detailslider .swiper-pagination-bullet {width:15px; height:15px; border-radius: 100%; background-color: #eee; opacity:1}
.pro_detailslider .swiper-pagination-bullet-active {background-color:#212C92}
.pro_detailslider .swiper-slide {opacity:0.2; transition:opacity .5s ease}
.pro_detailslider .swiper-slide.swiper-slide-active{opacity:1}

.pro_detailslider .pro_txtBox {width:100%; display:block; position: absolute; bottom: 0; left: 0; padding: 30px 50px 50px; background: linear-gradient(0deg, rgba(0, 0, 0, .7) 0%, rgba(0, 0, 0, 0) 100%); border-radius: 0 0 30px 30px;}
.pro_detailslider .pro_txtBox h3 {color:#fff !important; padding:5px 0px; display:block; font-weight:700; font-size:1.5em; margin-top:30px; margin-bottom:20px; padding-bottom:20px; border-bottom:2px dotted #eee;}
.pro_detailslider .pro_txtBox p {padding-top: 20px; color: #fff;}
.pro_detailslider .pro_txtBox h3 span {color:#333; font-size:0.9em; font-weight:500; margin-left:30px;}
.pro_detailslider .pro_txtBox ul li {width:100%; margin-bottom:10px;}
.pro_detailslider .pro_txtBox ul li span.tit {display:inline-block; font-weight:500; margin-right:20px;}
.pro_detailslider .pro_txtBox ul li span.stit {display:inline-block; font-size:1em; color:#959595; width:auto;}

.pro_detailslider .pro_step {width:100%; display:block; padding:30px 30px; background:#f9f9f9; border-radius:20px; margin-top:30px;}
.pro_detailslider .pro_step ul li span.text {background:#fff !important;}

.pro_detailslider .pro_txtBox ul li ul li {margin-bottom:0px; font-size:1em;}
.pro_detailslider .pro_txtBox ul li ul li:before {top:12px;}


#detailslider{max-width:1400px; overflow:visible; width:70%;}
.detailslider {position:relative; padding-bottom:85px; margin-bottom:60px;}
.detailslider.fullwidth{width:100vw; left: 50%; transform: translateX(-50%); min-width:1000px;}

.detailslider .imgBox {width:100%; height:0; padding-bottom: 54.3%; position: relative; border-radius: 30px; overflow:hidden;}
.detailslider .imgBox img {position:absolute;top:0;left:0;width:100%; height:100%;object-fit:cover}
.detailslider .swiper-pagination {left:50%; bottom:0; transform: translateX(-50%);}
.detailslider .swiper-pagination span + span {margin-left:10px}
.detailslider .swiper-pagination-bullet {width:15px; height:15px; border-radius: 100%; background-color: #eee; opacity:1}
.detailslider .swiper-pagination-bullet-active {background-color:#212C92}
.detailslider .swiper-slide {opacity:0.2; transition:opacity .5s ease}
.detailslider .swiper-slide.swiper-slide-active{opacity:1}

.detailslider .txtBox {margin-bottom:30px; display:block;}
.detailslider .txtBox p {font-size:1.5em; text-align:center; color:#333; padding:10px 0px; height:110px; font-weight:500; display:-webkit-box; word-wrap: break-word; -webkit-line-clamp:2; -webkit-box-orient: vertical; overflow:hidden; text-overflow:ellipsis;}
.detailslider .txtBox p span {color:#004ea2; padding:5px 0px; display:block; font-weight:700; font-size:1.5em;}


@media all and (max-width:1024px) {
	.overview_info.type2 li {width: 48%;}
}

@media all and (max-width:640px) {
	.overview_info.type2 li {width: 100%; margin-bottom: 20px;}

	.center_guide_box {padding: 50px;}
	.center_guide_box::before {display: none;}

	.pro_detailslider .pro_txtBox {position: relative; background: #fff; padding: 20px 30px;}
	.pro_detailslider .pro_txtBox h3 {color: #101010 !important; font-size: 25px !important;}
	.pro_detailslider .pro_txtBox p  {color: #333; text-align: center;}
}

@media all and (max-width:480px) {
    .center_guide_box {padding: 30px;}
	.center_guide_box .guide_txt p {font-size: 20px; margin-bottom: 20px;}
	.center_guide_box .guide_txt p:last-child {margin-bottom: 0;}
	.center_guide_box .btns {padding: 8px 15px !important; } 

    .pro_detailslider > #detailslider {width: 100%;}
	.pro_detailslider .swiper-slide {}
}



/* 비전 */
.visionBox {width:95%; max-width: 1400px; margin: 0px auto; display: flex; flex-wrap:wrap; justify-content:center;}
.visionBox >.listBox {width: calc(100% / 3 - 40px); margin: 0px 20px; margin-bottom: 20px;}
.visionBox >.listBox >h4 {background: #007877; border-radius: 30px 0px; padding: 30px 30px; text-align: center; box-sizing: border-box; color: #fff; font-size: 22px; width: 100%; margin-bottom: 0px;}
.visionBox >.listBox:nth-child(2) {margin: 0px 20px;}
.visionBox >.listBox i {margin-bottom: 10px; display: block;}
.visionBox >.listBox .txtBox {border: 1px solid #ddd; padding:30px 30px; border-radius:0px 20px 0px 20px; background: #fff;}
.visionBox >.listBox .txtBox .tit {font-size: 20px; font-weight: 500; text-align: center; margin-bottom: 10px; border-bottom: 2px dashed #ddd; padding-bottom: 10px; color: #007877;}
.visionBox >.listBox .txtBox .stxt {text-align: center; color: #111; font-size: 18px;} 

/*오시는길*/
.two_Out_Box {display: flex; flex-wrap: wrap; justify-content: space-between; width: 95%; max-width: 1400px; margin: 0px auto;}
#map {border-radius: 50px; overflow: hidden; width: 50%;}
.two_Box_gil { width:calc(50% - 120px); padding: 20px 60px 20px;}
.two_Box_gil .two_Box_in_01 {width: 100%; margin-bottom: 50px;}
.two_Box_gil .two_Box_in_02 {width: 100%;}
.two_Box_gil .b_dot1 { margin-left: 10px;}


@media all and (max-width: 1024px) {
  .two_Box_gil .two_Box_in_01 {  padding: 20px; height: auto !important;}
  .two_Box_gil .two_Box_in_02 {padding-top: 0; padding: 20px;}
 }

 @media all and (max-width: 769px) {
	#map {width: 100%; margin-bottom: 30px;}
	.two_Box_gil {width: 100%;}
	 
	 .boxListBox >li {width:calc(100% / 2 - 20px); margin-bottom: 20px;}
	 
	 .visionBox >.listBox {width: 100%; margin-bottom: 20px;}
	 .visionBox >.listBox:nth-child(2) {margin: 0px 20px; margin-bottom:20px;}
 }

 @media all and (max-width: 480px) {
  .two_Box_gil {padding: 0; text-align: center;}
  #map {height: 300px;}
	 .boxListBox >li {width: 100%; margin-bottom: 20px;}
	 
	 .visionBox >.listBox:nth-child(2) {margin: 0px 0px; margin-bottom: 20px;}
	 .visionBox >.listBox {width: 100%; margin-bottom: 20px;}
}

.history {position:relative; width:95%; max-width:1400px; margin:0px auto;}
.sub_cont_tit {position:relative; border-radius:0px 0px 50px 50px; border-bottom:3px solid #ddd;}
.history .sub_cont_tit h3 {text-align:center; color:#007877;}
.history .history_list {position:relative; padding: 0px 0 100px;}
.history .history_list strong {font-size: 50px; color: #222;padding: 50px 80px; width:50%; text-align: right;}
.history .history_list b {font-size: 20px; color: #222;}
.history .history_list ul {padding: 50px 100px;width:50%;position: relative;}
.history .history_list ul li {padding-left: 80px; padding-bottom:19px; margin: 20px 0; position: relative; border-bottom:1px dashed #ddd;}
.history .history_list ul li b { position: absolute; left: 0; top: 0; line-height: 1.3;}
.history .history_list ul li span {display:block;}
.history .history_list > div {display: flex; width: 100%;flex-wrap: wrap; position: relative;}
.history .history_list > div::after { content: ""; width: 10px;height: 10px; background: #18a474;  border-radius: 50%; position: absolute; left: 50%;top: 80px;margin-left: -5px; z-index: 2;}
.history .history_list > div::before {content: ""; width: 1px; height:100%;background: #ddd; position: absolute;  left: 50%; top:0px; z-index: 0;}
.history .history_list.type2 > div:nth-child(1n)::before {  top:0;}
.history .history_list > div:nth-child(2n) { flex-direction: row-reverse;}
.history .history_list > div:nth-child(2n) strong { text-align: left;}
.history .history_list > div:nth-child(2n) ul li { text-align: right;padding-left: 0;  padding-right:80px;}
.history .history_list > div:nth-child(2n) ul li b { left: auto; right: 0;}
.history_tit { padding:50px 60px; background: #18a474;color: #fff;width: 480px; height: 480px; position: relative;z-index: 4; overflow: hidden;margin-top: -380px; opacity: 0;  transition: all ease 1s; transition-delay: 1s;}
.history_tit h3 { font-size: 24px;margin: 20px 0 0;font-weight: 600; line-height: 1.5;}
.history_tit::after {content: "SINCE 1968";color: rgb(255 255 255 / 52%);font-size: 90px; line-height: 1;  position: absolute; left: 0;  bottom: -20px; font-weight: 800;  z-index: -1;}
.history_tit.on {opacity: 1;margin-top: -380px;}
/*
.history_bg {width:100%;margin: 0 auto; height: 380px;position: relative;z-index: 1;overflow: hidden;background: url("../images/sub/history_bg_02.jpg") no-repeat center center / cover;}
*/


@media (max-width: 1023px) {
.history_bg  { height: 200px;}
.history_tit.on { margin-top: -40px;opacity: 1;}
.history_tit { margin-top: -40px; padding: 30px; width: 85%; height: auto; }
.history_tit::after { font-size: 60px;}
.history_tit h3 { font-size: 20px;}
.history .history_list {padding: 30px 0 70px;}
.history .history_list strong { width: 100%;  font-size: 30px;  padding: 30px 40px 0; text-align: left;}
.history .history_list ul { width: 100%;padding: 0 30px; }
.history .history_list > div::before {left: 0;top: 50px;  top: -30px; }
.history .history_list > div::after {left: 0;  top: 50px; }
.history .history_list > div:nth-child(2n) { flex-direction: inherit; }
.history .history_list > div:nth-child(2n) ul li { text-align: left; padding-left: 80px;  padding-right: 0; }
.history .history_list > div:nth-child(2n) ul li b { left: 0;right: auto; }
.history .history_list b { font-size: 18px; }
}
@media (max-width: 460px) {

}

/* 주보 */
.inBox >#basicBBS_write {width:100%; padding: 0px 0px;}
.typeBox {display: flex; flex-wrap:wrap; justify-content:space-between;}
.typeBox .type03{width:50%; margin:auto;}
.juboBox {padding: 20px 0px;}
.juboBox li {display: flex; flex-wrap:wrap; justify-content:space-between; margin-bottom: 10px; }
.juboBox li span { position: relative; font-size: 15px; }
.juboBox li span.tit { display:inline-block; width:80px; height:20px; text-align:justify; }
.juboBox li span.tit:after {content:""; display:inline-block; width:100%;}
.juboBox li .txt_cen {width:calc(100% - 200px); position: relative;  text-align: center; background: #fff;}
.juboBox li .txt_cen::before {position: absolute; width: 100%; top: 50%; display: block; border-top: 2px dashed #ddd; content: "";}
.juboBox li .sTxt {width:90px; text-align: right; white-space:nowrap;}
.juboBox li .txt {background: #fff; padding: 0px 10px;}

.juboWrite .titleBox { display: flex; flex-wrap:wrap; align-items:center; padding: 10px 10px; background: #fafafa; border-bottom: 1px solid #111; margin-bottom: 0px;}
.juboWrite .sTitle {font-size: 18px; text-align: center; color: #111; padding: 10px 0px; margin-top: 10px; background: #f5f5dc;}
.juboWrite .titleBox .tit {margin-right: 10px; min-width:100px; font-size: 18px; font-weight: 500;}

.juboWrite table { border-top: 1px solid #111; border-bottom: 1px solid #111;}
.juboWrite table tr {}
.juboWrite table th { background: #fafafa; font-size: 16px; font-weight: 400; min-width: 120px;}
.juboWrite table th,
.juboWrite table td {border-bottom: 1px solid #ddd; padding: 5px 10px;}

 @media all and (max-width: 1025px) {
	.typeBox .type03{width:90%; margin:auto;}
	.typeBox .type03:last-child {width:100%; margin-right: 0px;}
}

@media all and (max-width: 769px) {
	.juboWrite table {display: flex;}
	.juboWrite table tr {display: flex; flex-wrap:wrap;}
	.juboWrite table th,
	.juboWrite table td {width:50%; display:flex; align-items:center; justify-content:center;}
}

 @media all and (max-width: 500px) {
	.typeBox .type03{width:100%; margin-right: 0px;}
}
 @media all and (max-width: 425px) {
	.juboWrite table th,
	.juboWrite table td {width:100%;}
	.juboWrite table td input {width: 100% !important;}
}

/* 출석 */
.searchBox {padding: 10px 20px; border: 1px solid #ddd; border-radius: 5px; width: 95%; margin:20px auto; background: #fafafa;}
.searchBox .selectBox01 {background: #fff;}
.searchBox .dayBox {position: relative;}
.searchBox .dayBox i {position: absolute; right: 10px; top:3px; display: block;}
.clickBox {padding:10px 0px; position: relative; width: 100%; display: block; border-top: 2px solid #111;}
.clickBox li {display: flex; flex-wrap:wrap; justify-content:space-between; margin-bottom: 10px; border-bottom: 1px solid #ddd; padding-bottom: 10px; align-items:center;}
.clickBox li span { position: relative;  width:100px; font-size: 15px;}
.clickBox li input[type=checkbox], input[type=radio], input[type=button] {width:20px; height: 20px;}
.clickBox li label .num {border-radius: 10px; background:#b0e0e6; color: #111; margin-right: 10px; padding: 3px 10px;}
.clickBox li .txt_cen {width:calc(100% - 170px); position: relative;  text-align: center; background: #fff;}
.clickBox li .txt_cen::before {position: absolute; width: 100%; top: 50%; display: block; border-top: 2px dashed #ddd; content: "";}
.clickBox li .sTxt {width:70px; text-align: right;}
.clickBox li .txt {background: #fff; padding: 0px 10px;}

/* 성경읽기 */
.listtabWRAP								{display:inline-block; width:100%; overflow-x:auto; overflow-y:hidden; padding:0px;}
.btitleWRAP								{display:inline-block; width:100%; padding:0px;}
.blr_menu									{width:100%; display:inline-block; margin:5px 0 4px 0;}
.blr_menu li								{float:left; background:#FFF; border:1px solid #d4d4d4; margin:0 3px 2px 0;}
.blr_menu li a								{font:11px/30px NanumSquareR; letter-spacing:0em; padding:0px 15px 0 15px; color:#999; text-decoration:none}
.blr_menu li a:hover						{color:#000}
.blr_menu li.selected					{background:#f7d808; border:1px solid #cab001;}
.blr_menu li.selected a					{color:#000; font:11px/30px NanumSquareB;}

.RTW												{width:100%;}
.RTW caption										{display:none;}
.RTW > tbody > * > *							{border-top:1px solid #DEDEDE; border-bottom:1px solid #DEDEDE; margin:0; padding:12px 5px; vertical-align:middle; font:12px NanumSquareR; background:#FFF; line-height:16px;}
.RTW > tbody th								{text-align:center; background:#F1F1F3 !important;}
.RTW > tbody > tr > th						{text-align:center;}
.RTW > tbody > tr > td						{text-align:left;}
.RTW > tbody > tr > td:hover 				{background:#FDFAD7;}
.RTW > tbody > tr > td.nonhover:hover	{background:none !important}



/* 성경통독 */
.tab_menu { position: relative; display: flex; flex-wrap:wrap; border-bottom: 2px solid #111; margin-bottom: 30px;}
.tab_menu >li {margin-right: 5px;}
.tab_menu >li a {font-size: 16px; border: 1px solid #ddd; border-bottom: none; border-radius: 5px 5px 0px 0px; padding:5px 6px; display: block;}
.tab_menu >li.selected a {background: #18a474; color: #fff; border: 1px solid #18a474;}
.graph_box {}
.graph_box .inner {width:100%; display: inline-block; margin-top: 50px;}
.graph_box .graph_listTxt {width:100%; display: flex; flex-wrap:wrap; align-items:center; border-radius: 5px; border: 1px solid #ddd; padding:10px 10px; justify-content:center; background: #fafafa;}
.graph_box .graph_listTxt .listBox {display: flex; flex-wrap:wrap; align-items:center;}
.graph_box .graph_listTxt li {display: flex; align-items:center; margin: 5px 10px;}
.graph_box .gr_bg {width:20px; height:20px; border-radius: 3px; margin-right: 5px;}
.graph_box .gr_bg01 {background:rgba(233, 67, 81, 1);}
.graph_box .gr_bg02 {background:rgba(224, 120, 0, 1);}
.graph_box .gr_bg03 {background:rgba(0, 163, 103, 1);}
.graph_box .gr_bg04 {background:rgba(51, 118, 253, 1);}
.graph_box .gr_bg05 {background:rgba(144, 79, 248, 1);}
.graph_box .gr_bg06 {background:rgba(226, 63, 178, 1);}

.breadTxt_list .tit { font-size: 20px; border-bottom: 1px solid #ddd; padding-bottom: 10px;}
.breadTxt_list .tit .bookchk {width: 20px; height: 20px;}
.breadTxt_list .listViewBox {background: #fafafa; padding: 15px 15px; margin-bottom: 20px; border-radius: 0px 0px 20px 20px; display: flex; flex-wrap:wrap; align-items: center; line-height: 1.8;}
.breadTxt_list .listViewBox .numList {margin-right: 15px; display: flex; align-items: center;}
.breadTxt_list .listViewBox .numList .chp {margin-right: 5px; width: 15px; height: 15px;}


/* 공통폼박스 */
.inBox {width:95%; max-width:1400px; margin:0px auto; padding:30px 50px; border:1px solid #dcdcdc; background:#FFF; border-radius: 50px 0px;}

.inBox h2.title {font-size:40px;}
.inBox h2.title span {font-size:40px;}


.inBox input.inputcss						{position:relative; padding:0px 20px; width:100%; height:60px; font-size:20px; font-weight:500; border:1px solid #dcdcdc; z-index:1; box-sizing: border-box;}
.inBox input::-webkit-input-placeholder	{font-size:15px; line-height:60px; color:#C6C6C6; letter-spacing:0em;}
.inBox input::-moz-placeholder			{font-size:15px; line-height:60px; color:#C6C6C6; letter-spacing:0em;}
.inBox input:-moz-placeholder			{font-size:15px; line-height:60px; color:#C6C6C6; letter-spacing:0em;}
.inBox input:-ms-input-placeholder		{font-size:15px; line-height:60px; color:#C6C6C6; letter-spacing:0em;}
.inBox input.login_pw 					{margin-top:-1px;}
.inBox input.login_btn 					{width:100%; height:50px; margin-top:15px; font-size:22px; color:#fff; background:#ee7500; letter-spacing:-0.05em; border:0; cursor:pointer;}
.inBox input.login_btn:hover 			{background:#de6800;}
.inBox .nologinWRAP						{ width:100%;}
.inBox .login_none						{position:relative; width:100%; margin-bottom:90px;}
.inBox a.nologin_btn 					{width:100%; height:50px; font-size:22px; color:#fff; background:#ee7500; letter-spacing:-0.05em; text-align:center; padding:7px 20px;}
.inBox a.nologin_btn:hover 				{background:#de6800;}

.inBox .login_help						{margin-top:15px; text-align:right; }
.inBox .login_help a					{font-size:15px; color:#8c8c8c;}
.inBox .login_help a:hover				{color:#ee7500;}
.inBox .login_help a:not(:last-child):after	{content:""; display:inline-block; margin-right:10px; padding-right:10px; height:12px; border-right:1px solid #CCC; vertical-align:-2px;}
.inBox .login_help label				{font-size:15px; color:#8c8c8c;}

.btnED {margin: 25px auto; text-align: center; display: block; width: 30%; height: 45px;line-height: 45px; background: #007877; border-radius: 45px; color: #fff; font-size: 20px; font-weight: 500;}


.inBox .memjoin_tbl							{width:100%; box-sizing:content-box; box-sizing: border-box;}
.inBox .memjoin_tbl	 ul							{border-bottom:1px dashed #999; padding:5px 0;}
.inBox .memjoin_tbl	 ul.nogap					{border-bottom:none; padding:0px;}
.inBox .memjoin_tbl	 li							{width:100%; text-align:left; display:flex; flex-wrap:wrap; margin:10px auto; align-items:center;}
.inBox .memjoin_tbl	 li span.tit				{width:160px; display:inline-block; border-right: 1px solid #ddd; margin:10px 20px 10px 0px;}

.inBox .memjoin_tbl	 li .blk_title				{display:block; font-size:14px; line-height:34px; color:#000; letter-spacing:0em;}
.inBox .memjoin_tbl	 li .blk_title em			{padding-left:20px; font-size:11px; line-height:34px; color:#000; letter-spacing:0em;}

.inBox .memjoin_tbl	 a.BtnCheck					{display:inline-block; min-width:100px; height:38px; margin-left:-2px; padding:0 15px; background:#ee7500; color:#FFF; border:none; border-radius:0 2px 2px 0; cursor:pointer; font-size:14px; line-height:38px; text-align:center; vertical-align:middle; text-decoration: none; border-radius: 8px; margin: 0px 5px;}

.inputBox01 {width: 50%; min-width: 100px; margin-right: 10px;}
.inputBox02 {width: 40%; min-width: 100px; margin-right: 10px;}
.inputBox03 {width: 30%; min-width: 100px; margin-right: 10px;}
.inputBox04 {width: 20%; min-width: 100px; margin-right: 10px;}
.inputBox05 {width: 10%; min-width: 100px; margin-right: 10px;}

.selectBox01 {border: 1px solid #ddd; border-radius: 5px; padding: 10px 15px;}
.inBox .memjoin_tbl	 .add_01,
.inBox .memjoin_tbl	 .add_02,
.inBox .memjoin_tbl	 .add_03 {width: 100%; margin-bottom: 5px; display: flex; flex-wrap:wrap;}

.infoOK									{margin:20px auto; font-size:15px; line-height:20px; color:#000;} /* 기본 배송지 설정, 수신동의 (Check박스의 Label) */

.inBox .memjoin_tbl	 .file_addplus				{display:inline-block; width:50px; text-align:right;}
.inBox .memjoin_tbl	 .file_addplus a i			{display:inline-block; font-size:24px; line-height:40px; color:#BBB;}
.inBox .memjoin_tbl	 label.error				{float:left; display:block; font-size:11px; line-height:22px; color:#ee7500; margin:5px 10px 0 0;}

@media screen and (max-width:500px) {
	.inBox {padding:0px 0px; border:none;}
	.inBox .btn_r {float:none;}
	.inBox .btn_r.article {width:100%; margin-top:10px;}
	
	.inBox h2.title {font-size: 30px; text-align: center;}
	
	.inBox .memjoin_tbl li span.tit {width: 100%; display:inline-block; border-right: none;background: #fafafa; padding:8px 10px;text-align: center; margin:0px; margin-bottom:10px;}
	
	.inBox .memjoin_tbl li {justify-content:center;}
	.inputBox01 {width: 100%; margin-right:0px;}
	.required {width: 100% !important; text-align: center;}
	.add_01 {justify-content:space-between;}
	.add_01 >input {width: 48% !important;}
	.inBox .memjoin_tbl a.BtnCheck {width: 48%;}
	.custom-select {width: 100%!important;}
	.custom-select >.selectBox01 {width: 100% !important;}
}


/* 공통표 */
.pyoBox {position: relative; width: 95%; max-width: 1400px; margin: 0px auto;}
.pyoBox.type02 { display: flex; flex-wrap:wrap; justify-content:space-between;}
.pyoBox.type02 >table {width: 48%;}
.basePyo {margin-top: 5px; border-top: 3px solid #ff874f;}
.basePyo th {padding: 15px 0; border: 1px solid #d9d9d9; text-align: center;color: #111; font-size: 1.1em;}
.basePyo thead th {padding: 20px 10px 20px 10px; border-bottom: 1px solid #d9d9d9; background: #f9f9f9; font-weight:500; color: #111;}
.basePyo thead th:last-child { border-right:none;}
.basePyo thead tr:last-child th {border-bottom: 1px solid #aaa;}
.basePyo tbody th {padding: 20px 10px 20px 10px; border: 1px solid #d9d9d9;
     background: #f9f9f9; font-weight: 500; color: #111;}  
.basePyo thead tr:first-child th {  /*border-top: 2px solid #151515;*/ border-bottom: 1px solid #aaa;}

.basePyo td { padding: 12px 5px; border: 1px solid #d9d9d9; text-align: center;}

.basePyo th.bln {border-left: none;}
.basePyo td.bln {border-left: none;}
.basePyo th:last-child.brn {border-right: none;}
.basePyo td:last-child {border-right: none;}

.basePyo .tit {margin-right: 10px; color: #036C01;}
.basePyo .txt_time {font-weight: 600;}

@media screen and (max-width:769px) {
	.pyoBox.type02 >table {width: 100%; margin-bottom: 20px;}
}

.txt_org { color:#FF7200;}




/* 페이징 */
.listPaging {width:100%; margin:30px auto; text-align:center}
.listPaging a {display:inline-block;border-radius: 50%;font-size:1em;border:1px solid #111;width: 40px;height: 40px;line-height: 38px;vertical-align: middle; margin: 0px 2px;}
.listPaging strong {display:inline-block;border-radius: 50%;font-size:1em;border:1px solid #111;width: 40px;height: 40px;line-height: 38px;vertical-align: middle; background: #111; color: #fff;}
.listPaging a {color:#555;border: 1px solid #ccc;}
.listPaging a:hover, .listPaging a:active, .listPaging a:focus {text-decoration:underline}
.listPaging span {visibility:hidden; overflow:hidden; position:absolute; top:0; left:0; width:0; height:0; font-size:0; line-height:0} 
.pageBtn:hover, pageBtn:active, pageBtn:focus,.last:hover, .last:active, .last:focus,
.pageprev:hover, .pageprev:active, .pageprev:focus,.prev:hover, .prev:active, .prev:focus {background-color:#f8f8f8}
.pageBtn,.last, .pageprev,.prev {display:inline-block; width:48px; height:48px; vertical-align:middle; border:1px solid #bcbcbc}
.pageBtn {background:url('../images/sub/bbs_next.png') no-repeat 50% 50%}
.last {background:url('../images/sub/bbs_next_end.png') no-repeat 50% 50%}
.pageprev {background:url('../images/sub/bbs_prev.png') no-repeat 50% 50%}
.prev {background:url('../images/sub/bbs_prev_end.png') no-repeat 50% 50%}


/* 사이트맵 */
.siteMapBox {
    width: 100%;
    max-width: 1400px;
    margin: 0px auto;
    display: flex;
    flex-wrap: wrap;
}

.sitemap {
    display: block;
    overflow: hidden;
    width: calc(100% / 5 - 10px);
    margin: 0px 5px;
    margin-bottom: 10px;
}

.sitemap > h3 {
    position: relative;
    background: #000846 none;
    border: 1px solid #000846;
    color: #fff;
    font-size: 20px;
    font-weight: 500;
    line-height: 70px;
    margin: 0;
    padding: 0;
    text-align: center;
    border-radius: 20px 5px;
}

.sitemap > h3::after {
    content: "\eb49";
    position: absolute;
	font-family:xeicon!important;
    right: 20px;
    bottom: 0px;
    display: block;
    background-size: contain;
}

.sitemap > .sitemap_list {
    border: 1px solid #ddd;
    margin-top: 10px;
    padding: 10px 20px 20px;
    position: relative;
	background: #fafafa;
    margin-bottom: 50px;
    border-radius: 20px 5px;
}

.sitemap > .sitemap_list > ul {
    display: block;    
}

.sitemap > .sitemap_list > ul > li {
    position: relative;
    background:#fff;
	border-radius: 5px;
    font-size: 15px !important;
    line-height: 25px;
    padding: 5px 15px;
	margin-bottom: 2px;
	border: 1px solid #ddd;
}

.sitemap > .sitemap_list > ul > li a + ul {
    margin-top: 5px;
    border-radius: 10px 10px 0px 0px;
    padding-top: 5px;
}

.sitemap > .sitemap_list > ul > li > a {
    position: relative;
    padding-left: 20px;
}

.sitemap > .sitemap_list > ul > li > a:before {
    content: "\eb99";
    position: absolute;
	font-family:xeicon!important;
    top: -4px;
    left: 0px;
	color: #666;
    display: block;
}

.sitemap_list > ul > li > ul {
    background: #fff;
    padding-left: 10px;
    display: block;
}

.sitemap_list > ul > li ul:last-child {
    border-radius: 0px 0px 10px 10px;
    padding-bottom: 5px;
    margin-bottom: 5px;
}

.sitemap_list > ul > li > ul > li {
    background: rgba(0, 0, 0, 0) url("/images/tour/sub/ic_li_li_li.gif") no-repeat scroll 0 6px !important;
    font-size: 14px !important;
    line-height: 25px;
    padding-left: 10px !important;
}

@media screen and (max-width: 1200px) {
    .siteMapBox {
        width: 95%;
    }
}

@media screen and (max-width: 769px) {
    .sitemap {
        display: block;
        overflow: hidden;
        width: calc(100% / 3 - 10px);
        margin: 0px 5px;
        margin-bottom: 10px;
    }

    .sitemap > .sitemap_list {
        margin-bottom: 20px;
    }
}

@media screen and (max-width: 460px) {
    .sitemap {
        width:100%;
    }

    .sitemap > h3 {
        font-size: 18px;
        line-height: 50px;
	}
}

@media screen and (max-width: 420px) {
    .sitemap {
        width:100%;
        margin: 0px 0px 10px 0px;
    }

    .sitemap > .sitemap_list {
        margin-bottom: 10px;
    }
}