@charset "utf-8";

input[type='radio'], input[type='checkbox']{position: absolute; height: 1px; width: 1px; overflow: hidden; clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px);}
input[type='radio'] + label{position: relative; padding-left: 1.75em}
input[type='radio'] + label::before{content: ''; position: absolute; top: 0; left: 0; width: 1.667em; height: 1.667em; border: 1px solid #000; border-radius: 50%; font-size: 0.75em; box-sizing: border-box; line-height: 1.667em; transition: background 0.3s}
input[type='radio']:checked + label::before{content: '\f00c'; background: #000; border: none; text-align: center; color: #fff; font-family: var(--awesome); font-weight: 500}
input[type='checkbox'] + label{position: relative; padding-left: 1.75em}
input[type='checkbox'] + label::before{content: ''; position: absolute; top: 0; left: 0; width: 1.667em; height: 1.667em; border: 1px solid #000; border-radius: 50%; font-size: 0.75em; box-sizing: border-box; line-height: 1.667em; transition: background 0.3s}
input[type='checkbox']:checked + label::before{content: '\f00c'; background: #000; border: none; text-align: center; color: #fff; font-family: var(--awesome); font-weight: 500}

/* bbs 리스트 */
.notice_list li:first-child a{border-top: 1px solid #000}
.notice_list li a{display: flex; align-items: center; padding: 24px 20px; border-bottom: 1px solid rgb(170, 170, 170); transition: .3s}
.notice_list li a .state{padding: 3px 12px; color: #fff; background-color: #000; margin-right: 20px}
.notice_list li a .tit{font-size: var(--h6-tit); font-weight: 500; flex: 1; overflow: hidden;text-overflow: ellipsis;white-space: nowrap}
.notice_list li a .date{font-size: 15px; font-family: 'outfit'; margin-left: 20px; line-height: 1em}

/* bbs 뷰 */
.view_top{padding-top: 250px}
.view_top .inner{width: 1120px; padding: 0 20px; margin: 0 auto}
.view_top .cat{display: inline-block; padding: 2px 12px 4px 12px; margin-bottom: 6px; color: #fff; background-color: #000}
.view_top .tit{font-size: var(--h5-tit); font-weight: 500}
.view_top .info{margin-top: 15px; display: flex; font-size: 13px; align-items: center}
.view_top .info li{position: relative}
.view_top .info li + li{margin-left: 20px}
.view_top .info li + li:before{content: ""; display: inline-block; width: 1px; height: 12px; background-color: var(--gray); position: absolute; left: -10px; top: 50%; transform: translate(0,-50%)}
.view_top .info li.date{font-family: 'outfit'}

.view_cont{margin-top: 20px; border-top: 1px solid #000; padding: 50px 20px;min-height: 500px; border-bottom: 1px solid rgb(170, 170, 170)}
.view_cont *{max-width: 100% !important}
.view_cont .img_box{display: flex}
.view_cont .img_box .img + .img{margin-left: 20px}

.view_file{border-bottom: 1px solid rgb(170, 170, 170); padding: 15px 20px 10px; display: flex}
.view_file > i{font-size: 16px; margin-right: 20px; margin-top: 2px}
.view_file .file{color: #757575; font-size: 13px;  display: flex; flex-wrap: wrap}
.view_file .file a{margin-right: 15px; margin-bottom: 5px; transition: all .3s; max-width: 200px; overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}

/* 이벤트 탑 */
/* 이미지 확대하는 거 .event_top .cont .img img 이걸 찾아라 */
.event_top .cont .img{position: relative; overflow: hidden; height: 32vw; max-height: 483.25px;}
.event_top .cont .img img{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease-in;}
.event_top .cont .txt_box{position: relative;margin-top:18px;text-align:center;}
.event_top .cont .txt_box .tit{font-size:16px;color:#000;margin-bottom:7px;font-weight: 400;line-height:20px;}
.event_top .cont .txt_box .line{display:none;}
.event_top .cont .txt_box .date{font-size: 16px; color: #888;font-weight: 400;line-height:20px;}

/* 전후사진 */
.beaf_list{display: flex; flex-wrap: wrap}
.beaf_list .cont{margin-right: 30px; width: calc(33.33% - 20px)}
.beaf_list .cont:nth-of-type(3n){margin-right: 0px}
.beaf_list .cont:nth-of-type(n+4){margin-top: 65px}
.beaf_list .cont .img{width: 100%; position: relative; padding-top: 100%; overflow: hidden}
.beaf_list .cont .img:before{position: absolute;content: "";width: 100%;height: 100%;background-color: #000;opacity: 0.02;z-index: 1;left: 0;top: 0}
.beaf_list .cont .img.no_img:after{width: 60%; height: 20%;background-image: url('../img/logo_short_b.svg'); background-position: center; background-size: contain; content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); background-repeat: no-repeat; opacity: 0.2}
.beaf_list .cont .img img{position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 100%; height: 100%; object-position: center; object-fit: cover; transition: all .3s ease-in;}
.beaf_list .cont .txt_box{position: relative;margin-top:18px;text-align:center;}
.beaf_list .cont .txt_box .tit{font-size:16px;color:#000;margin-bottom:7px;font-weight: 400;line-height:1;}
.beaf_list .cont .txt_box .tit:nth-child(12n-2),.beaf_list .cont .txt_box .tit:nth-child(12n-2),.beaf_list .cont .txt_box .tit:nth-child(12n-2) {margin-bottom:7px;}
.beaf_list .cont .txt_box .tit:nth-last-child(-n+3) {margin-bottom:10px;}
.beaf_list .cont .txt_box .date{font-size: 16px; color: #888;padding-bottom:0;margin-bottom:0;border-bottom:none;font-weight: 400;line-height:1;}

/* 전후사진 탑 */
/* 이미지 확대하는 거 .beaf_top .cont .img img 이걸 찾아라 */
.beaf_top .cont .img{position: relative; overflow: hidden; height: 32vw; max-height: 483.25px;}
.beaf_top .cont .img img{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease-in;}
.beaf_top .cont .txt_box{position: relative;margin-top:10px;text-align:center;}
.beaf_top .cont .txt_box .tit{font-size:var(--sub-txt);color:#000;margin-bottom:15px;font-weight: 400;}
.beaf_top .cont .txt_box .line{width:33%;height:1px;background-color:#eee;margin:15px auto;}
.beaf_top .cont .txt_box .date{font-size: var(--sub-txt); color: #888;font-weight: 400;}

/* 에필로그 */
.ep_list{display: flex; flex-wrap: wrap}
.ep_list .cont{margin-right: 30px; width: calc(33.33% - 20px)}
.ep_list .cont:nth-of-type(3n){margin-right: 0;}
.ep_list .cont:nth-of-type(n+4){margin-top: 65px}
.ep_list .cont .img{width: 100%; position: relative; padding-top: 100%; overflow: hidden}
.ep_list .cont .img:before{position: absolute;content: "";width: 100%;height: 100%;background-color: #000;opacity: 0.02;z-index: 1;left: 0;top: 0}
.ep_list .cont .img.no_img:after{width: 60%; height: 20%;background-image: url('../img/logo_short_b.svg'); background-position: center; background-size: contain; content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); background-repeat: no-repeat; opacity: 0.2}
.ep_list .cont .img img{position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 100%; height: 100%; object-position: center; object-fit: cover; transition: all .3s ease-in;}
.ep_list .cont .txt_box{position: relative;margin-top:18px;text-align:center;}
.ep_list .cont .txt_box .tit{font-size:16px;color:#000;margin-bottom:7px;font-weight: 400;line-height:1;}
.ep_list .cont .txt_box .tit:nth-child(12n-2),.ep_list .cont .txt_box .tit:nth-child(12n-2),.ep_list .cont .txt_box .tit:nth-child(12n-2) {margin-bottom:7px;}
.ep_list .cont .txt_box .tit:nth-last-child(-n+3) {margin-bottom:10px;}
.ep_list .cont .txt_box .date{font-size: 16px; color: #888;padding-bottom:0;margin-bottom:0;border-bottom:none;font-weight: 400;line-height:1;}

/* 에필로그 탑 */
/* 이미지 확대하는 거 .ep_top .cont .img img 이걸 찾아라 */
.ep_top .cont .img{position: relative; overflow: hidden; height: 32vw; max-height: 483.25px;}
.ep_top .cont .img img{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease-in;}
.ep_top .cont .txt_box{position: relative;margin-top:10px;text-align:center;}
.ep_top .cont .txt_box .tit{font-size:var(--sub-txt);color:#000;margin-bottom:15px;font-weight: 400;}
.ep_top .cont .txt_box .line{width:33%;height:1px;background-color:#eee;margin:15px auto;}
.ep_top .cont .txt_box .date{font-size: var(--sub-txt); color: #888;font-weight: 400;}

/* 미디어 */
.media_list{display: flex; flex-wrap: wrap}
.media_list .cont{margin-right: 30px; width: calc(33.33% - 20px)}
.media_list .cont:nth-child(3n){margin-right: 0;}
.media_list .cont:nth-child(n+4){margin-top: 60px}
.media_list .cont .img{width: 100%; position: relative; padding-top: 100%; overflow: hidden}
.media_list .cont .img:before{position: absolute;content: "";width: 100%;height: 100%;background-color: #000;opacity: 0.02;z-index: 1;left: 0;top: 0}
.media_list .cont .img.no_img:after{width: 60%; height: 20%;background-image: url('../img/logo_short_b.svg'); background-position: center; background-size: contain; content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); background-repeat: no-repeat; opacity: 0.2}
.media_list .cont .img img{position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 100%; height: 100%; object-position: center; object-fit: cover; transition: all .3s ease-in;}
.media_list .cont .txt_box{position: relative;margin-top:15px;text-align:center;}
.media_list .cont .txt_box .tit{font-size:var(--sub-txt);color:#000;margin-bottom:15px;font-weight: 400;}
.media_list .cont .txt_box .date{font-size: 16px; color: #888;font-weight: 400;}

/* 데이터 센터 */
.data_weight{display: flex}
.data_weight .left{flex: 1; margin-right: 80px; border-right: 1px solid #000; padding-right: 60px}
.data_weight .left .cont h5{font-size: var(--h5-tit)}
.data_weight .left .cont + .cont{margin-top: 45px}
.data_weight .left .num_box{display: flex; align-items: center; margin-top: 30px}
.data_weight .left .num_box .num{font-size: var(--h4-tit); font-weight: 500}
.data_weight .left .num_box .num span{font-size: 80px; color:#DF381F ; line-height: 1; font-family: 'outfit'}
.data_weight .left .num_box i{font-size: 40px; margin: 0 60px}
.data_weight .left .acc_text{margin-top: 20px; text-align: right; font-size: 12px; color: #757575; margin-top: 50px}

.data_weight .right{display: flex; flex-direction: column; width: 320px; flex-shrink: 0}
.data_weight .right .year_list{border-top: 2px solid #000; border-bottom: 2px solid #000}
.data_weight .right .year_list li{ font-size: var(--sub-txt); font-weight: 700; text-align: center}
.data_weight .right .year_list li a{padding: 20px; border-bottom: 1px solid rgb(170, 170, 170); display: block; transition: all .3s}
.data_weight .right .year_list li:last-child a{border-bottom: none}
.data_weight .right .pagination{margin-top: auto}

.view_cont .data_weight .left{margin: 0; padding: 0; border: none}
.view_cont .data_weight .left .cont h5{font-size: var(--h6-tit)}
.view_cont .data_weight .left .num_box .num span{font-size: 60px}
.view_cont .data_weight .left .num_box i{font-size: 30px; margin: 0 45px}

/* 다이어트 다이어리 */
.diary_list{display: flex; flex-wrap: wrap}
.diary_list .cont{margin-right:7px; width: calc((100% - 14px) / 3); display: flex; flex-direction: column}
.diary_list .cont:nth-child(3n){width: calc((100% - 14px) / 3); ;margin-right: 0}
.diary_list .cont:nth-child(3n+1),.diary_list .cont:nth-child(3n+2),.diary_list .cont:nth-child(3n+3){margin-top: 115px}
.diary_list .cont:nth-child(1),.diary_list .cont:nth-child(2),.diary_list .cont:nth-child(3){margin-top: 0px}
.diary_list .cont .img{width: 100%; position: relative; padding-top: 108.5%; overflow: hidden}
.diary_list .cont .img:before{position: absolute;content: "";width: 100%;height: 100%;background-color: #000;opacity: 0.02;z-index: 1;left: 0;top: 0}
.diary_list .cont .img.no_img:after{width: 60%; height: 20%;background-image: url('../img/logo_short_b.svg'); background-position: center; background-size: contain;
    content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); background-repeat: no-repeat; opacity: 0.2}
.diary_list .cont .img img{position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); width: 100%; height: 100%; object-position: center; object-fit: cover; transition: all .3s}
.diary_list .cont .txt_box{margin-top:18px;text-align: center; height: 100%;display:flex;flex-direction:column;line-height:1;}
.diary_list .cont .txt_box .txt{padding-top: 0;line-height:20px;overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size:16px;font-weight: 400;color:#000;margin-bottom:10px;}
.diary_list .cont .txt_box .line{display:none;}
.diary_list .cont .txt_box .title{font-size: 16px;line-height:20px;color: #888;margin-bottom:0;font-weight: 400;}

.diary_view h5{font-size: var(--h5-tit); text-align: center; margin-bottom: 30px}
.diary_view .sect + .sect{margin-top: 150px}
.diary_view .w1200{width: 1120px; margin: 0 auto; max-width: 100%}
.diary_view .swiper-slide{display: flex}
.diary_view .swiper-slide .img_box{width: 50%; padding-top:50%; position: relative}
.diary_view .swiper-slide .img_box .img img{width: 100%; position: absolute; width: 100%; height: 100%; object-position: center; object-fit: cover; left: 0; top: 0}

.diary_view .slide_box .control{position: absolute; width: 100%; padding-top: calc(100%/2); top: 0}
.diary_view .slide_box .control div{position: absolute; top: 50%; transform: translateY(-50%); width: 80px; height: 80px; margin-top: 0; background: rgba(255, 255, 255, 0.3)}
.diary_view .slide_box .control div.swiper-button-prev{left: 0}
.diary_view .slide_box .control div.swiper-button-next{right: 0}
.diary_view .slide_box .control div::after{display: none}
    .diary_view .slide_box .control div i{color: #000; font-size: 40px}


    .diary_view .slide_box .control div svg{color: #000; font-size: 40px}


.diary_view .slide_box .txt_box{margin-top: 20px;font-weight: 500; text-align: center; display: flex}
.diary_view .slide_box .txt_box > div{width: 50%}
.diary_view .slide_box .txt_box .txt{font-size: var(--h6-tit)}
.diary_view .slide_box .txt_box .kg{font-size: var(--h4-tit); margin-top: 10px}
.diary_view .slide_box .txt_box .kg em{font-weight: 600}
.diary_view .slide_box .txt_box .kg span{color: #DF381F}

.diary_view .in_body .cont{display: flex}
.diary_view .in_body .cont + .cont{border-top: 1px solid rgb(170, 170, 170)}
.diary_view .in_body .cont .tit{width: 200px; height: 300px; display: flex; align-items: center; justify-content: center; font-size: var(--h5-tit); font-weight: 500; color: #fff; background-color: #000}
.diary_view .in_body .cont .text{background-color: #f6f6f6; padding: 20px; flex: 1;  font-size: var(--sub-txt); height: 300px; overflow-y: auto}
.diary_view .in_body .cont .text::-webkit-scrollbar{width: 20px}
.diary_view .in_body .cont .text::-webkit-scrollbar-thumb{background-color: #000; border-radius: 10px; background-clip: padding-box; border: 8px solid #f6f6f6}
.diary_view .in_body .cont .text::-webkit-scrollbar-track{background-color: #f6f6f6}

.diary_view .diary .swiper-slide{display: flex; align-items: stretch}
.diary_view .diary .swiper-slide .left{width: 50%; padding-top: 50%; position: relative}
.diary_view .diary .swiper-slide .left img{position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-position: center; object-fit: cover}
.diary_view .diary .swiper-slide .right{width: 50%; padding: 60px 100px 60px 60px; background-color: #f6f6f6; line-height: 1.7; font-size: var(--sub-txt); overflow-y: auto}
.diary_view .diary .swiper-slide .right::-webkit-scrollbar{width: 20px}
.diary_view .diary .swiper-slide .right::-webkit-scrollbar-thumb{background-color: #000; border-radius: 10px; background-clip: padding-box; border: 8px solid #f6f6f6}
.diary_view .diary .swiper-slide .right::-webkit-scrollbar-track{background-color: #f6f6f6}

.diary_view .inter_view .swiper-slide{display: flex; align-items: stretch}
.diary_view .inter_view .swiper-slide .left{width: 50%; padding-top: 50%; position: relative}
.diary_view .inter_view .swiper-slide .left img{position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-position: center; object-fit: cover}
.diary_view .inter_view .swiper-slide .right{width: 50%; padding: 60px 100px 60px 60px; background-color: #f6f6f6; line-height: 1.7;  font-size: var(--sub-txt); overflow-y: auto}
.diary_view .inter_view .swiper-slide .right::-webkit-scrollbar{width: 20px}
.diary_view .inter_view .swiper-slide .right::-webkit-scrollbar-thumb{background-color: #000; border-radius: 10px; background-clip: padding-box; border: 8px solid #f6f6f6}
.diary_view .inter_view .swiper-slide .right::-webkit-scrollbar-track{background-color: #f6f6f6}

/* 에필로그 */
.epilogue_view .tit_box{text-align: center}
.epilogue_view .tit_box h4{font-size:var(--h5-tit); font-weight: 500}
.epilogue_view .tit_box .date{margin-top: 5px; font-size: var(--sub-txt); font-family: 'outfit'; font-weight: 300}


/* form */
/* 리얼모델 모집 */
.model_recruit{margin-top: 110px}
.model_recruit .top{padding: var(--h4-tit); border:1px solid rgb(170, 170, 170)}
.model_recruit .top div{display: flex}
.model_recruit .top div:not(:first-child){margin-top: 30px}
.model_recruit .top div p{width: 110px; font-size: 18px; font-weight: 500}
.model_recruit .top div p + *{flex: 1 1 auto}
.model_recruit .top div span{font-size:16px;}
.model_recruit .top div ul{display: flex}
.model_recruit .top div ul li{display:flex;text-align: center}
.model_recruit .top div ul li:not(:last-child)::after{content: '\f105'; color: var(--gray); font-size: 20px; font-family: var(--awesome); line-height: 1em;margin:2px 25px 0 25px;}
.model_recruit .top div ul li i{margin-top:2px;font-size: 20px;}
.model_recruit .top div ul li span{display: block; font-size: 16px;margin-left:12px;}
.model_recruit .bottom{padding: var(--h4-tit); margin-top: 20px; border: 1px solid rgb(170, 170, 170)}
.model_recruit .bottom form label.tit{min-width: 85px; font-size: var(--sub-txt); font-weight: 500}
.model_recruit .bottom form input[type='text']{width: 100%; padding: 12px; border: 1px solid rgb(170, 170, 170); font-size: 14px; line-height: 1em}
.model_recruit .bottom form textarea{width: 100%; min-height: 100px; padding: 12px; margin-top: 8px; border: 1px solid rgb(170, 170, 170); font-size: 14px; line-height: 1em}
.model_recruit .bottom .form_wrap{display: flex; flex-wrap: wrap; justify-content: space-between}
.model_recruit .bottom .form_wrap div{display: flex; align-items: center; width: calc(100%/3 - 40px)}
.model_recruit .bottom .form_wrap div.lst{flex-direction: column; align-items: flex-start; width: 100%}
.model_recruit .bottom .form_wrap div:not(:nth-child(-n+3)){margin-top: 25px}
.model_recruit .bottom .form_wrap div ul{display: flex}
.model_recruit .bottom .form_wrap div ul li{margin-right: 30px}
.model_recruit .bottom .agree{margin-top: 10px}

/* 문의 및 상담 */
.consult form{display: grid; grid-template-columns: repeat(2, calc(50% - 10px)); gap: 20px}
.consult .item{padding: 30px 40px; border: 1px solid #000}
.consult .item.full{grid-column: 1/3}
.consult .item > ul{display: flex; flex-wrap: wrap}
.consult .item > ul li{width: 50%; margin-top: 20px}
.consult .item.flex{display: flex}
.consult .item.flex > ul{display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-left: 40px}
.consult .item.flex > ul li{width: auto; margin-top: 0}
.consult label.tit{white-space: nowrap; min-width: 85px; font-size: 20px; font-weight: 500}
.consult label.minwidth55{min-width:55px;}
.consult input[type='text']{width: 100%; padding: 12px; border: 1px solid #000; font-size: 16px; line-height: 1em}
.consult textarea{width: 100%; min-height: 100px; padding: 12px; margin-top: 13px; border: 1px solid #000; font-size: 16px; line-height: 1em}
.consult .form_wrap{display: flex; flex-wrap: wrap; justify-content: space-between}
.consult .form_wrap div{display: flex; align-items: center; width: calc(100%/3 - 40px)}
.consult .form_wrap div:not(:nth-child(-n+3)){margin-top: 25px}
.consult .form_wrap div ul{display: flex}
.consult .form_wrap div ul li:not(:first-child){margin-left: 30px}

/* 회원 */
.withdrawal_btn{display: inline-block; margin-top: 14px; font-size: 16px; font-weight: 400}
.withdrawal_btn i{margin-left: 0.3em}

.join_top{padding-top: 220px}
.join_top .inner{width: 950px; padding: 0 15px; margin: 0 auto; max-width: 100%}
.login_box{display: flex}
.login_box .cont{width: calc(55% - 3.5px); border: 1px solid #000; padding: 57px 65px 65px; display: flex; flex-direction: column}
.login_box .cont + .cont{width: calc(45% - 3.5px); margin-left: 7px}
.login_box .cont .cont_tit{margin-bottom: 32px; font-size: 20px; font-weight: 500; font-family: 'outfit', 'Noto Sans KR', sans-serif}
.login_box .cont .cont_tit em{font-weight: 450; font-family: 'outfit', sans-serif}
.login_box .cont .txt{font-size: 16px; font-weight: 400}
.login .inp_form{margin-bottom: 40px}
/* 로그인 인풋 350: 한글은 Noto 400 폴백, 영문·숫자·기호는 Outfit 350 */
.login .inp_form input[type='text']{font-family:'outfit', 'Noto Sans KR', sans-serif;width: 100%; padding: 12px; border: 1px solid #000; font-size: 16px; font-weight: 350; line-height: 1em}
.login .inp_form input[type='password']{font-family:'outfit', 'Noto Sans KR', sans-serif;width: 100%; padding: 12px; border: 1px solid #000; font-size: 16px; font-weight: 350; line-height: 1em}
.login .inp_form input::placeholder{font-family:'outfit', 'Noto Sans KR', sans-serif;font-size: 16px; font-weight: 350;}
.login .inp_form .inp_txt{margin-top: 0.5em; color: #757575; font-size: 16px; font-weight: 400;}
.login .inp_form .inp .tit{margin-top: 1px; font-size: 19px; font-weight: 500; color: #000; display: inline-block}
.login .inp_form .inp + .inp{margin-top: 40px}

.join_btn{min-width: 150px; height: 54px; padding-bottom: 2px; border: 1px solid #000; color: #000; font-size: 15px; font-weight: 400; text-align: center; transition: all .3s}

.login_box .btn_box{display: flex; align-items: center; margin-top: auto}
.login_box .btn_box .find_box{display: flex}
.login_box .btn_box .find_box .btn{position: relative; font-size: 16px; font-weight: 400}
.login_box .btn_box .find_box .btn + .btn{margin-left: 1.5em}
.login_box .btn_box .find_box .btn + .btn:before{position: absolute; content: ""; width: 1px; height: 14px; background-color: var(--gray); left: -0.75em; top: calc(50% + 1.0px); transform: translateY(-50%)}
.login_box .join_btn{width: 150px; margin-top: 0; margin-left: auto; font-size: 16px !important; font-weight: 400 !important}
.join .inner{width: 740px; padding: 0 20px; margin: 0 auto}
.join .join_form{border: 1px solid #000; padding: 65px}
form#memFrm .join .join_form .inp_form .inp .tit{font-weight: 500}
.join .join_form .login_tit{margin-bottom: 1.5em; font-size: var(--h4-tit); font-weight: 500}
.join .join_form .inp_form .box{display: flex; width: 420px; flex: 0 0 420px}
.join .join_form .inp_form .inp{position: relative; display: flex; align-items: center; justify-content: space-between}
.join .join_form .inp_form .inp > input[type='text'],
.join .join_form .inp_form .inp > input[type='password']{width: 420px; flex: 0 0 420px}
.join .join_form .inp_form .inp + .inp{margin-top: 40px}
.join .join_form .inp_form .dupli_chk_btn{width: 85px; flex-shrink: 0; height: 45px; line-height: 43px; color: #fff; background-color: #000; text-align: center; margin-left: 7px; transition: all 0.3s}
.join .join_form .inp_form .inp_txt{display: none; font-size: 16px; font-weight: 400;}
.join .join_form .form_tit{font-size: 20px; font-weight: 500;}
.join .join_form .form_tit + .inp_form{margin-top:30px}
.join .join_form .inp_form + .form_tit{margin-top:75px}
.join .join_form .inp_form .inp .pw_fail{color:#E93737; font-size: 12px; position: absolute; left: 0; bottom: -5px; transform: translateY(100%);  }
.join .join_form .inp_form .inp ul{display: flex}
.join .join_form .inp_form .inp ul li{margin-right: 30px}
.join .join_form .inp_form .inp ul li:last-child{margin-right: 0}
.join .join_form .inp_form .inp ul li label{font-weight: normal;}
.join .join_form .inp:has(input[name="gender"]) .tit,
.join .join_form .inp_form + .inp_form .inp:last-child .tit{margin-bottom: 0 !important; line-height: 1 !important;}
.join .join_form .inp:has(input[name="gender"]),
.join .join_form .inp_form + .inp_form .inp:last-child{display: flex; align-items: center; justify-content: space-between; margin-top: 50px !important; padding-bottom: 9px; border-bottom: 1px solid #000;}
/* 팝업 */
.modal.withdrawal .modal_cont{width: 500px; max-width: 100%; margin: 0 auto; background-color: #fff}
.modal .cont{padding: 40px}
.modal .cont h5{font-size: var(--h5-tit); font-weight: 500}
.modal .cont ul li{position: relative; padding-left: 14px; font-size: var(--sub-txt); line-height: 1.7em}
.modal .cont ul li::before{content: ''; position: absolute; top: calc(0.85em - 1px); left: 0; width: 2px; height: 2px; background: #555; border-radius: 1px}
.modal .cont .inp{margin-top: 1em}
.modal .cont .inp.flex_box{display: flex; align-items: baseline; justify-content: space-between}
.modal .cont .inp.flex_box label{flex: 1 1 80px}
.modal .cont .inp.flex_box label + *{flex: 1 1 auto; width: calc(100% - 80px)}
.modal .cont .inp label{font-weight: 500}
.modal .cont input[type='checkbox'] + label{position: relative; padding-left: 28px}
.modal .cont input[type='checkbox'] + label::before{content: ''; position: absolute; top: calc(50% - 10px); left: 0; width: 20px; height: 20px; border: 1px solid rgb(170, 170, 170); border-radius: 50%; box-sizing: border-box; transition: background 0.3s}
.modal .cont input[type='checkbox']:checked + label::before{content: '\f00c'; background: #000; border: none; text-align: center; color: #fff; font-size: 12px; font-family: var(--awesome); font-weight: 500; line-height: 20px}

.modal .modal_top{background-color: #000;  text-align: center; padding: 15px; position: relative; color: #fff}
.modal .modal_top .tit{font-size: var(--h6-tit); font-weight: 500}
.modal .modal_top .modal_close{position: absolute; right: 30px; top: 50%; transform: translate(0%,-50%); font-size: 18px; color: #fff}

/* PC/태블릿 체크 컨트롤은 제공된 check.svg를 사용한다. */

	.modal .cont ul li {
		font-size: 16px;
		font-weight: 400;
	}
	.modal .cont .inp label {
		font-size: 16px;
		font-weight: 400;
	}

	.modal .modal_top .tit {
		font-size: 20px;
		font-weight: 500;
	}

	.login .inp_form:last-child {
		margin-bottom: 0;
	}

	/* 회원가입 아이디 입력행은 해상도와 무관하게 입력창과 버튼의 폭을 고정한다. */
	.join .join_form .inp_form .box input[type='text'] {
		min-width: 0;
		flex: 1 1 auto;
	}
	.join .join_form .inp_form .box .dupli_chk_btn {
		flex: 0 0 85px;
		min-width: 85px;
		padding: 0;
		padding-left: 1.5px;
		padding-bottom: 2px;
		white-space: nowrap;
	}

	input[type='radio']:checked + label::before,
	input[type='checkbox']:checked + label::before,
	.modal .cont input[type='checkbox']:checked + label::before {
		content: '' !important;
		font-family: initial !important;
	}


	.modal .cont input[type='checkbox']:checked + label::after {
		top: calc(50% - 6px);
		left: 4px;
		width: 12px;
		height: 12px;
	}

	.model_recruit .top div ul li:not(:last-child)::after {
		content: '' !important;
		display: inline-block;
		width: 1em;
		height: 1em;
		background-color: currentColor;
		-webkit-mask: url('/assets/icons/angle-right.svg') center / contain no-repeat !important;
		mask: url('/assets/icons/angle-right.svg') center / contain no-repeat !important;
		font-family: initial !important;
	}

	.login_box .join_btn,
	.modal.id_find .btn_area button {
		height: calc(1em + 30px);
	}


.modal.id_find .modal_cont{width: 458px; max-width: 100%; margin: 0 auto; background-color: #fff; position: relative}
.modal.id_find .close{position: absolute; top: 1px; right: 0; padding: 0; background-color: #000; width: 37px; height: 37px; text-align: center}
.modal.id_find .close i{font-size: 27px; color: #fff; line-height: 37px}

	.modal.id_find .close{display: flex !important; align-items: center; justify-content: center; box-sizing: border-box; padding: 6.5px; background-color: transparent; color: #000; cursor: pointer; z-index: 2}
	.modal.id_find .close .close_icon{display: block !important; width: 24px; height: 24px; pointer-events: none}
	.modal.id_find .close .fa-xmark{display: none !important}

.modal.id_find .cont{padding: 65px}
.modal.id_find .cont,
.modal.id_find .cont input[type='text'],
.modal.id_find .cont input::placeholder,
.modal.id_find .cont .inp_txt,
.modal.id_find .btn_area button,
.modal.id_find .btn_area *{font-family: 'outfit', 'Noto Sans KR', sans-serif !important}
.modal.id_find .cont .inp_form .inp{display: flex; align-items: center; justify-content: space-between; margin-top: 0}
.modal.id_find .cont .inp_form .inp .tit{width: 80px; flex: 0 0 80px; font-size: 20px; font-weight: 500; margin-bottom: 0; color: #000; font-family: 'Noto Sans KR', sans-serif !important}
.modal.id_find .cont .inp_form .inp input[type='text']{width: 100%; flex: 1; min-width: 0; margin-left: 9px; padding: 12px; border: 1px solid #000; font-size: 16px; font-weight: 400; line-height: 1em}
.modal.id_find .cont .inp_form .inp input::placeholder{font-size: 15px; font-weight: 400}
.modal.id_find .cont .inp_form .inp + .inp{margin-top: 40px}
.modal.id_find .cont .inp_form .inp_txt{margin-top: 36px; color: #000; font-size: 16px; font-weight: 400}
.modal.id_find .btn_area button,
.modal.id_find .btn_area *{font-size: 16px !important; font-weight: 400 !important}
.modal.id_find .btn_area button{padding-bottom: 0}

.modal.event .modal_cont{width: 1000px; max-width: 100%; margin: 0 auto; background-color: #fff}
.modal.event .modal_cont .modal_close{position: fixed; width: 50px; height: 50px; color: #fff; line-height: 1; display: flex; align-items: center; justify-content: center; right: 0; top: 0; font-size: 22px; background-color: #000}
.modal.event .modal_cont img{width: 100%}


/* 버튼 */
.btn_area{display: flex; justify-content: center; margin-top: 65px}
.listView_inner .btn_area{margin-top:115px;}
.listView_inner .btn_area * {height: 54px; font-size: 16px; padding-bottom: 2px;}
.btn_area.left{justify-content: flex-start}
.btn_area.right{justify-content: flex-end}
.btn_area *{min-width: 150px; height: 54px; padding-bottom: 2px; border: 1px solid #000; font-size: 16px; font-weight: 400; text-align: center; transition: all 0.3s}
.btn_area *.v2{background: #000; color: #fff}
.btn_area * + *{margin-left: 10px}

/* 페이징 */
.pagination{display: flex; justify-content: center; align-items: center; flex-wrap: wrap; padding: 0px; margin-top: 3.5rem; font-family: 'outfit'; font-size: 17px}
.pagination > a{ color: #000; transition: all .3s}
.pagination > a.prev{margin-left: 15px}
.pagination > a.next{margin-right: 15px}
.pagination .num_list{display: flex; align-items: center; margin-left:20px; margin-right:20px}
.pagination .num_list li + li{margin-left:15px}
.pagination .num_list a{ font-weight: 500; display: inline-block; text-align: center; width: 30px; height: 30px; line-height: 30px; transition: .3s}
.pagination .num_list li.on a{  color: #fff; background: #000}


/* hover */
@media (min-width: 1025px){

    .notice_list li a:hover{background-color: #f1f1f1}
    .view_file .file a:hover{color: #000}

    .data_weight .right .year_list li a:hover{background-color: #f3f3f3}

    .BeAf_view .info_cont .slide_tab .btn:hover{background-color: #000; color: #fff; font-weight: 500}

    .join_btn:hover{background: #000; color: #fff; font-weight: 300 !important}
    .join_btn:hover em.outfit{font-family: 'Outfit', sans-serif; font-weight: 250}
    .join .join_form .inp_form .dupli_chk_btn:hover{background: #333}

    .btn_area *:hover{background: #000; color: #fff; font-weight: 300}
    .btn_area *:hover em.outfit{font-family: 'Outfit', sans-serif; font-weight: 250}
    .btn_area *.v2:hover{background: #333; border-color: #333}
    .modal.id_find .btn_area button:hover,
    .modal.id_find .btn_area *:hover{font-weight: 300 !important}

    .pagination .num_list li:hover a{color: #fff; background: #000}

}










/* PC 글자 굵기 */
@media (min-width: 1025px){
	.login_box .cont + .cont{padding: 57px 65px 65px}
	.login_box .cont .inp_form .inp{display: flex; align-items: center; justify-content: space-between}
	.login_box .cont .inp_form .inp .tit{width: 80px; flex: 0 0 80px; margin-bottom: 0}
	.login_box .cont .inp_form .inp input[type='text'],
	.login_box .cont .inp_form .inp input[type='password']{width: 100%; flex: 1; min-width: 0; margin-left: 28px}
	.login_box .inp_form input::placeholder{font-size: 16px; font-weight: 350;}
	.login_box .join_btn,
	.login_box .btn_box .find_box .btn,
	.btn_area *{font-weight:normal;}
}

/* 데스크톱 확대/해상도에서도 중복확인 버튼 높이를 입력창에 맞춤 */
html.device-desktop .join .join_form .inp_form .dupli_chk_btn,
html.device-tablet .join .join_form .inp_form .dupli_chk_btn{
	align-self: stretch;
	display: flex;
	align-items: center;
	justify-content: center;
	height: auto;
	line-height: normal;
}