@charset "utf-8";


/* 게시판 목록 */
#bo_list { position:relative; }


#bo_list .list-box { border-top:1px solid #666; }
#bo_list .list-box li { position:relative; display:flex; justify-content:space-between; border-bottom:1px solid #ddd; }
#bo_list .list-box li.head { background:#f8f8f8; }
#bo_list .list-box li.empty_table { justify-content:center; align-items:center; height:30vh; }
#bo_list .list-box li:before { content:""; position:absolute; left:0; right:0; bottom:-1px; width:0; height:1px; background:#666; transition-duration:400ms; }
#bo_list .list-box li:not(.head):hover:before { width:100%; }

#bo_list .list-box li div { padding:20px 5px; transition-duration:400ms; }
#bo_list .list-box li.head div { padding-top:25px; padding-bottom:25px; }
#bo_list .list-box li:not(.head) > div { display:flex; }

#bo_list .list-box li div { text-align:center; white-space:nowrap; overflow:hidden; justify-content:center; align-items:center; }

#bo_list .list-box li.head a { position:relative; }
#bo_list .list-box li.head a i { position:absolute; top:calc(50% - 5px); left:calc(100% + 5px); height:10px; font-size:.625rem; color:#ccc; }
#bo_list .list-box li.head a[href*="asc"] i { transform:rotate(-180deg); }

#bo_list .list-box .li_ck { width:40px; display:flex; justify-content:center; align-items:center; }
#bo_list .list-box .li_ck input { margin:0; }
#bo_list .list-box .li_num { width:120px; padding-top:0; padding-bottom:0; }
#bo_list .list-box li:not(.head) .li_num { font-size:.875rem; text-transform: uppercase; }
#bo_list .list-box .li_subject { flex:1; padding-left:30px; padding-right:30px; }
#bo_list .list-box .li_subject a { display:block; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }
#bo_list .list-box .li_name { width:200px; }
#bo_list .list-box .li_tel,
#bo_list .list-box .li_email { width:200px; }
#bo_list .list-box .li_state,
#bo_list .list-box .li_edit,
#bo_list .list-box .li_pop { width:120px; }
#bo_list .list-box li .btn { font-size:.75rem; padding:5px 10px; background:#f8f8f8; border:1px solid #e9e9e9; border-radius: 5px; }

