/**
* OLYM Cascading Style Sheets
* File Name : contents.css
* Description : 컨텐츠 스타일시트
* Author : Web business Team / Choi Hyun Mi
* Email : desingtj@olym.co.kr
* Date : 2019.12.24
* Update : 2019.12.24
* Copyright(c) 2019 OLYM Communications. All Rights Reserved.
*/

/* 0101_동부창고 > 소개 */
.dbc_box1 .desc_box { display: flex; align-items: center; gap: 80px; margin-bottom: 70px;}
.dbc_box1 .desc_box .p_desc1 { font-family: 'S-CoreDream-7ExtraBold'; font-size: 36px; color: #000;}
.dbc_box1 .desc_box .p_desc2 { line-height: 1.8em;}
.dbc_box1 .pl_box > ul { display: flex; gap: 45px; justify-content: space-between;}
.dbc_box1 .pl_box > ul > li { width: 100%; box-sizing: border-box; padding: 40px 40px 60px 40px;}
.dbc_box1 .pl_box > ul > li h5 { font-size: 18px; color: #000; font-family: 'S-CoreDream-7ExtraBold';}
.dbc_box1 .pl_box > ul > li p { font-size: 14px; font-family: 'S-CoreDream-4Regular'; padding-top: 30px; line-height: 1.8em;}
.dbc_box1 .pl_box > ul > li.bg1 { background: #f0fafd url(/project/design/contents/bg_dbc1.png) no-repeat right bottom;}
.dbc_box1 .pl_box > ul > li.bg2 { background: #e6faf5 url(/project/design/contents/bg_dbc2.png) no-repeat right bottom;}
.dbc_box1 .pl_box > ul > li.bg3 { background: #f4effc url(/project/design/contents/bg_dbc3.png) no-repeat right bottom;}

.vision_box { padding: 30px 0 60px 0;}
.vision_box .title_box { margin: 0 auto 40px auto; border: 1px solid #00a53c; padding: 30px; display: flex; width: 60%; align-items: center; justify-content: center; gap: 20px; position: relative;}
.vision_box .title_box span { font-size: 18px; color: #000; font-family: 'S-CoreDream-7ExtraBold';}
.vision_box .title_box p { font-size: 18px; color: #00a53c; font-family: 'S-CoreDream-7ExtraBold';}
.vision_box .title_box::after { content: ""; width: 1px; height: 40px; background-color: #e1e1e1; position: absolute; bottom: 0; left: 50%; transform: translate(-1px, 41px);}
.vision_box .cont_box > ul { display: flex; gap: 40px; justify-content: space-between; position: relative;}
.vision_box .cont_box > ul::before {content: ""; width: calc(66% + 36px); height: 1px; background-color: #e1e1e1; position: absolute; top: 0; left: 50%; transform: translate(-50%, 0);}
.vision_box .cont_box > ul > li { width: 100%; box-sizing: border-box; border: 1px solid #e1e1e1;background-color: #f4f4f4; position: relative; margin-top: 40px;}
.vision_box .cont_box > ul > li::before { content: ""; width: 1px; height: 40px; background-color: #e1e1e1; position: absolute; top: 0; left: 50%; transform: translate(0, -40px);}
.vision_box .cont_box > ul > li > h5 { padding: 25px; text-align: center;font-size: 18px; color: #000; font-family: 'S-CoreDream-7ExtraBold'; background-color: #fff;}
.vision_box .cont_box > ul > li > ul { padding: 25px 40px; display: flex; flex-direction: column; gap: 20px;}
.vision_box .cont_box > ul > li > ul > li {font-size: 14px; font-family: 'S-CoreDream-4Regular'; position: relative; padding-left: 13px;}
.vision_box .cont_box > ul > li > ul > li::before { content: "- "; position: absolute; left: 0; top: 0; display: inline-block;}


@media all and (max-width:1260px) {
    .dbc_box1 .desc_box { gap: 40px; margin-bottom: 50px;}
    .dbc_box1 .desc_box .p_desc1 { font-size: 28px;}
    .dbc_box1 .pl_box > ul { gap: 30px;}
    .dbc_box1 .pl_box > ul > li { padding: 30px 30px 40px 30px;}
    .dbc_box1 .pl_box > ul > li p { padding-top: 20px;}
    .vision_box .title_box::after { transform: translate(0, 41px);}
    .vision_box .cont_box > ul { gap: 30px;}
    .vision_box .cont_box > ul::before {width: calc(66% + 27px);}
    .dbc_box1 .pl_box > ul > li.bg1 { background: #f0fafd url(/project/design/contents/bg_dbc1.png) no-repeat right bottom / auto 50px;}
    .dbc_box1 .pl_box > ul > li.bg2 { background: #e6faf5 url(/project/design/contents/bg_dbc2.png) no-repeat right bottom / auto 50px;}
    .dbc_box1 .pl_box > ul > li.bg3 { background: #f4effc url(/project/design/contents/bg_dbc3.png) no-repeat right bottom / auto 50px;}
}
@media all and (max-width:800px) {
    .dbc_box1 .desc_box .p_desc1 { font-size: 24px;}
    .dbc_box1 .pl_box > ul { gap:20px;}
    .dbc_box1 .pl_box > ul > li p { font-size: 13px;}
    .vision_box .title_box { padding: 20px; width: 80%;}
    .vision_box .title_box span { font-size: 16px;}
    .vision_box .title_box p { font-size: 16px;}
    .vision_box .cont_box > ul { gap: 20px;}
    .vision_box .cont_box > ul > li > h5 { padding: 20px; font-size: 16px;}
    .vision_box .cont_box > ul > li > ul { padding: 20px; gap: 10px;}
}
@media all and (max-width:600px) {
    .dbc_box1 .desc_box { gap: 10px; flex-direction: column; margin-bottom: 30px;}
    .dbc_box1 .desc_box .p_desc1 { font-size: 20px;}
    .dbc_box1 .desc_box .p_desc2 { line-height: 1.6em; text-align: center;}
    .dbc_box1 .pl_box > ul { flex-direction: column;}
    .vision_box { padding: 20px 0 40px 0;}
    .vision_box .title_box { padding: 20px; width: 100%; box-sizing: border-box; gap: 0; flex-direction: column; margin: 0 auto 20px auto;}
    .vision_box .title_box::after { display: none;}
    .vision_box .cont_box > ul { flex-direction: column;}
    .vision_box .cont_box > ul::before {display: none;}
    .vision_box .cont_box > ul > li { margin-top: 0;}
    .vision_box .cont_box > ul > li::before { height: 20px; transform: translate(0, -21px);}
    .vision_box .cont_box > ul > li > h5 { padding: 15px;}
    .vision_box .cont_box > ul > li > ul > li { font-size: 13px;}

}

/* 0102_동부창고 > 사업안내 */
.busiinfo_box { display: grid; grid-template-columns: 1fr 1fr; gap: 40px;}
.busiinfo_box .item { display: flex; flex-direction: column; height: 100%; box-sizing: border-box; border: 1px solid #e1e1e1;}
.busiinfo_box .item .top_box { background-color: #fff; padding: 30px 40px; display: flex; gap: 30px; align-items: center;}
.busiinfo_box .item .top_box h5 { font-size: 18px; color: #000; font-family: 'S-CoreDream-7ExtraBold'; display: flex; justify-content: space-between;}
.busiinfo_box .item .top_box h5 a { display: inline-block; padding: 0 5px; font-size: 13px; color: #00a53c; border-bottom: 2px solid #00a53c;}
.busiinfo_box .item .top_box h5 a:hover { color: #000;}
.busiinfo_box .item .top_box p { padding-top: 20px; font-size: 14px; line-height: 1.8em;}
.busiinfo_box .item > ul { padding: 30px 40px; display: flex; flex-direction: column; gap: 14px;}
.busiinfo_box .item > ul > li { font-size: 14px; position: relative; padding-left: 13px;}
.busiinfo_box .item > ul > li::before { content: "- "; position: absolute; left: 0; top: 0; display: inline-block;}

.busidetail_box { display: flex; flex-direction: column; gap: 100px;}
.busidetail_box .item { display: flex; align-items: center; justify-content: space-between; gap: 80px;}
.busidetail_box .item.rev { flex-direction: row-reverse;}
.busidetail_box .item .img_box { width: 60%; overflow: hidden; position: relative;}

.busidetail_box .item .img_box .swiper-slide img { width: 100%;}
.busidetail_box .item .img_box .page_box { position: absolute; right: 0; bottom: 0; width: 120px; height:50px; z-index: 1000;}
.busidetail_box .item .img_box .page_box > div { color: #fff; font-size: 25px; width:60px; height:50px; background: none; display: flex; align-items: center; justify-content: center; transition: all ease 0.3s; box-sizing: border-box;}
.busidetail_box .item .img_box .page_box > div:hover {color: #00a53c; }
.busidetail_box .item .img_box .page_box .swiper-button-prev { left:auto; right: 60px; top:0; margin-top:0;}
.busidetail_box .item .img_box .page_box .swiper-button-prev::after { content: ""; width: 1px; height: 24px; background-color: rgba(255,255,255,0.2); display: block; position: absolute; top: 50%; right: 0; transform: translate(0, -50%);}
.busidetail_box .item .img_box .page_box .swiper-button-next { top:0; right: 0; margin-top:0;}

.busidetail_box .item .desc_box { width: 40%;}
.busidetail_box .item h5 { font-size: 22px; color: #000; font-family: 'S-CoreDream-7ExtraBold'; padding-bottom: 20px;}
.busidetail_box .item ul { display: flex; flex-direction: column; gap: 14px;}
.busidetail_box .item ul > li { font-size: 14px; position: relative; padding-left: 13px;}
.busidetail_box .item ul > li::before { content: "- "; position: absolute; left: 0; top: 0; display: inline-block;}

@media all and (max-width:1440px) {
    .busiinfo_box .item .top_box .img_box { flex: 1; text-align: center;}
    .busiinfo_box .item .top_box .desc_box { flex: 4;}
}

@media all and (max-width:1260px) {
    .busiinfo_box { gap: 30px;}
    .busiinfo_box .item .top_box { padding: 20px 30px; gap: 20px;}
    .busiinfo_box .item > ul { padding: 20px 30px; gap: 10px;}

    .busidetail_box { gap: 70px;}
    .busidetail_box .item { gap: 50px;}
    .busidetail_box .item ul { gap: 10px;}
}

@media all and (max-width:800px) {
    .busiinfo_box { gap: 20px;}
    .busiinfo_box .item .top_box { padding: 20px;}
    .busiinfo_box .item .top_box h5 { font-size: 16px;}
    .busiinfo_box .item .top_box h5 a {font-size: 12px;}
    .busiinfo_box .item .top_box p { font-size: 13px; line-height: 1.6em;}
    .busiinfo_box .item > ul { padding: 20px;}
    .busiinfo_box .item > ul > li { font-size: 13px;}

    .busidetail_box .item { gap: 30px;}
    .busidetail_box .item h5 { font-size: 20px; padding-bottom: 10px;}
    .busidetail_box .item ul { gap: 6px;}
    .busidetail_box .item ul > li { font-size: 13px;}
}
@media all and (max-width:600px) {
    .busiinfo_box { grid-template-columns: 1fr;}
    .busidetail_box .item { display: grid; grid-template-columns: 1fr;}
    .busidetail_box .item .img_box { width: 100%;}
    .busidetail_box .item .desc_box { width: 100%;}
}

/* 0103_동부창고 > 운영안내 */
.oper_box { display: flex; gap: 40px; margin: 40px 0;}
.oper_box .item { border: 1px solid #e1e1e1; padding: 40px; width: 100%; box-sizing: border-box;}
.oper_box .item.bg1 { background: url(/project/design/contents/img_oper1.png) no-repeat 95% 30px;}
.oper_box .item.bg2 { background: url(/project/design/contents/img_oper2.png) no-repeat 95% 30px;}
.oper_box .item h5 { color: #000; font-size: 22px; font-family: 'S-CoreDream-7ExtraBold'; margin-bottom: 20px;}
.oper_box .item .item_box { display: flex;}
.oper_box .item .item_box > div { width: 100%; box-sizing: border-box;}
.oper_box .item .item_box > div + div { border-left: 1px solid #e1e1e1; padding-left: 40px;}
.oper_box .item .item_box h6 {color: #000; font-size: 16px; font-family: 'S-CoreDream-7ExtraBold'; margin-bottom: 10px;}
.oper_box .item .item_box ul {display: flex; flex-direction: column; gap: 7px;}
.oper_box .item .item_box ul > li { font-size: 14px; position: relative; padding-left: 8px;}
.oper_box .item .item_box ul > li::before { content: "· "; position: absolute; left: 0; top: 0; display: inline-block;}
.oper_box .item > ul {display: flex; flex-direction: column; gap: 18px;}
.oper_box .item > ul > li { font-size: 16px;}
.oper_box .item > ul > li > span { color: #000; font-family: 'S-CoreDream-7ExtraBold'; display: inline-block; width: 120px;}
.oper_box .item > ul > li > span::before { content: "· "; }

.parking_box { display: flex; margin-top: 40px; border: 1px solid #e5e5e5;}
.parking_box ul { width: 100%;}
.parking_box ul + ul { border-left: 1px solid #e5e5e5;}
.parking_box ul > li { padding: 20px 60px; display: flex; justify-content: space-between; align-items: center;}
.parking_box ul > li + li { border-top: 1px solid #e5e5e5;}
.parking_box ul > li:nth-child(odd) { background-color: #fbfbfb;}
.parking_box ul > li span {color: #000; font-size: 16px; font-family: 'S-CoreDream-7ExtraBold';}
.parking_box ul > li p {color: #13a541; font-size: 16px; font-family: 'S-CoreDream-7ExtraBold';}

@media all and (max-width:1260px) {
    .oper_box { gap: 30px; margin: 30px 0;}
    .oper_box .item { padding: 30px;}
    .oper_box .item h5 { font-size: 20px; }
    .oper_box .item.bg1 { flex: 3;}
    .oper_box .item.bg2 { flex: 2;}
    .parking_box ul > li { padding: 15px 30px;}
}

@media all and (max-width:800px) {
    .oper_box { flex-direction: column;}
}
@media all and (max-width:600px) {
    .oper_box { gap: 20px; margin: 20px 0;}
    .oper_box .item { padding: 20px;}
    .oper_box .item.bg1 { background: url(/project/design/contents/img_oper1.png) no-repeat 95% 20px / auto 60px;}
    .oper_box .item.bg2 { background: url(/project/design/contents/img_oper2.png) no-repeat 95% 20px / auto 60px;}
    .oper_box .item h5 { font-size: 17px; margin-bottom: 10px; }
    .oper_box .item .item_box h6 {font-size: 14px;}
    .oper_box .item > ul { gap: 10px;}
    .oper_box .item > ul > li { font-size: 14px;}
    .parking_box { flex-direction: column; margin-top: 20px;}
    .parking_box ul + ul { border-left: 0; border-top: 1px solid #e5e5e5;}
    .parking_box ul > li { padding: 15px 20px;}
    .parking_box ul > li span { font-size: 14px;}
    .parking_box ul > li p { font-size: 14px;}
}
@media all and (max-width:440px) {
    .oper_box .item .item_box { flex-direction: column;}
    .oper_box .item .item_box > div + div { border-left: 0; border-top: 1px solid #e1e1e1; padding:20px 0 0 0; margin-top: 20px;}
}


/* 0204_프로그램 > 동부창고 투어 */
.p_tour_info { line-height: 1.8em;}
.tour_step_box { margin-bottom: 50px;}
.tour_step_box > ul { display: flex; justify-content: space-between; gap: 60px; }
.tour_step_box > ul > li { width: 100%; box-sizing: border-box; padding: 40px 20px; background-color: #f5f5f5; border-radius: 30px; display: flex; flex-direction: column; align-items: center; gap: 20px; position: relative;}
.tour_step_box > ul > li + li::before { content: "\f061";font-family: FontAwesome; font-size: 24px; position: absolute; display: block; top: 50%; left: -30px; transform: translate(-50%, -50%);}
.tour_step_box > ul > li > span { color: #13a541; font-family: 'S-CoreDream-7ExtraBold';}
.tour_step_box > ul > li > p { color: #000; font-size: 17px; text-align: center; font-family: 'S-CoreDream-7ExtraBold';}

@media all and (max-width:1260px) {
    .tour_step_box { margin-bottom: 30px;}
    .tour_step_box > ul { gap: 40px;}
    .tour_step_box > ul > li { padding: 20px 15px; border-radius: 20px; gap: 10px;}
    .tour_step_box > ul > li + li::before { content: "\f063"; font-size: 22px; left: -20px;}
    .tour_step_box > ul > li > img { height: 70px;}
    .tour_step_box > ul > li > p { font-size: 15px;}
}

@media all and (max-width:600px) {
    .tour_step_box > ul { flex-direction: column;}
    .tour_step_box > ul > li + li::before { top: -20px; left: 50%;}

}

/* 0101_히스토리_청주 연초제조창 */
.tab_history ul { padding-left:20%; display:table;}
.tab_history ul li { display:table-cell; }
.tab_history ul li a { display:inline-block; color:#a2a2a2; padding:20px 40px; font-weight:700; position: relative;}
.tab_history ul li a.on { color:#000;}
.tab_history ul li a::after { content: ""; width: 4px; height: 15px; background-color: #000; display: block; position: absolute; bottom: 0; left: 50%; transform: translate(-2px, 0); opacity: 0; transition: all ease 0.3s;}
.tab_history ul li a.on::after { opacity: 1;}
.con35, .con36, .con40, .con70 { width:100% !important; max-width:100% !important;}
.con35 .tab_type1, .con36 .tab_type1, .con40 .tab_type1 { display:none;}
.con35 #contents, .con36 #contents, .con40 #contents { max-width:100% !important; padding:40px 0 0 0;}
.con70 #contents { max-width:100% !important;}

.history_box1 { min-height:1240px; background:#222222 url('/project/design/contents/bg_history1.jpg') no-repeat center bottom; background-size:cover; padding:80px 0 0 8%; box-sizing:border-box;}
.history_box1 .left { float:left; width:27%;}
.history_box1 .left.w_his { width: 60%; padding-right: 3%; box-sizing: border-box;}
.history_box1 .left .p_desc1 { color:#fff; font-size:40px; padding-top:40px;}
.history_box1 .left .p_desc1 span { font-size:60px; }
.history_box1 .left .p_desc2 { color:rgba(255,255,255,0.6); padding:30px 30% 30px 0; line-height:1.8em;}
.history_box1 .left.w_his .p_desc2 { padding:30px 30px 30px 0;}


.tab_year { background:url('/project/design/contents/bg_his_w.gif') repeat-x center 15px; width:70%;}
.tab_year a { width:33.33%; text-align:center; display:inline-block; vertical-align:top; font-size:1.2em; color:#fff; }
.tab_year i { border-radius:100%; background:#fff; width:22px; height:22px; display:block; margin:6px auto 30px auto;}
.tab_year a.on i { width:18px; height:18px; border:8px solid #fff; background:#393939; margin:0 auto 24px  auto;}

.history_box1 .right { float:left; width:73%; overflow:hidden;}
.history_box1 .right.w_his { width: 40%; padding-right: 6%; box-sizing: border-box;}
.history_box1 .right.w_his .his_slide { position: relative;}
.history_box1 .right.w_his .his_slide .swiper-slide img { width: 100%;}
.history_box1 .right.w_his .his_slide .page_box { position: relative; height:50px;}
.history_box1 .right.w_his .his_slide .page_box > div { color:rgba(255,255,255,0.6); font-size: 25px; width:60px; height:50px; background: none; display: flex; align-items: center; justify-content: center; transition: all ease 0.3s; box-sizing: border-box;}
.history_box1 .right.w_his .his_slide .page_box > div:hover {color: #fff; }
.history_box1 .right.w_his .his_slide .page_box .swiper-button-prev { left:auto; right: 60px; top:10px; margin-top:0;}
.history_box1 .right.w_his .his_slide .page_box .swiper-button-prev::after { content: ""; width: 1px; height: 24px; background-color: rgba(255,255,255,0.1); display: block; position: absolute; top: 50%; right: 0; transform: translate(0, -50%);}
.history_box1 .right.w_his .his_slide .page_box .swiper-button-next { top:10px; right: 0; margin-top:0;}


.history_box1 .right .top_img { width:1500px;}
.history_box1 .right .top_img li { float:left; padding-right:40px;}

.history_box1 .right .cen_desc h4 { float:left; font-size:40px; font-weight:700; color:#fff; width:400px; text-align:center; padding-top:65px;}
.history_box1 .right .cen_desc  .his_list { margin-top:-150px; padding:0 0 0 80px; width:600px;  float:left; color:#fff;}
.history_box1 .right .cen_desc  .his_list li { margin-bottom:20px;}
.history_box1 .right .cen_desc  .his_list li span { width:20%; float:left;  font-weight:700;}
.history_box1 .right .cen_desc  .his_list li p { width:80%; float:left; line-height:1.6em;}

#busi_box2 .top_img { width:auto; float:right;}
#busi_box2 .cen_desc h4 { width:auto; text-align:left; padding:65px 0 50px 80px;}
#busi_box2 .cen_desc  .his_list { margin-top:0; }

#busi_box3 .cen_desc h4 { width:auto; text-align:left; padding:65px 0 50px 80px;}
#busi_box3 .cen_desc  .his_list { margin-top:65px;  width:700px;}

.history_box2 { overflow-x:hidden;}
.add01{padding:0 10px; box-sizing: border-box; display: block; color:#ef1140;}
@media all and (max-width:1440px) {
.con35 #contents, .con36 #contents {width:100%; }
.history_box1 { padding:60px 0 0 5%;}
.history_box1 .left .p_desc1 { font-size:30px; padding-top:30px;}
.history_box1 .left .p_desc1 span { font-size:50px;}
.history_box1 .left .p_desc2 {padding:30px 15% 30px 0;}
.history_box1 .right .cen_desc h4 { font-size:36px; width:300px;}
.history_box1 .right .cen_desc  .his_list { padding:0 0 0 50px; width:500px; }
.history_box1 .right .top_img li { padding-right:20px;}
.history_box1 .right .top_img li img { width:300px;}
.history_box1 .right .cen_desc  .his_list li { margin-bottom:15px;}
.history_box1 .right .cen_desc  .his_list li span { width:23%;}
.history_box1 .right .cen_desc  .his_list li p { width:77%;}

#busi_box2 .cen_desc h4 { padding:65px 0 50px 50px;}
#busi_box3 .cen_desc h4 { padding:65px 0 50px 50px;}
#busi_box3 .cen_desc  .his_list { margin-top:0; }
}

@media all and (max-width:1260px) {
.history_box1 { padding:40px 0 0 5%;}
.history_box1 .left { width:100%; position:relative;}
.history_box1 .left .p_desc2 { padding:30px 10% 30px 0;}
.history_box1 .left .p_desc2 br { display:none;}
.tab_year { position:absolute; top:50px; right:0; width:50%;}
.history_box1 .right { width:100%;}
.history_box1 .right .top_img { width:100%;}
.history_box1 .right .top_img li { width:33.33%; box-sizing:border-box;}
.history_box1 .right .top_img li img { width:100%;}
.history_box1 .right .cen_desc h4 { width:33.33%; padding-right:20px; box-sizing:border-box;}
.history_box1 .right .cen_desc  .his_list { padding:0 0 0 30px; width:60%;  box-sizing:border-box; font-size:0.95em;}

#busi_box2 .cen_desc h4 { padding:35px 0 30px 30px;}
#busi_box3 .cen_desc h4 { padding:35px 0 30px 30px;}
#busi_box2 .top_img { width:40%;}
#busi_box2 .top_img li { width:100%;}
#busi_box3 .cen_desc { width:60%;}
}

@media all and (max-width:800px) {
.history_box1 .left .p_desc1 { font-size:24px; }
.history_box1 .left .p_desc1 span { font-size:40px;}
.history_box1 .left .p_desc2 { font-size:0.95em;}
.tab_year { top:30px;}
.tab_year i { width:18px; height:18px; margin:6px auto 10px auto;}
.tab_year a.on i { width:16px; height:16px; border:6px solid #fff; margin:0 auto 6px  auto;}
.history_box1 .right .top_img li {width:50%;}
.history_box1 .right .cen_desc h4 { font-size:24px; padding-top:35px;}
.history_box1 .right .cen_desc  .his_list { margin-top:30px; padding:0; width:100%;}
.history_box1 .right .cen_desc  .his_list li { font-size:0.875em; margin-bottom:10px;}
.history_box1 .right .cen_desc  .his_list li span { width:25%;}
.history_box1 .right .cen_desc  .his_list li p { width:75%;}
.history_box1 .right .cen_desc h4 { width:100%;}

.history_box1 .left.w_his { width: 95%; padding-right: 0;}
.history_box1 .right.w_his { width: 95%; padding:20px 5% 40px 5%;}

#busi_box2 .cen_desc h4 { width:100%; padding:35px 0 30px 0; text-align:center;}
#busi_box2 .top_img { width:50%; float:none; margin:0 auto;}
#busi_box2 .cen_desc { width:100%;}
#busi_box3 .cen_desc h4 { width:100%; padding:35px 0 30px 0; text-align:center;}
#busi_box3 .cen_desc { width:100%;}
#busi_box3 .cen_desc  .his_list { width:100%;}
}

@media all and (max-width:440px) {
.tab_history ul { padding-left:0; margin:0 auto;}
.tab_history ul li a { padding:0 30px 20px 30px;}
.history_box1 { padding:20px 5% 0 5%;}
.tab_year { position:relative; top:auto; right:auto; width:100%; margin-bottom:40px;}
.tab_year a { font-size:1em;}
.history_box1 .left .p_desc2 { padding:20px 10% 30px 0; line-height:1.6em;}
.history_box1 .right .top_img li { padding-right:0;}
.history_box1 .right .cen_desc  .his_list li span { width:28%;}
.history_box1 .right .cen_desc  .his_list li p { width:72%;}

.history_box1 .right.w_his { width: 100%; padding: 20px 0 40px 0px; }
}


/* 0102_공간소개 */
.box_spa { text-align:center;}
.box_spa ul > li { display:inline-block; padding:20px; color:#333;}
.box_spa ul > li i { margin-right:10px;}
.box_spa p { font-size:18px;}
.box_spa .list_add{flex-wrap: wrap; padding:10px; margin:10px; border:3px solid rgba(0,165,60,0.3); background:rgba(0,165,60,0.03);}
.box_spa .list_add > li{width:100%; padding:5px; }
.box_spa .list_add > li span{ color:#000;}

.space_cont {margin-bottom:80px;}
.space_cont.mgB_none {margin-bottom:auto;}

.space_box { position:relative;}
.space_box li {width:50%; float:left;}
.space_box li img{max-width: 100%; }
.space_box .con {margin-left:6.5%;width:43.5%;}
.space_box .con h4 {position:relative;}
.space_box .con h4.col34 {color:#26c0b0;}
.space_box .con h4.col35 {color:#00a53c;}
.space_box .con h4.col36 {color:#ff763b;}
.space_box .con h4.col6 {color:#3285cb;}
.space_box .con h4.col8 {color:#b570f5;}
.space_box .con h4 .num {font-family: 'Black Ops One',cursive; font-size:90px;line-height:90px;}
.space_box .con h4 .tit {position:absolute;left:30%;top:15px;font-size:32px;}
.space_box .con h4 .tit.left_18 {left:18%;}
.space_box .con h4 .sub {font-size:18px;display:block;margin-top:10px;}
.space_box .con .space_btn_box {position:absolute; bottom:0;}

.sub_space_box {background:#f2f2f2;padding:5% 0;margin-top:60px;}
.sub_space_box li {position:relative;float:left;margin-right: 50px}
.sub_space_box li img{width: 100%}
.sub_space_box li h5 {position:absolute;color:#fff;background:rgba(0,0,0,0.6);display:inline-block;left:0;bottom:0;width:100%;text-align:center;padding:15px 0;}
.sub_space_box li:last-of-type {margin-right:0;}

.sub_space_box .slick-dots {left: 50%;transform: translate(-50%, -0%);width: auto !important;}

.sub_space_box .slick-dots li button:before {font-size: 0 !important;}
.sub_space_box .slick-dots li button{ width: 7px; height: 7px; display: inline-block; border-radius: 100%; background: #000; opacity: .2; vertical-align: top; border: 0; padding: 0; cursor: pointer;}
.sub_space_box .slick-dots li.slick-active button{background: #000; opacity: 1;}

@media all and (max-width:1200px) {
.space_box .con h4 .num {font-size:60px;line-height:60px;}
.space_box .con h4 .tit {left:25%;top:6px;font-size:20px;}
.space_box .con h4 .sub {font-size:15px;margin-top:0;}
.space_box .con p {font-size:0.95em;}
}
@media all and (max-width:1000px) {
.space_cont {margin-bottom:60px;}
.space_box li {width:100%;}
.space_box .img {text-align:center;margin-bottom:20px;}
.space_box .con {margin-left:0;width:100%;}
.space_box .con h4 .tit {left:14%;}
.space_box .con h4 .tit.left_18 {left:8%;}
.sub_space_box {padding:7% 0;margin-top:40px;}
.space_box .con .space_btn_box {position:relative; bottom:auto; margin-top:20px;}
}
@media all and (max-width:800px) {
.box_spa ul > li { padding:15px; }
.box_spa ul > li i { margin-right:5px;}
.box_spa ul > li i img { width:20px;}
.box_spa p { font-size:16px;}
.box_spa p span { display:block;}

.space_cont {margin-bottom:40px;}
.space_box .con h4 .tit {left:18%;}
.space_box .con h4 .tit.left_18 {left:12%;}
.sub_space_box {margin-top:30px;}
.sub_space_box .slick-arrow {position: absolute; top: calc(50% - 9px);-webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); z-index: 505; font-size: 0; border: 0; background: 0; width: 44px; height: 44px; cursor: pointer;}
.sub_space_box .slick-arrow.slick-prev{left: 0; background:rgba(0,0,0,0.7);}
.sub_space_box .slick-arrow.slick-next{right: 0; background:rgba(0,0,0,0.7);}
.sub_space_box {padding:10% 0;}
}
@media all and (max-width:600px) {
.space_box .con h4 .tit {left:22%;}
.space_box .con h4 .tit.left_18 {left:16%;}
}
@media all and (max-width:500px) {
.box_spa ul > li { padding:10px 10px 0 10px; }
.box_spa p { font-size:15px; padding-top:20px;}
.box_spa p span { display:inline;}

.space_box .con h4 .tit {left:26%;}
.space_box .con h4 .tit.left_18 {left:16%;}
.space_box .con h4 .sub {font-size:14px;}
.space_box .con p {font-size:0.875em;}
}

/* 0104_CI소개 */
.ci_box { border:1px solid #ddd; padding:60px;}
.ci_box .left{ display:table-cell; border-right:1px solid #ddd; padding-right:60px;  vertical-align:middle;}
.ci_box .right{ display:table-cell; vertical-align:middle; padding-left:60px;}
.ci_box .right .p_desc1 { font-size:22px; font-weight:600; color:#000;}
.ci_box .right .p_desc2 { padding:40px 0 30px 0;}

.line_box {border:1px solid #ddd; padding:64px 20px; background:url("/project/design/contents/bg_ci.gif") repeat left top; text-align:center; }
.line_box .img_mg1 { margin:0 80px; display:inline-block;}
.line_box .img_mg2 { margin:0 40px; display:inline-block;}
.logo_box h5 { border:1px solid #ddd; border-bottom:none; padding:10px; text-align:center; font-weight:600; color:#333;}
.logo_box .left {width:50%; float:left; padding-right:20px; box-sizing:border-box;}
.logo_box .right {width:50%; float:left;padding-left:20px; box-sizing:border-box;}

.motive_box { text-align:center; padding:60px 30px; background:#000;}

@media all and (max-width:1200px) {
.ci_box { padding:40px;}
.ci_box .left{ padding-right:40px; }
.ci_box .right{ padding-left:40px;}
.logo_type1 img { height:40px;}
.line_box .img_mg1 { margin:0 30px;}
.line_box .img_mg2 { text-align:center; margin:40px 0; display:block;}
}
@media all and (max-width:800px) {
.ci_box .left { display:block; border-right:none;  border-bottom:1px solid #ddd; padding-right:0; padding-bottom:40px; text-align:center;}
.ci_box .left img { height:130px; }
.ci_box .right { display:block; padding-left:0; padding-top:40px;}
.ci_box .right .p_desc1 { font-size:16px;}
.ci_box .right .p_desc1 br { display:none;}
.ci_box .right .p_desc2 { padding:30px 0 20px 0;}
.line_box .img_mg1 {  text-align:center; margin:40px 0; display:block;}
.logo_box .left {width:100%; padding:0 0 30px 0;}
.logo_box .right {width:100%; padding-left:0;}
}


/* 0104_오시는길 */
.map_box { height:600px; border:4px solid #1b1b1b;}
.map_desc { background:#f7f7f7 url("/project/design/contents/img_map.png") no-repeat 100px center; margin-bottom:20px; padding:40px 35px 40px 230px; position:relative;border:1px solid #e1e1e1;}
.map_desc li { line-height:30px;}
.map_desc .title { color:#00a53c; display:inline-block; width:70px;}
.map_desc .sub {font-weight:300;font-size:0.875em;}
.btn_daum {position:absolute;top:50%;right:60px;-webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%);}
.font_gr {color:#00a53c;}
.map_bus {box-sizing:border-box;width:100%;border:4px solid #1b1b1b;padding:60px;text-align:center;background:#d2cbc6;}


.map_lo_box { background:#f2f2f2; margin:50px 0; padding:40px 0;}
.map_lo_box p { width:30%; float:left; text-align:center; font-size:20px; color:#000; padding-top:13px;}
.map_lo_box div { width:70%; float:left; line-height:1.8em;}


@media all and (max-width:1000px) {
.map_lo_box { margin:40px 0; padding:30px 0;}
.map_lo_box p { width:40%;font-size:18px;padding-top:10px;}
.map_lo_box div { width:60%;}
}

@media all and (max-width:767px) {
.map_box { height:300px;}
.map_desc { background:#f8f8f8 url("/project/design/contents/img_map.png") no-repeat 30px center; padding:25px 25px 25px 130px; }
.map_desc li { font-size:0.95em;}
.map_desc .title { width:50px;}
.btn_daum {position:relative;display:inline-block;top:auto;right:auto;-webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0);margin-top:10px;}
.map_desc .sub {line-height:1em;}
}
@media all and (max-width:600px) {
.map_bus {padding:20px;}
}
@media all and (max-width:500px) {
.map_lo_box { padding:20px;}
.map_lo_box p { width:100%;font-size:16px; padding:0 0 5px 0;}
.map_lo_box div { width:100%; font-size:12px;}
}
@media all and (max-width:414px) {
.map_desc { background-size:60px; padding:25px 25px 25px 110px; }
.map_desc li { line-height:24px;}
}

/* 0103_조직/직원 */
.img_org { padding:50px 0 80px 0;}
@media all and (max-width:800px) {
.img_org { padding:30px 0 40px 0;}
}


/* 예술교육 */
.art_box{ display: flex; justify-content: space-between; gap: 30px; text-align:center; }
.art_box > li{ width: 100%; display:flex; flex-direction: column; }
.art_box > li img{ width: 100%; box-sizing: border-box; border: 1px solid #E1E1E1; }

.art_text{ flex: 10; margin: 50px 0; }
.art_text > p{ margin-top: 50px; line-height: 1.8em; text-align: left; }

.art_text > span { display:block; width: 100%; position: relative;}
.art_text > span > i {position: absolute; left: 50%;}
.art_text .i1::before, .i2::before, .i3::before{ content: ""; display:block; width: 6px; height: 6px; border-radius: 50%; position: absolute;}
.art_text .i1::before{ background-color: #00a53c; left: -15px; transform: translate(-50%);}
.art_text .i2::before{ background-color: #7FB693; left: 0px; transform: translate(-50%);}
.art_text .i3::before{ background-color: #B7BDB9; left: 15px; transform: translate(-50%);}

.art_reg a{ width: 230px; line-height: 60px; display: inline-block; border: 1px solid #00a53c; color: #00a53c; font-size: 15px; font-weight: bold; border-radius: 3px;}
.art_reg a:hover{ background-color: #00a53c; color: #fff; }

/* 예술교육 반응형 */
@media all and (max-width: 800px) {
    .art_box { flex-wrap: wrap; }
    .art_box > li { flex: 0.5; }
    .art_text { margin: 30px 0; }
    .art_reg a{ width: 180px; height: 50px; line-height: 50px; margin-bottom: 30px; }
}
@media all and (max-width: 437px) {
    .art_box > li { flex: 1; }
}
/* // 예술교육 */


/* 0202_대관안내 */
.box_ck  .p_title { font-family: 'Black Ops One', sans-serif; font-size:90px; color:#26c0b0; line-height:90px; text-align:center; padding-top:30px;}
.box_ck .p_desc1 { text-align:center; font-size:24px; color:#000; font-weight:700; padding:30px;}
.box_ck .img_box { border:1px solid #e1e1e1;}
.box_ck .img_box .img { text-align:center; padding:20px 45px 45px 45px;}
.box_ck .img_box .img img { max-width:100%;}
.box_ck .img_box .p_desc2 { text-align:right; font-size:17px; padding:45px 45px 0 0;}

.box_ck.dong2 .p_title { color:#00a53c;}
.box_ck.dong3 .p_title { color:#ff763b;}
.box_ck.dong4 .p_title { color:#3285cb;}
.box_ck.dong5 .p_title { color:#b570f5;}
.box_ck.dong6 .p_title { color:#b2c203;  font-family: 'S-CoreDream-7ExtraBold', sans-serif; font-size:60px;}
.box_ck.dong7 .p_title { color:#ff64dc;}
.box_ck.dong8 .p_title { color:#7332cb;}

/* 20241202 추가 */
.box_ck.dong9 .p_title { color:#ed7ade;}
.box_ck.dong9 .ck_step > ul > li { width: 12.14%; }
.box_ck.dong10 .p_title { color:#E1C239;}
.box_ck.dong10 .ck_step > ul > li { width: 12.14%; }
/* // 20241202 추가 */
/* .bottom_text_info { color: #000; transform: skew(0.4deg); font-family: "Noto Sans Korean"; } */

.ck_step > ul > li { width:18%; padding-right:2.5%; float:left; background:url('/project/design/contents/img_step_ar.png') no-repeat 98% center; background-size:20px; margin-bottom: 2.5%;}
.ck_step > ul > li > div { background:#f0f0f0; text-align:center; height:170px; display: flex; flex-direction: column; align-items: center;
padding: 0.5rem;}
.ck_step > ul > li > div i { display:block; text-align:center; padding:25px 0 10px 0;}
.ck_step > ul > li:last-child { padding-right:0;}

.box_ck.dong2 .ck_step > ul > li {width:12.14%; }

.ck_info {background:url("/project/design/template/bg_box1.gif"); padding:10px;}
.ck_info .box_w { background:#fff; padding:30px 0; display:table; width:100%; box-sizing:border-box;}
.ck_info .box_w > div { display:table-cell; width:50%;box-sizing:border-box; padding-left:170px;}
.ck_info .box_w .left { border-right:1px solid #d3d3d3; background:url('/project/design/contents/img_info1.gif') no-repeat 60px center; }
.ck_info .box_w .right { background:url('/project/design/contents/img_info2.gif') no-repeat 60px center;}

/* 0202_대관안내_8동 */
.ck_info2 {background:url("/project/design/template/bg_box1.gif"); padding:10px;}
.ck_info2 .box_w { background:#fff; padding:30px 0; display:table; width:100%; box-sizing:border-box;}
.ck_info2 .box_w > div {display:table-cell; width:33%; box-sizing:border-box; padding:100px 0 0 0;}
.ck_info2 .box_w > div h5 { text-align:center; margin-bottom:10px;}
.ck_info2 .box_w > div ul { display:table; margin:0 auto;}
.ck_info2 .box_w .left { background:url('/project/design/contents/img_info1.gif') no-repeat center top; }
.ck_info2 .box_w .center { background:url('/project/design/contents/img_info2.gif') no-repeat center top; width:34%; border-left:1px solid #d3d3d3; border-right:1px solid #d3d3d3;}
.ck_info2 .box_w .right { background:url('/project/design/contents/img_info3.gif') no-repeat center top;}

.btn_black_line { border:4px solid #1b1b1b; width:280px; height:64px; display:inline-block; background:#fff; color:#1b1b1b; font-weight:600; font-size:24px; cursor:pointer;}
.btn_black_line:hover { background:#000; color:#fff;}
.btn_black_line.size2 { width:200px;}
a.btn_black_line {line-height:64px}
.btn_black { border:4px solid #1b1b1b; width:300px; height:64px; display:inline-block; background:#1b1b1b; color:#fff; font-weight:600; font-size:24px; cursor:pointer;}

.p_bottom_info { text-align:center; margin-top:40px; font-size:19px; color:#000 !important;}


@media all and (max-width:1100px) {
.box_ck  .p_title {font-size:70px; line-height:70px;}
.box_ck.dong6 .p_title { font-size:50px;}
.box_ck .p_desc1 { font-size:20px; padding:20px;}
.ck_step > ul > li { width:22.75%; padding-right:3%; margin-bottom:20px;float:left; background:url('/project/design/contents/img_step_ar.png') no-repeat 98% center; background-size:20px;}
.box_ck.dong2 .ck_step > ul > li {width:22.75%; }
.ck_step > ul > li:nth-child(4), .ck_step > ul > li:last-child { padding-right:0;}

.ck_info .box_w > div { padding-left:150px;}
.ck_info .box_w .left { background:url('/project/design/contents/img_info1.gif') no-repeat 50px center; background-size:60px;}
.ck_info .box_w .right { background:url('/project/design/contents/img_info2.gif') no-repeat 50px center; background-size:60px;}

.ck_info2 .box_w > div { padding:80px 10px 0 10px;}
.ck_info2 .box_w .left { width:35%; background-size:60px;}
.ck_info2 .box_w .center { width:30%;  background-size:60px;}
.ck_info2 .box_w .right { width:35%;  background-size:60px;}

.btn_black_line { width:240px; height:54px; font-size:20px;}
a.btn_black_line {line-height:54px}
.btn_black { width:240px; height:54px; font-size:20px;}
}

@media all and (max-width:800px) {
.box_ck  .p_title {font-size:50px; line-height:50px;}
.box_ck.dong6 .p_title { font-size:30px;}
.box_ck .p_desc1 { font-size:14px; padding:10px;}
.ck_step > ul > li { width:47%; padding-right:6%;}
.box_ck.dong2 .ck_step > ul > li {width:47%; }
.ck_step > ul > li:nth-child(even) { padding-right:0;}


.ck_info {font-size:0.95em; padding:5px;}
.ck_info .box_w { padding:20px 0;}

.ck_info .box_w > div { padding:0 20px 0 90px;}
.ck_info .box_w .left { background:url('/project/design/contents/img_info1.gif') no-repeat 30px center; background-size:40px;}
.ck_info .box_w .right { background:url('/project/design/contents/img_info2.gif') no-repeat 30px center; background-size:40px; }

.ck_info2 {font-size:0.95em; padding:5px;}
.ck_info2 .box_w { padding:20px 0;}
.ck_info2 .box_w > div { padding:60px 20px 0 20px;}
.ck_info2 .box_w .left { background-size:40px;}
.ck_info2 .box_w .center { background-size:40px;}
.ck_info2 .box_w .right { background-size:40px;}
}

@media all and (max-width:440px) {
.box_ck .img_box .img { padding:20px;}
.box_ck .img_box .p_desc2 { font-size:13px; padding:20px 20px 0 0;}


.ck_info .box_w { padding:20px;}
.ck_info .box_w > div { display:block; width:100%; padding:0 20px 0 60px;}
.ck_info .box_w .left { background:url('/project/design/contents/img_info1.gif') no-repeat left 10px; background-size:40px; border-right:none; border-bottom:1px solid #d3d3d3; padding-bottom:20px;}
.ck_info .box_w .right { background:url('/project/design/contents/img_info2.gif') no-repeat left 10px; background-size:40px; margin-top:20px;}

.ck_info2 .box_w { padding:20px;}
.ck_info2 .box_w > div { display:block; width:100%;  padding:60px 0 0 0;}
.ck_info2 .box_w .left { width:100%;}
.ck_info2 .box_w .center { width:100%; background:url('/project/design/contents/img_info2.gif') no-repeat center 20px; background-size:40px; border:none; border-top:1px solid #d3d3d3; border-bottom:1px solid #d3d3d3; margin:20px 0; padding:80px 0 20px 0;}
.ck_info2 .box_w .right { width:100%;}


.btn_black_line { width:120px; height:44px; font-size:16px; border:2px solid #1b1b1b}
.btn_black_line.size2 { width:120px;}
a.btn_black_line {line-height:44px}
.btn_black { width:120px; height:44px; font-size:16px;}

.p_bottom_info { margin-top:20px; font-size:16px; }
.p_bottom_info span { display:block;}
}

/* VR 레이어 */
.layer {display:none; position:fixed; _position:absolute; top:0; left:0; width:100%; height:100%; z-index:10000;}
.layer .bg {position:absolute; top:0; left:0; width:100%; height:100%; background:#000; opacity:.7; filter:alpha(opacity=70);}
/* .layer .pop-layer {display:block;} */

.pop-layer {display:none; position: absolute; top: 50%; left: 50%; width: 60%; height:auto;  background-color:#fff; z-index: 10;}
.pop-layer .pop-container {padding: 20px 25px 40px; overflow:hidden;}

.pop-layer h5 { color:#000; text-align:center; padding:10px 0; font-size:18px; }
.pop-layer .con_box { padding:0 30px 30px 30px;  height:500px;}
.pop-layer .btn_close { position:absolute; top:11px; right:20px; }

@media all and (max-width:1100px) {
.pop-layer {width: 90%;}
.pop-layer .con_box { padding:0 10px 10px 10px; height:200px;}
}
@media all and (max-width:500px) {
.pop-layer .con_box { height:500px;}
}


/* MEMO 251119 수정*/
/* 대관신청 */
.step_app > ul { width:80%; margin:0 auto; border-left:1px solid #ddd;}
.step_app > ul > li { float:left; width:25%;}
.step_app > ul > li > p { border:1px solid #ddd; border-left:none; padding:15px; text-align:center; font-size:17px;}
.step_app > ul > li > p.on { background:#f0f0f0; color:#000;}

@media all and (max-width:1100px) {
.step_app > ul { width:100%; }
.step_app > ul > li > p { font-size:14px;}
}

@media all and (max-width:600px) {
.step_app > ul > li { width:50%;}
.step_app > ul > li > p { padding:10px 5px;  font-size:13px;}
.step_app > ul > li:nth-child(3) > p, .step_app > ul > li:nth-child(4) > p {border-top: 0;}

}

.box_policy { border:1px solid #dadada; padding:45px;}

.box_app1 .box_form1 { background:#eee; padding-top:20px;}
.box_app1 .box_form1 dt { font-size:1.125em;}
.box_app1 .s_title{font-size:20px;}

@media all and (max-width:440px) {
.box_app1 .box_form1 { padding:20px 20px 0 20px;}

}

.box_booking{position: relative; display: flex; gap: 40px;}
.box_booking .left { flex: 1;}
.box_booking .right { flex: 1; position: relative;}
.box_booking .right .h_type2 .em1 {color: #be0b0b;}
.box_booking .right .p_key {padding:10px 20px; font-size: 14px; color: #000; background-color: #ebf3fc; margin-top: 10px;}

#booking{position: relative;}
.box_booking .loading::before{
    color: white;
    font-size: 2.4em;
    line-height: 1.3em;
    font-weight: bold;
    text-align: center;
    display: flex;
    align-items: center;
    background: rgba(0, 0, 0, 0.5);
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 5000;
    left: 0;
    top: 0;
    justify-content: center;
}
#booking.loading::before{
    content: '달력을 불러오는 중 입니다...';
}
.box_booking .right.loading::before{
    content: '예약을 확인하는 중 입니다...';
}

.booking_right dl { padding: 20px; background-color: #f9f9f9; display: grid; grid-template-columns:130px 1fr; gap: 10px; align-items: center;}
.booking_right dt { color: #000;font-size: 14px;}
.booking_right dd { display: flex; gap: 10px; align-items: center;}
.booking_right dd .inputbox2 { border: 1px solid #ddd; height: 40px; border-radius: 3px; width: 100%; box-sizing: border-box;}
.booking_right dd .selectbox2 { border: 1px solid #ddd; height: 40px; border-radius: 3px; width: 100%; box-sizing: border-box;}
.booking_right dd .btn { height: 80px; line-height: 78px; box-sizing: border-box;}
.booking_right dd .checks2 { display: flex; gap: 5px; margin: 5px 5px 5px 0;}
.booking_right dd .checks2 label { font-size: 13px;}
.booking_right dd.dd_day_box { flex-wrap: wrap; gap: 0 10px;}
.booking_right2 { margin-bottom: 20px;}
.booking_right2 .p_key {background-color: #fcebeb !important;}



/* 대관신청일 */
.sel_box_wrapper{ background: #fff; border: 1px solid #ddd; padding: 6px; box-sizing: border-box; width: 100%; min-height: 80px;  }
.sel_box{display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px;}
.sel_box .sel_box_item{ border: 1px solid #ddd; background-color: #efefef; color: #666; font-size: 13px; line-height: 1em; padding: 6px; border-radius: 4px; text-align: center; }

@media all and (max-width: 800px) { 
    .sel_box{grid-template-columns: repeat(1, 1fr);}
}




.booking_closed { height: 80px; border: 1px solid #ddd; padding:10px 20px; box-sizing: border-box; background-color: #f9f9f9; overflow-y: auto;}
.booking_closed ul { display: flex; flex-direction: column; gap: 5px;}
.booking_closed ul > li { display: flex; gap: 5px;}
.booking_closed ul > li > span { color: #be0b0b; font-size: 13px;}
.btn_res_add { background-color: #00a53c; color: #fff; width: 100%; height: 60px; display: flex; gap: 10px; align-items: center; justify-content: center; font-size: 16px; font-weight: 600;}
.btn_res_add i { font-size: 24px; transform: translateY(3px); font-weight: normal;}
.btn_res_add:hover { background-color: #000;}

.total_retal_fee { display: flex; align-items: center; justify-content: center; gap: 40px; background-color: #f9f9f9; color: #000; padding: 20px; font-size: 17px;}
.total_retal_fee p {color: #be0b0b; font-weight: 600; font-size: 20px;}


.box_booking .top_wrap { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px;}
.dd3 .box_booking .top_box { padding:0;}
.box_booking .top_box a { vertical-align:middle; display:inline-block; width:40px;height:40px; text-indent:-9999px;}
.box_booking .top_box a.prev {background:url("/project/design/contents/bg_cal_ar1.png") no-repeat center / 14px;}
.box_booking .top_box a.next {background:url("/project/design/contents/bg_cal_ar2.png") no-repeat center / 14px;}
.box_booking .top_box .date { font-family: 'Lato', sans-serif; font-size:30px; color:#000; display:inline-block; margin:0 10px; vertical-align:middle;}

.box_booking .top_desc span { margin-left:40px; width:15px; height:15px; display:inline-block;}
.box_booking .top_desc span.co1 { background:#fcfbd7; border:1px solid #ddd; vertical-align:top;}
.box_booking .top_desc span.co2 { background:#e9e9e9; border:1px solid #ddd; vertical-align:top;}
.box_booking .screen{display: block; width: 100%; height: 100%; position: absolute; background-color: #ddd; z-index: 9999; opacity: 0.2;}


/* 예약가능, 예약마감, 예약선택 */
.box_booking .s_bg1 { background:#fcfbd7;}
.box_booking .s_bg2 { background:#e9e9e9;}
.box_booking .on { background:#c3ecf6 !important;}

.table_c, .table_c th, .table_c td { border:0;border-collapse:collapse; }
.table_c { height:100%;border:1px solid #ddd; }
.table_c th { padding:10px; border-left:1px solid #ddd; border-top:2px solid #000;}
.table_c td { border-top:1px solid #ddd; border-left:1px solid #ddd; position:relative;font-family: 'Lato', sans-serif;  }
.table_c td span, .table_c td a { display:block; height:80px; text-align:right; padding:10px; box-sizing:border-box; color:#000;}
.table_c td a:hover { background:#c3ecf6;}
.table_c td:first-child { border-left:none;}
.table_c th:first-child { border-left:none;}
.table_c .co1 { color:#f4364c;}
.table_c .co2 { color:#00c7b1;}
.table_c .today { position:absolute; top:-1px; left:-1px; color:#fff; background:#ef1140; font-style:normal; display:inline-block; font-size:11px; font-weight:700; font-family: 'Lato', sans-serif;  padding:0 5px;}

.box_booking .time_box .box_in ul li { float:left; width:33.33%; box-sizing:border-box; padding:2px;}
.box_booking .time_box .box_in ul li a {font-family: 'Lato', sans-serif;  display:block; color:#484848; text-align:center; box-sizing:border-box;  padding:20px 0; font-weight:700; border:1px solid #bfbfbf;}
.box_booking .time_box .box_in ul li a:hover { background:#c3ecf6;}

.box_booking .time_box .no_sel { text-align:center; font-size:0.95em; color:#666; padding-top:220px;}
.box_booking .time_box .box_in .s_bg1 { background:none !important;}
.box_booking .time_box .box_in .s_bg1 a { background:#e8e8e8; cursor: default; color:#b1b1b1; }
.box_booking .time_box .box_in .s_bg1:hover a { background:#e8e8e8;}
.box_booking .time_box .box_in .on { background:none !important;}
.box_booking .time_box .box_in .on a { background:#c3ecf6 !important;}

.box_booking .time_box .no_time{font-size: 20px; text-align: center; color:#f60; border: 1px #e8e8e8 solid; width: 100%; margin: 16px 0; padding: 50px 0; }

.box_booking .desc_box  { border-top:1px solid #d3d3d3; padding:30px;}
.box_booking .desc_box .left { float:left; width:50%; border-right:1px solid #d3d3d3; box-sizing:border-box;}
.box_booking .desc_box .right { float:left; width:50%; box-sizing:border-box; padding-left:30px;}

 .total_price { font-size:1.2em; color:#ff0707;}

.box_form2 { border-top:2px solid #000; border-bottom:2px solid #000; padding-top:20px;}

.app_com_box .box_w { text-align:center; padding:60px;}
.app_com_box p { font-size:20px; color:#000; padding:30px 0; font-weight:500;}

@media all and (max-width:1300px) {
    .box_booking .top_desc span { margin-left: 20px;}
}
@media all and (max-width:1000px) {
    .box_booking { flex-direction: column;}
.box_booking .top_box a { width:40px;height:40px;}
.box_booking .top_box .date { font-size:30px;}

}
@media all and (max-width:800px) {
.box_booking .top_box { padding:10px 0;}
.box_booking .cen_box { width:100%;border-right:none; }
.table_c td span, .table_c td a { height:70px; padding:10px;}

.table_c, .table_c th, .table_c td { font-size:0.95em;}
.table_c .today { font-size:9px; padding:2px; line-height:1em;}

.box_booking .time_box { width:100%; border-left:none;}
.box_booking .time_box .box_in ul li a { padding:10px 0;}
.box_booking .time_box .no_sel { padding:30px 0;}
.box_booking .time_box .no_time{font-size: 16px; padding: 30px 0; }
}
@media all and (max-width:440px) {
.box_booking .top_wrap { flex-direction: column;}
.box_booking .top_box a { width:30px;height:30px;}
.box_booking .top_box a.prev { background-size:13px;}
.box_booking .top_box a.next { background-size:13px;}
.box_booking .top_desc { padding-top:10px; align-self: flex-end;}
.table_c td span, .table_c td a { height:50px; padding:5px;}
.box_booking .time_box .box_in { padding:10px 0;}
.box_booking .time_box .box_in ul li a { font-size:0.95em;}
.btn_booking { text-align:center; margin-top:30px;}
.box_booking .desc_box { padding:20px;}
.box_booking .desc_box .left { width:100%; border-right:none; padding-bottom:20px;}
.box_booking .desc_box .right { width:100%; padding:0;}

.app_com_box .box_w { padding:30px;}
.app_com_box p { font-size:16px; }


.booking_right dl { grid-template-columns:80px 1fr;}
}

/* db_btn_box */
.db_btn_box { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 40px;}
.db_btn_box .btn_black_line2 { display: flex; align-items: center; justify-content: center; box-sizing: border-box; border:4px solid #593acc; width:300px; height:64px; background:#fff; color:#593acc; font-weight:600; font-size:20px; }
.db_btn_box .btn_black_line2:hover { background:#593acc; color:#fff;}
.db_btn_box .btn_black_line { display: flex; align-items: center; justify-content: center; box-sizing: border-box; font-family: inherit; font-size:20px; transition: all ease 0.3s;}

@media all and (max-width: 1100px) { 
.db_btn_box .btn_black_line2 { border:2px solid #593acc; width: 240px; height: 54px; font-size: 18px;}
.db_btn_box .btn_black_line { border:2px solid #1b1b1b; font-size:18px;}
}

@media all and (max-width: 600px) { 
.db_btn_box .btn_black_line2 { width: auto; height: 44px; font-size: 15px; padding: 0 20px;}
.db_btn_box .btn_black_line { width: auto; height: 44px; font-size:15px; padding: 0 20px;}
}


/* 대관절차 */
.space_step_top { display: flex; justify-content: center; gap: 24px; margin-bottom: 30px;}
.space_step_top a { min-width: 30%; margin-top: 0 !important;}
.space_step { display: flex; gap: 40px;}
.space_step > div { width: 100%;}
.space_step h4 { text-align:center; padding:20px; font-family:"S-CoreDream-7ExtraBold"; font-size:24px; color:#000;}
.space_step ul { border-top:1px solid #ddd;}
.space_step ul > li { padding:20px; border:1px solid #ddd; border-top:none; display: flex; gap: 20px; align-items: center;}
.space_step ul > li .img { background:#f0f0f0; width:30%; padding: 20px; box-sizing: border-box; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px;}
.space_step ul > li .img p { color:#000; font-family:"S-CoreDream-5Medium"; text-align: center; }
.space_step ul > li .desc { width:70%; line-height:1.6em; }
.space_step ul > li .desc .desc2{background:rgba(255,83,0,0.2) ;color:#333; padding:10px; margin:10px 0 0;}

.space_step .btn_rental { display: flex; gap: 20px; margin-top: 15px;}
.space_step .btn_rental a { width: 100%; height: auto; box-sizing: border-box; line-height: 1.2em; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 20px; font-family: 'S-CoreDream-7ExtraBold'; font-size: 17px;}
.space_step .btn_rental a i { font-size: 1.5em;}


@media all and (max-width:1300px) {
    .space_step ul > li .img img { height: 50px;}
    .space_step ul > li .img p { font-size: 14px;}
    .space_step ul > li .desc { font-size: 15px;}
    .space_step .btn_rental { gap: 10px;}
    .space_step .btn_rental a { gap: 5px; padding: 15px 5px; font-size: 15px;}
}
@media all and (max-width:1000px) {
    .space_step { gap: 20px;}
    .space_step .btn_rental { flex-direction: column;}
}


@media all and (max-width:800px) {
.space_step_top { flex-direction: column; gap: 10px;}
.space_step_top a { min-width: auto;}
.space_step { flex-direction: column;}
.space_step h4 { padding:10px; font-size:20px;}
.space_step ul > li { padding:10px; gap: 10px;}
.space_step ul > li .img { gap: 5px;}
.space_step ul > li .img p { font-size: 13px;}
.space_step ul > li .desc { font-size: 13px; }
}



.ext_explain{ text-align: right; color: red; padding-top: 8px; }

/* 프로그램 > 세부프로그램 */
.box_detail > ul { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 20px;}
.box_detail .box_in { height: 100%; box-sizing: border-box; display: flex; flex-direction: column; justify-content: space-between; border: 1px solid #ddd; padding: 20px; color: #666;}
.box_detail .box_in h5 { font-weight: 600; font-size: 1.125em; color: #000; margin-bottom: 20px;}
.box_detail .box_in > ul > li { display: flex; align-items: center; padding: 5px 0; font-size: 0.95em;}
.box_detail .box_in > ul > li > span {color: #000; font-weight: 600; position: relative; margin-right: 20px;}
.box_detail .box_in > ul > li > span::after { position: absolute; right: -10px; top: 50%; transform: translate(0,-50%); width: 1px; height: 10px; display: block; content: ""; background-color: #ddd;}
.box_detail .box_in .p_de { text-align: right; margin-top: 20px;font-size: 0.95em; color: #f60; }
.box_detail .box_in .p_de span { color: #000; font-weight: 600; position: relative; margin-right: 20px;}
.box_detail .box_in .p_de span::after { position: absolute; right: -10px; top: 50%; transform: translate(0,-50%); width: 1px; height: 10px; display: block; content: ""; background-color: #ddd;}
.box_detail .box_in:hover, .box_detail .box_in.on { border: 1px solid #00a53c; background-color: #f9f9f9;}
.box_detail .box_in:hover h5, .box_detail .box_in.on h5 { color: #00a53c;}

.box_detail .box_in.not_sel, .box_detail .box_in.not_sel:hover { border: 1px solid #ddd; background-color: #f9f9f9; cursor: default; opacity: 0.7;}
.box_detail .box_in.not_sel h5, .box_detail .box_in.not_sel:hover h5 { color: #666;}
.box_detail .box_in.not_sel .p_de { color: #666; }


@media all and (max-width:1100px) {
    .box_detail > ul { grid-template-columns: 1fr 1fr;}
}
@media all and (max-width:600px) {
    .box_detail > ul {  grid-template-columns: 1fr; gap: 10px;}
    .box_detail .box_in { height: auto;}
    .box_detail .box_in h5 {  margin-bottom: 10px;}
    .box_detail .box_in .p_de { margin-top: 10px;}
}


@media all and (max-width:440px) {
    .ck_step > ul > li > div{
        font-size: 12px;
    }

    span.step_email{font-size: 10.5px;}
    }


 /* 예술교육프로그램 신청 */

    .table_c2, .table_c2 th, .table_c2 td { border:0;border-collapse:collapse; }
    .table_c2 { height:100%;border:1px solid #bfbfbf; margin-bottom: 20px; }
    .table_c2 thead th { padding:10px 5px; border-left:1px solid #bfbfbf; background:#f9f9f9;}
    .table_c2 tbody th {border-top:1px solid #bfbfbf; border-left:1px solid #bfbfbf;}
    .table_c2 td { border-top:1px solid #bfbfbf; border-left:1px solid #bfbfbf; position:relative; height: 140px; transition: all .3s ease; vertical-align: top;}
    .table_c2 .am, .table_c2 .pm, .table_c2 .all { position: relative; height: 50%; display: flex; flex-direction:column; justify-content: center; padding:5px; box-sizing: border-box;}
    .table_c2 .am { justify-content: flex-end;}
    .table_c2 .pm { border-top: 1px dotted #bfbfbf;}
    .table_c2 .all { height: 100%;}
    .table_c2 th .am { justify-content: center;}
    .am_time_area, .pm_time_area { font-size: 0.875em;}


    .table_c2 .date { position:absolute; top: 5px; right: 5px; font-family: 'Lato', sans-serif; font-weight:600; font-size:0.95em;}
    /* .table_c2 .tr2 th, .table_c2 .tr2 td { border-top: 1px dotted #bfbfbf;} */
    /* .table_c2 .tr2 td { vertical-align: middle;} */
    .table_c2 a { display:flex; flex-direction:column; align-items: center; justify-content: center; text-align: center; width: 100%; padding:8px 5px; box-sizing:border-box; color:#000; font-size:0.875em; line-height: 1.2em; letter-spacing:-0.04em; border:1px solid #ddd; border-radius:5px; background-color: #fff;}
    .table_c2 td .s_bg2 a { cursor: default; color:#666}

    /* .table_c2 td .s_bg1:hover,.table_c2 td a.on { background:#ffe4e4;} */
    .table_c2 td .s_bg1 a:hover { border:1px solid #f4364c;}
    .table_c2 td:first-child { border-left:none;}
    .table_c2 th:first-child { border-left:none;}
    .table_c2 .co1 { color:#f4364c;} /* 일요일 */
    .table_c2 .co2 { color:#00c7b1;} /* 토요일 */
    .table_c2 .today { position:absolute; top:-1px; left:-1px; color:#fff; background:#ef1140; font-style:normal; display:inline-block; font-size:11px; font-weight:700; font-family: 'Lato', sans-serif;  padding:0 5px;}

    @media all and (max-width:1100px) {
    .table_c2 .am { height: 60%;}
    .table_c2 .pm { height: 40%;}
    }


    @media all and (max-width:800px) {

    .table_c2, .table_c2 th, .table_c2 td { font-size:10px;}
    .table_c2 thead th { padding:5px 3px;font-size:10px;}
    .table_c2 tbody th {font-size:10px;}
    .table_c2 td { height: 100px;}
    .table_c2 .am, .table_c2 .pm, .table_c2 .all { padding:3px;}
    .table_c2 a { padding:3px;letter-spacing:-0.08em;}
    .table_c2 .today { font-size:9px; padding:2px; line-height:1em;}
    }

    @media all and (max-width:500px) {
        .table_c2 td { height: 140px;}
    }

    /* // 예술교육프로그램 신청 */

/* 동반인 추가 */
.add_with a { display:block; text-align: center; border:1px dashed #ddd; background:#f9f9f9; padding:10px; border-radius: 10px; color:#000; font-weight: 600;}
.add_with a:hover { background:#000; color:#fff;}



/* ----- 대관절차 ----- */
.procedure_wrap { display: flex; flex-direction: row; justify-content: space-between; gap: 30px; }
.procedure_wrap .sec { width: 100%; display: flex; flex-direction: column; gap: 20px; }
.procedure_wrap .sec > h6 { text-align: center; padding: 15px; background: rgba(0, 165, 60, 0.15); font-size: 17px; font-weight: 800; color: #000; }
.procedure_wrap .sec .ck_step > ul > li { width: 31%; }

ul.proce_step { display: flex; flex-direction: row; gap: 25px; }
ul.proce_step > li { position: relative; width: 100%; height: 160px; padding: 15px; background: #f4f4f4; display: flex; gap: 10px; flex-direction: column; justify-content: flex-start; align-items: center; text-align: center; font-size: 14px; letter-spacing: -0.3px; }
ul.proce_step > li::before { position: absolute; right: -28px; top: 50%; transform: translate(0, -50%); content: ''; background: url('/project/design/contents/img_step_ar.png') no-repeat center center; width: 30px; height: 22px; background-size: 60%; }
ul.proce_step > li:last-child:before { display: none; }
ul.proce_step > li > i { padding-top: 15px; }

@media all and (max-width: 1024px) { 
    .procedure_wrap { flex-direction: column; }
    .procedure_wrap .sec > h6 { font-size: 15px; padding: 10px; }
}
@media all and (max-width: 500px) {
    ul.proce_step { flex-direction: column; }
    ul.proce_step > li { width: auto; }
    ul.proce_step > li::before { left: 50%; top: 101%; transform: translate(-50%, 0) rotate(90deg); }
}
/* ----- // 대관절차 ----- */

/* ----- 대관안내 ----- */
.desc1_style { letter-spacing: -0.6px;}
.space_step ul.ul_desc { border-top: none !important; }
.space_step ul.ul_desc > li { border: none !important; padding: 0; position: relative; padding-left: 12px; line-height: 1.5rem;}
.space_step ul.ul_desc > li::before { position: absolute; content: '*'; top: 0; left: 0; }

.procedure_wrap2 { display: flex; flex-direction: column; gap: 2em; }
.procedure_wrap2 .sec > h6 { text-align: center; padding: 15px; background: rgba(0, 165, 60, 0.15); font-size: 17px; font-weight: 800; color: #000; }


/* 하단 버튼 */
.btn_wrap { display: flex; flex-direction: row; justify-content: space-between; gap: 10px;}
.btn_wrap > div { width: 100%; }
.space_step .btn_rental a { font-size: 16px; padding: 20px 0; }

@media all and (max-width: 800px) { 
    .procedure_wrap2 .sec > h6 { padding: 10px; font-size: 14px; }

    .btn_wrap { display: flex; flex-direction: row; justify-content: space-between; gap: 10px; margin-top: 15px;}
    .btn_wrap > div { width: 100%; }
    .space_step .btn_rental { margin-top: 0; }
    .space_step .btn_rental a { font-size: 13px; padding: 10px; }
}
/* ----- // 대관안내 ----- */

/* 대관시간문구 */
.rental_notice { border: 3px solid #000; border-radius: 8px; padding: 20px; margin-top: 30px; text-align: center; font-size: 1.05rem;}
.rental_notice i { font-size: 1.25rem; color: #f01010;}
.rental_notice .em1 { color: #000; font-weight: 700;}
.rental_notice .em2 { color: #f60; font-weight: 700;}
.rental_notice .em3 { background-color: #000; color: #fff; font-weight: 700; display: inline-block; padding: 5px 20px; border-radius: 20px; margin-right: 10px;}

@media all and (max-width: 1024px) { 
.rental_notice { border: 1px solid #000; padding: 10px; margin-top: 20px; font-size: 0.875rem;}
.rental_notice .em3 { display: block; margin: 5px 0;}
}