@charset "utf-8";


/* ---------- common ---------- */
/* txt */
.txt_box .tit{font-size:var(--tit); font-weight: 700; line-height: 1.4;}
.txt_box .txt{font-size:var(--txt); font-weight: 400; line-height: 1.6;}
.txt_box .tit + .txt{margin-top: 1rem;}
.txt_box + .cont{margin-top: 4rem;}
.txt_box .info_txt{color:var(--gray); margin-top: 0.5rem;}

.status_txt{display: flex; align-items: center; margin-top: 0.5rem;}
.status_txt .txt{margin-top: 0; line-height: 1;}
.status_txt .status{display: inline-block; margin-left: 0.3rem; font-size: var(--subTxt); background-color: rgba(235, 21, 141, 0.15); border-radius: 100rem; color: #EB158D; padding: 0 0.6rem;}
.status_txt .status .total{position: relative; opacity: 0.4;}
.status_txt .status .total:before{content:'/ '; position: relative;}

/* progress bar */ 
.com_progress_bar { margin: 2rem 0; height:0.3rem; width: 100%; border-radius: 100rem; background-color: #ECECEE;}
.com_progress_bar .bar{display: block; background-color: #000; border-radius: 100rem; height:100%;}
.com_progress_bar .bar_20{width: 20%;}
.com_progress_bar .bar_25{width: 25%;}
.com_progress_bar .bar_40{width: 40%;}
.com_progress_bar .bar_50{width: 50%;}
.com_progress_bar .bar_60{width: 50%;}
.com_progress_bar .bar_75{width: 75%;}
.com_progress_bar .bar_80{width: 80%;}
.com_progress_bar .bar_100{width: 100%;}

/* slide */
.swiper-pagination-bullet{width: 5px; height: 5px;}
.swiper-pagination-bullet-active{background-color: var(--primary);}
.swiper-pagination-bullet + .swiper-pagination-bullet{margin-left: 0.5rem;}

/* tag */
.com_tag_box{display: flex; gap: 0.5rem 0.7rem; flex-wrap: wrap;}
.com_tag_box .tag{font-size:var(--subTxt); color:var(--primary); font-weight: 500; line-height: 1; padding:0 1.5rem; height: 3.5rem; line-height: 3.4rem; border:0.1rem solid rgba(77, 37, 175, 0.15); background-color: #fff; border-radius: 60rem;}


/* banner_cta  */
.com_cta_banner{position: relative; background-color: rgba(240, 238, 234); border-radius: 2rem; margin-top: 5rem; overflow: hidden;}
.com_cta_banner .txt_box{position: relative; top: 0; left: 0;padding: 3rem 2.5rem; z-index: 2; }
.com_cta_banner .txt_box .tit{font-size:var(--subTit); font-weight: 600;}
.com_cta_banner .txt_box .txt{font-size:var(--txt); color: var(--gray); margin-top: 0.8rem;}
.com_cta_banner .txt_box .info_txt{font-size:var(--subTxt); color: #AFA599; margin-top: 1.5rem;}
.com_cta_banner .txt_box .btn{display: inline-block; font-size:var(--subTxt); background-color: #fff; border-radius: 10rem; padding: 0.6rem 1rem 0.55rem; font-weight: 500; margin-top: 3.5rem;}
.com_cta_banner .bg{position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1;}
.com_cta_banner .bg img{width: 100%; height: 100%; object-fit: cover; object-position: right bottom;}


/* 공통 form */
.input_sect > .in{display:flex; flex-direction: column; overflow: hidden; min-height:calc(100vh - var(--headerH) - var(--footerH)); padding-bottom: var(--subPd);}
.input_sect .in > .tit_box{margin-top: 2rem;}
.select_sect{padding-bottom: var(--subPd);}

.write_form{margin-top: 4rem; }

.write_form .form_list > li + li { margin-top: 3rem; }
.write_form .form_list > li .tit{position: relative; font-weight: 700; font-size:var(--txt); margin-bottom: 1rem;}
.write_form .form_list > li .tit .ess::after { content: "*"; color: var(--secondary); font-size: 1em; margin-left: 0.3rem;}
.write_form .form_list > li .cont_box{margin-top: 1rem;}

.write_form .form_list li .inp {position: relative; width: 100%; height: var(--inpH);}
.write_form .form_list li .inp input {position:relative; width: 100%; height: 100%; padding: 1.5rem 2rem; border: 1px solid var(--line); border-radius: 1rem; overflow: hidden; color: #101010;}
.write_form .form_list li .inp input:focus { border: 1px solid #000; }
.write_form .form_list li .inp input::placeholder { color: var(--gray); font-weight: 500;}
.write_form .form_list li .inp_txt { margin-top: 1rem; font-size: var(--subTxt); color: var(--gray); }

/* .write_form .form_list li .inp input#birth::-webkit-calendar-picker-indicator { position: absolute; cursor:pointer; right: 2rem; 
background: url('data:image/svg+xml,<svg width="21" height="23" viewBox="0 0 21 23" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.2917 0.75V4.91667M5.95833 0.75V4.91667M0.75 9.08333H19.5M11.1667 2.83333H9.08333C5.15521 2.83333 3.19062 2.83333 1.97083 4.05417C0.751042 5.275 0.75 7.23854 0.75 11.1667V13.25C0.75 17.1781 0.75 19.1427 1.97083 20.3625C3.19167 21.5823 5.15521 21.5833 9.08333 21.5833H11.1667C15.0948 21.5833 17.0594 21.5833 18.2792 20.3625C19.499 19.1417 19.5 17.1781 19.5 13.25V11.1667C19.5 7.23854 19.5 5.27396 18.2792 4.05417C17.0583 2.83437 15.0948 2.83333 11.1667 2.83333Z" stroke="black" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat center / contain;} */
.write_form .form_list li .inp input[type="date"],
.write_form .form_list li .inp input[type="time"] {-webkit-appearance: none; appearance: none; text-align: start; background: #fff;}
.write_form .form_list li .inp input[type="date"]::-webkit-datetime-edit,
.write_form .form_list li .inp input[type="time"]::-webkit-datetime-edit { background-color: transparent;}
.write_form .form_list li .inp input#birthDate::-webkit-calendar-picker-indicator { opacity: 0; position: absolute; right: 2rem; width: 2rem;  height: 2rem; cursor: pointer;}
.write_form .form_list li .inp input#birthDate { padding-left: 5rem; background: url('data:image/svg+xml,<svg width="21" height="23" viewBox="0 0 21 23" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.2917 0.75V4.91667M5.95833 0.75V4.91667M0.75 9.08333H19.5M11.1667 2.83333H9.08333C5.15521 2.83333 3.19062 2.83333 1.97083 4.05417C0.751042 5.275 0.75 7.23854 0.75 11.1667V13.25C0.75 17.1781 0.75 19.1427 1.97083 20.3625C3.19167 21.5823 5.15521 21.5833 9.08333 21.5833H11.1667C15.0948 21.5833 17.0594 21.5833 18.2792 20.3625C19.499 19.1417 19.5 17.1781 19.5 13.25V11.1667C19.5 7.23854 19.5 5.27396 18.2792 4.05417C17.0583 2.83437 15.0948 2.83333 11.1667 2.83333Z" stroke="%23787878" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat left 2rem center;  background-size: 2rem auto;}

.write_form .form_list li.nickname .inp input{padding-right: 12rem;}
.write_form .form_list li .chk_btn{position: absolute; height: 100%; right: 0; padding: 0 2rem; color: var(--primary); font-weight:600;;}

.write_form .select_list {display: flex; gap: 1rem;}
.write_form .select_list li {flex: 1; height: var(--inpH);}
.write_form .select_list li .select_opt {position: relative; display: block; width: 100%; height: 100%; cursor: pointer;}
.write_form .select_list li .select_opt input {position: absolute; inset: 0; opacity: 0; cursor: pointer;}
.write_form .select_list li .select_opt .txt {display: flex; align-items: center; justify-content: center; font-size:var(--txt); width: 100%; height:100%; padding: 0 1.5rem; background-color: #fff; border:1px solid rgba(217,217,217); border-radius: 1rem; transition: border-color .2s, background .2s, color .2s, font-weight .2s; }
.write_form .select_list li .select_opt input:checked + .txt {font-weight: 700; border-color: #5A2EFF; color: var(--primary);}
.write_form .select_list li .select_opt input:focus-visible + .txt {outline: 2px solid #000; outline-offset: 2px;} /* 키보드 포커스  */

.write_form .form_list .birth_time .inp.time_box {position: relative; display: flex; align-items: center;}
.write_form .form_list .birth_time .inp.time_box input#birthTime {padding-right: 12rem; appearance: none; -webkit-appearance: none; -moz-appearance: textfield;}
.write_form .form_list .birth_time .inp input#birthTime::-webkit-calendar-picker-indicator { opacity: 0; position: absolute; cursor:pointer; width: 100%; height: 100%; background-color: transparent;}
.write_form .form_list .birth_time .time_unknown {position: absolute; right: 0; padding:1.5rem 2.0rem; display: flex; align-items: center; gap: 0.5rem; cursor: pointer;}
.write_form .form_list .birth_time .time_unknown input[type="checkbox"] {position: absolute; opacity: 0; pointer-events: none; padding: 0;}
.write_form .form_list .birth_time .time_unknown .ico svg{display: block; height: 1.4em;}
.write_form .form_list .birth_time .time_unknown .ico svg path {fill: var(--gray);}
.write_form .form_list .birth_time .time_unknown .txt {font-size: var(--txt); font-weight: 600; color: var(--gray);}
.write_form .form_list #timeUnknown:checked + .ico svg path {fill: var(--primary);}
.write_form .form_list #timeUnknown:checked ~ .txt {color: var(--primary);}
.write_form .form_list #timeUnknown:focus-visible .txt {outline: 2px solid #000; outline-offset: 2px;}

/* 고객센터 */
.write_form .form_list li .select {position: relative; width: 100%; height: var(--inpH);}
.write_form .form_list li .select .nice-select {height: 100%; line-height: var(--inpH); border: 0.1rem solid var(--line); border-radius: 1rem;}
.write_form .form_list li .select .nice-select .option {}

.write_form .form_list li.file .tit {display: flex; align-items: center;}
.write_form .form_list li.file .txt {margin-left: auto; color: var(--gray); font-size: var(--subTxt); font-weight: 400;}
.write_form .form_list li.file .file_wrap {display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px;}
.write_form .form_list li.file .file_wrap .cont {overflow: hidden; aspect-ratio: 1 / 1; border-radius: 1rem; }
.write_form .form_list li.file .file_wrap .add_btn {display: flex; align-items: center; justify-content: center; background-color: #fff; border: 1px solid var(--line); }
.write_form .form_list li.file .file_wrap .img {position: relative;}
.write_form .form_list li.file .file_wrap .img img {position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; object-position: center;}
.write_form .form_list li.file .file_wrap .img::before {content: ""; position: absolute; inset: 0; background-color: rgba(0,0,0,0.3); z-index: 3;}
.write_form .form_list li.file .file_wrap .close_btn {display: flex; align-items: center; justify-content: center; position: absolute; right: 10px; top: 10px; width: 2em; height:2em; background-color: #000; z-index: 5; border-radius: 50%;}
.write_form .form_list li.file .file_wrap .close_btn svg {width: 40%; height: auto;}
.write_form .form_list li.file .file_wrap .close_btn svg path {stroke: #fff; opacity: 1;}


/* 동의 */
.write_form .form_list li.terms label {display: flex; align-items: center; cursor: pointer;}
.write_form .form_list li.terms label .txt { font-weight: 500;}
.write_form .form_list li.terms .tit label .txt {color: var(--gray); transition: 0.2s ease;}
.write_form .form_list li.terms label .ico {display: flex; align-items: center; margin-right: 10px; width: 1.6em; height: 1.6em;}
.write_form .form_list li.terms label .ico svg {width: 100%; height: auto;}
.write_form .form_list li.terms label input:checked + .ico svg rect {fill: var(--primary);}
.write_form .form_list li.terms label input:checked + .ico svg path {stroke: #fff;}
.write_form .form_list li.terms label input:checked + .ico + .txt{color: #000;}
.write_form .form_list li.terms .txt.ess::after { content: "*"; color: var(--secondary); font-size: 1em; margin-left: 0.3rem;}

.write_form .form_list li.terms .chk_box_bg{background-color: #EBEBEB; border-radius: 1rem; padding: 1.5rem;}
.write_form .form_list li.terms .chk_box_bg + .chk_box_bg{margin-top:1.5rem;}
.write_form .form_list li.terms .chk_box {position: relative; display: flex; align-items: center; justify-content: space-between; padding-right: 1.5rem;}
.write_form .form_list li.terms .chk_box{margin-top: 2rem; margin-left: 1.5rem;}


.write_form .form_list li.terms .chk .term_btn{font-size: var(--txt); position: absolute; right: 1.5rem}
.write_form .form_list li.terms .chk .term_btn .arr svg{display: block; height: 1em;}

/* .write_form .form_list li.terms label .txt_box{width: 100%; display: flex; align-items: center; justify-content: space-between; padding-right: 1.7rem;}
.write_form .form_list li.terms label .txt_box .arr svg{display: block; width: auto; height: 1rem;} */



/* .location-suggestions{position: relative; border: 1px solid var(--line); border-radius: 1rem; background-color: #fff; max-height: 15rem; overflow: auto; } */
/* .location-suggestions .location-suggestion{padding: 1.5rem 2rem; cursor: pointer; transition: background 0.3s ease;} */
/* .location-suggestions .location-suggestion + .location-suggestion{border-top: 1px solid var(--line);} */

.location-suggestions{position: relative; border-radius: 1rem; max-height: 15rem; overflow: auto; background-color: #1A1A1A; color: rgba(255, 2555, 255, 1);}
.location-suggestions .location-suggestion{padding: 1.5rem 2rem; cursor: pointer; transition: color 0.3s ease;}


/* 공통 checkbox / 회원가입_03,04 질문선택 */ 
.input_sect .com_select_list {margin-top: 3rem; padding-right: 5%;}
.input_sect .com_select_list .select_opt { display: block; position: relative; cursor: pointer;}
.input_sect .com_select_list li + li {margin-top: 1rem;}
.input_sect .com_select_list li .select_opt input { position: absolute; opacity: 0; pointer-events: none; }
.input_sect .com_select_list li .select_opt .txt {display: inline-block; font-size:var(--txt); padding: 1rem 1.5rem; border: 0.1rem solid #E4E6EA; background-color: #fff; border:0.1rem solid rgba(217,217,217); border-radius: 10rem; transition: border-color .2s, background .2s, color .2s, font-weight .2s; }
.input_sect .com_select_list li .select_opt input:checked + .txt { font-weight: 700; border-color: #5A2EFF; color: var(--primary); } /*box-shadow: 0 0 0 3rem rgba(90,46,255,.12) inset;*/
/* .input_sect .com_select_list.keyword li{display: inline-block;} */
.input_sect .com_select_list.keyword{display: flex; flex-wrap: wrap; gap: 1rem;}
.input_sect .com_select_list.keyword li + li {margin-top: 0;}

.input_sect .btm_btn_box{display: flex; justify-content: space-between; align-items: center; margin-top: 6rem;}
.input_sect .btm_btn_box.only{justify-content: flex-end;}

.com_info_box{display: flex; font-size:var(--subTxt); margin-top: 4rem; background-color: var(--bg); color:var(--gray); padding: 1rem 1.2rem; border-radius: 0.7rem; }
.com_info_box .ico{width: 1.5em; height: 1em; margin-right: 0.5rem; margin-top: 0.2rem; background: url('data:image/svg+xml,<svg height="1em" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.91663 2.7816C10.8034 3.29359 11.5398 4.02998 12.0518 4.91677C12.5638 5.80355 12.8333 6.80949 12.8333 7.83346C12.8333 8.85743 12.5637 9.86335 12.0517 10.7501C11.5398 11.6369 10.8034 12.3733 9.91656 12.8853C9.02977 13.3972 8.02384 13.6668 6.99987 13.6668C5.9759 13.6667 4.96997 13.3972 4.0832 12.8852C3.19642 12.3732 2.46004 11.6368 1.94808 10.75C1.43611 9.86318 1.1666 8.85724 1.16663 7.83327L1.16954 7.64427C1.20221 6.63685 1.49536 5.65508 2.02042 4.79468C2.54547 3.93428 3.28451 3.22462 4.16548 2.73487C5.04645 2.24512 6.03929 1.992 7.04721 2.00019C8.05513 2.00838 9.04373 2.2776 9.91663 2.7816ZM6.99996 9.58327C6.84525 9.58327 6.69688 9.64473 6.58748 9.75412C6.47808 9.86352 6.41663 10.0119 6.41663 10.1666V10.1724C6.41663 10.3271 6.47808 10.4755 6.58748 10.5849C6.69688 10.6943 6.84525 10.7558 6.99996 10.7558C7.15467 10.7558 7.30304 10.6943 7.41244 10.5849C7.52183 10.4755 7.58329 10.3271 7.58329 10.1724V10.1666C7.58329 10.0119 7.52183 9.86352 7.41244 9.75412C7.30304 9.64473 7.15467 9.58327 6.99996 9.58327ZM6.99996 5.49994C6.84525 5.49994 6.69688 5.5614 6.58748 5.67079C6.47808 5.78019 6.41663 5.92856 6.41663 6.08327V8.4166C6.41663 8.57131 6.47808 8.71969 6.58748 8.82908C6.69688 8.93848 6.84525 8.99994 6.99996 8.99994C7.15467 8.99994 7.30304 8.93848 7.41244 8.82908C7.52183 8.71969 7.58329 8.57131 7.58329 8.4166V6.08327C7.58329 5.92856 7.52183 5.78019 7.41244 5.67079C7.30304 5.5614 7.15467 5.49994 6.99996 5.49994Z" fill="%23787878"/></svg>') no-repeat center / contain;}
.com_info_box .txt{word-break: break-all;}

/* 로그인 */
.login_page{position: relative; z-index: 400; min-height:100vh; padding-bottom: 0; background: #fff url(../img/sub/login.jpg) no-repeat center top / cover;}
.login_page .page_bg img{object-position: top;}
.login_page .in{position: relative; display:flex; flex-direction: column; justify-content: center; min-height:calc(100vh - var(--headerH));}

.login_page .top_box{font-size:var(--txt); text-align: center;}
.login_page .top_box .logo{width: 20rem; margin: 0 auto;}
.login_page .top_box .logo img{width: 100%;}
.login_page .top_box .txt{margin-top: 2rem;}

.login_page .cta_txt_box{text-align: center; margin-top: 5vh;}
.login_page .cta_txt_box .txt{display:inline-block; font-size:var(--txt); color:#EB158D; background-color: #FFE3F3; border-radius: 0.7rem; padding: 0.7rem 1.2rem;}

.login_page .login_btn_wrap{margin-top: 8rem; padding-bottom: 10vh;}
.login_page .login_btn_wrap > .btn{position: relative;}
.login_page .login_btn_wrap > .btn a{display: flex; align-items: center; justify-content: center; font-size:1.5rem; height:var(--inpH); max-width: 80%; margin: 0 auto; font-weight: 600; padding:1em; background-color: #fff; border-radius: 10rem; transition: filter 0.2s ease, color 0.2s ease, background 0.2s ease;}
.login_page .login_btn_wrap > .btn .ico{margin-right: 1rem;}
.login_page .login_btn_wrap > .btn .ico svg{display: block; height: 1.5em;}
.login_page .login_btn_wrap > .btn + .btn{margin-top: 1rem;}
.login_page .login_btn_wrap .naver a{background-color: #34B445; color: #fff;}
.login_page .login_btn_wrap .naver a .ico svg{height: 1.375em;}
.login_page .login_btn_wrap .kakao a{background-color: #FFC73A; color: #101010;}
.login_page .login_btn_wrap .apple a{background-color: #F6F6F6; color: #101010;}

.login_page .login_btn_wrap > .btn .recent_badge{position: absolute; top:-1rem; left:50%; transform: translateX(-50%); margin-left: 11rem; padding: 0.5em 0.8em; white-space: nowrap; border-radius: 10rem; background-color: #101010; color: #fff; font-size: var(--subTxt);}
.login_page .login_btn_wrap > .btn .recent_badge:before{content:''; position: absolute; width: 100%; height: 0.7rem; right: 0; top: calc(100% - 0.2rem); background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="8" height="6" viewBox="0 0 8 6" fill="none"><path d="M0.0230342 4.5211C-0.164503 5.40868 0.831708 6.06729 1.5749 5.54706L6.90036 1.81923C7.70133 1.25855 7.30462 0 6.3269 0H1.78909C1.31647 0 0.908388 0.33087 0.810687 0.793274L0.0230342 4.5211Z" fill="black"/></svg>') no-repeat center / contain;}


/* ---------- 마이페이지 ---------- */
.my_page .info_sect{padding-top: 1.5rem;}
.my_page .info_sect .user_cont .top_area{display: flex; justify-content: space-between;}
.my_page .info_sect .user_cont .user_info {display: flex; align-items: center;}
.my_page .info_sect .user_cont .user_info .profile{position: relative; flex-shrink: 0; width: 5.3rem; height: 5.3rem; margin-right: 1rem;}
.my_page .info_sect .user_cont .user_info .profile .img{position: relative; width: 100%; height: 100%; background-color: #EBEBEB; border-radius: 50%; overflow: hidden; background-color: #EBEBEB;}
.my_page .info_sect .user_cont .user_info .profile .img img{position: absolute; left: 50%; transform: translateX(-50%); width: 190%; max-width: inherit; }
.my_page .info_sect .user_cont .user_info .profile .new_badge{width: 7px; height: 7px; right: 1rem; bottom: 0; top: unset;}

.my_page .info_sect .user_cont .user_info .name{font-size: var(--tit2); font-weight: 600; word-break: break-all; line-height: 1.2;}
.my_page .info_sect .user_cont .user_info .display_id{font-size: var(--subTxt); color: var(--gray); font-weight: 600; margin-top: 0.1em;}

.my_page .info_sect .user_cont .btn_box{display: flex; align-items: flex-start;}
.my_page .info_sect .user_cont .btn_box .btn{display: flex; align-items: center; white-space: nowrap; font-size: var(--subTxt); background-color: #fff; color: #000; border: 1px solid var(--line); height: 2.5rem; border-radius: 0.5rem; padding: 0 0.6em;}
.my_page .info_sect .user_cont .btn_box .btn .ico {margin-left: 0.2rem;}
.my_page .info_sect .user_cont .btn_box .btn .ico svg{display: block; height: 1.2em;}
.my_page .info_sect .user_cont .btn_box .btn + .btn{margin-left: 0.5rem;}

.my_page .info_sect .user_cont .birth_box{display: flex; align-items: center; justify-content: space-between; background-color: var(--bg); border-radius:1.5rem; margin-top: 1.5rem; padding: 1.5rem 2rem;}
.my_page .info_sect .user_cont .birth_box .birth_info .badge_wrap{display: flex; flex-wrap: wrap}
.my_page .info_sect .user_cont .birth_box .birth_info .badge_wrap .badge{font-size: var(--subTxt); font-weight: 600; color: #fff; padding: 0.6em 1em 0.5em; line-height: 1; border-radius: 10rem;}
.my_page .info_sect .user_cont .birth_box .birth_info .badge_wrap .badge + .badge{margin-left: 0.3rem;}
.my_page .info_sect .user_cont .birth_box .birth_info .badge_wrap .badge.zodiac{background-color: rgba(104, 57, 220, 0.60);}
.my_page .info_sect .user_cont .birth_box .birth_info .badge_wrap .badge.horoscope{background-color: #3F3F3F;}
.my_page .info_sect .user_cont .birth_box .birth_info .birth_txt{font-size: var(--txt); margin-top: 0.5rem;}

.arr_btn{display: flex; align-items: center; font-size: var(--subTxt); font-weight: 600; padding: 0.4em 0.9em; background-color: #fff; border-radius: 0.7rem;}
.arr_btn.line{border: 1px solid var(--line);}
.arr_btn .arr{margin-bottom: 0.1em; margin-left: 0.5rem;}
.arr_btn .arr svg{display: block; height: 0.7em;}


.my_page h2.tit{font-size: var(--tit);}
.my_page .info_sect .saju_profile{margin-top: 5rem;}
.my_page .info_sect .saju_profile .tit{margin-bottom: 1rem;}

.big_line_sect{margin-top: 4rem; padding-top: 4rem; border-top:1rem solid var(--bg);}

.my_page .re_sect .in > .tit_box{display: flex; align-items: center; justify-content: space-between;}

.com_tag_board.mypage_board .tag{width: 8rem;}
.com_tag_board.mypage_board a{display: block;}
.com_tag_board.mypage_board .tit_box{display: flex; align-items: center;}
.com_tag_board.mypage_board .date{margin-top: 0.5rem; font-size: var(--subTxt); color: var(--gray); white-space: nowrap;}

.my_page .cta_sect{padding: 4rem 0 0;}
.my_page .cta_sect .cta_banner_slide{position: relative; width: calc(100% + var(--inPd) * 2); margin-left: calc(var(--inPd) * -1);}
.my_page .cta_sect .cta_banner_slide .swiper-container{padding: 0 var(--inPd);}
.my_page .cta_sect .cta_banner_slide .paging{ display: flex; justify-content: center; margin-top: 1rem;}
.my_page .cta_sect .com_nav_list{margin-top: 4rem;} 

.my_page .menu_sect{padding-bottom: 5rem;}
.my_page .menu_sect .menu_list .item > *{position: relative; display: flex; align-items: center; width: 100%; font-weight: 500; padding: 2rem 1rem; font-size: 1.7rem; border-bottom: 1px solid var(--line);}
.my_page .menu_sect .menu_list .item > div > a{position: relative; display: flex; align-items: center;}
.my_page .menu_sect .menu_list .item .ico svg{display: block; margin-right: 1rem;}
.my_page .menu_sect .menu_list .item .txt{display: flex; align-items: center;}
.my_page .menu_sect .menu_list .item .txt a{display: inline-block; margin-left: 0.5rem; text-decoration: underline; color:Var(--gray); font-size: 0.7em; text-underline-offset: 4px;}
.my_page .menu_sect .menu_list .item .toggle_btn{position: absolute; right: 0;}
.my_page .menu_sect .btn_box{display: flex; justify-content: space-between; margin-top: 2rem;} 
.my_page .menu_sect .btn_box .btn{font-size: var(--txt); font-weight: 500; color: var(--gray);}

.my_page .menu_sect .menu_list .item > div > a {width: calc(100% - 6rem);}
.my_page .menu_sect .menu_list .item.withdraw .txt{color: var(--gray);}


/* 마이페이지_다시보기 */
.page_modal .modal_cont.re_view_modal .board_cont{padding: 0 0 8rem;}
.page_modal .modal_cont.re_view_modal .board_cont .btm_cont{margin-top: 4rem;}
.page_modal .modal_cont.re_view_modal .board_cont .com_tag_board .item{position: relative;}
.page_modal .modal_cont.re_view_modal .board_cont .com_tag_board .delete_button{position: absolute; top: 0; right: 0; background-color: var(--gray); border-radius: 50%; width: 2rem; height: 2rem;}
.page_modal .modal_cont.re_view_modal .board_cont .com_tag_board .delete_button svg{display: block; width: 50%; height: 50%;}

/* 마이페이지_내정보수정 */
.modify_page .character_display{position: relative; border-radius: 2rem; overflow: hidden; background: url(../img/sub/character_customize_bg.jpg) no-repeat center center / cover;}
.modify_page .character_display .character{position: relative; padding-top: 100%;}
.modify_page .character_display .character:before{content:''; position: absolute; left: 0; bottom: 0%; width: 100%; height: 15%; z-index: 1; background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="167" height="49" viewBox="0 0 167 49" fill="none"><g filter="url(%23filter0_f_1744_5413)"><ellipse cx="83.5" cy="25.5" rx="68.5" ry="10.5" fill="%23634C82" fill-opacity="0.3"/></g><defs><filter id="filter0_f_1744_5413" x="0" y="0" width="167" height="51" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur stdDeviation="7.5" result="effect1_foregroundBlur_1744_5413"/></filter></defs></svg>') no-repeat center / contain;}
.modify_page .character_display .character > img{position: absolute; width: 100%; height: 100%; left: 0; top: 0; padding: 3rem 1rem 1.5rem; z-index: 2; object-fit: contain;}
.modify_page .character_display .btn_box{position: absolute; bottom: 1.8rem; right: 1.8rem; z-index: 10;}


/* 마이페이지_푸터 */
.f_info{padding-bottom: 3rem;}
.f_info .sns_list {display: flex;}
.f_info .sns_list .item + .item{margin-left: 1rem;}
.f_info .sns_list .item .btn{display: flex; align-items: center; justify-content: center; width: 4.5rem; height: 4.5rem; background-color: #EBEBEB; border-radius: 50%;}
.f_info .sns_list .item .btn svg{display: block;}

.f_info .info_cont{margin-top: 2.5rem; color: var(--gray);}
.f_info .info_cont .name{font-weight: 700; margin-bottom: 1rem; line-height: 1;}
.f_info .info_cont .info_list{font-size: var(--subTxt); display: flex; flex-wrap: wrap; gap: 0 1.5rem;}
.f_info .info_cont .info_list .item{display: flex;}
.f_info .info_cont .info_list .item .label{font-weight: 700; margin-right: 0.5rem;}

.f_info .info_cont .copyright{font-size: var(--subTxt); margin-top: 2rem;}



/* 공지사항 */
.notice_page .notice_cont{padding-bottom: 5rem;}
.notice_page .notice_list .item a{display: block; padding: 2rem 0; border-bottom: 1px solid var(--line);}
.notice_page .notice_list .item .tit_box{position: relative; display: inline-block;}
.notice_page .notice_list .item .tit_box .tit{font-size: var(--tit2); font-weight: 700; display: -webkit-box;-webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis;}
.notice_page .notice_list .item .date{font-size: var(--txt); color: var(--gray); display: block; }
.notice_page .notice_list .item .tit_box .new_badge{width: 6px; height: 6px; right: -0.5rem;}

.board_page .notice_list .item:nth-child(n+9){ display: none; }
/* 더보기 */
.board_page .post_toggle {display: flex; align-items: center; justify-content: center; width: 100%; margin-top: 3rem; font-size:var(--subTxt); color: var(--gray); padding: 0 1.6rem; height:3.5rem; border: 1px solid #ddd; border-radius: 0.8rem; background-color: #fff; line-height: 1; cursor: pointer; }
.board_page .post_toggle .ico { display: inline-block; margin-left: 0.6rem; transition: transform 0.25s ease; }
.board_page .post_toggle .ico svg{display: block;}
.board_page .post_list.open + .post_toggle .ico { transform: rotate(180deg); }

/* 문의내역 */
.inquiry_page .inquiry_cont{padding-bottom: 5rem;}
.inquiry_page .inquiry_list .item a{display: block; padding: 2rem 0; border-bottom: 1px solid var(--line);}

.inquiry_tag_box{display: flex;}
.inquiry_tag{background-color: var(--bg); color: var(--gray); font-weight: 700; border-radius: 3px; padding:0.5em 0.8em; max-width: max-content; line-height: 1; font-size:var(--subTxt); margin-bottom: 0.5em;}
.inquiry_tag.wait{background-color: var(--bg); color: var(--gray);}
.inquiry_tag.clear{background-color: #1a1a1a; color: #fff;}
.inquiry_tag.cate{color: #9C72C6; margin-left: 0.5rem;}
.inquiry_page .inquiry_list .item .tit_box{position: relative; display: inline-block;}
.inquiry_page .inquiry_list .item .tit_box .tit{font-size: var(--tit2); font-weight: 700; display: -webkit-box;-webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis;}
.inquiry_page .inquiry_list .item .date{font-size: var(--txt); color: var(--gray); display: block; }
.inquiry_page .inquiry_list .item .tit_box .new_badge{width: 6px; height: 6px; right: -0.5rem;}

.inquiry_page .inquiry_list .item .no_list{height: calc(100dvh - var(--headerH) - var(--footerH) - 5rem); display: flex; align-items: center; justify-content: center; text-align: center; border-bottom:none; cursor: inherit;}
.inquiry_page .inquiry_list .item .no_list .ico svg{width: 3.3rem; height: 3.3rem;}
.inquiry_page .inquiry_list .item .no_list .tit{font-size: var(--tit); color: #B4B4B4; font-weight: 700; margin-top: 1rem;}


/* ---------- 캐릭터 설정 ---------- */
.custom_page{position: relative; padding-top: 0; padding-bottom: 10rem; z-index: 200; background-color: #fff;}
.custom_page .custom_sect .display_cont{position: relative; padding: calc(var(--headerH) + 2rem) 0 1.2rem; overflow: hidden; background: url(../img/sub/character_customize_bg.jpg) no-repeat center center / cover;}

.custom_page .custom_sect .display_cont .top_box{display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 1.5rem;}
.custom_page .custom_sect .display_cont .top_box .credit{display: flex; align-items: center; background-color: #fff; border-radius: 10rem; padding: 0.7em 1em;}
.custom_page .custom_sect .display_cont .top_box .credit .ico{margin-right: 0.2em;}
.custom_page .custom_sect .display_cont .top_box .credit .ico svg{display: block; height: 1.2em;}
.custom_page .custom_sect .display_cont .top_box .credit .txt{font-size: var(--subTxt); font-weight: 500; line-height: 1; margin-top: 0.1em;}

.custom_page .custom_sect .display_cont .character_box{display: flex; justify-content: center; max-width: 100%; height: 30rem; }
.custom_page .custom_sect .display_cont .character_box .character{height: 100%;}
.custom_page .custom_sect .display_cont .character_box .character img{height: 100%;}
.custom_page .custom_sect .display_cont .character_box .character canvas{display: block; width: 100%; height: 100%;}

.custom_page .custom_sect .display_cont .reset_btn{position: absolute; display: flex; align-items: center; justify-content: center; right: var(--inPd); bottom: 1.5rem; width: 3rem; height: 3rem; border-radius: 50%; background-color: rgba(255, 255, 255, 0.6);}
.custom_page .custom_sect .display_cont .reset_btn .ico{width: 52%;}
.custom_page .custom_sect .display_cont .reset_btn .ico svg{display: block; width: 100%;}


.custom_page .select_cont .category_tab{display: flex; padding-top: 2rem; padding-bottom: 0.5rem; padding-right: var(--inPd); overflow-x: auto; width: calc(100% + var(--inPd) * 2); margin-left: calc(var(--inPd) * -1);}
.custom_page .select_cont .category_tab::-webkit-scrollbar{display: none;}
.custom_page .select_cont .category_tab .tab{display: flex; flex-direction: column; justify-content: space-between; align-items: center; width: 6rem; height: 5rem; flex-shrink: 0; cursor: pointer;}
.custom_page .select_cont .category_tab .tab .ico {height: 2.5rem;}
.custom_page .select_cont .category_tab .tab .ico svg{vertical-align: middle;}
.custom_page .select_cont .category_tab .tab .ico svg path[fill="black"]{fill: rgba(217, 217, 217, 1);}
.custom_page .select_cont .category_tab .tab .txt{color: var(--gray); font-weight: 500; transition: 0.3s ease;}
.custom_page .select_cont .category_tab .tab.active .ico svg path[fill="black"]{fill: var(--primary);}
.custom_page .select_cont .category_tab .tab.active .txt{color: var(--primary); font-weight: 600;}

/* 베타버전 */
.custom_page .select_cont .category_tab .tab:not(.beta){opacity: 0.5;}


.custom_page .select_cont .item_wrap{margin-top: 3rem;}

.custom_page .select_cont .item_wrap .item_cont {display: none;}
.custom_page .select_cont .item_wrap .item_cont.active {display: block;}

.custom_page .select_cont .item_wrap .item_cont .item_box.box_type{display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem;}
.custom_page .select_cont .item_wrap .item_cont .item_box.box_type .item{position: relative; cursor: pointer;}
.custom_page .select_cont .item_wrap .item_cont .item_box.box_type .item .img_box{position: relative; padding-top: 100%; width: 100%; background-color: #F4F3F5; border: 1px solid #F4F3F5; border-radius: 1rem; overflow: hidden;}
.custom_page .select_cont .item_wrap .item_cont .item_box.box_type .item.active .img_box{border: 1px solid #4D25AF;}

.custom_page .select_cont .item_wrap .item_cont .item_box.box_type .item .img_box img{position: absolute; width: 100%; height: 100%; top: 0; left: 0; object-fit: contain;}
.custom_page .select_cont .item_wrap .item_cont .item_box.box_type .item .new_badge{top: 0.5rem; right: 0.5rem;}

.custom_page .select_cont .item_wrap .item_cont .item_box .item .price{position: relative; display: flex; align-items: center; justify-content: center; font-size: var(--subTxt); font-weight: 500; margin-top: 0.4rem;}
.custom_page .select_cont .item_wrap .item_cont .item_box .item .price:before{content:''; display: inline-block; width: 1em; height: 1em; margin-right: 0.3em; background:url('data:image/svg+xml,<svg width="9" height="9" viewBox="0 0 9 9" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="9" height="9" rx="4.5" fill="url(%23paint0_linear_849_424)"/><path d="M6.38612 4.34941C6.38612 4.34941 6.38612 4.34941 6.38138 4.34941C6.25801 4.30706 6.14413 4.25529 6.03025 4.19882C5.99703 4.18 5.96382 4.16118 5.9306 4.14235C5.8452 4.09529 5.76453 4.04353 5.68861 3.99176C5.66014 3.97294 5.62693 3.94941 5.59846 3.93059C5.49881 3.85529 5.39917 3.77059 5.30902 3.68118C5.29953 3.67176 5.29478 3.66706 5.29004 3.65765C5.20937 3.57294 5.13345 3.48353 5.06228 3.38941C5.03855 3.35647 5.01957 3.32824 4.99585 3.29529C4.94365 3.21529 4.89146 3.13529 4.84401 3.05059C4.82503 3.01765 4.80605 2.98941 4.79182 2.95647C4.73488 2.84353 4.68743 2.73059 4.64472 2.61294C4.59253 2.46235 4.38849 2.46235 4.33155 2.61294C4.28885 2.73529 4.23191 2.85294 4.17023 2.96588C4.17023 2.97059 4.16548 2.97529 4.16074 2.98471C4.09905 3.09765 4.03262 3.21059 3.9567 3.31412C3.94721 3.32353 3.94247 3.33765 3.93298 3.34706C3.77165 3.56824 3.58185 3.76118 3.36358 3.92588C3.35409 3.93529 3.33986 3.94 3.33037 3.94941C3.23547 4.02 3.13108 4.08588 3.02669 4.14706C3.00771 4.15647 2.99348 4.16588 2.97924 4.17529C2.86062 4.23647 2.74199 4.29765 2.61388 4.34C2.46204 4.39647 2.46204 4.59882 2.61388 4.65059C2.61388 4.65059 2.61388 4.65059 2.61862 4.65059C2.74199 4.69294 2.85587 4.74471 2.96975 4.80118C3.00297 4.82 3.03618 4.83882 3.0694 4.85765C3.1548 4.90471 3.23547 4.95647 3.31139 5.00824C3.33986 5.02706 3.37307 5.05059 3.40154 5.06941C3.50119 5.14471 3.60083 5.22941 3.69098 5.31882C3.70047 5.32824 3.70522 5.33294 3.70996 5.34235C3.79063 5.42706 3.86655 5.51647 3.93772 5.61059C3.96145 5.63882 3.98043 5.67176 4.00415 5.70471C4.05635 5.78471 4.10854 5.86471 4.15599 5.94941C4.17497 5.98235 4.19395 6.01059 4.20819 6.04353C4.26512 6.15647 4.31257 6.26941 4.35528 6.38706C4.40747 6.53765 4.61151 6.53765 4.66845 6.38706C4.71115 6.26471 4.76809 6.14706 4.82977 6.03412C4.82977 6.02941 4.83452 6.02471 4.83926 6.01529C4.90095 5.90235 4.96738 5.78941 5.0433 5.68588C5.05279 5.67647 5.05753 5.66235 5.06702 5.65294C5.22835 5.43176 5.41815 5.23882 5.63642 5.07412C5.64591 5.06471 5.66014 5.06 5.66963 5.05059C5.76453 4.98 5.86892 4.91412 5.97331 4.85294C5.99229 4.84353 6.00652 4.83412 6.02076 4.82471C6.13938 4.76353 6.25801 4.70235 6.38612 4.66C6.53796 4.60353 6.53796 4.40118 6.38612 4.34941Z" fill="white"/><defs><linearGradient id="paint0_linear_849_424" x1="-6.50178" y1="16.0306" x2="15.4899" y2="-7.39218" gradientUnits="userSpaceOnUse"><stop offset="0.17" stop-color="%236839DC"/><stop offset="0.5" stop-color="%239451D8"/><stop offset="1" stop-color="%23D474D4"/></linearGradient></defs></svg>') no-repeat center / contain;}

.custom_page .select_cont .item_wrap .item_cont .item_box .item.disabled .img_box:after{content: ''; position: absolute; display: block; inset: 0; width: 100%; height: 100%; background:rgba(0,0,0,0.3);}

.custom_page .select_cont .item_wrap .item_cont .item_box.color_type{display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 2.5rem 2rem; max-width: max-content; margin: 0 auto;}
.custom_page .select_cont .item_wrap .item_cont .item_box.color_type .item{width: 3rem; height: 3rem; border-radius: 50%; cursor: pointer;}
.custom_page .select_cont .item_wrap .item_cont .item_box.color_type .item.active{background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="10" viewBox="0 0 14 10" fill="none"><path d="M1 4.75L4.75 8.5L12.25 1" stroke="%234D25AF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat center center / 50%;}


.custom_page .btm_btn_cont{position: fixed; display: flex; align-items: center; justify-content: center; bottom: 0; width: var(--maxWidth); max-width: 100%; height: var(--inpH); }
.custom_page .btm_btn_cont button{width: 100%; height: 100%; background-color:#000; color: #fff; font-size: var(--txt); font-weight: 700;}





/* ------------------------- 소울스페이스 -------------------------  */
.soul_page{position: relative; z-index: 400; padding-top: 0; padding-bottom: 0;}

.soul_page .go_sect {position: relative; height: 100dvh;}
.soul_page .go_sect .slide {position: absolute;  top: 50%; transform: translateY(-50%); width: 100%;}
.soul_page .go_sect .slide .item a{display: flex; flex-direction: column; align-items: center; padding-top: 15px; transition: padding 0.8s ease-in-out;}
.soul_page .go_sect .slide .item:before {content: ''; position: absolute; /*top: calc(100% + 1.5rem);*/ bottom: 0; left: 50%; transform: translateX(-50%); width: 15rem; height: 5rem;  border-radius: 50%; opacity: 0; transition: opacity 0.8s ease-in-out;  background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 125 51" fill="none"><g filter="url(%23filter0_f_14_253)"><ellipse cx="62.5" cy="25.5" rx="47.5" ry="10.5" fill="%23A98DD0" fill-opacity="0.4"/></g><defs><filter id="filter0_f_14_253" x="0" y="0" width="125" height="51" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feGaussianBlur stdDeviation="7.5" result="effect1_foregroundBlur_14_253"/></filter></defs></svg>') no-repeat center / cover;}


.soul_page .go_sect .slide .item .txt_box{position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; background-color: #fff; width: 22rem; height: 19rem; border-radius: 2rem; box-shadow: 0 10px 30px 0 rgba(77, 37, 175, 0.20); opacity: 0; transition: opacity 0.5s ease;}
.soul_page .go_sect .slide .item .txt_box:before{content:''; position: absolute; display: block; top: calc(100% - 0.3rem); left: 50%; transform: translateX(-50%); width: 100%; height: 1.7rem; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="19" height="17" viewBox="0 0 19 17" fill="none"><path d="M7.63215 15.75C8.40195 17.0833 10.3264 17.0833 11.0962 15.75L18.4575 3C19.2273 1.66667 18.265 0 16.7254 0H2.00298C0.463381 0 -0.49887 1.66667 0.27093 3L7.63215 15.75Z" fill="white"/></svg>') no-repeat center / contain;}
.soul_page .go_sect .slide .item .txt_box .tit{line-height: 1;}
.soul_page .go_sect .slide .item .txt_box .txt{margin-top: 1.5rem; color: var(--gray);}

.soul_page .go_sect .slide .item .character_box{position: relative; height: 15rem; display: flex; align-items: flex-end; margin-top: -2vh; z-index: 2;}
.soul_page .go_sect .slide .item .character_box img{width: 100%; height: 100%; object-fit: contain; }

/* 슬라이드 효과 */
.soul_page .go_sect .slide .swiper-wrapper { align-items: center; }
.soul_page .go_sect .slide .item .txt_box{margin-bottom: 15rem;}
.soul_page .go_sect .slide .item .character_box{transform: scale(1); transform-origin: center bottom; transition: transform 0.8s ease-in-out;}

.soul_page .go_sect .slide .item.swiper-slide-active a{padding-bottom: 10rem; will-change: transform;} /*animation: floatTopY 3s ease-in-out infinite;*/
.soul_page .go_sect .slide .item.swiper-slide-active .txt_box{opacity: 1;  transition: opacity 0.8s ease-in-out 0.5s; }
.soul_page .go_sect .slide .item.swiper-slide-active .character_box{transform: scale(2);}
.soul_page .go_sect .slide .item.swiper-slide-active .character_box:before{opacity: 1;}

.soul_page .go_sect .slide .item.temp .character_box img{height: 80%;}

.soul_page .home_btn {position: absolute; left: 50%; transform: translateX(-50%); bottom: 3.5rem;}
.soul_page .home_btn a{display: flex; align-items: center; justify-content: center; width: 6rem; height: 6rem; background-color: var(--primary); border-radius: 50%;}
.soul_page .home_btn a svg{display: block; width: 1.5rem; height: auto;}



/* 공통_진입화면 */
.first_page {position: relative; z-index: 200; padding-bottom: 0;}
.first_page .page_bg{top: -3%;}
.com_first_sect{position: relative; padding-top: 0; height: calc(100dvh - var(--headerH)); min-height: 50rem; overflow: hidden;}
.com_first_sect > .tit{font-size:2.5rem; font-weight: 700; color: #fff; text-align: center;}
.com_first_sect > .tit{display: none;}
.com_first_sect .img_box{ margin-top: 2vh; overflow: hidden;}
.com_first_sect .img_box img{display: block; margin:0 auto; height: 50vh; object-fit: cover;} /*width: 114%; max-width: 114%; margin-left:-7%;*/

.com_first_sect .info_cont{position: absolute; bottom: 0; left: 0; transform: translateY(90%); width: 100%; background-color: #fff; border-radius: 3rem 3rem 0 0; padding: 3rem 3.5rem 2.8rem; transition: transform 1s ease-in-out;}
.com_first_sect.active .info_cont{transform: translateY(0);}

.typing_txt_wrap{position: relative;}
.com_first_sect .info_cont .typing_txt,
.com_first_sect .info_cont .typing_txt_hidden{ font-size: var(--tit2); font-weight: 700; width: 95%;}
.com_first_sect .info_cont .typing_txt{position: absolute; top: 0; left: 0;}
.com_first_sect .info_cont .typing_txt_hidden{opacity: 0;}
.com_first_sect .info_cont .typing_txt_hidden .mo_over{display: none;}
/* .com_first_sect .info_cont .typing_txt{height: 10.5rem;;}
/* .saju_page .com_first_sect .info_cont .typing_txt{height: 8rem;}
.tarot_page .com_first_sect .info_cont .typing_txt{height: 13.5rem;} */


.com_first_sect .info_cont .txt br{display: none;}
.com_first_sect .info_cont .basic_btn{margin-top: 2.5rem;}


/* 공통_로딩화면 */
.loading_overlay {position: fixed; width: var(--maxWidth); max-width: 100%; height: 100dvh; top: 0; z-index: 999; opacity: 1; transition: opacity 0.6s ease-in-out;}
.loading_overlay.hide{opacity: 0; pointer-events: none;}

/* reuslt overlay_로딩영상 */
.loading_overlay .loading_bg{position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 1;}
.loading_overlay .loading_bg img{position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.loading_overlay .loading_cont{position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; z-index: 2;}
.loading_overlay .loading_cont .loading_video video{width: 100%; height: 100%; object-fit: cover; object-position: center;}

/* 타로버전 */
.loading_overlay.tarot_ld_ol{padding-bottom: 8rem;}
.loading_overlay.tarot_ld_ol .com_loading_box{margin-top: -7rem;}

/* 운세픽버전*/
.loading_overlay.pick_ld_ol{background-color: #f0ebe0;}
.loading_overlay.pick_ld_ol .loading_cont .pick_loading_video + .com_loading_box{position: absolute; margin-top: 60vh;}
.loading_overlay.pick_ld_ol .loading_cont .pick_loading_video {width: 100%; height: 100%;}


.com_loading_box{position: relative; display: flex; align-items: center; width: max-content; background: rgba(0, 0, 0, 0.60); border-radius:0.5rem; padding: 0.8rem 1.6rem; z-index: 2;} /*margin-top:45vh;*/
.com_loading_box .ico{display: flex; margin-right: 0.5rem;}
.com_loading_box .dot{display: block; width: 3px; height: 3px; border-radius: 100%; background: rgba(255, 255, 255, 0.25); animation: dotBlink 1.2s infinite ease-in-out;}
.com_loading_box .dot + .dot{margin-left: 0.3rem;}
.com_loading_box .txt{font-size:var(--subTxt); color: #fff; font-weight: 600;}
.com_loading_box .dot:nth-child(1) { animation-delay: 0s; }
.com_loading_box .dot:nth-child(2) { animation-delay: 0.2s; }
.com_loading_box .dot:nth-child(3) { animation-delay: 0.4s; }

@keyframes dotBlink {
    0%, 80%, 100% { background: rgba(255,255,255,0.4); }
    40% { background: #fff; }
}


/* form 위 overlay 로딩 */
.loading_overlay .loading_dim{position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; background:rgba(0, 0, 0, 0.7); z-index: 2;}
.loading_overlay .loading_dim .com_loading_box{flex-direction: column;}
.loading_overlay .loading_dim .com_loading_box .ico{display: flex;}

.loading_dot_pulse{position: relative; display: flex; flex-direction: column; align-items: center; width: max-content; background: rgba(0, 0, 0, 0.60); border-radius:0.5rem; padding: 2.5rem 2.5rem 1.8rem; z-index: 2;}
.loading_dot_pulse .ico{display: flex; margin-right: 0.5rem;}
.loading_dot_pulse .dot {display: block; width: 3px; height: 3px; border-radius: 100%; background: rgba(255, 255, 255, 0.25); animation: dotPulse 1.2s infinite ease-in-out; margin-bottom: 1rem;}
.loading_dot_pulse .dot + .dot { margin-left: 0.8rem; }
.loading_dot_pulse .txt { font-size: var(--subTxt); color: #fff; font-weight: 600; }
.loading_dot_pulse .dot:nth-child(1) { animation-delay: 0s; }
.loading_dot_pulse .dot:nth-child(2) { animation-delay: 0.2s; }
.loading_dot_pulse .dot:nth-child(3) { animation-delay: 0.4s; }


@keyframes dotPulse {
    0%, 80%, 100% {
        transform: scale(1);
        background: rgba(255, 255, 255, 0.3);
    }
    40% {
        transform: scale(2.5);
        background: #fff;
    }
}


/* 영상로딩_페이지 */
.page[class$="_loading_page"]{width: 100%; padding: 0; height: 100vh; overflow: hidden;}
.page[class$="_loading_page"] .loading_sect {display: flex; flex-direction: column; align-items: center; justify-content: center;  width: 100%; height: 100%; overflow: hidden;}
.page[class$="_loading_page"] .loading_sect .loading_bg{position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 1;}
.page[class$="_loading_page"] .loading_sect .loading_bg img{position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.page[class$="_loading_page"] .loading_sect .loading_cont{display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; z-index: 2;}
.page[class$="_loading_page"] .loading_sect .loading_cont .loading_video video{width: 100%; height: 100%; object-fit: cover; object-position: center;}





/* 결과_공통 */
/* .result_page{position: relative; display: flex; flex-direction: column; padding-top: 0; padding-bottom: 5rem; min-height: 100vh; background-color: #fff; z-index: 200;} */
.page[class$='result_page']{position: relative; display: flex; flex-direction: column; padding-bottom: calc(var(--footerH) + var(--subPd)); min-height: 100vh; background-color: #fff;}
.page[class$='result_page'] .result_wrap {transition: opacity 0.8s ease-in-out 0.3s;}
.page[class$='result_page'] .result_wrap.hide {opacity: 0;}

/* 결과_공통 상단 */
.com_result_top{position: relative; display: flex; justify-content: center; flex-shrink: 0; height: 26rem; padding: calc(var(--headerH) + 2rem) var(--inPd) 3rem; background-color: #EBEBEB; border-radius: 0 0 5rem 5rem; overflow: hidden;}
.com_result_top .txt_box{ max-width: 50%; padding-left: 5%; margin-bottom: 3.2rem;} /*하단 버튼 높이값 3.2rem */
/* .com_result_top .txt_box .date{display: inline-block; font-size:var(--subTxt); color: #9C72C6; font-weight: 600; background-color: #fff; border-radius: 0.5rem; padding: 0.3em 0.8em; margin-bottom: 0.7rem; white-space: nowrap;} */
.com_result_top .txt_box .date {color: var(--gray); font-size: var(--txt); margin-bottom: 0.3rem;}
.com_result_top .txt_box .tit{font-size:var(--tit); font-weight: 700; line-height: 1.5;}
.com_result_top .txt_box .tit .name{color: var(--primary);}

/* .com_result_top .img_box{position: absolute; top: calc(var(--headerH) + 2rem); right: -5rem; width: 35rem;} */
.com_result_top .img_box{position: relative; height: 35rem; margin-left: 2rem;}
.com_result_top .img_box img{height: 100%; object-fit: contain;}

.com_result_top .btn_box{position: absolute; bottom: 3rem; display: flex;}
.com_result_top .btn_box .btn{display: flex; justify-content: center; align-items: center; border-radius: 50%; width: 3.2rem; height: 3.2rem; background-color: #fff;}
.com_result_top .btn_box .btn svg{display: block; width: 50%; height: 50%; margin-left: -0.15em; margin-top: 0.1em;}
.com_result_top .btn_box .btn + .btn{margin-left: 0.5rem;}


/* 결과_공통 상단 - 스타일 추가 */
.com_result_header .user_cont{padding-top: 3rem; }
.com_result_header .user_cont .in{ display: flex; align-items: center;}
.com_result_header .user_cont .profile{position: relative; width: 9rem; height: 9rem; flex-shrink: 0; background-color: #EBEBEB; border-radius: 50%; margin-right: 1rem; overflow: hidden;}
.com_result_header .user_cont .profile > img{position: absolute; width: 190%; max-width: inherit; left: 50%; transform: translateX(-50%);}
.com_result_header .user_cont .txt_wrap .tit{font-size: 2.2rem; font-weight: 700; line-height: 1.2;}
.com_result_header .user_cont .txt_wrap .tit .name{color: var(--primary);}
.com_result_header .user_cont .txt_wrap .txt_box{display: flex; align-items: center; margin-top: 0.5rem;}
.com_result_header .user_cont .txt_wrap .txt_box .txt,
.com_result_header .user_cont .txt_wrap .txt_box .date{font-size: var(--subTit); color: var(--gray); font-weight: 500; line-height: 1;}
.com_result_header .user_cont .txt_wrap .txt_box .txt.dot{position: relative; padding-left: 0.8rem; margin-left: 0.6rem;}
.com_result_header .user_cont .txt_wrap .txt_box .txt.dot:before{content: ''; position: absolute; display: block; top: 50%; transform: translateY(-50%); left: 0; width: 3px; height: 3px; border-radius: 50%; background-color: var(--gray);}
.com_result_header .user_cont .txt_wrap .txt_box .share_btn{display: flex; align-items: center; border: 1px solid var(--line); font-size: var(--subTxt); font-weight: 500; border-radius: 5px; color: var(--gray); padding: 0.2rem 0.5em 0.25rem; margin-left: 0.5em;}
.com_result_header .user_cont .txt_wrap .txt_box .share_btn:before{content: ''; display: inline-block; width: 0.8em; height: 1.5em; margin-right: 0.4rem; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 13 15" fill="none"><path d="M10.5 4.50004C11.6046 4.50004 12.5 3.6046 12.5 2.50002C12.5 1.39544 11.6046 0.5 10.5 0.5C9.39542 0.5 8.49999 1.39544 8.49999 2.50002C8.49999 3.6046 9.39542 4.50004 10.5 4.50004Z" stroke="%23787878" stroke-linecap="round" stroke-linejoin="round"/><path d="M2.5 9.16654C3.60457 9.16654 4.5 8.2711 4.5 7.16652C4.5 6.06194 3.60457 5.1665 2.5 5.1665C1.39543 5.1665 0.5 6.06194 0.5 7.16652C0.5 8.2711 1.39543 9.16654 2.5 9.16654Z" stroke="%23787878" stroke-linecap="round" stroke-linejoin="round"/><path d="M10.5 13.8335C11.6046 13.8335 12.5 12.9381 12.5 11.8335C12.5 10.7289 11.6046 9.8335 10.5 9.8335C9.39542 9.8335 8.49999 10.7289 8.49999 11.8335C8.49999 12.9381 9.39542 13.8335 10.5 13.8335Z" stroke="%23787878" stroke-linecap="round" stroke-linejoin="round"/><path d="M4.49994 8.14827L8.49994 10.7665M8.49994 3.56641L4.49994 6.18461" stroke="%23787878" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat center / contain;}

.com_result_header .score_cont + .user_cont{padding-top: 0;}
.com_result_header .score_cont{position: relative; display: flex; flex-direction: column; justify-content: flex-end; padding: 92% 0 9rem;}
.com_result_header .score_cont .bg{position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; overflow: hidden;}
.com_result_header .score_cont .bg img{width: 100%; object-fit: contain; object-position: center top;}
.com_result_header .score_cont .bg.show img{opacity: 1;}
.com_result_header .score_cont .cont{position: relative; z-index: 2; }
.com_result_header .score_cont .cont .txt_box {text-align: center; opacity: 0; transform: translateY(1rem); transition: opacity 0.8s ease-in-out, transform 0.8s ease-in-out;}
.com_result_header .score_cont .cont .txt_box .date{font-size: var(--subTit); color: var(--gray); font-weight: 600; margin-bottom: 0.5rem;}
.com_result_header .score_cont .cont .txt_box .tit{font-size: var(--mainTit); font-weight: 700;}
.com_result_header.active .score_cont .cont .txt_box{opacity: 1; transform: translateY(0);}


.score_bar { width: 100%; max-width: 80%; margin: 7rem auto 0; }
.score_bar .track { position: relative; width: 100%; height: 2rem; border-radius: 10rem; background: rgba(5, 5, 5, 0.15); }
.score_bar .fill { position: absolute; left: 0; top: 0; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, #946FF0 0%, #946FF0 100%); transition: width 0.8s ease; }
.score_bar .step { position: absolute; height: 100%;}
.score_bar .step .dot { position: absolute; top: 50%; transform: translate(-50%, -50%); width: 1rem; height: 1rem; border-radius: 50%; border: 3px solid rgba(255, 255, 255, 1); background: transparent; box-sizing: border-box; }
.score_bar .step .label { position: absolute; display: block; top: 100%; transform: translateX(-50%); margin-top: 0.5rem; font-size: var(--subTxt); color: #1a1a1a; opacity: 0.3; font-weight: 500; }
.score_bar .score_bubble { position: absolute; bottom: 100%; transform: translate(-50%, 0rem); padding:0.35em 0.9em 0.4em; font-size: var(--subTit); font-weight: 700; border-radius: 10rem; background: #1a1a1a; color: #fff; white-space: nowrap; opacity: 0; transition: opacity 0.5s ease-in-out 0.8s, transform 0.5s ease-in-out 0.8s;}
.score_bar .score_bubble.show{opacity: 1; transform: translate(-50%, -1.2rem); }
.score_bar .score_bubble::after { content: ""; position: absolute; left: 50%; top:calc(100% - 0.3rem); transform: translateX(-50%); width: 1rem; height: 1rem; background: #1a1a1a; clip-path: polygon(50% 100%, 0 0, 100% 0); }


.com_result_cont .result_item{padding-top: 4rem;}
.com_result_cont .result_item > .tit{font-size: var(--tit); font-weight: 700; line-height: 1.4; }
.com_result_cont .result_item .txt_box .tit,
.com_result_cont .result_item > .tit{margin-bottom: 1rem;}
.com_result_cont .result_item .result_tit{font-size:var(--tit); font-weight: 700; margin-bottom: 4rem;}
.com_result_cont .result_item .flex_box{display: flex; justify-content: space-between; align-items: center;}
.com_result_cont .result_item .flex_box > *{margin-bottom: 1rem;}
.com_result_cont .result_item .txt + .com_tag_box{margin-top: 2rem;}
.com_result_cont .result_item.line_top{margin-top: 4rem; border-top: 1px solid var(--line);}

.com_result_header + .com_result_cont.big_line{margin-top: 4rem;}
.com_result_cont.big_line{margin-top: 5rem; border-top: 1rem solid var(--bg); }
.com_result_cont.big_line .result_item:first-child{padding-top: 5rem;}

.com_result_cont .result_item.main_item .txt_box .tit{font-size:2.5rem;}
.com_result_cont .result_item.main_item .txt_box .tit + .txt{margin-top: 1.5rem;}
.com_result_cont .result_item.sub_item .txt_box .tit{font-size:var(--tit2); font-weight: 600;}
.com_result_cont .result_item .txt_box + .txt_box{margin-top: 3rem;}
.com_result_cont .result_item .desc{color: #5E5E5E; font-size:var(--subTxt); margin-bottom: 0.5rem;}

.com_result_cont .result_item .plus_tit .plus{display: inline-block; margin-bottom: 0.4rem; margin-left: 0.2rem;}
.com_result_cont .result_item .plus_tit .plus svg{display: block;}
/* 행운의컬러 / 에너지컬러 / 행운의 아이템 / 좋은 소품 / 향기 / 루틴 */
.com_result_cont .result_item .item_tit {display: flex; align-items: center; gap: 0.2em; flex-wrap: wrap; font-size:var(--subTit);}
/* .com_result_cont .result_item .item_tit > span:first-child,
.com_result_cont .result_item .item_tit > div > span:first-child{margin-left: 0.2em;} */
.com_result_cont .result_item .item_tit .lucky_color_wrap,
.com_result_cont .result_item .item_tit .energy_color_wrap{display: flex; align-items: center; flex-wrap: wrap;}
.com_result_cont .result_item .item_tit .color_item{display: flex; align-items: center; }
.com_result_cont .result_item .item_tit .color_item + .color_item{margin-left: 0.2em;}
.com_result_cont .result_item .item_tit .color_item .color_ball{display: inline-block; width: 1em; height: 1em; background-color: #101010; border-radius: 100%; margin-left: 0.3rem; margin-bottom: 0.1em;}

.com_result_cont .result_item .badge_box{display: inline-block; font-size:var(--subTxt); color: #9C72C6; font-weight: 600; background-color: var(--bg); border-radius: 0.5rem; padding: 0.3em 0.8em; margin-bottom: 1rem; white-space: nowrap;}
.com_result_cont .result_item.main_item .badge_box{font-size: var(--txt);}

/* ! 텍스트 */
.com_result_cont .info_item{margin-top: 5rem; padding-top: 4rem; border-top: 1px solid var(--line);}
.com_result_cont .info_item .tit{position: relative; font-size:var(--txt); color: #5E5E5E; padding-left: calc(1.2em + 0.5rem);}
.com_result_cont .info_item .tit:before{content:''; position: absolute; left: 0; top: 0.1em; display: inline-block; width: 1.2em; height: 1.2em; background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="17" height="17" viewBox="0 0 17 17" fill="none"><path d="M12 1.07191C13.2162 1.77405 14.2261 2.78396 14.9282 4.00011C15.6304 5.21626 16 6.59582 16 8.00011C16 9.4044 15.6303 10.7839 14.9282 12.0001C14.226 13.2162 13.2161 14.2261 11.9999 14.9283C10.7837 15.6304 9.40418 16 7.99987 16C6.59557 16 5.21602 15.6303 3.99987 14.9281C2.78372 14.226 1.77383 13.216 1.07171 11.9999C0.369584 10.7837 -3.56717e-05 9.40415 2.58212e-09 7.99986L0.00400009 7.74066C0.0488026 6.35906 0.450838 5.01265 1.17091 3.83268C1.89099 2.65271 2.90452 1.67946 4.11271 1.00781C5.3209 0.336162 6.68252 -0.0109685 8.06481 0.000264195C9.44709 0.0114969 10.8029 0.380709 12 1.07191ZM8 10.3998C7.78783 10.3998 7.58434 10.4841 7.43431 10.6342C7.28429 10.7842 7.2 10.9877 7.2 11.1998V11.2078C7.2 11.42 7.28429 11.6235 7.43431 11.7735C7.58434 11.9235 7.78783 12.0078 8 12.0078C8.21217 12.0078 8.41566 11.9235 8.56569 11.7735C8.71571 11.6235 8.8 11.42 8.8 11.2078V11.1998C8.8 10.9877 8.71571 10.7842 8.56569 10.6342C8.41566 10.4841 8.21217 10.3998 8 10.3998ZM8 4.79988C7.78783 4.79988 7.58434 4.88416 7.43431 5.03419C7.28429 5.18422 7.2 5.3877 7.2 5.59987V8.79985C7.2 9.01202 7.28429 9.2155 7.43431 9.36553C7.58434 9.51556 7.78783 9.59984 8 9.59984C8.21217 9.59984 8.41566 9.51556 8.56569 9.36553C8.71571 9.2155 8.8 9.01202 8.8 8.79985V5.59987C8.8 5.3877 8.71571 5.18422 8.56569 5.03419C8.41566 4.88416 8.21217 4.79988 8 4.79988Z" fill="%23EB158D"/></svg>') no-repeat center / contain}
.com_result_cont .info_item .txt{font-size:var(--subTxt); color: #5E5E5E; margin-top: 1rem;}

/* 슬라이드 */
.com_result_slide {margin-top: 2rem;}
.com_result_slide .swiper-container{width: calc(100% + var(--inPd) * 2); margin-left: calc(var(--inPd) * -1); padding: 0 var(--inPd);}
.com_result_slide .swiper-slide{width: 35rem; max-width: 82%;}
.com_result_slide .item{width: 100%; height: auto; background-color: var(--bg); border-radius: 2rem; padding: 2.5rem 2rem;}
.com_result_slide .item .label{font-size:var(--txt); background-color: #fff; padding: 0.5rem 1.2rem; border-radius: 0.7rem; max-width: max-content;}
.com_result_slide .item .txt_box{margin-top:3rem;}
.com_result_slide .item .txt_box .tit{font-size:var(--subTit); font-weight: 600;}
.com_result_slide .pagination{display: none;}

/* 하단 버튼 */
.com_btm_cont { margin-top: auto; }
.com_btm_cont .basic_btn{margin-top: 5rem;}
.com_btm_cont .basic_btn .plus{display: inline-block; margin-top:-0.6rem;}
.com_btm_cont .basic_btn .plus.txt{font-size: 0.7em; margin-top: -1.2rem;}


.com_result_cont .profile_img{width: 3.2rem; height: 3.2rem; padding-top: 0.4rem; border-radius: 10rem; background-color: var(--bg); overflow: hidden; margin: 1rem 0;}
.com_result_cont .profile_img img{width: 100%;}

.result_item .chart_box { width: 100%; background: var(--bg); border-radius: 2rem; padding: 2.5rem 2rem; }
.result_item .chart_box canvas { width: 100%; height: 18.5rem; }





/* ---------- 사주아뜰리에 ---------- */
.saju_page {background: linear-gradient(162deg, #F299A8 -1.35%, #D6B58A 55.12%, #9C8C6F 102.98%);}

.saju_result_page{padding-top: 0;}

.table_box{overflow: hidden;}
.table_box .saju_table{width: 100%; border-radius: 1rem; overflow:hidden; border-collapse: collapse; text-align: center;}
.table_box .saju_table th, 
.table_box .saju_table td { padding: 1rem 0.5rem; }
.table_box .saju_table th { background: #E6E9EC; font-weight: 600; font-size:var(--txt); }
.table_box .saju_table td { background: var(--bg); font-weight: 600; font-size:var(--txt); }

.table_box .saju_table th{line-height: 1;}
.elm {display: inline-flex; align-items: center; justify-content: center; font-size:var(--subTxt); width: 1.6em; height: 1.6em; margin-left: 0.4rem; padding-top: 0.1em; line-height: 1; color: #fff; border-radius: 50%;}
.elm.fire { background-color: #FF6A6A; }
.elm.earth { background-color: #9E733D; }
.elm.metal { background-color: #EEBF00; }
.elm.water { background-color: #237AFB; }
.elm.wood { background-color: #44B444; }

.saju_table .dot{display: inline-block; width: 1.1rem; height: 1.1rem; border-radius: 50%; background-color: #fff; margin-left: 0.4rem; margin-bottom: -0.1rem;}
.saju_table .dot.none{border: 1px solid #c4c4c4;}
.saju_table .dot.weak{background-color: #d1c3f4;}
.saju_table .dot.strong{background-color: var(--primary);}

.saju_table.info_dot{display: flex; color: var(--gray); font-size:var(--subTxt);}
.saju_table.info_dot .item{display: flex; align-items: center;}
.saju_table.info_dot .item + .item{margin-left: 1.5rem;}
.saju_table.info_dot .item .txt{line-height: 1; margin-left: 0.3rem;}

.result_item p[data-render-view="lucky_number"]{display: inline-flex; align-items: center; justify-content: center; margin-top: 0 !important; width: 2.5rem; height: 2.5rem; font-size: var(--txt); background-color: rgba(229, 219, 255, 1); color:rgba(104, 57, 220, 1); border-radius: 50%;} 
.result_item .lucky_number_lotto{display: flex; gap: 0.5rem;}
.result_item .lucky_number_lotto .lucky_number{display: inline-flex; align-items: center; justify-content: center; margin-top: 0 !important; width: 2.5rem; height: 2.5rem; font-size: var(--txt); background-color: rgba(229, 219, 255, 1); color:rgba(104, 57, 220, 1); border-radius: 50%;} 


.com_result_cont .result_item .tit.with_info {white-space: nowrap; display: flex; align-items: center;}
.com_result_cont .result_item .tit.with_info .info_btn{margin-left: 0.4rem;}
.com_result_cont .result_item .tit.with_info .info_btn svg{display: block;}



/* ---------- 타로스튜디오 ---------- */
.tarot_page {background: url(../img/sub/tarot_bg.jpg) no-repeat center / cover;}

.tarot_list_btn{position: absolute; display: flex; align-items: center; font-size:var(--subTit); top: 0.6rem; right: var(--inPd); color: #fff;}
.tarot_list_btn .ico{margin-right: 0.3rem;}
.tarot_list_btn .ico svg{display: flex;}
.tarot_list_btn .txt{line-height: 1;}
.tarot_list_btn.bk{color: #000;}

.tarot2_page .input_sect .tit_box .txt{color: var(--gray);}
.tarot2_page .input_sect .com_select_list{margin-top: 3rem;}
/* .tarot2_page .com_tab_wrap .scroll_tab::-webkit-scrollbar{display: block;}
.tarot2_page .com_tab_wrap .scroll_tab::-webkit-scrollbar { height: 5px; }
.tarot2_page .com_tab_wrap .scroll_tab::-webkit-scrollbar-track { background: transparent; }
.tarot2_page .com_tab_wrap .scroll_tab::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.2); border-radius: 5px; } */
.tarot2_page .com_tab_wrap .scroll_tab { overflow-x: auto; cursor: grab; }
.tarot2_page .com_tab_wrap .scroll_tab.dragging { cursor: grabbing; }

/* 타로스튜디오_카드선택 */
.tarot_pick_page .select_sect{padding-bottom: 0;}
.tarot_pick_page .select_sect{position: relative; min-height: calc(100% - var(--headerH) - var(--footerH));}
.tarot_pick_page .cont{position: relative; margin-top: 2rem;}

.tarot_pick_page .tarot_list_btn{top: 17rem; z-index: 20;}
.contents-tarot-card-pick_body .tarot_pick_page .tarot_list_btn{top: 14.5rem;}

/* .tarot_pick_page .tarot_pick{position: absolute; width: 100%;} */
.tarot_pick_page .tarot_pick .pick_box{display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 0.5rem;}
.tarot_pick_page .tarot_pick .pick_box .pick_card{position: relative; width: 100%; grid-column: 6 / span 2; padding-top: 154%; border-radius: 0.5rem; border: 1px dashed var(--primary); overflow: hidden;}
.tarot_pick_page .tarot_pick .pick_box .pick_card img{position: absolute; width: 100%; height: 100%; top: 0; left: 0; object-fit: cover; }
.tarot_pick_page .tarot_pick .pick_box .pick_card .txt{position: absolute; width: 100%; height: 100%; top: 0; left: 0; display: flex; align-items: center; justify-content: center; color: var(--primary); opacity: 0.8; font-size: var(--subTxt); padding:0.25rem}

.tarot_pick_page .tarot_list_box{position: relative; height: 35vh; padding-bottom: 1px; margin-top: 2rem; overflow: hidden;}
.tarot_pick_page .tarot_list_box:before{content: ''; position: absolute; bottom: -1px; left: 0; width: 100%; height: 20%; background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 0%, #FFF 80.83%); z-index: 2;}
.tarot_pick_page .tarot_list_box .tarot_list{position: relative; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); max-height: 100%; overflow: auto; padding-bottom: 4rem; gap: 0.5rem;}
.tarot_pick_page .tarot_list_box .tarot_list::-webkit-scrollbar {display: none;}
.tarot_pick_page .tarot_list_box .tarot_list .tarot_card{position: relative; width: 100%; padding-top: 154%; overflow: hidden; cursor: pointer; transition: box-shadow 0.3s ease-in-out, opacity 0.3s ease-in-out;}
.tarot_pick_page .tarot_list_box .tarot_list .tarot_card img{position: absolute; width: 100%; height: 100%; top: 0; left: 0; object-fit: cover; border-radius: 0.5rem;}
/* 카드 선택 후 */
.tarot_pick_page .tarot_pick .pick_box .pick_card.has-card{border-style: solid; box-shadow: 0 0 2rem rgba(104, 57, 220, 0.3);}
.tarot_pick_page .tarot_pick .pick_box .pick_card .flying_card{border-radius: 0.5rem; overflow: hidden;}
.tarot_pick_page .tarot_list_box .tarot_list .tarot_card.is-active{opacity: 0;}
.tarot_pick_page .tarot_list_box .tarot_list .tarot_card.is-disable { opacity: 0.4; pointer-events: none;}

.tarot_pick_page .btm_btn_box{ display: flex; flex-direction: column; margin-top: 2rem;}
.tarot_pick_page .btm_btn_box .new_btn{margin:2rem auto 0;}


/* 타로스튜디오_결과 */
.tarot_result_top{position: relative; text-align: center; padding-top: 4rem;}
.tarot_result_top .result_card {position: relative; width: 20rem; height: 30.8rem; perspective: 1000px; margin: 0 auto; }
.tarot_result_top .result_card img{ position: absolute; width: 100%; height: 100%; border-radius: 0.5rem; left: 0; top: 0; object-fit: cover; backface-visibility: hidden; box-shadow: 0 0 4rem 0 rgba(104, 57, 220, 0.50); transition: transform 1s cubic-bezier(.46,.03,.52,.96);}

.tarot_result_top .result_card .card_back {transform: rotateY(0deg);}
.tarot_result_top .result_card .card_front {transform: rotateY(-180deg);}
.tarot_result_top .result_card .card_front.reverse {transform: rotateY(-180deg) rotate(180deg);}
.tarot_result_top .result_card.active .card_back {transform: rotateY(180deg);}
.tarot_result_top .result_card.active .card_front {transform: rotateY(0deg);}
.tarot_result_top .result_card.active .card_front.reverse {transform: rotateY(0deg) rotate(180deg);}

.tarot_result_top .btn_box{position: absolute; right: var(--inPd); top: 0; padding-top: 4rem;}
.tarot_result_top .btn_box .btn{display: flex; align-items: center; justify-content: center; border: 1px solid var(--line); border-radius: 50%; width: 3.2rem;  height: 3.2rem;}
.tarot_result_top .btn_box .btn + .btn{margin-top: 1rem;}
.tarot_result_top .btn_box .btn svg{display: block; width: 50%; height: 50%; margin-left: -0.1em;}

.tarot_result_top .txt_box{ margin: 3.5rem auto 0;}
.tarot_result_top .txt_box .desc{color: var(--gray); font-size:var(--txt); font-weight: 500; margin-bottom: 1rem; line-height: 1.8;}
.tarot_result_top .txt_box .desc span{ padding: 0.3em 0.5em; border-radius: 10rem; font-size: 0.8em; margin-left: 0.3rem; background: #e3dbf7; color: var(--primary);}
.tarot_result_top .txt_box .txt{margin-top: 2rem; line-height: 1.6;}
.tarot_result_top .com_tag_box{justify-content: center; margin-top: 2rem;}
 
.tarot_result_page .result_cont{margin-bottom: 4rem;}
.tarot_result_page .result_cont .result_item{margin-top: 5rem;}


/* 타로의미 추가 */
.tarot_list_page .list_sect{padding: 3rem 0 8rem;}
.tarot_list_page .list_sect .tit_box{text-align: center;}
.tarot_list_page .list_sect .tit_box .txt{color: var(--gray); margin-top: 0.5rem;}
.tarot_list_page .list_sect .cont {display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.5rem;}
.tarot_list_page .list_sect .cont .card{cursor: pointer;}
.tarot_list_page .list_sect .cont .card img{border:1px solid var(--line); border-radius: 0.5rem;}
.tarot_list_page .list_sect .cont .txt{text-align: center; font-weight: 500; margin-top: 0.5rem;}

.card_mean {position: fixed; top: 0; max-width: 100%; z-index: 9999; opacity: 0; pointer-events: none;  transition: opacity 0.3s ease-in-out}
.card_mean.open { opacity: 1; pointer-events: inherit;}
.card_mean .card_mean_wrap { margin: 0 auto; width: var(--maxWidth); max-width: 100%; height: 100%; min-height: 100vh; background-color: #fff; }
.card_mean .card_mean_wrap .modal_header{position: sticky; background-color: #fff;}
.card_mean .card_mean_wrap .card_mean_cont{width: 100%; overflow-y: auto; max-height: calc(100dvh -  var(--headerH));}
.card_mean .card_mean_wrap .card_mean_cont::-webkit-scrollbar{display: none;}

.tarot_list_page .card_mean .card{width:20rem; margin: 0 auto 3.5rem; }
.tarot_list_page .card_mean .card img{border-radius: 0.5rem; box-shadow: 0 0 4rem 0 rgba(104, 57, 220, 0.50);}
.tarot_list_page .card_mean .card_mean_cont{text-align: center; padding: 4rem 0 5rem;}
.tarot_list_page .card_mean .card_mean_cont .com_tag_box{justify-content: center; margin-top: 1rem;}
.tarot_list_page .card_mean .card_mean_cont .txt_box{margin-top: 4rem; }
.tarot_list_page .card_mean .card_mean_cont .txt_box .tit{margin-bottom: 1rem;}
.tarot_list_page .card_mean .card_mean_cont .txt_box .txt{width: 50rem; max-width: 100%; margin: 0 auto;}
/* 모달 카드 이미지: FLIP 애니메이션 기준점 */
.tarot_list_page .card_mean .card img {display: block; width: 100%; transform-origin: top left;}
.tarot_list_page .list_sect .cont .card img.card-origin-hidden {visibility: hidden;}



/* ---------- 운세픽 ---------- */
.pick_page{background: #e6a65c;}

/* .pick_draw_page{ max-height: calc(100dvh - var(--headerH));} */
.pick_draw_page{padding-bottom: 0;}
.pick_draw_page .pick_sect .in{ position: relative; display: flex; flex-direction: column; height: calc(100dvh - var(--headerH)); padding-top: 3vh; padding-bottom: 5rem;}
.pick_draw_page .page_bg img,
.loading_overlay.pick_ld_ol .loading_cont .pick_loading_video video{ object-position: 50% 80%;}




/* ---------- 내이름탐구소 ---------- */
.name_page{background: conic-gradient(from -83deg at 0% 50.94%, #887361 68.03920447826385deg, #CCB496 155.95588445663452deg, #69655D 360deg);}

/* 내이름탐구소_정보입력 */
.write_form .form_list li .inp_flex{display: flex; gap: 1rem;}
.name_form_page .write_form .form_list li .inp_flex .btn{width: 11rem; flex-shrink: 0; background-color: #000; border-radius: 1rem; color: #fff; padding: 0 2rem; font-weight: 600; font-size: var(--txt);}
.name_form_page .write_form .form_list li .com_info_box{margin-top: 1rem;}


/* 한자선택 모달 */
.name_modal .input_sect > .in{min-height: calc(100vh - var(--headerH));}
.name_modal .name_select_form .top_cont .name_box {display: flex; flex-wrap: wrap; max-width: 100%; gap: 1rem; margin-top: 4rem;}
.name_modal .name_select_form .top_cont .name_box .name_letter {position: relative; flex: 1; min-width: calc(20% - 1rem); padding: 0; box-shadow: inset 0 0 0 1px var(--line); border-radius: 1rem; background: #fff; font-size: 3rem; font-weight: 500; color: var(--gray); overflow: hidden; transition: border 0.3s ease, color 0.3s ease;}
.name_modal .name_select_form .top_cont .name_box .name_letter::before {content: ""; display: block; padding-top: 100%;}
.name_modal .name_select_form .top_cont .name_box .name_letter span {position: absolute; left: 0; top: 0; right: 0; bottom: 0; display: flex; align-items: center; justify-content: center;}
.name_modal .name_select_form .top_cont .name_box .name_letter.active {color: #000; box-shadow: inset 0 0 0 2px var(--primary);}
.name_modal .name_select_form .top_cont .name_box.over5 .name_letter{max-width: calc(20% - 1rem);}

.name_modal .name_select_form .letter_select_cont{display: none;}
.name_modal .name_select_form .letter_select_cont.active{display: block;}
.name_modal .name_select_form .letter_select_cont .letter_box {display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 2rem; gap: 1rem;}
.name_modal .name_select_form .letter_select_cont .letter_box .letter_item{position: relative; display: flex; align-items: center; justify-content: center; font-size: 3rem; border-radius: 1rem; color: var(--gray); box-shadow: inset 0 0 0 1px var(--line); cursor: pointer; transition: border 0.3s ease, color 0.3s ease; }
.name_modal .name_select_form .letter_select_cont .letter_box .letter_item::before {content: ""; display: block; padding-top: 100%;}
.name_modal .name_select_form .letter_select_cont .letter_box .letter_item .txt {position: absolute; left: 0; top: 0; right: 0; bottom: 0; display: flex; align-items: center; justify-content: center;}
.name_modal .name_select_form .letter_select_cont .letter_box .letter_item .meaning{position: absolute; font-size: var(--txt); font-weight: 400; color: var(--primary); background-color: #EDE6FF; padding: 0.3em 1rem; border-radius: 0.5rem; top: -1.3rem; opacity: 0; visibility: hidden; transition:opacity 0.3s ease;}
.name_modal .name_select_form .letter_select_cont .letter_box .letter_item.active{color: var(--primary); box-shadow: inset 0 0 0 2px var(--primary);}
.name_modal .name_select_form .letter_select_cont .letter_box .letter_item.active .meaning{opacity: 1; visibility: visible;}

.name_modal .name_select_form .btm_cont{margin-top: 4rem;}





/* 이름_메인결과 */
.name_result_cont{overflow: hidden; max-width: 100%;}
.name_result_cont .name_result_item{overflow: auto;}
.name_result_page .name_table { width: 100%; border-collapse: collapse; text-align: center; table-layout: fixed;}
.name_result_page .name_table th,
.name_result_page .name_table td {border: 1px solid #e5e5e5; padding: 1rem;}
.name_result_page .name_table thead th {font-size: 4.5rem; color: #000; border:none; line-height: 1; font-weight: 500;}
.name_result_page .name_table thead th.last_name{width: 9rem !important; color: #D9D9D9;}

.name_result_page .name_table td{font-size: var(--txt); font-weight: 700; }
.name_result_page .name_table td.row_tit { min-width: 0; font-size: var(--subTxt);  padding: 1rem 0; background: var(--bg); font-weight: 600; border-left: none; color: #888;}
.name_result_page .name_table td:last-child{border-right: none;}
.name_result_page .name_table td .plus_btn{margin-left: 10px;}
.name_result_page .name_table td .plus_btn svg{display: block; height: 1.2em; width: auto;}
.name_result_page .name_table .elm{width: 2rem; height: 2rem;}

.result_item .warn_item td{font-size: 0;}
.result_item .warn {display: inline-block; font-size: var(--smTxt); padding: 0.3rem 0.5em; font-weight: 600; color: #CA5555; background: #FFE4E4; border-radius: 3px; margin: 0.25rem;}


/* 이름_분석결과 */
.name_result_page .name_result_cont .result_item .txt_box > .tit{font-size: var(--tit2);}
.name_result_page .name_result_cont .result_item > .txt_box + .txt_box{margin-top: 5rem;}
/* .name_result_page .result_item .tit_box.flex_box .stars{display: flex;}
.name_result_page .result_item .tit_box.flex_box .stars .star svg{display: block; width: 2.2rem; height: 2.2rem;} */

.name_result_page .name_analysis_box .item{margin-top: 1.5rem;}
.name_result_page .name_analysis_box .item .tit{font-size: var(--txt); margin-bottom:0}
.name_result_page .name_analysis_box .item .txt{margin-top: 0.5rem;}

.name_result_page .name_count_box{display: flex; margin-bottom: 1rem ;}
.name_result_page .name_count_box .item{display: flex; align-items: center; flex-wrap: wrap;}
.name_result_page .name_count_box .item + .item{margin-left: 1.5rem;}
.name_result_page .name_count_box .item .num{font-size: var(--tit2); font-weight: 600; margin-right: 0.4rem;}
.name_result_page .name_count_box .item .badge{font-size: var(--txt); width: 2.5rem; height: 2.5rem; line-height: 2.5rem; border-radius: 50%; text-align: center; background-color: #E5DBFF; color: var(--primary);}
.name_result_page .name_count_box .item .badge.yin{background-color: #868686; color: #fff;}

.name_result_page .name_pronun_box{display: flex; align-items: center; flex-wrap: wrap; margin-bottom: 1rem;}
.name_result_page .name_pronun_box .elm_box{margin-right: 0.5rem;}
/* 결과 태그 */
.result_item .result_tag{display: inline-block; font-size: var(--smTxt); font-weight: 600; background-color: var(--bg); padding: 0.3em 0.5em; line-height: 1; border-radius: 0.3rem;}
.result_item .result_tag.win{color: #556ACA; background-color: #fff; border:1px solid #556ACA}
.result_item .result_tag.good{color: #00A272; background-color: #D1F0E7;}
.result_item .result_tag.bad{color: #CA5555; background-color: #FFE4E4;}
/* 작은 태그 */
.sm_tag_box{display: flex; flex-wrap: wrap; gap: 0.25rem;}
.sm_tag_box .tag{font-size: var(--subTxt); color: var(--gray); font-weight: 500; background-color: #fff; border:1px solid #EBEBEB; border-radius: 10rem; padding: 0.3em 0.8em; }

.name_result_page .name_result_box{background-color: var(--bg); border-radius: 2rem; padding: 3rem 2rem; margin-top: 2rem; margin-bottom: 1rem;}
.name_result_page .name_result_box .item + .item{margin-top: 3rem;}
.name_result_page .name_result_box .item .tit_box{display: flex; align-items: center; flex-wrap: wrap; margin-bottom: 1rem;}
.name_result_page .name_result_box .item .tit_box .tit{font-size:var(--tit2); margin-bottom: 0; line-height: 1; margin-right: 0.7rem;}
.name_result_page .name_result_box .item .sm_tag_box{margin-top: 1rem;}

/* 이름_그래프 */
.name_result_page .result_item .chart_box{position: relative; padding-top: 5rem; margin-top: 2rem;}
.name_result_page .result_item .chart_box .legend_wrap{position: absolute; top: 2.5rem; right: 2.5rem; text-align: right; }
.name_result_page .result_item .chart_box .legend_wrap .legend_item{display: inline-flex; align-items: center; font-size: var(--subTxt);}
.name_result_page .result_item .chart_box .legend_wrap .legend_item .legend_dot{display: inline-block; width: 1.4rem; height: 0.6rem; border-radius: 10rem; background-color: #EB158D; margin-right: 0.4rem;}
.name_result_page .result_item .chart_box .legend_wrap .legend_item:nth-child(2) .legend_dot{background-color: #6839DC;}
.name_result_page .result_item .chart_box .legend_wrap .legend_item + .legend_item{margin-left: 1rem;}

.name_result_page .result_item .chart_box + .txt{margin-top: 2rem;}

.name_result_page .result_item .letter_wrap{ font-size: 0;}
.name_result_page .result_item .letter_item{display: inline-flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; font-size: var(--txt); background-color: rgba(229, 219, 255, 1); color:rgba(104, 57, 220, 1); border-radius: 50%;} 
.name_result_page .result_item .letter_item + .letter_item{margin-left: 0.5rem;}
.name_result_page .result_item .letter_tit {display: flex; align-items: center; flex-wrap: wrap;}

/* 이름 뜻 모달 */
.modal_cont.name_mean .modal_body{padding: 4rem 2rem;}
.modal_cont.name_mean .modal_body .list{margin-top: 1rem ;}
/* .modal_cont.name_mean .modal_body .list .item{list-style: auto; } */
.modal_cont.name_mean .modal_body ol.list { counter-reset: item; list-style: none; padding-left: 0;}
.modal_cont.name_mean .modal_body ol.list .item { counter-increment: item; position: relative;}
.modal_cont.name_mean .modal_body ol.list .item::before {content: counter(item) "."; position: relative;  left: 0; margin-right: 0.5rem;}



/* ---------- 고해의숲 ---------- */
.confess_page{background: linear-gradient(0deg, #4B6140 24.29%, #9EB18A 60.86%, #7F6841 102.49%);}

/* 채팅 페이지 */
.confess_chat_page{display: flex; overflow:hidden; background-color: #EBEFF3; height: 100dvh;}
.confess_chat_page .confess_main {display: flex; flex-direction: column; justify-content: space-between; flex: 1; overflow: hidden; min-height: calc(100dvh - var(--headerH) - var(--footerH));}
.confess_chat_page .confess_main .chat_cont {display: flex; flex-direction: column; flex: 1; overflow-y: auto; overflow-x: hidden;}

/* .confess_chat_page .chat_top_date{position: relative; text-align: center;}
.confess_chat_page .chat_top_date:before{content:''; position: absolute; width: 100%; height: 1px; left: 0; top: 50%; background-color: rgba(0, 0, 0, 0.15); z-index: 1;}
.confess_chat_page .chat_top_date .date_txt{position: relative; display: inline-block; padding: 1rem; color: var(--gray); font-weight: 500; line-height: 1; font-size: var(--smTxt); text-align: center; background-color: #EBEFF3; z-index: 2;} */

.confess_chat_page .chat_msg { display: flex; flex-direction: column; gap: 2rem; margin-top: 2rem; padding-bottom: 4rem;}
.confess_chat_page .chat_msg .msg{ display: flex; max-width: 90%; margin-bottom: 0.5rem;}
.confess_chat_page .chat_msg .msg.user_msg { align-self: flex-end; flex-direction: row-reverse;}
.confess_chat_page .chat_msg .msg .msg_cont {flex: 1; max-width: 100%;}

.confess_chat_page .chat_msg .msg .msg_cont .msg_box{display: flex; align-items: flex-end;} /* 시간 표시때문에 box */
.confess_chat_page .chat_msg .msg .msg_cont .msg_box + .msg_box{margin-top: 0.5rem;}

.confess_chat_page .chat_msg .msg .msg_cont .msg_txt {width: 80%; max-width: max-content; background: #fff;padding: 1rem; border-radius: 1rem;font-size: var(--txt); word-wrap: break-word;}
.confess_chat_page .chat_msg .msg .msg_cont .msg_img{height: 12rem;}
.confess_chat_page .chat_msg .msg .msg_cont .msg_img img{height: 100%; object-fit: cover; overflow: hidden; border-radius: 1rem;}

.confess_chat_page .chat_msg .msg .msg_cont .btn_box {display:flex; height:4.2rem; margin-top: 1.5rem;}
.confess_chat_page .chat_msg .msg .msg_cont .btn_box .btn{display:inline-flex; align-items: center; justify-content: center; width: 11rem; background-color: var(--primary); color: #fff; font-size: var(--txt); font-weight: 500; border-radius: 10rem;;}
.confess_chat_page .chat_msg .msg .msg_cont .btn_box .btn + .btn{margin-left: 0.5rem;}
.confess_chat_page .chat_msg .msg .msg_cont .btn_box .btn.end_btn{background-color: transparent; border:1px solid rgba(0, 0, 0, 0.25); color: #000;}

.confess_chat_page .chat_msg .msg .msg_cont .msg_box:last-child .time{opacity: 1;}
.confess_chat_page .chat_msg .msg .msg_cont .time{color: var(--gray); margin: 0 0.5rem; font-size: var(--smTxt); white-space: nowrap;}

.confess_chat_page .chat_msg .msg.user_msg .msg_cont .msg_box{justify-content: flex-end;}
.confess_chat_page .chat_msg .msg.user_msg .msg_cont .msg_box .msg_txt{order: 2;}
/* .confess_chat_page .chat_msg .msg.user_msg .msg_cont .msg_box .msg_txt_box{display: flex; flex-direction: column; align-items: flex-end;} */

/* 종료 시 노출되는 버튼 */
.confess_chat_page .confess_main .chat_cont .end_btn_box{display: flex; height: 5.2rem; gap: 0.5rem; margin-top: 3rem; margin-bottom: 3rem;}
.confess_chat_page .confess_main .chat_cont .end_btn_box .btn{flex: 1; display: flex; align-items: center; justify-content: center; border-radius: 1rem; overflow: hidden; background-color: #000; color: #fff;}
.confess_chat_page .confess_main .chat_cont .end_btn_box .reset_btn{background-color: transparent; border:1px solid rgba(0, 0, 0, 0.25); color: #000;}
.confess_chat_page .confess_main .chat_cont .end_btn_box .btn .ico{margin-left: 0.5rem;}
.confess_chat_page .confess_main .chat_cont .end_btn_box .btn .ico svg{display: block;}

/* AI */ 
.confess_chat_page .chat_msg .msg.ai_msg { align-self: flex-start; flex-direction: row;}
.confess_chat_page .chat_msg .msg .ai_profile {display: flex; align-items: center; justify-content: center; width: 3rem; height: 3rem; border-radius: 50%; overflow: hidden; background: #e8f4f8; margin-right: 1.5rem; flex-shrink: 0;}
.confess_chat_page .chat_msg .msg .msg_cont .msg_name { font-size: var(--smTxt); margin-bottom: 0.5rem;  font-weight: 500;}

/* 사용자 */
.confess_chat_page .chat_msg .msg.user_msg .msg_txt {background: rgba(104, 57, 220, 0.10); border-radius: 1rem}

/* 타이핑 */
.typing_indicator {opacity: 0.8;}
.typing_indicator .typing_ing {display: flex; align-items: center; background: #fff; padding: 1rem; height: 3.5rem; border-radius: 1rem; gap: 8px;}
.typing_indicator .typing_dots { display: flex; gap: 5px;}
.typing_indicator .typing_dots .dot { width: 5px; height: 5px; border-radius: 50%; background: var(--gray); animation: typing 1.4s infinite ease-in-out;}
.typing_indicator .typing_dots .dot:nth-child(1) { animation-delay: -0.32s; }
.typing_indicator .typing_dots .dot:nth-child(2) { animation-delay: -0.16s; }
.typing_indicator .typing_txt { font-size: var(--txt); color: var(--gray);}

@keyframes typing {
    0%, 80%, 100% { transform: scale(0.8); opacity: 0.5; }
    40% { transform: scale(1); opacity: 1; }
}

/* 첫화면 모션 */
.confess_chat_page .chat_msg .welcome_msg .msg_cont .msg_box{display: none;}
.confess_chat_page .chat_msg .welcome_msg .msg_cont .msg_box .time {  opacity: 0;  transition: opacity 0.3s ease; }
.confess_chat_page .chat_msg .welcome_msg .msg_cont .btn_box {opacity: 0;}


/* 하단 입력 영역 */
.confess_chat_page .input_area {display: flex; background: #fff;padding: 1.5rem; gap: 1rem;}
.confess_chat_page .input_area .input_cont {position: relative; width: 100%; display: flex; align-items: center;}

.confess_chat_page .input_area .input_cont .add_btn{width: 3.3rem; height: 3.3rem; border-radius: 50%; background-color: var(--bg); margin-right: 1rem;}

.confess_chat_page .input_area .input_cont .input_box {flex: 1; position: relative;}
.confess_chat_page .input_area .input_cont .input_box textarea{display: flex; font-size: var(--txt); width: 100%; min-height: 4.5rem; max-height: 10rem; padding: 1.5rem 2rem; padding-right: 5rem; border:2px solid var(--bg); border-radius: 10rem; resize: none; background: var(--bg); transition: all 0.2s ease; outline: none; box-sizing: border-box;}
.confess_chat_page .input_area .input_cont .input_box textarea:focus { border: 2px solid #000; background-color: #fff;} /*box-shadow: 0 0 0 3px rgba(66, 133, 244, 0.1);*/

/* @supports (-webkit-touch-callout: none) {
    .confess_chat_page .input_area .input_cont .input_box textarea{ font-size: 16px !important;}
} */

.confess_chat_page .submit_btn{position: absolute; right: 2rem; }
.confess_chat_page .submit_btn svg{display: block; width: auto; height: 1.7em;}





/* ---------- 감정구슬노트 ---------- */
.emotion_page{background: linear-gradient(180deg, #74ABB1 -2.99%, #CCB496 48.2%, #69655D 106.46%);}


.nice-select{font-size: var(--txt); padding-left: 2rem; height: 4rem; line-height: 3.9rem;}
.nice-select .current{line-height: 1; font-weight: 600;}
.nice-select .list{width: 100%; max-height: 22rem; padding: 0.2rem 0 0.8rem; border-radius: 0.5rem; overflow: auto; top: 100%; margin-top: 0; background-color: #1A1A1A; color: rgba(255,2555,255,.5); font-weight: 600;}
.nice-select:after{border:none; width: 0.8rem; height: 0.6rem; margin-top: -0.3rem; right: 2rem; transform-origin: center; -webkit-transform: rotate(0);-ms-transform: rotate(0);transform: rotate(0); background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="8" height="5" viewBox="0 0 8 5" fill="none"><path d="M3.38478 4.78233C3.58477 5.02481 3.95624 5.02481 4.15623 4.78233L7.42584 0.818142C7.69482 0.492023 7.46285 0 7.04012 0H0.500901C0.0781664 0 -0.153806 0.492022 0.115173 0.818142L3.38478 4.78233Z" fill="%23020202"/></svg>') no-repeat center / contain;}
.nice-select.open:after {-webkit-transform: rotate(-180deg);-ms-transform: rotate(-180deg);transform: rotate(-180deg);}
.nice-select .option{padding: 1.2rem 1.5rem; line-height: 1;}
.nice-select .option:hover,
.nice-select .option.focus, 
.nice-select .option.selected.focus{background-color: transparent; color: rgba(255,255,255,1);}
.nice-select.open,
.nice-select:focus{border-color:#000}
.write_form .nice-select .list{border-radius: 1rem;}

.emotion_cal_page .cal_sect{background-color: var(--bg); padding: 4rem 0 2.4rem;}

.emotion_cal_page .cal_header { display: flex; gap: 0.8rem; }
.emotion_cal_page .cal_header .select_box{flex:1;}
.emotion_cal_page .cal_header .select_box .nice-select{font-size: var(--tit2);}

.emotion_cal_page .cal_body{margin-top: 3rem;}
.emotion_cal_page .cal_body .week_row{display: grid; grid-template-columns: repeat(7, 1fr); font-size: var(--txt); text-align: center;}

.emotion_cal_page .cal_sect .date_grid {display: grid; grid-template-columns: repeat(7, 1fr); width: 100%; margin-top: 2rem;}
.emotion_cal_page .cal_sect .date_grid .day{display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 7.2rem; font-size:var(--smTxt); color: var(--gray);}
.emotion_cal_page .cal_sect .date_grid .day .num{margin-top: 0.5rem;}

.emotion_cal_page .cal_sect .cal_body .ball_box { display: block; width: 3.5rem;height: 3.5rem;border-radius: 50%; background-color: #fff; background-size: cover; background-position: center;}

.ball_black  { background-image: url('../img/sub/emotion/ball_black.png'); }
.ball_blue   { background-image: url('../img/sub/emotion/ball_blue.png'); }
.ball_brown  { background-image: url('../img/sub/emotion/ball_brown.png'); }
.ball_green  { background-image: url('../img/sub/emotion/ball_green.png'); }
.ball_orange { background-image: url('../img/sub/emotion/ball_orange.png'); }
.ball_pink   { background-image: url('../img/sub/emotion/ball_pink.png'); }
.ball_purple { background-image: url('../img/sub/emotion/ball_purple.png'); }
.ball_red    { background-image: url('../img/sub/emotion/ball_red.png'); }
.ball_white  { background-image: url('../img/sub/emotion/ball_white.png'); }
.ball_yellow { background-image: url('../img/sub/emotion/ball_yellow.png'); }

.emotion_cal_page .cal_sect .cal_body .ball_box.add{display: flex; align-items: center; justify-content: center; border: 1px solid var(--line);}
.emotion_cal_page .cal_sect .cal_body .ball_box.add:before{content:''; display: block; width: 100%; height: 100%; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none"><path d="M0.75 6.75H12.75M6.75 0.75V12.75" stroke="%23787878" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat 52% 52% / 50%;}

.emotion_cal_page .cal_sect .date_grid .day .num{position: relative;}
.emotion_cal_page .cal_sect .date_grid .day.today .num:before{content:''; position: absolute; right: -0.8rem; width: 0.5rem; height: 0.5rem; border-radius: 100%; background-color: var(--secondary);}
.emotion_cal_page .cal_sect .date_grid .day.empty{pointer-events: none;}

.emotion_cal_page .summary_sect{padding: 4rem 0 5rem; text-align: center;}
.emotion_cal_page .summary_sect .cont .txt{font-size: var(--txt); margin-top: 1rem;}
.emotion_cal_page .summary_sect .btn_box{margin-top: 3rem;}
.soul_profile{position: relative; display: flex; justify-content: center; align-items: flex-end; width: 4.8rem; height: 4.8rem; margin: 0 auto; border-radius: 1.5rem; overflow: hidden; background: linear-gradient(180deg, #C1C1F3 0%, #AF6BC3 100%);}
.soul_profile img{width: 80%;}

.modal_cont.emotion_summary .com_result_cont{padding-top: 4rem;}
.modal_cont.emotion_summary .com_result_cont .result_item.sub_item{padding-top: 0;}  


/* 감정구슬_구슬선택 */
.emotion_input_page {}
.emotion_input_page .emotion_ball_form{margin-top: 4rem;}
.emotion_input_page .emotion_ball_form .ball_list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.2rem;}
.emotion_input_page .emotion_ball_form .ball_list .ball_item { display: block;width: 100%;}

.emotion_input_page .emotion_ball_form .ball_list .ball_item input { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none;}
.emotion_input_page .emotion_ball_form .ball_list .ball_item .inner {  display: flex; align-items: center; justify-content: space-between; cursor: pointer; border: 1px solid var(--line); background: #fff; border-radius: 1rem; padding: 1.2rem 2rem;transition: border .25s ease;}
.emotion_input_page .emotion_ball_form .ball_list .ball_item .inner:focus-visible { outline: 2px solid #000; outline-offset: 2px; }
.emotion_input_page .emotion_ball_form .ball_list .ball_item input:checked + .inner { border-color: var(--primary);} /* box-shadow: 0 0 0 2px rgba(104,57,220,0.15);*/

.emotion_input_page .emotion_ball_form .ball_list .ball_item .inner .txt { font-size: var(--txt); color: var(--gray);}
.emotion_input_page .emotion_ball_form .ball_list .ball_item input:checked + .inner .txt {color: var(--primary);font-weight: 600;}

.emotion_input_page .emotion_ball_form .ball_list .ball_item .ball {width: 3.5rem;height: 3.5rem;background-size: cover;background-position: center;}


/* 감정구슬_내용선택 */
.page[class*="emotion_"] .field_tit {display: block; font-size: var(--txt); font-weight: 700; margin-bottom: 1rem; cursor: text; }
.page[class*="emotion_"] legend.field_tit { overflow: unset; position: unset; width: auto; height: auto; margin: 0 0 1rem 0;}

.emotion_input_page .situation_group { margin-bottom: 2.4rem; margin-top: 4rem;}
.emotion_input_page .chip_list { display: flex; flex-wrap: wrap; gap: 0.8rem; }
.emotion_input_page .chip_list .chip_item { display: inline-flex; position: relative; border: none; padding: 0; background: none; font-size: var(--txt);}
.emotion_input_page .chip_list .chip_item input { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none; }

.emotion_input_page .chip_list .chip_item .chip_inner { display: inline-flex; align-items: center; justify-content: center; height: 4rem; padding:0 2rem; border-radius: 999px; border: 1px solid #E1E3E6; background: #fff; font-size: 1.35rem; color: #555; cursor: pointer; transition: all 0.2s ease; }
.emotion_input_page .chip_list .chip_item input:checked + .chip_inner{ border-color: var(--primary); color: var(--primary); font-weight: 700; }
.emotion_input_page .chip_list .chip_item input:checked + .chip_inner:hover{background-color: #fff;}

.emotion_input_page .chip_list .chip_item.add_btn .chip_inner {min-width: 0; width:4rem; height: 4rem; font-size: 1.6rem; font-weight: 600; background: #fff; padding: 0; }

.emotion_input_page .textarea_box { position: relative; border-radius: 1rem; background: var(--bg); padding: 1.5rem 1.5rem 3.2rem 1.5rem; }
.emotion_input_page .textarea_box textarea { width: 100%; border: none; resize: none; height: 15rem; font-size: 1.4rem; line-height: 1.5; background: transparent; outline: none; }
.emotion_input_page .textarea_box .counter_box { position: absolute; right: 1.5rem; bottom: 1.5rem; font-size: var(--subTxt); color: var(--gray); }
.emotion_input_page .textarea_box .counter_box .current { color: #000; font-weight: 600;}

.emotion_input_page .summary_group .textarea_box{height: 7rem;}

.emotion_input_page .tag_group .tag_input_box { display: flex; align-items: center; flex-wrap: wrap; border-radius: 1rem; border: 1px solid var(--line); height: var(--inpH); padding: 0 2rem; background: #fff; }
.emotion_input_page .tag_group .tag_input_box .tag_input {width: 100%; }
.emotion_input_page .tag_group .tag_input_box .tag_input::placeholder { color: var(--gray); }

.emotion_input_page .ai_reply_opt { margin-top: 1rem; }
.emotion_input_page .ai_reply_opt .ai_reply_label { display: inline-flex; align-items: center; gap: 0.8rem; font-size: 1.3rem; color: var(--gray); font-weight: 500; cursor: pointer; }
.emotion_input_page .ai_reply_opt .ai_reply_label input { position: absolute; opacity: 0; width: 0; height: 0; }
.emotion_input_page .ai_reply_opt .ai_reply_label .ico svg{display: block; height: 1.4em;}
.emotion_input_page .ai_reply_opt .ai_reply_label .ico svg path{ opacity: 0.15; }
.emotion_input_page .ai_reply_opt .ai_reply_label input:checked + .ico svg path{ opacity: 1; fill: #6839DC; }
.emotion_input_page .ai_reply_opt .ai_reply_label .txt { font-size: var(--subTxt); color: var(--gray); }


/* 감정구슬_등록내용 */
.emotion_note_page .note_sect .note_header{display: flex; align-items: center;}
.emotion_note_page .note_sect .note_header .ball_box{width: 5.7rem; height: 5.7rem; margin-right: 1rem; flex-shrink: 0; background-size: cover; background-position: center;}
.emotion_note_page .note_sect .note_header .date_box{font-size: var(--txt);}
.emotion_note_page .note_sect .note_header .date{background-color: #000; padding: 0 1rem; border-radius: 10rem; color: #fff; display: inline-block; margin-bottom: 0.5rem;}
.emotion_note_page .note_sect .note_cont{background-color: var(--bg); padding: 2rem; border-radius: 1rem; margin-top: 1.5rem;} 

.emotion_note_page .tag_sect{padding-top: 4rem;}

.emotion_note_page .reply_sect{padding-top: 4rem; padding-bottom: 5rem;}
.emotion_note_page .reply_sect .reply_box{display: flex; flex-direction: column; align-items: center; background-color: var(--bg); padding: 2rem 1.5rem; border-radius: 1rem; font-size: var(--txt);}
.emotion_note_page .reply_sect .reply_box.reply_waiting{color: var(--gray);}
.emotion_note_page .reply_sect .reply_box .soul_box{padding-top: 3rem; text-align: center;}
.emotion_note_page .reply_sect .reply_box .soul_box .soul_profile{margin-bottom: 1rem;}

.emotion_note_page .reply_sect .reply_box .cta_box{display: flex; align-items: center; font-size: var(--subTxt); margin-top: 4rem;}
.emotion_note_page .reply_sect .reply_box .cta_box .btn{color: #000; background-color: #fff; padding: 0.2em 0.8em; border-radius: 10rem; margin-left: 1rem;}


/* ---------- 1회무료운세 ---------- */
.free_result_page .free_result_cont .result_card{position: relative; width: 26rem; height: 40rem; max-width: 100%; margin: 5rem auto 0; color: #fff; text-align: center; }

.free_result_page .free_result_cont .result_card .card_box{position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 100%; padding-bottom: 5rem; border-radius: 1.4rem; overflow: hidden;}
.free_result_page .free_result_cont .result_card .card_box .desc{font-size: var(--subTxt); font-weight: 500;}
.free_result_page .free_result_cont .result_card .card_box .tit{font-size: var(--tit); font-weight: 700; margin-top: 1.5rem; max-width: 78%;}
.free_result_page .free_result_cont .result_card .card_box .btn{position: absolute; bottom: 5rem; font-size: var(--subTxt); padding: 0.6em 1em; background-color: rgba(77, 37, 175, 0.40); color: #fff; border-radius: 10rem; font-weight: 500; }

/* 1회무료운세_결과_사주 */
.free_result_page .free_result_cont .result_card.saju_result_card .card_box{background:url(../img/sub/saju_result_card_bg.svg) no-repeat center / cover;}

/* 1회무료운세_결과_타로 */
.free_result_page .free_result_cont .result_card.tarot_result_card > div{ position: absolute; width: 100%; height: 100%; border-radius: 0.5rem; left: 0; top: 0; object-fit: cover; backface-visibility: hidden; border-radius: 1.4rem; overflow: hidden; transition: transform 1s cubic-bezier(.46, .03, .52, .96);}
.free_result_page .free_result_cont .result_card.tarot_result_card .card_front_wrap{border:1px solid var(--line);}
.free_result_page .free_result_cont .result_card.tarot_result_card .card_front_wrap .card_front{width: 100%; height: 100%; object-fit: cover;}
.free_result_page .free_result_cont .result_card.tarot_result_card .card_box{background:url(../img/sub/tarot_result_card_bg.svg) no-repeat center / cover;}
/* .free_result_page .free_result_cont .result_card.tarot_result_card .card_box{background: conic-gradient(from 40deg at -35.83% 27.75%, #4D25AF 11.84178113937378deg, #7F5AC2 105.8214282989502deg);} */
/* .free_result_page .free_result_cont .result_card.tarot_result_card .card_box:before{content:''; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: url(../img/sub/tarot_result_frame.svg) no-repeat center / 90%;} */
.free_result_page .free_result_cont .result_card .card_front_wrap { transform: rotateY(0deg); }
.free_result_page .free_result_cont .result_card .card_front_wrap .reverse{ transform: rotate(180deg); }
.free_result_page .free_result_cont .result_card .card_back_wrap { transform: rotateY(-180deg); }

.free_result_page .free_result_cont .result_card.active .card_front_wrap { transform: rotateY(180deg); }
.free_result_page .free_result_cont .result_card.active .card_back_wrap { transform: rotateY(0deg); }

.free_result_page .com_result_cont .result_item .tit_box.with_profile{display: flex;}
.free_result_page .com_result_cont .result_item .tit_box.with_profile .profile_img{margin: -0.2em 1rem 0 0;}



/* ---------- 소울코드리포트 ---------- */
.report_page .com_result_cont .result_item .result_tit{margin-bottom: 2rem;}

.report_page .item.with_tit{position: relative; margin-top: 4rem;}
.report_page .swiper-slide > .tit{position: absolute; top: -4rem; left: 0;}

.report_page .result_item .space_list .item + .item{margin-top: 1rem;}
.report_page .result_item .space_list .item a{display: flex; align-items: center; background-color: var(--bg); border-radius: 1rem; padding: 1.5rem;}
.report_page .result_item .space_list .item a .img_box{position: relative; flex-shrink: 0; width: 20%; padding-top: 20%; margin-right: 1rem; border-radius: 1rem; overflow: hidden;}
.report_page .result_item .space_list .item a .img_box img{position: absolute; width: 100%; height: 100%; top: 0; left: 0; object-fit: cover;}
.report_page .result_item .space_list .item a .txt_box .tit{font-size: var(--txt); font-weight: 600; margin-bottom: 0;}
.report_page .result_item .space_list .item a .txt_box .txt{margin-top: 0.2rem; line-height: 1.5;}

.report_page .result_item .cheer_card{position: relative; margin-top: 2rem;}
.report_page .result_item .cheer_card .bg{position: relative; padding-top: 69%; border-radius: 2rem; overflow: hidden;}
.report_page .result_item .cheer_card .bg img{position: absolute; width: 100%; height: 100%; top:0; left: 0; object-fit: cover;}
.report_page .result_item .cheer_card .txt{position: absolute;  font-size: var(--tit); font-weight: 700;  line-height: 1.4; top: 0; left: 0; color: #000; padding: 2.5rem; z-index: 2;}
.report_page .result_item .cheer_card .txt.green{color: #1F6030;}
.report_page .result_item .cheer_card .txt.blue{color: #2D445A;}
.report_page .result_item .cheer_card .txt.blueGray{color: #4F6274;} 
.report_page .result_item .cheer_card .txt.white{color: #fff;}
.report_page .result_item .cheer_card .txt.pink{color: #A05292;}



/* ---------- 커뮤니티 ---------- */
.cummu_page .in > .tit{font-size: var(--tit); font-weight: 700;}

.toggle_btn { display: inline-flex; align-items: center; gap: 0.5rem; font-size: var(--subTxt); }
.toggle_btn .toggle_label { color: var(--gray); font-weight: 500; }
.toggle_btn .toggle_box { position: relative; display: inline-flex; align-items: center; cursor: pointer; }
.toggle_btn .toggle_box .toggle_input { position: absolute; opacity: 0; width: 0; height: 0; }
.toggle_btn .toggle_box .toggle_slider { position: relative; width: 4rem; height: 2rem; border-radius: 999px; background-color: #e5e5e5; transition: background-color 0.2s ease; }
.toggle_btn .toggle_box .toggle_slider::before { content: ""; position: absolute; top: 50%; left: 0.1rem; width: 1.8rem; height: 1.8rem; border-radius: 50%; background-color: #ffffff; border: 1px solid #e5e5e5; transform: translateY(-50%); transition: transform 0.2s ease, border-color 0.2s ease; box-sizing: border-box; }
.toggle_btn .toggle_box .toggle_input:checked + .toggle_slider { background-color: #6c3bf7; }
.toggle_btn .toggle_box .toggle_input:checked + .toggle_slider::before { transform: translate(2rem, -50%); border-color: #6c3bf7; }

.cummu_page .my_sect{padding-top: 2rem;}
.cummu_page .my_sect .tit_box{display: flex; justify-content: space-between; align-items: center;}
.cummu_page .my_sect .slide{margin-top: 2rem;}
.cummu_page .my_sect .slide .item{width: 8.4rem;}
.cummu_page .my_sect .slide .item .img{position: relative; padding-top: 100%; border-radius: 2rem; overflow: hidden;}
.cummu_page .my_sect .slide .item .img img{position: absolute; width: 100%; height: 100%; left: 0; top: 0;}
.cummu_page .my_sect .slide .item .txt{color: var(--gray); font-size: var(--subTxt); font-weight: 500; text-align: center; margin-top: 1rem;}
.cummu_page .my_sect .slide{position: relative; width: calc(100% + var(--inPd) * 2); margin-left: calc(var(--inPd) * -1);}
.cummu_page .my_sect .slide .swiper-container{padding: 0 var(--inPd);}


.cummu_page .recom_sect{padding-top: var(--secPd);}

/* 커뮤니티_POST TYPE 1 */
.cummu_page .post_list{margin-top: 2rem;}
.cummu_page .post_list .item a{display: flex; background-color: var(--bg); border-radius: 1rem; padding: 1.5rem 1rem;}
.cummu_page .post_list .item + .item{margin-top: 1rem;}
.cummu_page .post_list .item .img_box{ position: relative; flex-shrink: 0; width: 25%; padding-top: 25%; border-radius: 1rem; margin-right: 1rem; overflow: hidden;}
.cummu_page .post_list .item .img_box img{position: absolute; width: 100%; height: 100%; left: 0; top: 0; object-fit: cover;}
.cummu_page .post_list .item .txt_box{display: flex; flex-direction: column; padding: 0.5rem 0 0;}
.cummu_page .post_list .item .txt_box .tit{font-size: var(--txt); font-weight: 600;  display: -webkit-box;-webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis;}
.cummu_page .post_list .item .txt_box .txt{font-size: var(--subTxt); color: var(--gray); font-weight: 500; margin-top: 0.2em; display: -webkit-box;-webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis;}
.cummu_page .post_list .item .txt_box .status_box{font-size: var(--smTxt); color: #6839DC; max-width: max-content; background-color: #fff; border-radius: 3px; padding: 0.3em 0.5em; margin-top: auto;}
/* 펼치기 */
.cummu_page .post_list.with_toggle:not(.open) .item:nth-child(n+4) { display: none; }
.com_post_toggle {display: flex; align-items: center; justify-content: center; width: 100%; margin-top: 1rem; font-size:var(--subTxt); color: var(--gray); padding: 0 1.6rem; height:3.5rem; border: 1px solid #ddd; border-radius: 0.8rem; background-color: #fff; line-height: 1; cursor: pointer; }
.com_post_toggle .ico { display: inline-block; margin-left: 0.6rem; transition: transform 0.25s ease; }
.com_post_toggle .ico svg{display: block;}
.open + .com_post_toggle .ico { transform: rotate(180deg); }


.cummu_page .custom_sect{padding-top: var(--secPd);}
.cummu_page .post_vertial_list{margin-top: 2rem;}
.cummu_page .post_vertial_list .item + .item{margin-top: 3rem;}

/* 커뮤니티_POST TYPE 2 */
.cummu_page .post_vertial_list .top_area{display: flex; justify-content: space-between; align-items: flex-start;}
.cummu_page .post_vertial_list .top_area .user_box{display: flex; align-items: center;}
.cummu_page .post_vertial_list .top_area .user_box .profile{position: relative; display: flex; justify-content: center; width: 3.7rem; height: 3.7rem; margin-right: 0.6rem; background-color: #D9D8DB; border-radius: 50%; overflow: hidden;}
.cummu_page .post_vertial_list .top_area .user_box .profile img{position: absolute; left: 50%; transform: translateX(-50%); width: 200%; max-width: inherit;}
.cummu_page .post_vertial_list .top_area .user_box .name{font-size: var(--subTxt); font-weight: 600;}
.cummu_page .post_vertial_list .top_area .user_box .date{font-size: var(--smTxt); font-weight: 500; color: var(--gray);}

.cummu_page .post_vertial_list .top_area .status_box{display: flex;}
.cummu_page .post_vertial_list .top_area .status_box > div{display: flex; align-items: center;}
.cummu_page .post_vertial_list .top_area .status_box > div .ico{margin-right: 0.35rem;}
.cummu_page .post_vertial_list .top_area .status_box > div .ico svg{display: block; }
.cummu_page .post_vertial_list .top_area .status_box > div + div{margin-left: 1rem;}

.cummu_page .post_vertial_list .btm_area{margin-top: 1rem;}
.cummu_page .post_vertial_list .btm_area .txt_box .tit{font-size: var(--txt); font-weight: 600; display: -webkit-box;-webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis;}
.cummu_page .post_vertial_list .btm_area .txt_box .txt{font-size:var(--subTxt); font-weight: 500; margin-top: 0.2em; color: var(--gray); display: -webkit-box;-webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis;}

.cummu_page .post_vertial_list .btm_area .img_box{position: relative; padding-top: 56%; border-radius: 2rem; overflow: hidden; margin-top: 1rem;}
.cummu_page .post_vertial_list .btm_area .img_box img{position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover;}

.round_tab_wrap .round_tab{display: flex;}
.round_tab_wrap .round_tab .tab{background-color: var(--bg); border-radius: 10rem; color: var(--gray); padding: 0.5em 1em; flex-shrink: 0;}
.round_tab_wrap .round_tab .tab + .tab{margin-left: 0.5rem;}
.round_tab_wrap .round_tab .tab.active{background-color: var(--primary); color: #fff;}
.round_tab_wrap { position: relative; width: calc(100% + var(--inPd) * 2); margin-left: calc(var(--inPd) * -1);}
.round_tab_wrap .round_tab {padding: 0 var(--inPd);}

.cummu_page .hot_sect{padding-top: var(--secPd); padding-bottom: 4rem;}
.cummu_page .hot_sect .round_tab_wrap{margin-top: 2rem;}
.cummu_page .hot_sect .post_list .item .txt_box .member_box{font-size: var(--smTxt); max-width: max-content; background-color: #fff; border-radius: 3px; padding: 0.3em 0.5em; margin-top: auto;}
.cummu_page .hot_sect .post_list .item .txt_box .member_box .num{color: #6839DC; padding-left: 0.3em;}

.cummu_page .hot_sect .slide{width: calc(100% + var(--inPd) * 2); margin-left: calc(var(--inPd) * -1);}
.cummu_page .hot_sect .slide .swiper-container{padding: 0 var(--inPd);}
.cummu_page .hot_sect .slide .paging{display: flex; justify-content: center; margin-top: 1.5rem;}
.cummu_page .hot_sect .slide .paging .swiper-pagination-bullet + .swiper-pagination-bullet{margin-left: 10px;}
.cummu_page .hot_sect .slide .paging .swiper-pagination-bullet{width: 7px; height: 7px;}
.cummu_page .hot_sect .slide .paging .swiper-pagination-bullet-active{background-color: #000;}


/* 커뮤니티_특정커뮤니티 */
.cummu_group_page .com_tab_wrap .tab{flex: 1;}
.cummu_group_page .tab_cont{padding-top: 2rem;}

.cummu_group_page .notice_board .item a{display: flex; align-items: center; padding: 1.2rem 0; border-bottom: 1px solid var(--line);}
.cummu_group_page .notice_board .item .tag{font-size:var(--subTxt); flex-shrink: 0; color: #6839DC; background-color: rgba(104, 57, 220, 0.10); padding: 0.2em 0.9em; margin-right: 1rem; border-radius: 0.3rem; font-weight: 500; text-align: center;}
.cummu_group_page .notice_board .item .txt{font-size: var(--txt); font-weight: 600; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; text-overflow: ellipsis;}

.cummu_group_page .hot_sect{margin-top: 3rem;}
.cummu_group_page .hot_sect .in > .tit{margin-bottom: 2rem;}
.cummu_group_page .hot_sect .post_thum_list.with_toggle:not(.open) .item:nth-child(n+5) { display: none; }
.cummu_group_page .list_sect{padding-bottom: 5rem;}

/* 커뮤니티_POST TYPE 3 */
.post_thum_list{display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.5rem 1rem;}
.post_thum_list .item .img_box{position: relative; padding-top: 60%; border-radius: 1rem; overflow: hidden;}
.post_thum_list .item .img_box img{position: absolute; width: 100%; height: 100%; left: 0; top: 0; object-fit: cover;}
.post_thum_list .item .txt_box {margin-top: 1rem;}
.post_thum_list .item .txt_box .tit{font-size: var(--txt); font-weight: 400; margin-bottom: 0.5rem;}
.post_thum_list .item .txt_box .user_box{display: flex; align-items: center;}
.post_thum_list .item .txt_box .user_box .profile{position: relative; width:2rem; height: 2rem; background-color: #D7D7D9; margin-right: 0.5rem; border-radius: 50%; overflow: hidden;}
.post_thum_list .item .txt_box .user_box .profile img{position: absolute; left: 50%; transform: translateX(-50%); width: 190%; max-width: inherit; }
.post_thum_list .item .txt_box .user_box .name{font-size: var(--subTxt); font-weight: 500; color: var(--gray);}
.post_thum_list + .com_post_toggle{margin-top: 2rem;}

/* 커뮤니티_POST TYPE 4 */
.post_horizontal_list .item + .item{border-top: 1px solid var(--line);}
.post_horizontal_list .item a{display: flex; justify-content: space-between; align-items: center; padding: 1.5rem 0;}
.post_horizontal_list .item .tit{font-size: var(--txt); font-weight: 600;}
.post_horizontal_list .item .img_box{position: relative; width: 20%; padding-top: 20%; flex-shrink: 0; margin-left: 1.5rem;}
.post_horizontal_list .item .img_box img{position: absolute; width: 100%; height: 100%; top: 0; left: 0; object-fit: cover; border-radius: 1rem;}
.post_horizontal_list .item .status_box{display: flex; color: var(--gray); font-weight: 500; font-size: var(--subTxt); margin-top: 0.5rem;}
.post_horizontal_list .item .status_box > * + *{margin-left: 0.8rem;}
.post_horizontal_list .item .status_box .comment{display: flex; align-items: center;}
.post_horizontal_list .item .status_box .comment .ico svg{display: block;}
.post_horizontal_list .item .status_box .comment .ico{margin-right: 0.2em;}

/* 광고배너 */
.ad_banner a{display: flex;}
.ad_banner a .txt_box{padding-top: 2rem; padding-bottom: 3.5rem;}



/* ---------- 콘텐츠상세 ---------- */
/* .content_view_page{padding-bottom: 5rem;} */

.content_view_page .view_top,
.content_view_page .view_top .img,
.content_view_page .view_top .img img{width: 100%;}

.content_view_page .view_cont .tit_box{margin: 2rem 0;}
.content_view_page .view_cont .tit_box .tit{font-size: var(--tit); font-weight: 700;}
.content_view_page .view_cont .tit_box .txt{color: var(--gray); margin-top: 0.2rem;} 
.content_view_page .view_cont .tit_box .date{color: var(--gray); font-size: var(--txt); margin-top: 0.8rem;}

.content_view_page .view_cont .cont{border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 3rem 0;}
/* .content_view_page .view_cont .cont .txt_box p + p{margin-top: 1rem;} */
.content_view_page .view_cont .cont .txt_box b {display: block; margin-bottom: 2rem;}

.content_view_page .view_cont .cont .view_btn_wrap{display: flex; justify-content: space-between; margin-top: 5rem;}

.content_view_page .view_cont .cont .view_btn_wrap .view{display: flex; align-items: center; font-size: var(--txt); color: var(--gray); font-weight: 500;}
.content_view_page .view_cont .cont .view_btn_wrap .view .ico{display: block; margin-right: 0.5rem;}
.content_view_page .view_cont .cont .view_btn_wrap .view .ico svg{display: block; width: auto; height: 1.4em;}

.content_view_page .view_cont .cont .view_btn_box{display: flex; align-items: center; justify-content: flex-end;}
.content_view_page .view_cont .cont .view_btn_box .btn {font-size: var(--txt); color: var(--gray); font-weight: 500;}
.content_view_page .view_cont .cont .view_btn_box .btn + .btn{margin-left: 1.5rem;}
.content_view_page .view_cont .cont .view_btn_box .btn .ico svg{display: block; width: auto; height: 1.4em;}
.content_view_page .view_cont .cont .view_btn_box .heart_btn{display: inline-flex; align-items: center;}
.content_view_page .view_cont .cont .view_btn_box .heart_btn .num{margin-left: 0.5rem; min-width: 1em;}
.content_view_page .view_cont .cont .view_btn_box .heart_btn.liked .ico svg path { stroke: #EB158D; }

.content_view_page .btm_btn_box{margin-top: 5rem; padding-bottom: 5rem;}
.content_view_page .btm_btn_box .list_btn{display: flex; align-items: center; justify-content: center; margin: 0 auto; max-width: max-content; height: 5.5rem; padding: 1rem 4rem; font-size:var(--txt); font-weight: 500; background-color:#fff; border:1px solid var(--line); border-radius: 1rem;}



/* 문의 결과 */
.inquiry_view_page .view_cont .cont{border-bottom: none; padding-bottom: 6rem;}
.inquiry_view_page .view_answer .answer_box{background-color: var(--bg); border-radius: 1rem; padding: 3rem 1.5rem;}
.inquiry_view_page .view_answer .answer_box .top_area .tit{font-size: var(--subTit); font-weight: 700;}
.inquiry_view_page .view_answer .answer_box .top_area .date{color: var(--gray); font-size: var(--txt); margin-top: 0.5rem;}
.inquiry_view_page .view_answer .answer_box .top_area {border-bottom: 1px solid var(--line); padding-bottom: 2rem; margin-bottom: 3rem;}

.inquiry_view_page .view_answer .answer_ing_box{display: flex; flex-direction: column; justify-content: center; align-items: center; background-color: var(--bg); border-radius: 1rem; padding: 5rem 1.5rem;}
.inquiry_view_page .view_answer .answer_ing_box .txt{font-weight: 700; font-size: var(--subTit); margin-top: 0.5rem; color: #B4B4B4;}


/* ---------- 콘텐츠결과 ---------- */
.content_result_page .content_tit{font-size: var(--tit); font-weight: 700; margin-bottom: 5rem; }
.content_result_page .result_item .content_color_tit{font-size: var(--tit2); color: var(--primary); font-weight: 600;}
.content_result_page .result_item .txt_box + .txt_box{margin-top: 5rem;}
.content_result_page .result_item .content_color_tit + .txt_box{margin-top: 1rem;}
.content_result_page .result_item .content_tit + .content_color_tit{margin-top: 5rem;}
.content_result_page .result_item .txt_box .tit{font-size: var(--tit2); font-weight: 600;}

.dot_list li{position: relative; padding-left: 0.5em;}
.dot_list li:before{content:'·'; position: absolute; left: 0;}

.content_result_page .cta_sect{margin-top: 5rem; padding-top: 5rem; border-top: 10px solid rgba(0, 0, 0, 0.05);}
.content_result_page .cta_sect .cont + .cont{padding-top: 5rem;}
.content_result_page .cta_sect .cont > .tit{font-size: var(--tit); font-weight: 700; margin-bottom: 2rem;}
.content_result_page .cta_sect .more_cont > .tit{margin-bottom: 1rem;}

.content_result_page .result_item .result_birth{font-size: var(--tit2); font-weight: 700; margin-bottom: 1rem;}
.content_result_page .result_item .color_txt{color: var(--primary);}

.content_result_page .tarot_result_top .txt_box .txt{margin-top: 0.5rem;}




/* ---------- 기획전 ---------- */
.exhibit_page{padding-top: 0;}
.exhibit_page .exhibit_top{position: relative;}
/* .exhibit_page .top_cont .bg{position: relative; padding-top: 200%;} */
.exhibit_page .exhibit_top .txt_box{color: #fff; position: absolute; width: 100%; bottom: 0; text-align: center; padding:5.5vh var(--inPd);}
.exhibit_page .exhibit_top .txt_box .txt{font-size: var(--txt); font-weight: 500; line-height: 1.5;}
.exhibit_page .exhibit_top .txt_box .txt + .txt{margin-top: 1rem;}

.exhibit_page .exhibit_cont{padding-top: 4rem; padding-bottom: 7.5rem;}
.exhibit_page .exhibit_cont .com_tab_box .tab{ flex:1; font-size: var(--subTit);}

.exhibit_page .exhibit_cont .fortune_sect{margin-top: 1.5rem;}
/* .exhibit_page .exhibit_cont .com_thum_board{padding-top: 2rem;} */


/* ---------- 이벤트 ---------- */
.land_event_page .view_top .img{width: 100%;}
.land_event_page .view_top .img img{width: 100%;}
.land_event_page .event_notice{background-color: #414141; color: #8a8a8a; padding: 2rem 0 2.5rem;}
.land_event_page .event_notice .tit{font-size: var(--tit2); font-weight: 700;}
.land_event_page .event_notice .notice_list{margin-top: 0.5rem;}
.land_event_page .event_notice .notice_list .item{position: relative; color: #8a8a8a; font-size: var(--subTxt); padding-left: 0.8em;}
.land_event_page .event_notice .notice_list .item + .item{margin-top: 0.2rem;}
.land_event_page .event_notice .notice_list .item:before{content: '-'; position: absolute; left: 0;}

.event_banner + *{margin-top: 4rem;}
.event_banner a{position: relative; display: block; border-radius: 1rem; overflow: hidden;}
.event_banner a .bg{position: relative; padding-top: 51%;}
.event_banner a .bg img{position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: right bottom;}
.event_banner a .txt_box{position: absolute; top: 0; left: 0; padding: 2.5rem 2.5rem 6rem; z-index: 2;}
.event_banner a .txt_box .desc{color: #C7B1FF; font-size: var(--smTxt); font-weight: 500; margin-bottom: 0.5rem;}
.event_banner a .txt_box .tit{color: #fff; font-size: var(--tit2); font-weight: 600;}


/* ---------- 모든운세 (띠운세, 별자리운세) ---------- */
.zodiac_result_page,
.horoscope_result_page{padding-top: 0;}

/* .pack_result_top {justify-content: flex-start;} */
.pack_result_top .pack_result_label{display: inline-block; font-size: var(--subTxt); padding: 0.5em 0.8em; margin-top: 0.7rem; line-height: 1; border-radius: 0.5rem; color: #fff; background-color: rgba(0, 0, 0, 0.80);}
.pack_result_top .txt_box{ margin-right: 45%; z-index: 2; padding-left: 0;}
.pack_result_top .bg{position: absolute; width: 100%; height: 100%; bottom: 0; left: 0; z-index: 1;}
.pack_result_top .bg img{width: 100%; height: 100%; object-fit: cover; object-position: 50% 80%;}

.horoscope_result_page .result_item .txt_box .date{display: inline-block; font-size:var(--subTxt); color: #9C72C6; font-weight: 600; background-color: var(--bg); border-radius: 0.5rem; padding: 0.3em 0.8em; margin-bottom: 1rem; white-space: nowrap;}

.related_cont{padding-top: 5rem;}
.related_cont .related_slide{position: relative; width: calc(100% + var(--inPd) * 2); margin-left: calc(var(--inPd) * -1); margin-top: 1rem;}
.related_cont .related_slide .swiper-container{padding: 0 var(--inPd);}
.related_cont .related_slide .item{width: 7.5rem; }
.related_cont .related_slide .item a{display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; padding-top: 1rem;} 
.related_cont .related_slide .img{width: 7.5rem; height: 7.5rem; border-radius: 50%; overflow: hidden;}
.related_cont .related_slide .img img{width: 100%; height: 100%; object-fit: cover;}
.related_cont .related_slide .txt{margin-top: 1rem; font-weight: 500; font-size: var(--subTxt);}




/* ---------- 정책 ---------- */
.terms_page {margin-top: 2rem; margin-bottom: 5rem;}
.terms_cont .txt_box{margin-top: 5rem;}
.terms_cont h1{font-size: var(--tit);}
.terms_cont h2{font-size: var(--tit2); font-weight: 700; }
.terms_cont h3{font-size: var(--subTit); font-weight: 600; margin-top: 1.5rem;}
.terms_cont h4{ margin-top: 1.5rem;}
.terms_cont * + p{margin-top: 0.8rem;}
.terms_cont * + ul,
.terms_cont * + ol{margin-top: 0.5rem;}
.terms_cont figure{margin: 0; overflow-x: scroll; width: calc(100% + var(--inPd) * 2); margin-left: calc(var(--inPd) * -1); padding: 0 var(--inPd);}
.terms_cont table{ margin-top: 1rem;}
.terms_cont table th,
.terms_cont table td{border: 1px solid var(--line); padding: 1rem;}
.terms_cont table th{background-color: var(--bg);}
.terms_cont ul > li {position: relative; padding-left: 0.8em; line-height: 1.8;}
.terms_cont ul > li::before { content: '•'; position: absolute; left: 0; top: -0.25em; font-size: 1.2em;}
.terms_cont ul > li > ul > li::before { content: '-';}
/* .terms_cont ul > li > ul > li {list-style: circle;} */
.terms_cont ol > li{padding-left: 1em; text-indent: -1em;}
.terms_cont ol ul > li{text-indent: 0;}
.terms_cont hr{margin: 4rem 0;  background:var(--line); border: none; height: 1px;}

.modal_cont.privacy_modal .modal_body{padding-top: 3rem;}
.modal_cont.privacy_modal .modal_body .terms_cont h3{margin-top: 2.5rem;}




/* 이벤트신청 */
.event_form_page .write_form .form_list .terms{margin-top: 7rem;}
.event_form_page{padding-bottom: 0;}
.event_form_page .com_btm_cont .basic_btn{margin-top: 4rem;}


/* ---------- 반응형 ---------- */
/* ~380 */
@media screen and (max-width: 380px) {
    .com_first_sect{padding-top: 0;}
    .com_first_sect .info_cont{padding: 3rem 2.5rem 3rem; }
    .com_first_sect .info_cont .typing_txt,
    .com_first_sect .info_cont .typing_txt_hidden{font-size: 1.6rem;}

    /* .com_first_sect .info_cont .typing_txt{height: 9.5rem;}
    .saju_page .com_first_sect .info_cont .typing_txt{height: 6.5rem;}
    .tarot_page .com_first_sect .info_cont .typing_txt{height: 12.5rem;} */

}


/* 601 ~ */
@media screen and (min-width: 601px) {

    /* 기획전 */
    .exhibit_page .exhibit_top .txt_box{padding-bottom: 8rem;}
    .exhibit_page .exhibit_top .txt_box .txt{font-size: 2rem;}
    .exhibit_page .exhibit_top  .txt_box .txt + .txt{margin-top: 2rem;}

    /* 모든운세 */
    .pack_result_top {justify-content: center;}

    .com_first_sect .info_cont .typing_txt_hidden .mo_over{display: block;}


}



/* 721 ~ */
@media screen and (min-width: 721px) {

    /* 공통 form */
    /* .location-suggestions .location-suggestion:hover{background-color: var(--bg);} */
    .location-suggestions .location-suggestion{color: rgba(255,255,255,0.5);}
    .location-suggestions .location-suggestion:hover{color: rgba(255,255,255,1);}


    /* 공통결과 */
    .com_result_header .user_cont .profile{margin-right: 2rem;}
    .com_result_header .user_cont .txt_wrap .tit{font-size: 2.5rem;}

    .swiper-pagination-bullet{width: 7px; height: 7px;}

    /* 진입화면*/
    .com_first_sect .info_cont{}
    .com_first_sect > .tit{display: none;}
    /* .com_first_sect .info_cont .typing_txt{height: 8rem;}
    .saju_page .com_first_sect .info_cont .typing_txt{height: 8rem;}
    .tarot_page .com_first_sect .info_cont .typing_txt{height: 8rem;} */

    /* 로딩화면*/
    .tarot_loading_video{width: 50rem; max-width: 100%;}

    /* 소울스페이스 */
    .soul_page .go_sect .slide .item .txt_box{margin-bottom: 20rem;}
    .soul_page .go_sect .slide .item .character_box{height: 22rem;}

    /* 소울스페이스_결과 */
    .com_result_top{height: 30rem;}
    .com_result_top .img_box{height: 37rem;}
    .com_result_top .txt_box .tit{font-size: 2.5rem;}
    .com_result_top .txt_box{margin-right: 5rem; padding-left: 0;}


    /* 타로스튜디오 */
    .tarot_result_top .btn_box .btn{width: 3.8rem; height: 3.8rem;}
    .tarot_result_top .txt_box{ max-width: 80%; }

    .tarot_pick_page .tarot_list_btn{top: 21rem;}
    .contents-tarot-card-pick_body .tarot_pick_page .tarot_list_btn{top: 18.5rem;}


    /* 운세픽 */
    .pick_draw_page .pick_sect .in{padding-bottom: 8rem;}
    .pick_draw_page .page_bg img,
    .loading_overlay.pick_ld_ol .loading_cont .pick_loading_video video{ object-position: 50% 65%;}


    /* 내이름연구소*/
    .name_modal .name_select_form .top_cont .name_box .name_letter.active,
    .name_modal .name_select_form .letter_select_cont .letter_box .letter_item.active{box-shadow: inset 0 0 0 3px var(--primary);}

    /* 무료운세 */
    .free_result_page .free_result_cont .result_card .card_box .btn{transition: background-color 0.3s ease;}
    .free_result_page .free_result_cont .result_card .card_box .btn:hover{background-color: #000;}

    /* 소울코드리포트 */
    .report_page .result_item .cheer_card .txt{padding: 3rem;}

    .content_view_page .view_cont .cont .view_btn_box .btn{font-size: var(--txt);}
    .content_view_page .view_cont .cont .view_btn_wrap .view{font-size: var(--txt);}

    /* 커뮤니티 */
    .cummu_page .post_vertial_list .btm_area .txt_box .tit,
    .cummu_page .post_list .item .txt_box .tit{font-size: 1.7rem;}
    .cummu_page .my_sect .slide .item .txt,
    .cummu_page .post_vertial_list .top_area .user_box .name{font-size: var(--txt);}

    .cummu_page .post_list .item a{padding: 1.5rem;}
    .cummu_page .post_list .item .img_box{width: 20%; padding-top: 20%;}
    .cummu_page .post_list .item .txt_box{padding: 1rem 0 0.2rem;}

    .cummu_page .post_vertial_list .item + .item{margin-top: 5rem;}
    .cummu_page .post_vertial_list .top_area .user_box .profile{width: 6rem; height: 6rem;}
    .cummu_page .post_vertial_list .btm_area{margin-top: 1.5rem;}

    .cummu_page .post_vertial_list .top_area .user_box .profile{margin-right: 1rem;}
    .cummu_page .post_vertial_list .top_area .user_box .name{font-size: var(--subTit);}
    .cummu_page .post_vertial_list .top_area .user_box .date{font-size: var(--subTxt);}



    /* 기획전 */
    .exhibit_page .exhibit_cont{padding-top: 5rem;}
    .exhibit_page .exhibit_cont .fortune_sect{margin-top: 2.2rem;}


    /* 모든운세 */
    .pack_result_top .txt_box{margin-right: 40%;}
    .related_cont .related_slide .item{width: 10rem;}
    .related_cont .related_slide .img{width: 10rem; height: 10rem;}
    /* .related_cont .related_slide .item a .img img{transition: transform 0.3s ease-in-out;}
    .related_cont .related_slide .item a:hover .img img{transform: scale(1.1);} */

    /* 공지사항 */
    .notice_page .notice_list .item .tit_box .new_badge{width: 8px; height: 8px;}

    /* 콘텐츠상세 */
    .content_view_page .btm_btn_box .list_btn{height: 5rem;}

    /* 캐릭터설정 */
    .custom_page .custom_sect .display_cont .character_box{height: 35rem;}
    .custom_page .select_cont .item_wrap .item_cont .item_box.box_type{grid-template-columns: repeat(4, minmax(0, 1fr));}

    /* 마이페이지_이벤트배너 */
    .event_banner a .bg{padding-top: 43%;}
    .event_banner a .txt_box .desc{font-size: var(--subTxt);}
    .event_banner a .txt_box .tit{font-size: var(--tit);}

}



/* 721 ~ 2000 */
@media screen and (min-width: 721px) and (max-width: 2000px) {
    .first_page .page_bg{top: 0;}

    .pick_draw_page .pick_sect .in{padding-top: 2rem;}

}


/* 1241 ~ */
@media screen and (min-width: 1241px) {
    div[class$="result_top"] .btn_box .btn{transition: 0.3s ease;}
    div[class$="result_top"] .btn_box .btn svg rect,
    div[class$="result_top"] .btn_box .btn svg path{transition: 0.3s ease;}
    div[class$="result_top"] .btn_box .btn:hover {background-color: var(--primary);}
    div[class$="result_top"] .btn_box .btn:hover svg path[stroke="#787878"]{stroke: #fff;}
    .tarot_result_top .btn_box .btn:hover{ border-color:var(--primary)}

    .com_result_header .user_cont .txt_wrap .txt_box .share_btn{transition: background 0.3s ease, color 0.3s ease;}
    .com_result_header .user_cont .txt_wrap .txt_box .share_btn:hover{background-color: #000; color:#fff;}
    .com_result_header .user_cont .txt_wrap .txt_box .share_btn:before{transition: background 0.3s ease}
    .com_result_header .user_cont .txt_wrap .txt_box .share_btn:hover:before{background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 13 15" fill="none"><path d="M10.5 4.50004C11.6046 4.50004 12.5 3.6046 12.5 2.50002C12.5 1.39544 11.6046 0.5 10.5 0.5C9.39542 0.5 8.49999 1.39544 8.49999 2.50002C8.49999 3.6046 9.39542 4.50004 10.5 4.50004Z" stroke="%23fff" stroke-linecap="round" stroke-linejoin="round"/><path d="M2.5 9.16654C3.60457 9.16654 4.5 8.2711 4.5 7.16652C4.5 6.06194 3.60457 5.1665 2.5 5.1665C1.39543 5.1665 0.5 6.06194 0.5 7.16652C0.5 8.2711 1.39543 9.16654 2.5 9.16654Z" stroke="%23fff" stroke-linecap="round" stroke-linejoin="round"/><path d="M10.5 13.8335C11.6046 13.8335 12.5 12.9381 12.5 11.8335C12.5 10.7289 11.6046 9.8335 10.5 9.8335C9.39542 9.8335 8.49999 10.7289 8.49999 11.8335C8.49999 12.9381 9.39542 13.8335 10.5 13.8335Z" stroke="%23fff" stroke-linecap="round" stroke-linejoin="round"/><path d="M4.49994 8.14827L8.49994 10.7665M8.49994 3.56641L4.49994 6.18461" stroke="%23fff" stroke-linecap="round" stroke-linejoin="round"/></svg>') no-repeat center / contain;}


    .com_cta_banner .txt_box .btn{transition: background 0.3s ease, color 0.3s ease;}
    .com_cta_banner .txt_box .btn:hover{background-color: #000; color: #fff;}

    /* 캐릭터설정 */
    /* .custom_page .select_cont .category_tab::-webkit-scrollbar {-webkit-appearance: none; display: block; height: 5px;}
    .custom_page .select_cont .category_tab::-webkit-scrollbar-thumb {background-color: rgba(0, 0, 0, .4); border-radius: 0.5rem;}
    .custom_page .select_cont .category_tab::-webkit-scrollbar-track {border-radius: 1rem; background-color: rgba(0, 0, 0, .1);} */

    .modal_cont.share .btn_list button{transition: transform 0.3s ease-in-out;}
    .modal_cont.share .btn_list button:hover{transform: translateY(-1rem);}

    .related_cont .related_slide .item a{transition: transform 0.3s ease-in-out, color 0.3s ease;}
    .related_cont .related_slide .item a:hover{transform: translateY(-1rem); color: var(--primary);}


    /* 카드의미설명 */
    .tarot_list_page .list_sect .cont .card:hover img{transition: border 0.3s ease;}
    .tarot_list_page .list_sect .cont .card:hover img{border-color: var(--primary);}

    /* 고해의숲 */
    .confess_chat_page .chat_msg .msg .msg_cont .btn_box .btn{transition: background 0.3s ease, border 0.3s ease, color 0.3s ease;}
    .confess_chat_page .chat_msg .msg .msg_cont .btn_box .btn:hover{background-color: #1a1a1a; color: #fff; border-color: #1a1a1a;}

    .confess_chat_page .input_area .input_cont .add_btn{transition: background 0.3s ease}
    .confess_chat_page .input_area .input_cont .add_btn:hover{background-color: var(--primary);}
    .confess_chat_page .input_area .input_cont .add_btn:hover svg path{stroke: #fff;}

    .confess_chat_page .confess_main .chat_cont .end_btn_box .btn{transition: background 0.3s ease, color 0.3s ease;}
    .confess_chat_page .confess_main .chat_cont .end_btn_box .btn:hover{background-color: var(--primary); color: #fff;}
    .confess_chat_page .confess_main .chat_cont .end_btn_box .btn svg path{transition: stroke 0.3s ease}
    .confess_chat_page .confess_main .chat_cont .end_btn_box .btn:hover svg path{stroke: #fff;}



    /* 감정구슬 */
    .emotion_input_page .chip_list .chip_item:not(.add_btn) .chip_inner:hover { background-color: var(--bg); }
    .emotion_input_page .chip_list .chip_item.add_btn .chip_inner:hover { border-color: var(--primary); background-color: var(--primary); }
    .emotion_input_page .chip_list .chip_item.add_btn .chip_inner svg path{transition: all 0.2s ease;}
    .emotion_input_page .chip_list .chip_item.add_btn .chip_inner:hover svg path{stroke:#fff;}
    .emotion_note_page .reply_sect .reply_box .cta_box .btn{transition: background 0.3s ease, color 0.3s ease;}
    .emotion_note_page .reply_sect .reply_box .cta_box .btn:hover{background-color: #000; color: #fff;} 

    /* 내이름연구소 */
    .name_modal .name_select_form .letter_select_cont .letter_box .letter_item:hover .meaning{opacity: 1; visibility: visible;}


    /* 고객센터 */
    .nice-select .list::-webkit-scrollbar{display: inherit; width: 14px;}
    .nice-select .list::-webkit-scrollbar-thumb{background: #5B5B5B; border-right: 8px solid #1a1a1a; border-radius: 3px; border-top-right-radius: 10px 3px; border-bottom-right-radius: 10px 3px;}
    .nice-select .list::-webkit-scrollbar-track{background: #1a1a1a;}
    .nice-select .list::-webkit-scrollbar-button:vertical:decrement{height: 10px;}
    .nice-select .list::-webkit-scrollbar-button:vertical:increment{height: 10px;}

    /* 마이페이지 */
    .my_page .info_sect .user_cont .btn_box .btn{transition: all 0.3s ease;}
    .my_page .info_sect .user_cont .btn_box .btn:hover{background-color: #000; color: #fff;}
    .my_page .info_sect .user_cont .btn_box .btn .ico path{fill: #000; transition: fill 0.3s ease;}
    .my_page .info_sect .user_cont .btn_box .btn:hover .ico path{fill: #fff;}

    .arr_btn{transition: background 0.3s ease, color 0.3s ease;}
    .arr_btn:hover{background-color: #000; color: #fff;}
    .arr_btn svg path{fill: #000; transition: fill 0.3s ease;}
    .arr_btn:hover svg path{fill: #fff;}

    .my_page .menu_sect .btn_box .btn{transition: color 0.3s ease;}
    .my_page .menu_sect .btn_box .btn:hover{color: #000;}

    .com_tag_board.mypage_board .top_box{display: flex; justify-content: space-between; align-items: center;}
    .com_tag_board.mypage_board .top_box .delete_btn svg{display: block; height: 1.5em;}
    .com_tag_board.mypage_board .txt_box{display: flex; justify-content: space-between;  align-items: center; margin-top: 1rem;}
    .com_tag_board.mypage_board .txt_box .date{margin-left: 1rem; margin-top: 0;}

    /* .f_info .sns_list .item .btn{transition: background 0.3s ease;}
    .f_info .sns_list .item .btn:hover{background-color: #fff;} */
    .f_info .sns_list .item .btn path{transition:  0.2s ease;}
    .f_info .sns_list .item .btn.insta:hover path{fill: #D93AA4;}
    .f_info .sns_list .item .btn.blog:hover path{fill: #55B255;}
    .f_info .sns_list .item .btn.youtube:hover path{fill: #F01313;}


    /* 콘텐츠 상세 */
    .content_view_page .btm_btn_box .list_btn{transition: background 0.3s ease, color 0.3s ease;}
    .content_view_page .btm_btn_box .list_btn:hover{background-color: #000; color: #fff;}

    /* 고객센터 */
    .write_form .form_list li.terms .terms_box::-webkit-scrollbar{display: inherit; width: 10px;}
    .write_form .form_list li.terms .terms_box::-webkit-scrollbar-thumb{background: #BFBFBF; border-right: 5px solid #fff; border-radius: 3px; border-top-right-radius: 8px 3px; border-bottom-right-radius: 8px 3px;}
    .write_form .form_list li.terms .terms_box::-webkit-scrollbar-track{background: #fff;}
    .write_form .form_list li.terms .terms_box::-webkit-scrollbar-button:vertical:decrement{height: 10px;}
    .write_form .form_list li.terms .terms_box::-webkit-scrollbar-button:vertical:increment{height: 10px;}

    .write_form .form_list li .inp textarea::-webkit-scrollbar{display: inherit; width: 10px;}
    .write_form .form_list li .inp textarea::-webkit-scrollbar-thumb{background: #BFBFBF; border-right: 5px solid #fff; border-radius: 3px; border-top-right-radius: 8px 3px; border-bottom-right-radius: 8px 3px;}
    .write_form .form_list li .inp textarea::-webkit-scrollbar-track{background: #fff;}
    .write_form .form_list li .inp textarea::-webkit-scrollbar-button:vertical:decrement{height: 10px;}
    .write_form .form_list li .inp textarea::-webkit-scrollbar-button:vertical:increment{height: 10px;}



    .confess_chat_page .submit_btn svg path{transition: stroke 0.3s ease;}
    .confess_chat_page .submit_btn:hover svg path{stroke:#000;}



}

/* 2000~ */
@media screen and (min-width: 2000px) {
    /* 소울스페이스 */
    .soul_page .go_sect .slide .item .txt_box{width: 30rem; margin-bottom: 26rem;}
    .soul_page .go_sect .slide .item .txt_box .txt{padding:  0 2rem;}
    .soul_page .go_sect .slide .item .txt_box .txt br{display: none;}
    /* .soul_page .go_sect .slide .item .character_box{ height: 26rem;} */

    .soul_page .go_sect .slide .item .txt_box{height: 22rem;}
}

/* 2600~ */
@media screen and (min-width: 2600px) {
    
    .com_first_sect{padding-top: 3vh;}
    .com_first_sect.active .info_cont{padding: 5rem 4rem 5rem;}
    .com_first_sect .info_cont .basic_btn{margin-top: 4rem;}
    
}