.btn_go { margin-bottom: 20px; display:flex; align-items: center; }
.btn_go .btn { padding: 10px 25px; font-size:.875rem; color:#fff; }
.btn_go a { background: var(--main-color4); margin-right:2px; }
.btn_go a:hover { background: #D73C00; }
.btn_go button { background: #333; color:#fff; }






@media (max-width: 1400px) {
    #bo_list .list-box .li_name { width:120px; }
	#bo_list .list-box .li_tel,
    #bo_list .list-box .li_email { width:180px; }
}

@media (max-width: 1200px) {
    #bo_list .list-box li:not(.head) > div { font-size:.875rem; }
    #bo_list .list-box li:not(.head) .li_num { font-size:.75rem; }

    #bo_list .list-box .li_tel,
    #bo_list .list-box .li_email { width:150px; }

    #bo_list .list-box .li_state { width:100px; }
}


@media (max-width: 1024px) {
    #bo_list .list-box li.head { display:none; }

	#bo_list .list-box li { flex-wrap:wrap; justify-content:flex-start; align-items:center; padding:15px 5px; }

	#bo_list .list-box li div { padding:0; text-align:left; justify-content:left; }

	#bo_list .list-box .li_ck { width:auto; justify-content:flex-start; margin-right:10px; }
	#bo_list .list-box .li_num { width:auto; text-align:left; margin-right:5px; }
	#bo_list .list-box .li_subject { flex:none; width:100%; padding:10px 0 3px; font-size:1.125rem; font-weight:600; }


	#bo_list .list-box .li_name,
	#bo_list .list-box .li_tel,
    #bo_list .list-box .li_email,
    #bo_list .list-box .li_state,
    #bo_list .list-box .li_pop { width:auto; margin-right:20px; }
    #bo_list .list-box .li_email { width:calc(100% - 200px); margin-right:auto; }
    #bo_list .list-box .li_pop button { padding:3px 7px 1px; }
}

@media (max-width: 767px) {
    #bo_list .list-box .li_name,
	#bo_list .list-box .li_tel,
    #bo_list .list-box .li_email { margin-right:15px; }
}


/* 게시판 쓰기 */
#bo_w,
#bo_v { border-radius: 10px; border:1px solid #ddd; background:#f8f8f8; padding:30px 40px; --li-gap:15px; --label-gap:30px; }
.write-title { display:flex; flex-direction: column; padding-bottom:10px; border-bottom:1px solid #666; }
.write-title h5 { font-size:1.25rem; }
.write-title span { font-size:.75rem; color:#888; }
.write-title b { color:var(--k-color-pink); }

.write-box { padding:20px 0; margin-bottom:50px; }

.write-box ul { display:grid; gap:10px; }
.write-box li { position:relative; min-height:60px; display: flex; align-items: center; flex-wrap:wrap; z-index:1; }

.write-box .basic { grid-template-columns: repeat(2, 1fr); }
.write-box .basic li:nth-child(-n+4) { grid-column: span 2; }
.write-box .basic li:nth-child(n+5) { grid-column: span 1; }

.write-box .part-box { position:relative; }
.write-box .part-box:nth-child(n+2) { margin-top:40px; }
.write-box .part-box:nth-child(n+2):before { content:""; position: absolute; left:-15px; top:-20px; right:-15px; background:#666; height:1px; }
.write-box .part-box button { position:absolute; top:0; right:0; background:#333; width:30px; height:30px; display:flex; align-items: center; justify-content: center; color:#fff; z-index:9; }

.write-box .part { grid-template-columns: repeat(2, 1fr); }
.write-box .part li:last-child { grid-column: span 2; }

.write-box .signatory { grid-template-columns: repeat(2, 1fr); }
.write-box .signatory li:nth-child(-n+2) { grid-column: span 2; }

.write-box li > span:first-child { width:100%; font-weight: 600; padding:0 var(--li-gap); align-self: flex-start; margin-top:15px; }
.write-box li > *:first-child:before { content:""; position:absolute; left:0; top:0; right:0; bottom:0; border-radius: 3px; border:1px solid #ddd; background:#fff; z-index:-1; }
.write-box li.on > *:first-child:before { border-color:var(--main-color3); }
.write-box li > label span { position:absolute; left:var(--li-gap); top:50%; transform: translateY(-50%); margin-left:2px; font-size:1rem; color:#aaa; z-index:9; transition-duration: .15s; }
.write-box li.required span:after { content:" *"; color:var(--k-color-pink); margin-left:.1em; }


.write-box .form-tag { position:relative; background-position:calc(100% - 20px) center !important; padding:0 var(--li-gap); background-color:transparent !important; }
.write-box li > label:first-child + .form-tag { height:100%; border-color:transparent; background:transparent; }
.write-box li > label:first-child + textarea.form-tag { padding:7px var(--li-gap); }

.write-box li.focus { border-color:var(--main-color1); padding-top:15px; }
.write-box li.focus > label span { top:7px; transform: translateY(0); font-size:.625rem; font-weight: 600; }


.write-box .manufact { grid-template-columns: repeat(2, 1fr); }
.write-box .manufact li:not(:nth-child(n+5)) { grid-column: span 2; }

.write-box .selects { width:100%; display:flex; flex-wrap:wrap; align-items: center; margin:10px 0; padding:0 var(--li-gap); }
.write-box .selects label { margin:10px var(--label-gap) 10px 0; }
.write-box .other-box { flex:1; display:flex; align-items: center; }
.write-box .other-box .form-tag { opacity:0; visibility:hidden; padding:7px 10px; width:250px; margin-left:calc(-1 * var(--label-gap)/2) }
.write-box .other-box .form-tag.on { opacity:1; visibility:visible; }

.write-box input + label { cursor: pointer; font-size:.875rem; }
.write-box input[type="radio"],
.write-box input[type="checkbox"] { opacity: 0; width:0; margin:0; }
.write-box input[type="radio"] + label { border:1px solid #ddd; margin:0 0 0 -1px; padding:7px 30px; cursor: pointer; background:#f8f8f8; width:50%; text-align: center; margin-bottom:10px; }
.write-box input[type="radio"] + label:first-of-type { border-radius: 5px 0 0 5px; }
.write-box input[type="radio"] + label:last-of-type { border-radius: 0 5px 5px 0; }

.write-box input[type="radio"]:checked + label { background:var(--main-color3); color:#fff; border-color:var(--main-color3); }


.write-box input[type="checkbox"] + label { position:relative; padding-left:23px; --box-size:18px; }
.write-box input[type="checkbox"] + label:before,
.write-box input[type="checkbox"] + label:after { position:absolute; left:0; top:1px; width:var(--box-size); height:var(--box-size); }
.write-box input[type="checkbox"] + label:before { content: ""; border:1px solid #666; border-radius: 3px; }
.write-box input[type="checkbox"] + label:after { content:"\f00c"; font-family: "Font Awesome 6 Free"; font-weight: 900; text-align:center; line-height:20px; font-size:13px; color:var(--k-color-pink); display:none; }

.write-box input[type="checkbox"]:checked + label {  }
.write-box input[type="checkbox"]:checked + label:before { border-color:var(--k-color-pink); }
.write-box input[type="checkbox"]:checked + label:after { display:block; }

.write-box .btn-add { width:100%; border:1px solid #ddd; text-align:center; background:#e5e5e5; margin-top:20px; padding:15px; border-radius: 2px; }
.write-box .btn-add:hover { background:#ddd; }

.write-box .agree { background:#fff; border-radius: 2px; border:1px solid #ddd; padding:20px var(--li-gap); }

.write-box .w_file { position:relative; }
.write-box .w_file ~ .w_file { margin-top:5px; }
.write-box .w_file input[type="file"] { display:none; }
.write-box textarea { resize:none; height:calc(100% - 35px); }

.write-box li .btn { position:absolute; padding:5px 20px; border:1px solid #666; top:50%; transform:translateY(-50%); right:20px; margin:0; border-radius:99px; font-size:.875rem; cursor:pointer; }
.write-box li .btn:hover { background:#333; color:#fff; }

.write-box i { font-size:1.25rem; }
.write-box #cb-agreement { border:1px solid #ddd; margin-top:-3px; }

#bo_w .captcha-box #captcha_info { display:block; margin-top:5px; }
#bo_w #captcha_key { font-size:1rem; }




.info { text-align:center; }
.info .info-desc { margin-bottom:50px; }
.info .con { position: relative; border-radius: 10px; padding:50px 150px; background:rgba(var(--main-color4-rgb), .1); max-width:900px; margin:0 auto; }
.info .con::before { content: ""; position: absolute; left:0; top:0; right:0; bottom:0; border-radius: inherit; background:rgba(235,235,235, .1); z-index:-1; }

.info .con .title { font-size:1.625rem; font-weight: 600; margin-bottom:30px; width:100%; }
.info .con dl { text-align: left; margin:0 auto; width:100%; font-size: 1.125rem; }
.info .con dt { float: left; margin-right:10px; padding-bottom: 10px; width:200px; }
.info .con dd { padding-bottom: 10px }
.info .con a { border-radius: 99px; display: inline-block; padding:10px 50px; background:var(--main-color4); color:#fff; margin-top:20px;  }


.info .sec6{width:100%; max-width:900px; margin:0 auto 50px;  }
.info .sec6 ul { display:flex; padding:30px 50px; border-radius:200px; border:1px dotted var(--main-color1); }
.info .sec6 ul li { position:relative; width:calc(100%/4 + 20px); border-radius:100%; margin:0 -10px; overflow:hidden; background:rgba(var(--main-color1-rgb),.05); }
.info .sec6 ul li:last-child { background:var(--main-color1); color:#fff; }
.info .sec6 ul li:before { content:""; display:block; padding-bottom:100%; }
.info .sec6 ul .content { position:absolute; left:0; top:0; right:0; bottom:0; display:flex; flex-direction:column; justify-content:center; align-items:center; }

.info .sec6 ul .step { color:var(--main-color2); font-weight:600; }
.info .sec6 ul .head { margin-top:10px; }

@media (max-width: 767px) {
	.info .con { position: relative; border-radius: 10px; padding:50px 30px; }
	.info .con .title { font-size:1.25rem; margin-bottom:15px; }
	.info .con dl { font-size: 0.875rem; }
    .info .con dt { width:100%; float: none; padding-bottom:2px; }
    .info .con dd { margin-bottom:5px; }

    .info .sec6 ul { flex-wrap: wrap; padding:25px 20px; border-radius:100px; }
    .info .sec6 ul li { width: calc(100% / 2 + 20px); margin:-10px; }
    .info .sec6 ul .head { font-size:.875rem; }
}


.modal-board button[data-dismiss="modal"]:first-child { top:5px; right:5px; width:25px; height:25px; }
.modal-board .modal-dialog { width:auto; }
.modal-board .modal-content { padding:30px 50px; text-align: center; border:none; border-radius: 10px; }
.modal-board .modal-content .head { color:var(--main-color1); font-size:1.5rem; font-weight: 600; }
#modal-today .modal-content button { border-radius: 99px; background: var(--main-color1); color:#fff; padding:5px 30px; margin-top:20px; }

.modal-board .modal-content form { display: flex; flex-direction: column; align-items: flex-start; }
.modal-board .modal-content form label { font-weight: 600; margin-bottom:5px; }
.modal-board .modal-content form input { margin-bottom:10px; }
.modal-board .modal-content form button { margin:10px auto 0; border-radius: 99px; background:#333; color:#fff; padding:10px 30px; }

.modal-board .modal-content ul { text-align: left; padding:10px 30px 15px; }
.modal-board .modal-content li { display: flex; align-items: center; padding:10px; }
.modal-board .modal-content li.num { text-transform: uppercase; }
.modal-board .modal-content li:not(:last-child) { border-bottom: 1px dotted rgba(255,255,255,.3); }
.modal-board .modal-content li i { width:24px; text-align:center; color:#666; margin-right:10px; }


#modal-ticket button[data-dismiss="modal"]:first-child:before,
#modal-ticket button[data-dismiss="modal"]:first-child:after { background:#fff; }

#modal-ticket .modal-dialog { max-width:90vw; }
#modal-ticket .modal-content { padding:0; background:none; box-shadow: none; }
#modal-ticket .swiper-box { position:relative; }
#modal-ticket .swiper { max-width:400px; padding:15px; --logo-w:45px; }
#modal-ticket .swiper-slide { border-radius:10px; background:var(--main-color3); color:#fff; box-shadow: 5px 5px 20px rgba(0,0,0,.1); padding-left:var(--logo-w); overflow:hidden; }
#modal-ticket .swiper-slide:before { content:""; position: absolute; left:0; top:0; bottom:0; background:#fff url('img/logo.png') no-repeat center/contain;  width:var(--logo-w); }
#modal-ticket .swiper-slide .ticket-title { padding:15px 30px; border-bottom:1px solid rgba(255,255,255,.3); display:flex; justify-content: space-between; align-items: flex-end; }
#modal-ticket .swiper-slide .part_name { font-size:1.25rem; }
#modal-ticket .swiper-slide .part_position { font-weight:600; }
#modal-ticket .pg { display:inline-block; width:auto; border-radius: 99px; transform: translateY(-5px); background:#fff; padding:5px 20px; font-size:.75rem; }

#modal-ticket .nav { position: absolute; color:#fff; top:50%; transform: translateY(-50%); cursor: pointer ;}
#modal-ticket .nav.prev { left: -30px; }
#modal-ticket .nav.next { right: -30px; }


.btn-modal { display:block; padding:10px 20px; background:#333; color:#fff; border-radius: 5px; margin-bottom:5px; font-size:.75rem; margin-left:auto; }
.btn-modal:hover, .btn-modal:focus { color:#fff; }
#modal-history .modal-dialog { max-width:400px; }
#modal-history .modal-content { display:flex; flex-wrap: wrap; align-items: center; }
#modal-history .modal-content label { width:80px; text-align: left; }
#modal-history .modal-content input { width:calc(100% - 80px); margin:2px 0; }
#history_btn { border-radius: 5px; background:var(--main-color3); color:#fff; width:100%; padding: 10px; font-size:.875rem; margin-top: 10px; }



.ui-datepicker { z-index:1050 !important; }


/* 댓글 */
/*#bo_comment .pf_img { display:none; }*/


/* 게시판 읽기 */
#bo_v { }


@media (max-width: 767px) {
	#bo_w,
    #bo_v { padding:15px; --label-gap:20px; }

    .title { padding-bottom:5px; }
    .title h5 { font-size:1.125rem; }

    .write-box { padding:10px 0; margin-bottom:20px; }
    .write-box ul { gap:5px; grid-template-columns: 100% !important; }
    .write-box li { min-height:50px; }

    .write-box .basic li:nth-child(-n+4),
    .write-box .manufact li:not(:nth-child(n+5)),
    .write-box .part li:last-child,
    .write-box .signatory li:nth-child(-n+2) { grid-column: span 1; }

    .write-box li > label span { margin-left:1px; }

    .write-box .selects label { margin:5px var(--label-gap) 5px 0; }
    .write-box .other-box .form-tag { padding:5px 10px; width:auto; }

    .write-box .selects { margin:5px 0; }
    .write-box .btn-add { padding:10px; margin-top:10px; }

    .write-box .agree { padding:15px var(--li-gap); }


    #modal-ticket .nav.prev { left: -5px; }
    #modal-ticket .nav.next { right: -5px; }
}