@charset "utf-8";
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.8/dist/web/variable/pretendardvariable.css");
@import url('https://fonts.googleapis.com/css2?family=Nanum+Myeongjo&display=swap');


*{list-style: none; text-decoration: none; margin:0; padding:0; box-sizing: border-box;  letter-spacing:-0.05em; font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Segoe UI", "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif; color:#1b1b1b;}

button{border:none; background:none;}
input,select{-webkit-border-radius:0; background-color:#fff;}
table, th, thead, tfoot {outline: 0;}
table{border-collapse: collapse; border-spacing: 0;}

html{scroll-behavior: smooth;}
label, input, button, select, img{vertical-align:middle;}

.mart10{margin-top:10px !important;}
.mart15{margin-top:15px !important;}
.mart20{margin-top:20px !important;}
.mart30{margin-top:30px !important;}
.mart40{margin-top:40px !important;}
.mart50{margin-top:50px !important;}
.mart60{margin-top:60px !important;}
.mart100{margin-top:100px !important;}

.w30{width:30px !important;}
.w40{width:40px !important;}
.w50{width:50px !important;}
.w80{width:80px !important;}
.w100{width:100px !important;}
.w120{width:120px !important;}
.w150{width:150px !important;}
.w200{width:200px !important;}
.w220{width:220px !important;}

.ipt_20{width:20% !important;}
.ipt_30{width:30% !important;}
.ipt_40{width:40% !important;}
.ipt_42{width:42% !important;}
.ipt_44{width:44% !important;}
.ipt_57{width:57% !important;}
.ipt_70{width:70% !important;}
.ipt_75{width:75% !important;}

.md10{margin: 10px 0;}
.mr8{margin-right:8px;}


/* ------------------------------------------------------------------------------------------------------------------------------------------------ */

section{width:100%; height:100vh; display:flex; align-items:center; justify-content:center; transition:transform 0.8s ease-in-out; position:relative;}
.section_1 {background:url('img/banner_11.png') no-repeat center top / cover;}
.section_2 {background:url('img/banner_2.png') no-repeat center top / cover;}


.container {
    transition: transform 0.8s ease;
}

section {
    height: 100vh;
}

footer {
    width: 100%;
    height: 300px; /* 고정 */
    background-color: #fff;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.5rem;
	    flex-direction: column;
  }

.footer ul{display:flex; gap:20px; width:100%; padding:0 20px; margin-bottom:14px;}
.footer ul li a{font-size:15px; font-weight:500;}
.foot24{width:100%; padding: 0 20px; }
.foot24 h2{font-size:20px; margin-bottom:20px;}
.foot24 p{font-size:15px; line-height:26px; color:#9fa1a4;}
.foot24 .fo_line{margin: 0 8px;}

.bbs_fter ul{ max-width: 960px;}
.bbs_fter .foot24{max-width: 960px; }
.fixed-header{position:fixed; top:0; left:0; width:100%; height:76px; color:#fff; display:flex; align-items:center; justify-content: space-between; z-index:1000; padding:0 30px; }
.fixed-header h1{font-size:24px;}
.fixed-header a{padding:8px 15px; background-color:#613f17; color:#fff; font-size:15px; display:inline-block; border-radius:4px;}
.fixed-header a:hover{background-color:#7a5220;}

.text_1{position:absolute; right:200px; top:30%; }
.text_1 h2{color:#fff; font-family: 'Nanum Myeongjo', serif; font-weight:500; font-size:55px; margin-bottom:40px; line-height:80px;}
.text_2{position:absolute; right:200px; top:35%; }
.text_2 h2{color:#fff; font-family: 'Nanum Myeongjo', serif; font-weight:500; font-size:55px; margin-bottom:40px; line-height:80px;}
.text_2 .port_a{font-size:24px; padding:22px 40px; display:inline-block; background-color:#613f17; font-weight:500; color:#fff; border-radius:10px;}
.text_2 .port_a:hover{background-color:#7a5220;}
.text_2 .port_a span{color:#fff; font-size:28px; font-weight:bold;}


/* 폼 */
.form{max-width:640px; margin: 0 auto; margin-top:50px;}
.form h1{text-align:center; font-size:24px;}
.form .form_bx{background-color:#fff; margin-top:20px; padding:40px 30px; box-shadow: 0 2px 8px rgba(0, 0, 0, .1); border-radius:12px;}
.form .form_bx .fm_div{border-top:1px solid #888; margin-top:20px;}
.form .form_bx table{width:100%; table-layout: fixed;}
.form .form_bx table tr{border-bottom:1px solid #ddd;}
.form .form_bx table th,
.form .form_bx table td{padding:10px; height:40px; font-size:14px;}
.form .form_bx table th{background-color:#f6f6f6; text-align:left;}
.form .frm_input{border:1px solid #ddd; padding:5px; height:25px; border-radius:4px; font-size:14px;}
.form .frm_select{border:1px solid #ddd; padding:0 5px; height:25px; border-radius:4px; font-size:14px;}

.oby_img{text-align:center;}
.oby_img #preview1{width:120px; height:160px; background-color:#fafafa; display:block; margin: 0 auto; object-fit: cover; border-radius:6px; box-shadow: 0 0 0 1px #d8d8d8 inset; object-position:center;}    
.oby_img #preview2{width:120px; height:160px; background-color:#fafafa; display:block; margin: 0 auto; object-fit: cover; border-radius:6px; box-shadow: 0 0 0 1px #d8d8d8 inset; object-position:center;}    
.oby_img input[type=file]{display:none; border:none;}
.oby_img .upload{background-color:#6b6b6b; color:#fff; margin-top:5px; text-align:center; cursor:pointer; border-radius:6px; padding:5px 0; display:inline-block; width:120px;} 
.oby_img .upload:hover{background-color:#818181;}

.sub{font-size:13px; color:#454545; margin-top:5px;}

.type_lab{display:flex; gap:15px; height:100%; overflow-y:scroll;}
.type_lab img{width:80px; height:107px; object-fit: cover; cursor:pointer; border-radius:6px;}
.type_lab div{text-align:center; margin-top:6px; font-weight:500; cursor:pointer;}
.type_lab div span{vertical-align:middle; margin-left:3px;}

.chckdiv{margin-top:10px; font-weight:500;}
.chckdiv label{display:block; vertical-align:middle; margin-bottom:5px; cursor:pointer;}
.chckdiv input{vertical-align:middle; margin-top:-3px; margin-right:3px; cursor:pointer;}

.form_btn{margin-top:20px; width:100%; height:55px; background-color:#000; color:#fff; font-size:17px; cursor:pointer; border-radius:10px;} 
.form_btn:hover{background-color:#333;}
.form_btn span{color:#fff; font-size:20px; font-weight:bold;}

.fm_div table col:last-child {width: 100%;}












/* ===================================================================================================================================================
	영정사진 제작
=================================================================================================================================================== */ 

.gen_header{display:flex; align-items:center; justify-content:space-between; height:72px; background-color:#fff; padding:0 30px; position:sticky; top:0; left:0; z-index:100; box-shadow: 0px 6px 9px -4px rgba(153, 153, 153, .25);}
.gen_header h1{font-size:22px;}
.gen_header > div{display:flex; gap:20px;}
.gen_header > div p{font-weight:500;}
.gen_header > div a{color:#ff0000; font-size:15px;}


.gen_main{display:flex; justify-content:center; gap:20px; margin-top:30px;}
.gen_main .gen_1{width:460px; background-color:#fff; box-shadow: 0px 6px 9px -4px rgba(153, 153, 153, .05); padding:30px 0; border-radius:12px;}
.gen_main .gen_1 > h2{font-size:20px; padding: 0 20px 20px 20px;}
.gen_main .gen_1 .gen1_top{padding: 0 20px;}
.gen_main .gen_1 .gen1_top h3{font-size:16px;}
.gen_main .gen_1 .gen1_top h3 span{font-weight:400; color:#6c7174;}

.gen1_bx{height:600px; overflow-y:auto;}
.gen1_bx::-webkit-scrollbar { width: 8px;}
.gen1_bx::-webkit-scrollbar-track {background: #f0f0f0; border-radius: 4px;}
.gen1_bx::-webkit-scrollbar-thumb { background-color: #bbb;  border-radius: 4px; border: 2px solid #f0f0f0; }
.gen1_bx::-webkit-scrollbar-thumb:hover { background-color: #999;}

.gen1_img {display: flex;  flex-wrap: wrap; gap: 10px; width: 100%; padding:15px; border:1px solid #e8e8e8; border-radius:12px; margin-top:15px;}
.gen1_img .img_box {position: relative; width: 100%; height:140px; overflow: hidden; cursor: pointer; display: flex; flex-direction: column; align-items: center; justify-content: center; background-color: #f8f8f8; transition: background-color 0.3s ease, border-color 0.3s ease;}
.gen1_img .img_box:not(.add_box) {width: calc(50% - 5px); border-radius:12px;}
.gen1_img .img_box p {color: #999; font-size: 14px;}
.gen1_img .img_box img {width: auto; height: 100%; object-fit: cover; display: block; border-radius:12px;}
.gen1_img .add_box {font-size: 40px; color: #bbb; background-color: #f8f8f8; transition: background-color 0.3s ease, border-color 0.3s ease; border-radius:12px;}
.gen1_img .add_box:hover {background-color: #f0f0f0; box-shadow: inset 0 0 10px rgba(0,0,0,0.05); color:#333;}
.gen1_img .add_box p{font-size:16px; color:#000; font-weight:bold;}
.gen1_img .add_box .subp{font-size:14px; font-weight:normal; color:#6c7174; margin-top:2px;}
.gen1_img .add_box .add_icon{width:auto; height:22px; border-radius:0px; margin-bottom:10px;}

.img_box .hover_actions {position: absolute; inset: 0; background: rgba(0,0,0,0.5); opacity: 0; display: flex; align-items: center; justify-content: center; gap: 15px; transition: opacity 0.3s; border-radius:12px;}
.img_box:hover .hover_actions {opacity: 1;}
.hover_actions button {border: none; width: 30px; height: 30px; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 18px;}
.hover_actions button:hover {}


.gen1_mid{margin-top:20px; padding: 0 20px;}
.gen1_mid h3{font-size:16px;}
.gen1_mid .prompt{padding:15px; border-radius:12px; border:1px solid #e8e8e8; margin-top:12px;}
.gen1_mid .prompt textarea{width:100%; height:100px; border:none; resize:none; outline:none; font-size:15px;}
.gen1_mid .prompt textarea:focus{border:none; outline:none;}
.gen1_mid .prompt textarea::placeholder{font-size:15px; color:#989898;}

.gen1_fot{margin-top:20px; padding:0 20px;}
.gen1_fot h3{font-size:16px;}
.gen1_fot h3 span{font-weight:400; color:#6c7174;}

.color_select {margin-top:12px; display: flex; flex-wrap: wrap; gap: 20px;}
.color_select label { display: flex; flex-direction: column; align-items: center;  width: calc(20% - 16px); cursor: pointer;}
.color_select input[type="radio"] {display: none;}
.color_box { width: 100%; height: 60px; border-radius: 6px; border: 2px solid transparent; transition: all 0.2s ease;}
.color_select p { margin-top: 8px; font-size: 14px; color: #333;}

/* ✅ 선택된 상태 */
.color_select input[type="radio"]:checked + .color_box { border:2px solid #000 !important;}
.color_select input[type="radio"]:checked + .color_box + p { color: #000; font-weight: 600;}

.gen1_btn{padding:20px 20px 0 20px;}
.gen1_btn button{width:100%; height:60px; background-color:#333; color:#fff; font-size:18px; border-radius:12px; cursor:pointer;} 
.gen1_btn button:hover{background:#555;}










.gen_main .gen_2{width:605px; background-color:#fff; box-shadow: 0px 6px 9px -4px rgba(153, 153, 153, .05); padding:30px 20px; border-radius:12px;}

.gen2_top h3 .gen2_tit{border:1px solid #383838; font-size:16px; display:inline-block; padding:2px 12px; border-radius:50px; color:#383838;}
.gen2_top h3 b{font-weight:500; font-size:15px; color:#888a8d; margin-left:10px;} 

.gen2_top2{margin-top:20px;}
.gen2_top2 ul{display:flex; gap:10px;}
.gen2_top2 ul li{width:50px; border-radius:10px;}
.gen2_top2 ul li img{width:100%; height:50px; object-fit:cover; border-radius:10px;}
.gen2_top2 p{margin-top:10px; font-weight:500;}
.gen2_top2 p img{width:15px; vertical-align:middle; margin-right:10px; margin-top:-10px;}

.gen2_mid{margin-top:15px; display:flex; gap:12px;}
.gen2_mid input[type="radio"] {display: none;}
.gen2_mid img {width: 180px; aspect-ratio: 3 /4; object-fit: cover; border-radius: 8px; border: 2px solid transparent; cursor: pointer; transition: 0.2s;}
.gen2_mid input[type="radio"]:checked + img { border:3px solid #000; box-shadow: 0 0 8px rgba(0,119,204,0.4);  transition: all 0.2s ease;}

.gen2_table{margin-top:20px;}
.gen2_table > div h3{font-size:16px; margin-bottom:10px;}
.gen2_table > div input{width:100%; border:1px solid #e8e8e8; padding:10px; border-radius:6px; font-size:15px;}

.gen2_ck{margin-top:13px; display:flex; gap:10px;}
.gen2_ck label{font-size: 15px; cursor:pointer; vertical-align:middle; font-weight:500;}
.gen2_ck input{margin-right:3px; vertical-align:middle; margin-top:-2px; width:14px; height:14px;}



.gen2_mid img {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeUp 4s ease forwards infinite;
}

.gen2_mid label:nth-child(1) img { animation-delay: 0s; }
.gen2_mid label:nth-child(2) img { animation-delay: 0.15s; }
.gen2_mid label:nth-child(3) img { animation-delay: 0.3s; }

@keyframes fadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 타자 효과 (무한 반복용) */
@keyframes typing {
  0% {
    width: 0;
  }
  40% {
    width: 50ch; /* 글자 수에 맞게 조절 */
  }
  60% {
    width: 50ch;
  }
  100% {
    width: 0;
  }
}

/* 커서 깜빡임 */
@keyframes blink {
  0%, 50%, 100% {
    border-color: transparent;
  }
  25%, 75% {
    border-color: #666;
  }
}

#typingText {
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  width: 0;
  animation:
    typing 6s steps(50, end) infinite,
    blink 0.8s step-end infinite;
}



.g_btn{background-color:#000 !important;}
.g_btn:hover{background-color:#363636 !important;}


/* ==================================================================
	로그인
===================================================================== 

.login{display:flex; align-items: center; justify-content: center;}
.login h1{margin-bottom:30px;}
.login > div{position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); width:500px; padding:70px 50px; background-color:#fff; box-shadow: 0px 6px 9px -4px rgba(153, 153, 153, .1); border-radius:20px; text-align:center;}
.login > div h2{margin-bottom:30px;}
.login > div > .log_ipt input{border:1px solid #e8e8e8; border-radius:10px; padding:10px 12px; width:100%; margin-bottom:10px; height:48px; font-size:16px;}
.login .log_ck{display:flex; gap:15px; align-items:left; margin-top:5px;}
.login .log_ck label{font-size:16px; color:#454545; cursor:pointer;}
.login .log_ck input{margin-top:-3px; cursor:pointer; margin-right:2px;}

*/

.log_btn{width:100%;  background-color:#333; font-size:17px; font-weight:600; border-radius:12px; margin-top:40px; cursor:pointer;}
.log_btn:hover{background-color:#000;}
.log_btn a{display:block; color:#fff; width:100%; height:50px; line-height:50px; display:inline-block; font-size:16px;}

.log_btn2 {
    width: 100%;
    margin-top: 10px;
    border: 1px solid #aaa;
    text-align: center;
    border-radius: 10px;
    font-size: 16px;
}

.log_btn2 a {
    color: #666;
    width: 100%;
    height: 50px;
    display: inline-block;
    line-height: 50px;
}





.mgmt_sub{max-width:960px; margin: 0 auto; margin-top:30px;}
.mgmt_sub h2{font-size:22px; text-align:left; padding-bottom:15px; border-bottom:2px solid #7f7f7f; font-weight:700;}




.mgmt_hed{background-color:#312208; height:55px;}
.mgmt_hed .mgmt_hedbx{max-width:960px; margin: 0 auto;}
.mgmt_hed .mgmt_hedbx h1{font-size:22px; line-height:55px;}
.mgmt_hed .mgmt_hedbx h1 a{color:#fff;}

.mgmt_bx{padding:20px 30px;}
.mgmt_bx h3{font-size:17px; margin:12px 0 8px 0;}
.mgmt_bx h4{font-size:15px; margin:10px 0 8px 0;}
.mgmt_bx p{font-size:14px; line-height:20px; color:#666;}

.mgmt_bx .ckbx{margin-top:20px;}
.mgmt_bx .ckbx label{font-size:14px; font-weight:500; cursor:pointer;}
.mgmt_bx .ckbx input{margin-right:3px; vertical-align:middle; margin-top:-2px; cursor:pointer;}
.mgmt_bx .ckbx_p1{margin-top:12px; margin-bottom:10px;}
.bbs_fter{border-top:1px solid #ddd; height:250px; margin-top:50px;}
.mgmt_bx .ckbx button{border:1px solid #ff0000; color:#ff0000; padding:8px 20px; margin-top:15px; font-size:14px; cursor:pointer;}
.mgmt_bx .ckbx .frm_input{border:1px solid #888; height:25px; padding:0 5px;}

.fm_tadiv{margin:12px 0; }
.fm_tadiv table{border-top:1px solid #888;}
.fm_tadiv table th{background-color:#f8f8f8;}
.fm_tadiv table th,
.fm_tadiv table td{padding:5px; font-size:14px; text-align:center; border-right:1px solid #ddd; border-bottom:1px solid #ddd;}
.fm_tadiv table th:last-child{border-right:0px;}
.fm_tadiv table td:last-child{border-right:0px;}
.fm_tadiv table tbody th{background-color:#fff8f8;}



/* ------------------------------------------------------------------------------------------------------------------------------------------------ */

/*
로그인
*/

.login{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:90%; background-color:#fff; padding:40px 30px; border-radius:20px; box-shadow: 0px 6px 9px -4px rgba(153, 153, 153, .25);}
.login h1{text-align:center; margin-bottom:30px;}
.login h1 img{width:160px;}

.log_ipt input{border:1px solid #ddd; width:100%; padding:10px 12px; border-radius:10px; height:48px; margin-bottom:10px; font-size:16px;}
.log_ck label{margin-right:5px; vertical-align:middle; font-size:15px; cursor:pointer;}
.log_ck input{vertical-align:middle; margin-top:-2px; cursor:pointer;}
.log_btn{width:100%; margin-top:30px; background-color:#333; font-size:16px; border-radius:10px;}
.log_btn a{color:#fff; width:100%; height:48px; display:inline-block; line-height:48px;}
.log_btn2{width:100%; margin-top:10px; border:1px solid #aaa; text-align:center; border-radius:10px; font-size:16px;}
.log_btn2 a{color:#666; width:100%; height:48px; display:inline-block; line-height:48px;}



/*
회원가입
*/

.reg_tit{ margin:20px 0 10px;}
.reg_tit h2{font-size:17px;}

.reg_form{margin:30px 0; padding: 0 15px;}
.reg_form h1{text-align:center; font-size:20px; font-weight:700; position:relative;}
.reg_table{border-top:1px solid #888;}
.reg_table table{width:100%; }
.reg_table td,
.reg_table th{padding:10px; border-right:1px solid #ddd; border-bottom:1px solid #ddd; font-size:15px;}
.reg_table th{background-color:#f6f7f9; text-align:left;}

.reg_table td:last-child{border-right:0px;}
.reg_table td .frm_input{width:100%; padding:0 8px; border:1px solid #ccc; height:33px; font-size:15px;}
.reg_table td .frm_select{width:100%; padding:0 8px; border:1px solid #ccc; height:33px; font-size:15px;}
.reg_table .hd_ckbt{padding:0 12px; height:33px; background-color:#000; border-radius:3px; font-size:14px; margin:6px 0; color:#fff;}
.reg_table .wharf{width:45% !important;}

.chkbx{margin-top:10px;}
.chkbx label{font-size:15px; font-weight:500; cursor:pointer;}
.chkbx input{margin-top:-3px; margin-right:3px;  cursor:pointer;}

.re_form_btn{margin-top:30px; width:100%; background-color:#333; border-radius:10px;}   
.re_form_btn a{display:inline-block; height:48px; line-height:48px; color:#fff; font-size:16px; width:100%;}



/*
모두의영정 신청
*/

.gen_from{margin:30px 0; padding: 0 15px;}
.gen_from h1{text-align:center; font-size:18px; font-weight:700; position:relative;}

.gen_img {margin-top: 20px;}
.gen_img h2 {font-size: 18px; margin-bottom: 5px;}
.gen_img h3 {font-size: 15px; color: #666; margin-bottom: 12px; font-weight:500;}

.gen_img .img_box {display: flex; gap: 15px;}
.img_wrap {width:100%; flex: 1; display: flex; flex-direction: column; align-items: center; gap: 5px;}

.img_area {aspect-ratio: 3 / 4; height:180px; border: 1px solid #ddd; border-radius: 8px; display: flex;  justify-content: center;  align-items: center;  cursor: pointer;  overflow: hidden;  background: #f8f8f8;  transition: 0.2s;}
.img_area span { color: #777; font-size: 14px; text-align: center; pointer-events: none;}
.img_area img {width: auto; height: 200px; object-fit: cover; display: none;}

.btn_area {width:100%; margin:2px 0 10px; text-align:center;}
.delete_btn { background: red;  color: #fff;  border: none;  font-size: 14px;  width:100%; padding: 8px 14px;  border-radius: 4px;  cursor: pointer;  display: none;  transition: 0.2s;}

.fur_box{margin-top:20px;}
.fur_box h2{font-size:18px; margin-bottom:10px;}
.fur_box h2 a{float:right; font-size:14px; background-color:#918282; padding:6px 10px; color:#fff; font-weight:500; margin-top:-5px; border-radius:5px;}
.fur_box .frm_input{width:100%; padding:10px; border:1px solid #ccc; height:40px; font-size:15px; border-radius:5px;}
.fur_box > div{margin-bottom:6px;}

.frm_select{width:100%; padding:10px; border:1px solid #ccc; height:40px; font-size:15px; border-radius:5px;}

.rec_box{margin-top:20px;}
.rec_box > div{margin-bottom:20px;}
.rec_box > div h2{font-size:18px; margin-bottom:10px;}
.rec_box > div .frm_input{width:100%; padding:10px; border:1px solid #ccc; height:40px; font-size:15px; border-radius:5px;}

.frame{margin-bottom:10px;}
.frame label{font-size:16px; vertical-align:middle; font-weight:500; cursor:pointer;}
.frame input{vertical-align:middle; margin-right:2px; margin-top:-2px; cursor:pointer;}


.mgmt{margin:30px 0; padding: 0 15px;}
.mgmt h1{text-align:center; font-size:18px; font-weight:700; position:relative;}
.mgmt ul{margin-top:25px;}
.mgmt ul li a{background-color:#fff; margin-bottom:12px; padding:20px; display:block; border-radius:12px; box-shadow: 0px 6px 9px -4px rgba(153, 153, 153, .05); display:flex; justify-content: space-between; align-items: center;}
.mgmt ul li a h3{font-size:17px; font-weight:600;}
.mgmt ul li a h3 img{width:20px; margin-right:10px; vertical-align:middle; }
.mgmt ul li a h3 .modu1{margin-top:-3px;}
.mgmt ul li a h3 .modu2{margin-top:-3px;}
.mgmt ul li a span{background-color:#8a8a8a; width:26px; height:26px; border-radius:50%; display:flex; justify-content: center; align-items: center;}
.mgmt ul li a span img{width:20px;}

.md_list{margin-top:30px; border-top:1px solid #888;}
.md_list table{width:100%;}
.md_list th{background-color:#f6f7f9; padding:10px;}
.md_list th,
.md_list td{border-right:1px solid #ddd; border-bottom:1px solid #ddd; font-size:13px; text-align:center; }
.md_list th:last-child{border-right:0px;}
.md_list td:last-child{border-right:0px;}
.md_list td{padding:5px; font-weight:500;}

.back{position:absolute; left:0; top:-2px;}
.back img{width:20px;}

.name{position:absolute; right:0; top:0; font-size:15px; font-weight:500; margin-top:3px;}

.datetime span{display:block; margin-top:3px;}
.addr_td span{display:block; margin-top:3px;}
.date_td img{width:40px;}
.date_td img:last-child{margin-left:5px;}



.pop_ched{padding:20px 15px 15px 15px;}
.pop_ched h2{font-size:17px;}

.fune{padding:0 15px;}
.fune .fune_hed ul{display:flex; gap:5px; flex-wrap:wrap;}
.fune .fune_hed ul li{padding:4px 8px; background-color:#f8f8f8; font-size:14px; border-radius:3px; cursor:pointer;}
.fune .fune_hed ul li.active{background-color:#454545; color:#fff;}

.fune_sch{margin:10px 0 0; display:flex; align-items:center; gap:5px; justify-content: center; padding:10px 0; background-color:#f1f1f1; border-top:1px solid #ddd; border-bottom:1px solid #ddd;}
.fune_sch select,
.fune_sch input{border:1px solid #c2c2c2; padding:0 5px; height:25px;}
.fune_sch input[type="submit"]{background-color:#454545; color:#fff; border:1px solid #454545;}

.fune_tab{margin-top:15px;}
.fune_tab table{width:100%;}
.fune_tab th{background-color:#f6f7f9;}
.fune_tab th,
.fune_tab td{font-size:13px; padding:5px;}

.da_td{text-align:center; }
.da_td input{padding:3px 7px; border:1px solid #999; background-color:#999; color:#fff;}

/*페이징*/
.pg_wrap {margin:0;padding:30px 0 20px 0;text-align:center;}
.pg_wrap span,.pg_wrap strong,.pg_wrap a {display:inline-block;text-decoration:none;}
.pg {}
.pg a:focus,.pg a:hover {text-decoration:none;border:1px solid #333;}
.pg_page,.pg_current {padding:0 8px;min-width:9px;height:25px;color:#353e44;font-weight:normal;line-height:25px;vertical-align:middle;border:1px solid #c8c8c8;}
.pg_page {background-color:#fbfbfb;text-decoration:none;}
.pg_current {background-color:#333;color:#fff;border:1px solid #333 !important;}
.pg_start,.pg_prev,.pg_next,.pg_end {width:27px;height:27px;overflow:hidden;padding:0 !important;font-size:0 !important;text-indent:-9000px;border:none !important;background:url('/img/sprite_pg.png') no-repeat;vertical-align:top;}
.pg_prev {margin-right:4px;}
.pg_next {margin-left:4px;}
.pg a.pg_start {background-position:-116px 0;}
.pg a.pg_prev {background-position:-145px 0;}
.pg a.pg_next {background-position:-174px 0;}
.pg a.pg_end {background-position:-203px 0;}
.pg span.pg_start {background-position:0 0;}
.pg span.pg_prev {background-position:-29px 0;}
.pg span.pg_next {background-position:-58px 0;}
.pg span.pg_end {background-position:-87px 0;}



.img_area_two {display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; width:100%;     justify-items: center;     align-items: center;}
.img_area_two label { display:block;  border-radius:8px; position:relative; overflow:visible; cursor:pointer; width:100%;}
.img_area_two label .img-inner { width:100% !important; height:200px; overflow:hidden; margin: 0 auto; }
.img_area_two input[type="radio"] { display:none; }
.img_area_two img { width:100%; height:100%; object-fit:cover; display:block; }
.img_area_two label:has(input[type="radio"]:checked) img{ box-shadow:0 0 0 4px #007bff; border-radius:8px; }

.img_area_two label {
    min-width: 0;
}

.img-popup {
	position: fixed;
	inset: 0;
	z-index: 99999;
}

.popup-dim {
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,.7);
}

.popup-box {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 90%;
	max-width: 520px;
	background: #fff;
	border-radius: 16px;
	padding: 20px;
}

.popup-close {
	position: absolute;
	right: 15px;
	top: 15px;
	background: none;
	border: none;
	font-size: 20px;
	cursor: pointer;
	z-index:10000;
}

.popupSwiper img {
	width: 100%;
	height: auto;
	border-radius: 12px;
}

.img_area_two label.active img{
	box-shadow: 0 0 0 4px #007bff;
	border-radius: 10px;
}

.genh3 button{float:right; background-color:#999; color:#fff; padding:8px 14px; font-size:14px; margin-top:-10px; border-radius:10px;}
.genh3:after{content:""; clear:both; display:block;}

.img-popup .swiper-button-prev:after, .img-popup .swiper-rtl .swiper-button-next:after{display:none;}


/* 하단 메뉴 */
.tail{position:fixed; left:0; bottom:0; width:100%; height:65px; background-color:#fff; border-top:1px solid #f2f2f2; z-index:100;}
.tail ul::after{content:""; clear:both; display:block;}
.tail ul li{float:left; width:25%; text-align:center; font-size:15px; cursor:pointer; line-height:1.5em;}
.tail ul li a:before{width:20px; height:20px; margin: 12px auto 4px; display:block; vertical-align:middle; content:'';}
.tail ul li a{color:#8c8d93; display:block;}
.tail ul li.active a{color:#151719; font-weight:600;}

.tail ul li.tab1 a:before{background: url(img/tail_icon1_off.png) no-repeat center; background-size: 100% auto;}
.tail ul li.tab2 a:before{background: url(img/point_icon1_off.png) no-repeat center; background-size: 100% auto;}
.tail ul li.tab3 a:before{background: url(img/tail_ic44.png) no-repeat center; background-size: 100% auto;}
.tail ul li.tab4 a:before{background: url(img/tail_far.png) no-repeat center; background-size: 100% auto;}

.tail ul li.tab1.active a:before{background: url(img/tail_icon1_onn.png) no-repeat center; background-size: 100% auto;}
.tail ul li.tab2.active a:before{background: url(img/point_icon1_onn.png) no-repeat center; background-size: 100% auto;}
.tail ul li.tab3.active a:before{background: url(img/tail_ic4.png) no-repeat center; background-size: 100% auto;}
.tail ul li.tab4.active a:before{background: url(img/tail_far2.png) no-repeat center; background-size: 100% auto;}


/* log */
.log{background-color:#fff; padding:20px; border-radius:12px; box-shadow: 0px 6px 9px -4px rgba(153, 153, 153, .05);}
.log > h3{font-size:14px; font-weight:600;}

.log_bx { padding:20px 0 16px 0; border-bottom:1px solid #ddd;}
.log_bx img{width:22px; border-radius:8px;}
.log_bx .left {display: flex; align-items: center; gap: 10px; justify-content: space-between;}
.log_bx .left > div{display:flex; gap:10px; align-items:center;}
.log_bx .left h2{font-size:17px; font-weight:600;}
.log_bx p {font-weight:600;}
.log_bx:last-child{border-bottom:0px; padding:20px 0 10px 0;}
.log_bx .btn_wrap { width: 100%; margin-top:10px;}
.log_bx .btn_wrap a{background: linear-gradient(90deg, #969696, #7F7F7F, #6F6F6F); display:inline-block; text-align:center; font-size:15px; width:100%; padding:12px 0; color:#fff; margin-top:5px; border-radius:6px;}

.withd{display:flex; justify-content:space-between; align-items:center; margin-top:13px;}
.withd > div{display:flex; gap:10px; align-items:center;}
.withd h2{font-size:17px; font-weight:600; color:#ea4849;}
.withd p{color:#ff6060;}

.pit{padding: 0 15px; margin-top:12px;}
.pit h3{font-size:18px; font-weight:600;}
.pit h2{margin:8px 0 25px 0; font-size:24px;}

.pit_line{border:5px solid #f7f8f9;}

.pit_list{padding:20px 15px 100px 15px; background-color:#fff; height:100%;} 
.pit_list h3{font-size:18px; font-weight:600;}


.pit_my{background-color:#f7f8f9; margin:15px 0; padding:15px 20px; border-radius:10px; display:flex; gap:5px;}
.pit_my select{flex:1; border:none; padding:10px; border:1px solid #ddd; font-size:15px; border-radius:6px;}

.pit_main h4{font-size:16px; font-weight:600; padding:10px 0 15px 0; border-bottom:1px solid #f6f6f7;}
.pit_main ul{}
.pit_main ul li h2{color:#494a53; font-size:15px; font-weight:600;} 
.pit_main ul li{border-bottom:1px solid #e9e9e9;}
.pit_liflex {display: flex; align-items: center;  justify-content: space-between; border-bottom:1px solid #e9e9e9; padding:30px 0;}
.pit_liflex:last-child{border-bottom:0px;}
.pit_liflex h3{font-size:17px; font-weight:600;}

.pit_li_left h2{margin-bottom:5px;}

.pit_li_right p {text-align:right; }
.pit_li_right .pit_blue{font-size:18px; font-weight:600; color:blue;}
.pit_li_right .pit_red{color:red; font-size:18px; font-weight:600;}
.pit_li_right .pit_all{color:#454545; font-weight:400; font-size:15px; margin-top:3px;}

.pit_my2{background-color:#f7f8f9; margin:15px 0; padding:20px 20px; border-radius:10px; display:flex; gap:5px; flex-wrap:wrap;}
.pit_my2 .pointbx1{flex:1 1 calc(50% - 10px); background:#fff; padding:10px 0; border-bottom:1px solid #e9e9e9; font-size:15px; font-weight:500; border-radius:6px;}
.pit_my_bx{border-bottom:1px solid #9d9d9d; position:relative; width:100%;}
.pit_my_bx input{width:100%; border:none; height:40px; padding:0 17px; font-size:16px; text-align:right; background:none;}
.pit_my_bx span{position:absolute; right:0; top:11px;}

.pitnd{margin-top:20px; display:flex; align-items: center;  justify-content: space-between; margin-bottom:12px;}
.pitnd h3{font-size:17px;}
.pitnd label span{font-size:15px;}

.radio_label {
  display: inline-block;
  padding: 8px 16px;
  border: 1px solid #ccc;
  border-radius: 6px;
  cursor: pointer;
  background-color: #fff; /* 기본 배경 */
  color: #333;           /* 기본 글자 색 */
  transition: all 0.3s;
  margin-right: 8px;     /* 버튼 간격 */
  font-size:15px;
  font-weight:500;
}

.radio_label input[type="radio"] {
  display: none; /* 기본 라디오 숨김 */
}

.radio_label input[type="radio"]:checked + label,
.radio_label:has(input[type="radio"]:checked) {
  background: linear-gradient(90deg, #969696, #7F7F7F, #6F6F6F); /* 체크 시 배경 */
  color: #fff;               /* 체크 시 글자 색 */
  border-color: #969696;
}


.withd_btn{width:100%; margin-top:30px; height:50px; background-color:#000; color:#fff; font-size:17px; border-radius:6px;}

.ref_bx {display: flex; align-items: center; justify-content: space-between; padding:15px 0 8px 0;  flex-wrap: wrap;}
.ref_bx img{width:22px; border-radius:8px;}
.ref_bx .left {display: flex; align-items: center; gap: 10px;}
.ref_bx .left h2{font-size:17px; font-weight:600;}
.ref_bx p {font-weight:600;}
.ref_bx:last-child{border-bottom:0px; padding:6px 0 0 0;}
.ref_bx .btn_wrap { width: 100%; margin-top:10px;}
.ref_bx .btn_wrap a{border:1px solid #8859f5; display:inline-block; text-align:center; font-size:15px; padding:6px 10px; float:right; color:#8859f5;}


.pit_my3{background-color:#f7f8f9; margin:15px 0; padding:20px 20px; border-radius:10px; display:flex; gap:5px; flex-wrap:wrap;}
.pit_my3 input{flex:1; min-width:0; font-size:15px; padding: 0 10px; border:1px solid #ddd; border-radius:6px;}
.pit_my3 .member_btn{width:80px; background-color:#454545; color:#fff; padding:10px 0; font-size:15px; border-radius:6px; flex-shrink: 0;}
.reg_member th:last-child{border-right:0px;}
.reg_member td{font-weight:500;}
.td_point{color:#9162ff;}
.td_mileage{color:#bd8900;}

.prof_btn{margin-top:30px; display:flex; gap:15px;}
.prof_btn a{flex:1; text-align:center; border:1px solid #000; height:45px; line-height:45px; font-size:15px;}
.prof_btn .prof_out{border:1px solid #ff6969; color:#ff0000;}
.prof_btn .prof_reg{background-color:#999; border:1px solid #999; color:#fff;}

.modu_ig{width:24px !important; border-radius:8px;}

.w48f{width:48% !Important; }

.memnm{padding:0 !important;}
.memnm h3{font-size:17px; font-weight:700;}
.memnm a{display:block; padding:20px;}
.memnm img{width:17px; float:right; vertical-align:middle;}


.my_label{display:inline-block;}
.my_label label {
  display: inline-block;
  padding: 8px 16px;
  border: 1px solid #ccc;
  border-radius: 6px;
  cursor: pointer;
  background-color: #fff; /* 기본 배경 */
  color: #333;           /* 기본 글자 색 */
  transition: all 0.3s;
  margin-right: 8px;     /* 버튼 간격 */
  font-size:16px;
  font-weight:500;
}

.my_label label input[type="radio"] {
  display: none; /* 기본 라디오 숨김 */
}

.my_label label input[type="radio"]:checked + label,
.my_label label:has(input[type="radio"]:checked) {
  background: linear-gradient(90deg, #969696, #7F7F7F, #6F6F6F); /* 체크 시 배경 */
  color: #fff;               /* 체크 시 글자 색 */
  border-color: #969696;
}


.receiver_box{float:right;}
.receiver_box input{margin-top:-3px; vertical-align:middle;}

.h50{height:80px !important;}









.odrec_1{margin:30px 0 25px; text-align:center; }
.odrec_1 h3{font-size:17px; font-weight:500; line-height:24px;}
.odrec_tab th,
.odrec_tab td{font-size:15px; height:45px;}

.odrec_2{margin:50px 0 0 0;}
.odrec_2 ul{display:flex; gap:15px;}
.odrec_2 ul li{flex:1; border:1px solid #ddd; text-align:center; line-height:50px;}
.odrec_2 ul li a{height:50px; line-height:50px; display:inline-block; width:100%; font-weight:500;}
.odrec_2 ul .odr_recbtn a{background-color:#000; color:#fff; border:1px solid #000;}
.odrec_2 ul .odr_li2{background-color:#333; color:#fff; border:1px solid #333;}

.rec_ulimg{border:1px solid #000;}



.layer_popup {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.5);
  display: none;
  z-index: 1000;
}

.layer_popup.on {
  display: block;
}

.popup_inner {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff;
  padding: 10px 20px;
  border-radius: 12px;
  width:90%;
  max-height:90%;
  overflow-y:auto;
}

.my_chkbx{text-align:center;}

.rec_box00 {
  display: none;
}
.rec_box00.on {
  display: block;
}

.layer_popup { display:none; }
.layer_popup.on { display:block; }

.step { display:none; }
.step.on { display:block; }

.pp_btn{text-align:right;}
.pp_btn .btn_close{text-align:right; font-size:18px; font-weight:500;}



.type_bg{text-align:center; font-size:17px; background-color:#e8e8e8; display:block; margin-top:10px; padding:6px 0; margin-bottom:12px;}

.selected_prompt{display:block; gap:10px;}
.selected_prompt img{width:auto; height:160px; object-fit:cover; margin-right:10px;}
#selectedPromptText{margin-top:8px; font-weight:500;}



.nwigx{display:flex; gap:20px; }
.flx_req label{width:100%; line-height:38px; margin-right:0px; margin-bottom:10px; }
.flx_req label:nth-child(2){margin-bottom:0px;}
.flx_req{width:100%; height:170px; display:flex;    justify-content: center; align-items: center; }

.rec_flx{display:flex; gap:20px;     align-items: center;}
.rec_flx .ref_1{width:135px;}
.rec_flx .ref_1 h2{margin-bottom:0px;}
.rec_flx .ref_2{flex:1;}
.rec_flx .ref_2 .my_label{width:100%; display:flex; gap:10px;}
.rec_flx .ref_2 .my_label label{flex:1; text-align:center; margin-right:0px;}

.pbx0{background-color:#f9f9f9; padding:18px 0; text-align:center; border-top:1px solid #f2f3f7;}
.pbx0 h2{font-size:20px;}

/* pbx layer */
.pbx_layer {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
}

.pbx_dim {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.6);
}

.pbx_inner {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  
  z-index: 1;
  width: 90%;
  max-width: 420px;
  background: #fff;
  border-radius: 8px;
  padding: 40px 15px 15px;
  text-align: center;
}

.pbx_inner img {
  width: 100%;
  height: auto;
  display: block;
}

.pbx_close {
  position: absolute;
  top: 5px;
  right: 10px;
  background: none;
  border: 0;
  font-size: 30px;
  line-height: 1;
  cursor: pointer;
}

.bigigp{display:inline-block; margin-top:10px; padding:6px 20px; background-color:#999; color:#fff; font-weight:500; border-radius:50px; cursor:pointer;}



.testck input{vertical-align:middle; margin-top:-3px;}
.testck label{font-weight:500; vertical-align:middle;}
.testck span{font-size:18px; margin-left:5px;}


















@media (min-width: 1140px) {
    .login {max-width: 600px; padding:70px 50px;}
	.mgmt {max-width: 600px; margin: 0 auto; margin-top:30px;}
	.mgmt2 {max-width: 600px; margin: 0 auto; margin-top:30px;}
	.tail{max-width:600px; margin: 0 auto; bottom:0; left: 50%; transform: translateX(-50%);}

	.img_area{width:100%;}

	.popup_inner{max-width:600px;}
	.type_lab{flex-wrap: wrap;}
}



/* ============================================================================================================================================================================ */

/* 이쪽에서만 반응형 작업 할것 */

/* ============================================================================================================================================================================ */
.pc{display:block;}
.mob{display:none;}

@media (max-width: 400px) {
	
	.section_1 {background:url('img/mob_banner_111.png') no-repeat center center / cover; position:relative;}
	.section_1::before{content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.2); z-index:1;}
	.section_2 {background:url('img/mob_banner_2.png') no-repeat center center / cover; position:relative;}
	.section_2::before{content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.2); z-index:1;}

	.fixed-header{padding:0 15px;}
	.fixed-header h1{font-size:20px;}
	
	.text_1{top:20%; right:unset; z-index:2;}
	.text_1 h2{font-size:28px; line-height:40px; margin-bottom:25px; text-align:center;}  

	.text_2{top:25%; right:unset; z-index:2;}
	.text_2 h2{font-size:28px; line-height:40px; margin-bottom:25px; text-align:center;}  
	.text_2 .port_a{width:100%; text-align:center; font-size:20px; padding:20px 0;}
	
	.form{margin-top:0px;}
	.form .form_bx table{}
	.form{width:100%; padding: 30px 15px 30px 15px;}
	.form .form_bx{padding:30px 20px;}
	.form .form_bx table{}
	.form .frm_input{width:100%; font-size:15px; height:30px;}
	.form .frm_select{font-size:15px; height:30px;}

	.form .form_bx table th, 
	.form .form_bx table td{font-size:15px; height:auto;}
	
	.type_lab{flex-wrap:wrap;}
	.type_lab label{ width: calc(33.333% - 10px); }
	.type_lab label img{width:100%;  height: auto; aspect-ratio: 3 / 4;  }
	.type_lab.type_2 label{width:calc(50% - 10px);}
	
	.w120{width:80px !important;}
	.fm_div table col:last-child {width: 100%;}
	.mwidth{display:flex; gap:10px;}

	.oby_img .upload{font-size:15px;}

	.text_2 .port_a span{font-size:23px;}
	
	.img-down-btn{display:block; text-align:center; margin-bottom:10px;}
	.adown{padding:5px 0; width:100%; background-color:#4e4e4e; display:inline-block; margin-top:8px; border-radius:6px;}
	.adown i{color:#fff;}

	.fur_mou{background-color:#f8f8f8; padding:10px; border-radius:6px;}
	.fur_mou p{color:red; font-weight:500;}

}