input[type="checkbox"]{accent-color: #333;}
input[type="checkbox"]{width: 20px;height: 20px;}
button, .btn{background: #333;border: 1px solid #333;}
/*  */
header .h_inner { position: relative; max-width: 1200px; background: transparent; margin: 0 auto; } 
.dark_light_bbx { display: none; } 
body { height: 100vh; overflow: hidden;} 
.ham_bbx .logo img,
header .logo img { display: none; } 
.ham_btn span { box-shadow: 0 0 5px #00000033; background: #ffffff2f; border: 1px solid #ffffff8c; } 
.ham_btn span:nth-child(2) { background: #ffffff2f; } 
.ham_bbx .menu_bbx .ham_btn span { background: #1594c7; border: none; } 

/* */
/* 라이트 모드 */
:root[color-theme='light'] {
    --color: #fff; /* 텍스트용 기본 색: 어두운색 */
    /* --surface-default: linear-gradient(135deg, #232526, #414345); 모던 시멘트 */
    --surface-default: linear-gradient(135deg, #56ccf2, #2f80ed); /* 맑은 하늘 그라데이션 */
    --bg-color: #19497C;
}

/* 다크 모드 */
:root[color-theme='dark'] {
    --color: #fff; /* 텍스트용 기본 색: 밝은색 */
    --surface-default: linear-gradient(135deg, #141e30, #243b55); /* 블랙-네이비 */
    --bg-color: #1C232B;
}

/* */
.m_ { overflow-x: hidden; } 
.m_ .m_inner { display: flex; flex-direction: column; gap: 20px; } 
.m_ .m_inner>.bg { width: 100%; pointer-events: none; } 
.m_ .m_inner>.bg img { width: 100%; } 
/* */
.weatherSwiper { overflow: unset; } 
.bx { background: #ffffff2d; border: 1px solid #ffffff60; border-radius: 10px; color: #fff; } 
/* */

.region_temperature { font-size: 18px; font-weight: 500; display: flex; align-items: center; gap: 8px; } 
.region_temperature .region_bx { display: flex; align-items: center; gap: 4px; color: #fff; } 
.region_temperature .temperature_bx { font-size: 20px; display: flex; align-items: center; } 
/* */
.recommend_bbx { display: flex; gap: 16px; } 
.recommend_bx { width: 100%; padding: 20px; flex-direction: column; height: auto; } 
/* */
.tbx { width: 100%; } 
.tbx .tit { font-weight: 550; font-size: 20px; text-align: center; } 
.tbx .desc { font-weight: 450; font-size: 16px; margin-top: 10px; } 
.tbx ul { margin-top: 6px; } 
.tbx li,
.tbx .p1 { font-weight: 400; font-size: 14px; margin-top: 16px; } 
.tbx li { display: flex; align-items: center; gap: 4px; margin-top: 10px; } 
.tbx li::before { content: ''; width: 3px; height: 3px; border-radius: 50%; background: #fff; position: relative; display: inline-block; } 
/* */

.info_bbx{gap: 10px; position: absolute;top: 0;left: 0;width: 100%;height: 100%; display: flex;align-items: center;justify-content: space-evenly;flex-direction: column;}
/*  */
.b_bx{max-width: 500px; display: flex;flex-direction: column;width: calc(100% - 32px);align-items: center;justify-content: center;gap: 20px;}
.b_bx .tit_bx{font-size: 20px;text-shadow: 0 0 4px #000;}
/*  */
.info_bbx .txt_bx{padding: 10px; font-size: 16px; line-height: 1.4; display: flex;align-items: center; width: 500px;max-width: 90vw;position: relative;}
.info_bbx .txt_bx::after{backdrop-filter: blur(1px); border: 1px solid #fff; content: '';width: 100%;height: 100%;background: #ffffff20;position: absolute;bottom: -3px;left: -3px;}
.info_bbx .txt_bx::before{backdrop-filter: blur(5px); border: 1px solid #ddd; content: '';width: 100%;height: 100%;background: #00000030;position: absolute;top: -3px;right: -3px;}
.info_bbx .txt_bx .txt{gap: 5px; position: relative;display: flex;z-index: 2;}

.clothes_bbx{width: 100%; position: relative;display: flex;overflow: unset;padding: 10px 18px;flex-direction: column; background: #ffffff03; border-radius: 15px; border: 1px solid #ffffff25; }
.clothes_bbx .tit{text-align: center; font-size: 16px;font-weight: 500;padding: 6px 0;}
.clothes_bbx .cloth_bx{gap: 20px; padding: 4px 0; display: flex;align-items: center;border-top: 1px solid #ffffff20;}
.clothes_bbx .cloth_bx:nth-child(2){border-top: none;}
.clothes_bbx .cloth_bx:last-child{padding-bottom: 0;}
.clothes_bbx .cloth_bx .icon{width: 30px;height: auto;aspect-ratio: 1/1;}
.clothes_bbx .cloth_bx .icon img{filter: brightness(0) invert(1);}
.clothes_bbx .cloth_bx .txt{font-size: 18px;font-weight: 400;}

.info_bx{text-shadow: 0 0 10px #000000; display: flex;flex-direction: column; align-items: center; width: calc(100vw - 32px);}
.lo_we_bx{ display: flex;align-items: center;}
.lo_we_bx_1{margin-top: 0;flex-direction: column;}
.lo_we_bx .icon{display: flex;align-items: center;justify-content: center; width: 24px; height: auto; aspect-ratio: 1/1;position: relative;right: 2px;}
.now_temp{font-size: 102px;font-weight: 100;position: relative;line-height:0.95;}
.now_temp .dot{position: absolute;font-size: 75px;top: 3px;right: -25px;}
.temp_h_l{display: flex;align-items: center;gap: 10px;margin-top: 7px;}
.temp_h_l .i_txt_s{display: flex;align-items: center;font-weight: 400;font-size: 18px;}
#location{font-size: 30px;font-weight: 500;}
#borough{font-size: 30px; font-weight: 400;}
#description{font-size: 24px; font-weight: 300;}
#weatherMain{display: flex;align-items: center;justify-content: center;position: relative;}
.i_txt{white-space: nowrap;gap: 2px; font-size: 16px;display: flex;align-items: center;}
.i_txt .i_txt_s{display: flex;align-items: center;}
/*  */
.i_bbx{padding: 15px; width: calc(100% - 32px); max-width: 500px;  border-radius: 15px; display: flex;gap: 20px;flex-direction: column;background: #ffffff03; border: 1px solid #ffffff25;}
.i_bbx .i_bx{display: flex;justify-content: space-between;}
/*  */
/*  */
.loading_bbx{ transition: .2s; position: fixed;top: 0;left: 0;display: flex;align-items: center;justify-content: center;z-index: 999999;width: 100vw;height: 100vh;}
.loading_bbx.off{opacity: 0;pointer-events: none;}
.loading_bbx .bg{background: #333;position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.loading_bbx .cont{display: flex;flex-direction: column;gap: 30px;align-items: center;justify-content: center;}
.loading_bbx .cont img{z-index: 2;width: 100px;height: 100px;box-shadow: 0 0 6px #ffffff20;border-radius: 10px;}
.loading_bbx .cont .p1{z-index: 2;font-size: 14px;font-weight: 500;color: #fff;text-align: center;line-height: 1.4;}
.loading_bbx.red .bg{background: #ff0000;}
/*  */
.no_data{display: none !important;}
/*  */
#gear{transition: .3s; width: 24px; aspect-ratio: 1/1; cursor: pointer;position: absolute;right: 20px;top: 20px;z-index: 10000;}
#gear img{width: 100%;height: 100%;object-fit: contain;}
body.view_modal_content #gear{transform: rotate(60deg);}
/*  */
/* .popup_bbx{opacity: 1;pointer-events: all; transition: .3s; position: fixed;top: 0;left: 0;width: 100vw;height: 100vh;z-index: 9999;display: flex;align-items: center;justify-content: center;} */
.popup_bbx{opacity: 0;pointer-events: none; transition: .3s; position: fixed;top: 0;left: 0;width: 100vw;height: 100vh;z-index: 9999;display: flex;align-items: center;justify-content: center;}
body.view_modal_content .popup_bbx{opacity: 1; pointer-events: all;}
.popup_bbx .bg{background: #00000050;position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.popup_bbx .cont{border: 2px solid #fff; background: #000000e0; gap: 20px; padding: 20px;border-radius: 10px; width: 400px;max-width: calc(100vw - 32px);z-index: 2;display: flex;align-items: center;justify-content: center;flex-direction: column;}
.popup_bbx .p_ct_bx{display: flex;align-items: center;gap:10px;justify-content: space-between;width: 100%;}
.popup_bbx .p_ct_bx .tit{white-space: nowrap; font-size: 18px;font-weight: 500;}
.popup_bbx .p_ct_bx input[type="time"]{border: none;outline: none; font-size: 18px;font-weight: 500;font-family: "Pretendard";background: #ffffff36;color: #fff;}
.popup_bbx .btn{margin-top: 10px;}
/*  */
.bg_bbx{position: absolute;top: 0;left: 0;width: 100vw;height: 100vh;}
.bg_bbx img{width: 100%; height: 100%; object-fit: cover; object-position: center;position: absolute;top: 0;left: 0;}
.bg_bbx::after{content: '';position: absolute;top: 0;left: 0;background: linear-gradient(#1C232B00 20%, #1C232B 40%);width: 100%;height: 100%;}