/* ======== 마이페이지 ======== */
.bg {background-color: #f5f5f5;}

.mypage_info {width: 100%; display: flex; flex-direction: column; align-items: flex-start; gap: 15px; padding: 30px 0 20px;}
.mypage_info dl {display: flex; align-items: center; gap: 6px;}
.mypage_info dt {font-size: 18px; color: #aaa; font-family:'NanumSquareNeoExtraBold' !important; line-height: 1;}
.mypage_info dd {color: #666; font-family:'NanumSquareNeoExtraBold' !important; line-height: 1;}
.mypage_info p {font-size: 26px;}
.mypage_info p em {display: inline-block;}

.mypage_area {width: 100%; display: flex; flex-direction: column; gap: 15px;}
.my_record {display: flex; border-radius: 12px; background-color: #fff; border: 1px solid #eee; box-shadow: 0 0 10px #00000005;}
.my_record dl {display: flex; flex-direction: column; align-items: center; padding: 18px 10px; gap: 2px; width: 50%; position: relative;}
.my_record dl:first-child::after {content: ""; display: block; width: 1px; height: 50%; position: absolute; top: 50%; right: 0; transform: translateY(-50%); background-color: #eee;}
.my_record dt {font-size: 15px; color: #666;}
.my_record dd {font-size: 26px;}

.my_menu {width: 100%; display: flex; flex-direction: column; border-radius: 15px; border: 1px solid #eee; box-shadow: 0 0 10px #00000005; padding: 10px 15px; background-color: #fff;}
.my_con {display: flex; width: 100%; justify-content: space-between; padding: 18px 10px; border-bottom: 1px solid #eee; align-items: center;}
.my_con:last-child {border-bottom: none;}
.my_con span {font-size: 18px; position: relative; font-family:'NanumSquareNeoBold' !important;}
/* .my_con.on span::after {content: ""; display: block; width: 12px; height: 12px; border-radius: 100%; background: linear-gradient(to right bottom, #E32200, #FF9A52); position: absolute; top: 50%; right: -25px; transform: translateY(-50%);} */
.my_con span em {color: #999; font-size: 15px; padding-left: 10px; display: inline-block;}
.my_con i {display: block; width: 16px; height: 16px; background: url(../img/arrow01.png) no-repeat center/contain;}



/* 공지사항 */
.board_list {display: flex; flex-direction: column; width: 100%;}
.board_con {display: flex; flex-direction: column; align-items: flex-start; width: 100%; gap: 15px; border-bottom: 1px solid #eee; padding: 20px; background-color: #fff;}
.board_con .board_tit {display: flex; align-items: flex-start; gap: 10px; width: 100%;}
.board_con .board_tit dt {font-size: 15px; color: #E32200; padding: 8px 15px; border-radius: 50px; border: 1px solid #E32200; line-height: 1; display: none;}
.board_con.ess .board_tit dt {display: block;}
.board_con .board_tit dd {padding-top: 2px; font-size: 18px; max-width: calc(100% - 20px); position: relative; padding-right: 8px;}
.board_con.new .board_tit dd::after {content: ""; display: block; width: 12px; height: 12px; position: absolute; top: 8px; left: 100%; border-radius: 100%; background: linear-gradient(to right bottom, #E32200, #FF9A52);}
.board_con .date {font-size: 15px; color: #888;}

.board_view .view_title {width: 100%; display: flex; flex-direction: column; align-items: flex-start; padding: 30px 0; border-bottom: 1px solid #eee;}
.board_view .view_title em {display: none;}
.board_view .view_title.on em {font-size: 15px; color: #E32200; padding: 8px 15px; border-radius: 50px; border: 1px solid #E32200; line-height: 1; display: block; margin-bottom: 15px;}
.board_view .view_title .tit {font-size: 22px;}
.board_view .view_title span {font-size: 16px; color: #666; padding-top: 20px;}
.board_view .view_cont {padding-top: 30px; line-height: 1.6;}



/* 이용약관 */
.terms_view {padding: 40px 0 50px; font-size: 18px;}


/* 알림설정 */
.alarm_set {width: 100%; display: flex; flex-direction: column;}
.alarm_con {display: flex; align-items: center; justify-content: space-between; padding: 20px; border-bottom: 1px solid #eee;}
.alarm_con span {font-size: 18px;}
.toggle {width: 65px; height: 40px; border-radius: 100px; background-color: #f7f7f7; display: flex; justify-content: flex-start; padding: 5px; box-shadow: inset -2px -2px 15px #00000003; transition: all .07s;}
.toggle i {display: block; width: 30px; height: 30px; border-radius: 100%; background-color: #ddd; transition: all .07s; box-shadow: 0 0 5px #00000010;}
.toggle.on {background-color: #E32200; justify-content: flex-end;}
.toggle.on i {background-color: #fff;}


/* 회원탈퇴 */
.withdraw_info {padding: 30px 0; font-size: 18px;}
.withdraw_box {display: flex; flex-direction: column; align-items: flex-start; width: 100%; gap: 15px;}
.withdraw_box .tit {font-size: 16px; color: #555;}
.withdraw_list {display: flex; flex-direction: column; width: 100%; gap: 10px;} 



/* ======== 350px ======== */
@media screen and (max-width: 350px) {
    /* 마이페이지 */
    .mypage_info dt {font-size: 15px;}
    .mypage_info dd {font-size: 15px;}
    .mypage_info p {font-size: 20px;}
    .my_record dl {gap: 0; padding: 15px 5px;}
    .my_record dt {font-size: 14px;}
    .my_record dd {font-size: 18px;}
    .my_con {padding: 15px 8px;}
    .my_con span {font-size: 16px;}
    .my_con i {width: 12px; height: 12px;}
    .my_menu {padding: 5px 10px;}
    .my_con span em {font-size: 14px; padding-left: 5px;}
    .my_con.on span::after {width: 8px; height: 8px; right: -15px;}
    .board_con {gap: 8px; padding: 12px 20px;}
    .board_con .board_tit {flex-direction: column; gap: 6px;}
    .board_con .board_tit dt {font-size: 14px; padding: 6px 12px;}
    .board_con .board_tit dd {font-size: 16px; max-width: calc(100% - 16px);}
    .board_con.new .board_tit dd::after {width: 8px; height: 8px; top: 10px;}
    .board_view .view_title {padding: 30px 0 20px;}
    .board_view .view_title.on em {font-size: 14px; padding: 6px 12px;}
    .board_view .view_title .tit {font-size: 18px;}
    .board_view .view_title span {font-size: 15px; padding-top: 10px;}
    .board_view .view_cont {padding: 20px 0;}
    .alarm_con {padding: 15px 20px;}
    .alarm_con span {font-size: 16px;}
    .toggle {height: 35px; width: 55px;}
    .toggle i {width: 25px; height: 25px;}
    .terms_view {font-size: 16px;}
}