/**
 * adpick_notification.css
 * - 알림설정(ac=notification) · 로그인보안(ac=security) leftover
 * - 전체폭 셸은 adpick_common.css (.layout-fullwidth)
 * - layout: 공통 CSS 뒤에 로드 (통짜 adpick.notification.css 대체)
 * - Tailwind 미사용 (기존 SCSS 스타일만)
 */

/* layout-fullwidth 가 padding-top:0 이라 타이틀이 배너에 붙음 → 여백·폭 맞춤 */
.body-page-notification .page-title-wrap,
.body-page-security .page-title-wrap {
	max-width: 1430px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 20px;
	padding-left: 3%;
	padding-right: 3%;
	box-sizing: border-box;
}

/* 전체폭 셸 이후 본문 폭 */
.page-notification-setting,
.page-security {
	max-width: 1430px;
	margin-left: auto;
	margin-right: auto;
	box-sizing: border-box;
}
.page-notification-setting {
	padding-left: 3%;
	padding-right: 3%;
}

.notification-setting{background-color:#fff}
.notification-setting .msg{text-align:right;color:#aab4c9;font-size:.85em;padding:15px}
.notification-setting .item{position:relative;padding:4%}
.notification-setting .item.soundset{border-top:1px solid #cad0dd;border-bottom:1px solid #cad0dd}
.notification-setting .item h3{font-size:1.2em;line-height:1.1;color:#0e1217;margin-bottom:3px}
.notification-setting .item p{color:#aab4c9;font-size:.85em}
.notification-setting .item .adtype-checkeds{margin-top:6px}
.notification-setting .item .adtype-checkeds li{position:relative;padding:7px 0;padding-right:60px}
.notification-setting .item .adtype-checkeds li:first-child .subject{margin-bottom:4px}
.notification-setting .item .adtype-checkeds li .subject{display:block;font-weight:bold;color:#0e1217;font-size:.85em}
.notification-setting .item .adtype-checkeds li .toggle{right:0}
.notification-setting .item .adtype-checkeds li .custom-checkbox{margin-right:14px}
.notification-setting .item .adtype-checkeds li .custom-checkbox span{color:#0e1217;font-size:.8em}
.notification-setting .item .toggle{position:absolute;right:4%;top:50%;margin-top:-10.5px}
.notification-setting .item .soundtype-check{margin-top:10px}
.notification-setting .item .soundtype-check:after{display:block;content:"";clear:both}
.notification-setting .item .soundtype-check .label{float:left;font-size:.85em;color:#0e1217;margin-right:10px;margin-top:3px}
.notification-setting .item .soundtype-check ul{float:left}
.notification-setting .item .soundtype-check ul li{padding:3px 0}
.notification-setting .item .soundtype-check .custom-radio span{color:#0e1217;font-size:.85em}
.notification-setting .item .pushtest{margin-top:10px}
.notification-setting .item .pushtest.default-btn button{background-color:#aab4c9}
.notification-setting .item .pushtest button{background-color:#37bc9b;color:#fff;padding:3px 10px;font-size:.9em}
.notification-setting .item .agree-check{margin-top:10px}
.notification-setting .item .agree-check p{color:#0e1217}
.notification-setting .item .agree-check p .label{display:block;margin-bottom:5px}
.notification-setting .item .agree-check p .custom-radio{margin-right:8px}
.notification-setting .email-input{display:flex;align-items:center;margin-bottom:10px}
.notification-setting .email-input input[type=email]{flex:1;padding:10px;border:1px solid #ddd;border-radius:4px;margin-right:10px}
.notification-setting .btn,.notification-setting .ui-customform-button label,.ui-customform-button .notification-setting label{background-color:#000;color:#fff;border:none;padding:10px;border-radius:4px;cursor:pointer;width:35px}
.notification-setting .btn:hover,.notification-setting .ui-customform-button label:hover,.ui-customform-button .notification-setting label:hover{background-color:#333}
.notification-setting .error-message{color:red;font-size:.9em}
.notification-setting .success-message{color:#37bb9a;font-size:.9em}

@media screen and (min-width: 1024px){.notification-setting{display:flex}
.notification-setting:after{display:block;content:"";clear:both}
.notification-setting .setting{flex:1;padding:20px}
.notification-setting .setting-etc{position:relative;border-left:solid .5px rgba(202,208,221,.5);flex:1;padding:20px}
.notification-setting .msg{position:absolute;right:20px;bottom:20px}
.notification-setting .item{font-size:1.1em;padding:20px}
.notification-setting .item.soundset{border:0}
.notification-setting .item h3{margin-bottom:5px}
.notification-setting .item .toggle{right:20px}
.notification-setting .item .agree-check,.notification-setting .item .soundtype-check{margin-left:10px;margin-right:10px}
}

@media screen and (min-width: 1366px){.notification-setting .item .adtype-checkeds li{padding:10px 0}
.notification-setting .item .adtype-checkeds li:first-child .subject{margin-bottom:0;display:inline;margin-right:14px}
.notification-setting .item .agree-check p{text-align:right}
.notification-setting .item .agree-check p:after{display:block;content:"";clear:both}
.notification-setting .item .agree-check p .label{float:left}
}
.page-security{padding:30px 20px}
.page-security .inner{background-color:#fff;padding:30px 10px;text-align:center;font-weight:500;word-break:keep-all;border-radius:10px;box-shadow:0 3px 6px 0 rgba(0,0,0,.16)}
.page-security .title{font-size:20px;padding-bottom:20px}
.page-security .desc{color:#656d78;line-height:1.5}
.page-security .box{display:flex;align-items:center;justify-content:center;gap:20px;border-radius:10px;background-color:#f9f9f9;padding:20px 0;margin:25px 0}
.page-security .txt-os{font-size:20px;font-weight:bold;padding:15px 0}
.page-security .br{display:none}
.page-security .btn-green{background-color:#47ceac;width:140px;height:47px;display:block;line-height:47px;text-decoration:none;color:#fff;font-weight:bold;border-radius:4px;margin:0 auto;margin-bottom:20px;font-size:17px;margin-top:25px;margin-bottom:20px}
.page-security .btn-blue{color:#1e99e1;text-decoration:underline}
.page-security .txt-notice{font-size:15px}

@media screen and (min-width: 768px){.page-security{padding:60px 20px}
.page-security .inner{max-width:830px;margin:0 auto;padding:40px 110px}
.page-security .title{font-size:28px}
.page-security .br{display:block}
.page-security .desc{font-size:17px}
.page-security .desc br:first-child{display:none}
.page-security .desc strong br:first-child{display:none}
.page-security .box{padding:22px;margin:30px auto;max-width:600px;font-size:17px}
.page-security .box .txt-os{font-size:25px}
.page-security .btn-green{margin-top:30px}
}