/* * {outline: 1px solid #ddd;} */
:root {
    --mc: #283A63;
    --sc: #FFBD39;
    --tc: #98d3c1;
    --bc: #49bcae;
    --bbc: #e6fffc;
    --gc: #fffcf1;
    --fc: #eaf3f4;
    --pc: #f7586c;
    --ppc: #f7556a;
    --lc: #ced4da;
}

/* *********************** 공통 *********************  */
.sub-top h2 {font-size: 32px; font-weight: 700; margin-bottom: 20px; text-align: center;}
.sub-content h3 { font-size: 16px;   color: #666; margin: 30px 0 0 0; line-height: 1.25;
 position: relative;  border-bottom: 1px solid rgba(0,0,0,.3); padding:  0 0 10px 0; margin-bottom: 0;}
.sub-content  .ag_h3 { border-bottom:  none;}
.sub-content .join-form h2 {display: block; font-size: 24px; font-weight: 600; margin-bottom: 20px; line-height: 1.45;}

/* 측정 분석 tit */
.test_tit h2 {font-size: 32px;  font-weight:600; text-align: center; line-height: 1.25; margin-bottom: 20px; letter-spacing: -1px;}
.test_tit h2 i {color:var(--sc);}
.test_tit h2 span {color: var(--sc);}

.two_tit {position: relative;}
.two_tit h2 {font-size: 30px;  font-weight:600; text-align: center; line-height: 1.20; margin-bottom: 6px; }
.two_tit h2 span {color: var(--sc);}
.two_tit p {font-size: 16px; line-height: 1.45; color: #666; text-align: center; margin-bottom: 60px; }
.two_tit p span {display: block;}

/* 로그인, 회원가입 h2 공통 */
.all_tit h2 {margin-bottom: 50px; font-size: 100px;  font-weight:500; text-align: center; line-height: 0.95em; letter-spacing: -3px; color: var(--sc);}
.all_wrap strong {display: block; text-align: center; font-size: 32px; font-weight: 600; margin-bottom: 10px;}
.all_wrap .smm_h2 {font-size: 16px; text-align: center; color: #666; margin-bottom: 50px;}
.all_wrap .smm_h2 br {display: none;}
.all_wrap .sns-login p {font-size: 22px; font-weight: 600; text-align: center; margin-bottom: 20px;}

.id_inner{max-width: 480px; margin: 0 auto; padding: 0 15px;}



/* 버튼 */
.sns_btn { font-size: 18px; text-align: center; margin-bottom: 10px; }
.sns_btn a {display: inline-block; width:300px; padding: 15px 10px; border-radius: 5px; }
.kakao a {color: #382121; background: #ffe607; transition: .5s;}
.naver a {color: #fff; background: #0ab804; transition: .5s;}
.sns-login dd .kakao {font-size: 18px; color: #382121; background: #ffe607; padding: 8px; border-radius: 50%;}

.slex_btn { font-size: 18px; text-align: center; margin-bottom: 40px; }
.slex_btn a {display: inline-block; background: var(--bc); width:300px; padding: 20px 10px; border-radius: 5px; color: #fff; transition: .5s; border: 1px solid var(--bc);}
.slex_btn:hover a {background: #fff; color: var(--bc);  border: 1px solid var(--bc);}

.save_btn { font-size: 16px; text-align: center; margin-top: 30px; }
.save_btn a {display: inline-block; background: var(--bc); width:180px; padding: 12px 10px; border-radius: 50px; color: #fff; transition: .5s; border: 1px solid var(--bc);}
.save_btn:hover a {background: #fff; color: var(--bc);  border: 1px solid var(--bc);}


.coment {margin-top: 40px;}
.coment .ctt {font-size: 18px; font-weight: 600; color: var(--bsc); text-align: center; line-height: 1.25; margin-bottom: 2px;}
.coment p {font-size: 16px; font-weight: 500; color: #444; text-align: center; line-height: 1.30; letter-spacing: -0.4px;}
.coment p span { color: #000; font-weight: 600;}


/* ***********************  join01_login  *********************  */
.login .form_control { display: block; min-width: 100%; height: 35px;padding: 6px 12px; font-size: 16px; line-height: 1.45; color: #555; background-color: #fff;  border: 0; border-bottom: 1px solid var(--lc); margin-bottom: 20px; }
.login .table { min-width: 100%;}
.login .id_desc {display: flex; gap: 30px; justify-content: center; border-bottom: 1px solid #ddd; padding: 50px 0; margin-bottom: 50px; } 
.login .id_desc>li {position: relative;}
.login .id_desc>li~li::before {position: absolute; content: ""; top: 50%;
left: -15px; transform: translate(-50%,-50%); width: 1px; height: 10px; background: #aaaaaa;}


.login .slex_btn { font-size: 18px; text-align: center; margin-bottom: 10px; }
.login .slex_btn a {display: inline-block; background: var(--bc); width:200px; padding: 15px 10px; border-radius: 5px; color: #fff; transition: .5s; border: 1px solid var(--bc);}
.login .slex_btn:hover a {background: #fff; color: var(--bc);  border: 1px solid var(--bc);}



/* ***********************  search~ - ID/pw찾기  *********************  */
.search .form_control { display: block; min-width: 100%; height: 35px;padding: 6px 12px; font-size: 16px; line-height: 1.45; color: #555; background-color: #fff;  border: 0; border-bottom: 1px solid var(--lc); margin-bottom: 20px; width: 100%; }
.search .form_phone {display: flex; width: 100%;}
.search .form_phone .phone {width: 100%;}
.search .form_phone .bar {margin-top: 14px; padding: 0 5px;}

.search .id_desc {display: flex; gap: 30px; justify-content: center; } 
.search .id_desc>li {position: relative;}
.search .id_desc>li~li::before {position: absolute; content: ""; top: 50%;
left: -15px; transform: translate(-50%,-50%); width: 1px; height: 10px; background: #aaaaaa;}
.search .slex_btn {margin: 40px 0 30px 0;}


/* ***********************  idpw_result - ID/pw 결과  *********************  */

.idpw_result .idpw_wrap {display: flex; flex-direction: column; justify-content: center; margin-bottom: 50px;}
.idpw_result .idpw_wrap .pull h3 {font-size: 20px; font-weight: 600; margin-bottom: 10px;}
.idpw_result .idpw_wrap .pull .result {font-size: 18px; width: 100%; padding: 20px; border: 1px solid #ddd; text-align: center; line-height: 1.4;}
.idpw_result .idpw_wrap .pull .result b{font-size: 24px; color: var(--sc);}
.idpw_result .idpw_wrap .form-group {display: flex;}
.idpw_result .idpw_wrap .form-group .o_btn {font-size: 16px; padding: 20px; cursor: pointer; color: var(--bc); background: #fff; border: 1px solid #ddd;}
.idpw_result .login-footer {text-align: center;}
.idpw_result .login-footer .lead {font-size: 20px; font-weight: 600; margin-bottom: 8px;}
.idpw_result .login-footer span { display: block; font-size: 16px; line-height: 1.35; margin-bottom: 30px;}
.idpw_result .login-footer span br {display: none;}


/* *********************   membership01 - 회원가입 ********************  */
.welcome .sns-login {padding: 50px 0; border-top: 1px solid var(--lc);}
.welcome .slex_btn {margin-bottom: 50px;}
.welcome .sns-login {display: flex; flex-direction: column; vertical-align: middle; justify-content: center; }

.welcome .ag_top {margin-bottom: 10px;}
.welcome form {margin: 20px 0;}
.welcome form h3 label {font-size: 16px; font-weight: 600; float: right;}
.welcome .agree-check { display: flex; flex-direction: column; gap: 20px; overflow: hidden;}
.welcome .agree-check .terms {margin-top: -1px; border-radius: 0 0 5px 5px;}
.welcome .agree-check .agree-top {background: #f7f7f7;border: 1px solid var(--lc);padding: 10px;padding-left: 15px; border-radius: 5px 5px 0 0;}
.welcome .agree-check .agree-top br {display: none;}
.welcome .agree-check .agree-top i {cursor: pointer;}
.welcome .agreeBox {white-space:pre-line; padding:0px; margin-top:-10px;}
.welcome .terms {height: 190px;line-height: 18px;color: #888;;border: 1px solid #ddd;padding: 15px;}
.welcome .terms .scrollable {white-space: pre-line}
.welcome .join-form h3 label { font-size: 16px; float: right}
.welcome  .slide_toggle_button i {transition: .5s;}
.welcome .agree-check .agree-top { display: flex; justify-content: space-between;}
.welcome  .slide_toggle_button i { display: inline-block; color:var(--bc); font-weight: 700; transition: transform 0.4s; cursor: pointer;}
.welcome  .slide_toggle_button.turn i { transform: rotate(180deg);}

/* *********************   membership02 - 회원가입완료 ********************  */

.membership .mem_h2 {font-size: 40px;}
.membership .member_wrap .img_box  {margin: 0 auto; width: 200px; margin-bottom: 20px;}
.membership .member_wrap .txt p {font-size: 18px; text-align: center; line-height: 1.40; margin: 30px 0 20px 0;}
.membership .member_wrap .txt p span {color: tomato; font-weight: 600;}


/* ***********************  join02 - 회원가입 정보입력 *********************  */
.join .form_control { display: block; width: 70%; height: 32px;padding: 6px 12px; font-size: 16px; line-height: 1.4; color: #555; background-color: #fff; background-image: none; border: 1px solid #ddd; border-radius: 5px;}
.join .table { width: 100%;}
.join .form_addr { height: 32px;padding: 6px 12px; font-size: 16px; line-height: 1.45; color: #555; background-color: #fff; background-image: none; border: 1px solid var(--lc); border-radius: 5px;}
.join .address .itm01 {margin-bottom: 8px;}

/* 폼 디자인 */
.join .form_wrap {display: flex; }
.join .birth .form_control {width: 80px;}
.join .phone .form_control {width: 100px;}
input[type="radio"], input[type="checkbox"] { vertical-align: top;  margin: 1px 0 0;}
input:focus {outline:none;}
input[type="radio"], input[type="checkbox"] { vertical-align: top;  margin: 1px 0 0;}


.join .table tr {display: flex; border-bottom: 1px solid #ddd; padding: 20px 0; align-items: center;}
.join .table th {text-align: left; min-width: 140px;}
.join .join-form table.table td .help-block  {font-size: 14px; line-height: 32px; color: #666;}
.join .table td span.bar {padding: 0 5px; line-height: 32px; min-width: 20px; font-size: 1rem; text-align: center;}
.join .help-block b {font-size: 18px; font-weight: bold; color: #222;margin-bottom: 15px; display: block;}

/* btn 버튼 */
.btn {border: 0; background-color: transparent;}
.join-form .table td .btn {min-width: 90px; height: 32px; cursor: pointer; margin-left: 4px; border-radius: 5px;}
.btn.black { background: var(--mc); border-color: #222; color: #fff;}
.btn.lightgray { background: #ebebeb;  border: 1px solid #ddd;
color: #666;}
.btn-box { margin-top: 50px; text-align: center;}
.btn-box .btn { width: 140px; height: 40px; font-size: 16px;  cursor: pointer; border-radius: 5px;}
.btn.dark {background: var(--bc); border-color: #fff; color: #fff; margin-right: 10px;} 
.btn.line {background: #f1f1f1 ; border: 1px solid #ddd; color: #000;}


/* 약관동의 */
.join .agree-check { display: flex; flex-direction: column; gap: 20px; overflow: hidden;}
.join .agree-check .terms {margin-top: -1px; border-radius: 0 0 5px 5px;}
.join .agree-check .agree-top {background: #f7f7f7;border: 1px solid var(--lc);padding: 10px;padding-left: 15px; border-radius: 5px 5px 0 0;}
.join .agree-check .agree-top br {display: none;}
.join .agreeBox {white-space:pre-line; padding:0px; margin-top:-10px;}
.join .terms {height: 190px;line-height: 18px;color: #888;;border: 1px solid #ddd;padding: 15px;}
.join .terms .scrollable {white-space: pre-line}
.join .join-form h3 label { font-size: 16px; float: right}

/* 동의 내용 토글 */
.join .agree-check .agree-top { display: flex; justify-content: space-between;}
.join  .slide_toggle_button { display: inline-block; color:var(--bc); font-weight: 700; transition: transform 0.4s; cursor: pointer;}
.join  .slide_toggle_button.turn { transform: rotate(180deg);}
.terms { display: none; overflow-x:hidden; width:100%; height:150px;}



.join ::-webkit-scrollbar {
    width: 14px;
    height: 90px;
}

.join ::-webkit-scrollbar-thumb {
    outline: none;
    border-radius: 10px;
    border: 4px solid transparent;
    box-shadow: inset 6px 6px 0 rgba(34, 34, 34, 0.15);
}

.join ::-webkit-scrollbar-thumb:hover {
    border: 4px solid transparent;
    box-shadow: inset 6px 6px 0 rgba(34, 34, 34, 0.3);
}

.join ::-webkit-scrollbar-track {
    box-shadow: none;
    background-color: transparent;
}

.join .out_list {margin-top: 10px;}

/* **********************  test01,02 - 나의 운동능력 측정 *******************  */

.test01 .test_top {margin-bottom: 50px;}
.test01 .test_top ul{display: flex; align-items: center; justify-content: center; gap: 40px;}
.test01 .test_top ul>li {position: relative;}
.test01 .test_top ul>li~li::before {content: ""; position: absolute; top:40%; left: -30px; transform: translate(-50%,-50%); width: 10px;  height: 10px;  border-top: 1px solid var(--bc);  border-right: 1px solid  var(--bc);  transform: rotate(45deg); }
.test01 .test_top ul>li .no_p {font-size: 16px; color: #444; border: 1px solid var(--bc); background: #fff; padding: 12px 30px; border-radius: 35px; text-align: center;}
.test01 .test_top ul>li .color_p {border: 1px solid var(--bc); background: var(--bc); color: #fff; }
.test01 .test_top ul>li .no_p br {display: none;}



.test01 .guide_txt {border: 1px solid #3b979b5c; background: #fff; padding: 25px 20px; border-radius: 8px; margin-bottom: 30px;}
.test01 .guide_txt p {font-size: 17px; line-height: 1.45; border-bottom: 1px dotted #ddd; padding: 8px 0;}
.test01 .guide_txt p:last-child {border-bottom: none;}
.test01 .guide_video .g_itm { border: 1px solid #3b979b5c; padding:  30px 20px; margin: 30px 0 0 0;}
.test01 .guide_video .g_itm .itm_txt h3 {font-size: 20px; font-weight: 600; margin-bottom: 20px; text-align: center;}
.test01 .guide_video .g_itm .itm_txt h3 br {display: none;}
.test01 .guide_video .g_itm .v_content {width: 100%; height: auto; background: #eee; margin-bottom: 20px;}

.video_box {
    position: relative;
    padding-bottom: 56.25%;
    border-radius: 5px;
    overflow: hidden;
	margin-bottom: 20px;
}

.video_box>* {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


.test01 .guide_video .g_itm .form_wrap {display: flex; flex-direction: column; gap: 20px; justify-content: space-between; align-items: center; }
.test01 .form_control { display:inline-block; width: 50px; height: 25px;padding: 0 12px; font-size: 16px; line-height: 1.4; color: #000; background-color: var(--bbc); border: 0; border-radius: 15px; margin: 0 0 0 8px;} 

.test01 .check_btn {font-size: 16px; background: var(--bc); padding: 8px 20px; color: #fff; border-radius: 25px; transition: .5s; font-weight: 600;} 
.test01 .check_btn:hover {font-weight: 600; color: var(--pc);}
.test01 .check_btn_no {font-size: 16px; border: 1px solid var(--bc); padding: 6px 15px; color: var(--bc); border-radius: 25px;}
.test01 label { display: inline-block; font-size: 14px; padding: 8px 15px; border-radius: 15px;
color: #000; vertical-align: middle; background-color:var(--bbc); cursor: pointer;}
[type="radio"]:checked { color: var(--bc); border: 5px solid var(--bc); cursor: pointer; background-color:#fff;}




/* test02 - 나의 기본정보 입력하기 페이지 */
.test01 .test02_wrap { margin-top: 30px;}
.test01 .test02_wrap p {font-size: 18px; margin-bottom: 20px; border-bottom: 1px dotted #d1d1d1; padding: 10px 0;}
.test01 .test02_wrap .form_wrap {margin-bottom: 8px;;}
.test01 .test02_wrap .form_wrap .form_size span {display: inline-block; width: 40px;}
.test01 .test02_wrap .form_wrap .form_size input { width: 50px; height: 32px;
    font-size: 15px; border: 0; border-radius: 15px; outline: none; padding-left: 10px; background-color: var(--bbc);}
.test01 .test02_wrap .form_ab_wrap {display: flex; gap: 10px; margin-bottom: 60px;}    
.test01 .test02_wrap .form_ab_wrap .form_ab { display: flex; align-items: center; justify-content: center;  border: 0;outline: none; cursor: pointer; }

.test01 .test02_wrap .form_ab_wrap label {display: inline-block; font-size: 18px; padding: 8px 20px; border-radius: 15px; color: #000; vertical-align: middle; cursor: pointer; margin: 0 10px 0 3px;}

[type="checkbox"] { appearance: none; outline: 1px solid #ddd; width: 15px; height: 15px; transition: border .2s ease-in-out; border-radius: 50%;}

[type="checkbox"]:checked { border: 5px solid var(--bc);}

[type="checkbox"]:hover { cursor: pointer;}

[type="checkbox"]:hover+span { cursor: pointer;}


[type="radio"] { appearance: none; outline: 1px solid #ddd; width: 15px; height: 15px; transition: border .2s ease-in-out; border-radius: 50%;}

[type="radio"]:radio { border: 5px solid var(--bc);}

[type="radio"]:hover { cursor: pointer;}

[type="radio"]:hover+span { cursor: pointer;}


 /* test01,02 공통 버튼  */
.test01 .test_wrap {display: flex; justify-content: center; gap: 10px; margin-top: 40px;}
.prev_btn { font-size: 18px; text-align: center; margin-bottom: 40px; }
.prev_btn a {display: inline-block; background: #fff; width:160px; padding: 15px 10px; border-radius: 5px; color:  var(--sc); transition: .5s; border: 1px solid var(--sc); font-weight: 700;}
.prev_btn:hover a {color: #000;}

.next_btn { font-size: 18px; text-align: center; margin-bottom: 40px; }
.next_btn a {display: inline-block; background: var(--sc); width:160px; padding: 15px 10px; border-radius: 5px; color: #fff; transition: .5s; border: 1px solid var(--sc); font-weight: 700; }
.next_btn:hover a {color: #000;}




/* **********************  test03 - 측정결과  ************************  */
.test01 .result_wrap {position: relative;}

.test01 .result_wrap .rs_tit {text-align: center; padding: 30px 0;}
.test01 .result_wrap .rs_tit span {display: block; margin-bottom: 10px; font-size: 32px; font-weight: 600; color: #fff; border-bottom: 1px solid  rgba(255,255,255,.4);; padding: 10px 0;}
.test01 .result_wrap .rs_tit p {display: block; font-size:20px; font-weight: 500; color: rgba(255,255,255,.8);}
.test01 .result_wrap .rs_tit p br {display: none;}

.test01 .result_wrap .result_box { background: var(--tc); height: 300px; border-radius: 15px 15px 80px 80px;}
.test01 .result_wrap .result_box .box_inner { position: absolute; bottom:0; left: 50%; transform: translate(-50%,-50%); margin: 0 0 -200px 0; width: 85%; height: 230px; background: var(--gc); z-index: 998; border-radius: 20px;
display: flex; align-items: center; justify-content: center; gap: 50px;}
.test01 .result_wrap .result_box .box_inner .box_profile img { background: #fff;  width: 150px; height: 150px; border-radius: 50%;}
.test01 .result_wrap .result_box .box_inner .profile_btn {text-align: center; margin-top: 10px;} 
.test01 .result_wrap .result_box .box_inner .profile_btn a {font-size: 16px; color: #666; } 
.test01 .result_wrap .result_box .box_inner .box_score strong {display: block; font-size: 22px; margin-bottom: 15px; text-align: center;font-weight: 600;}
.test01 .result_wrap .result_box .box_inner .box_score p {font-size: 24px; background: var(--sc); color: #fff; text-align: center; padding: 20px; border-radius:  0px 80px 80px 80px;}

/* 건강유형별 점수 */
.test01 .result_list { padding: 120px 0 0 0 ; margin-bottom: 30px;}
.test01 .result_list ul {display: grid; grid-template-columns: repeat(3,1fr); align-items: center; justify-content: center; text-align: center; gap: 10px;}
.test01 .result_list ul>li { height: 100%; padding: 20px 30px;  border-radius: 5px; border: 1px dotted var(--tc);}
.test01 .result_list ul>li:nth-child(even) {border: 1px dotted var(--sc);}
.test01 .result_list ul>li strong {display: block; font-size: 18px;}
.test01 .result_list ul>li .list_txt {margin-top: 10px; background: #fff;}
.test01 .result_list ul>li .list_txt p {font-size: 22px; font-weight: 600; color: var(--bc);}

/* 오각형 차트 */
#radar-chart {border: 1px dotted var(--sc); padding: 40px; border-radius: 15px; width: 100%}

.test01 .test03_wrap {display: flex; flex-direction: column; justify-content: center; gap: 10px; margin-top: 40px;}
.health_btn { font-size: 18px; text-align: center; margin-bottom: 20px; }
.health_btn a {display: inline-block; background: #fff; width:100%; padding: 18px 10px; border-radius: 5px; color:  var(--sc); transition: .5s; border: 1px solid var(--sc); font-weight: 700;}
.health_btn:hover a {color: #000;}

.body_btn { font-size: 18px;  text-align: center; }
.body_btn a {display: inline-block; background: var(--sc); width:100%; padding: 18px 10px; border-radius: 5px; color: #fff; transition: .5s; border: 1px solid var(--sc);  font-weight: 700;}
.body_btn:hover a {color: #000;}
.body_btn p {font-size: 18px; font-weight: 600; color: var(--bsc); margin-bottom: 10px;}




/* **********************  analyze - 체형분석하기  ************************  */



.analyze .guide_txt {border: 1px solid #3b979b5c; background: #fff; padding: 25px 20px; border-radius: 8px; margin-bottom: 30px;}
.analyze .guide_txt p {font-size: 18px; line-height: 1.45; border-bottom: 1px dotted #ddd; padding: 5px 0;}
.analyze .guide_txt p:last-child {border-bottom: none;}


.analyze .test_wrap {display: flex;  gap: 10px; margin-top: 0;}




/* ********************** 공통 추가한 부분 ************************  */
.test_tit h2 img {width: 20px; vertical-align: middle; } 
#radar-chart {border: 1px dotted var(--sc); padding: 40px; border-radius: 15px;}

/* **********************  analyze - 체형분석하기  ************************  */


.test_wrap {display: flex; justify-content: center; gap: 10px; margin-top: 40px;}

.analyze .img_box img {width: 250px; border-radius: 15px;}
.analyze .guide_txt {border: 1px solid #3b979b5c; background: #fff; padding: 25px 20px; border-radius: 8px; margin-bottom: 30px; }
.analyze .guide_txt p {font-size: 18px; line-height: 1.45; border-bottom: 1px dotted #ddd; padding: 8px 0; }
.analyze .guide_txt p:last-child {border-bottom: none;}
.analyze .guide_txt strong {display: block; font-size: 20px; line-height: 1.45; font-weight: 700; margin-top: 20px; }

.analyze .my_body {border: 1px dotted var(--tc); border-radius: 15px; height: 100%; margin: 30px auto; padding: 20px; display: flex;
    justify-content: center;}
.analyze .my_txt p {font-size: 16px; font-weight: 600; text-align: center; line-height: 1.40; color: var(--bsc); margin-bottom: 20px;}

.file-upload {display: flex; justify-content: center;}

.file-upload label {
    display: inline-block;
    padding: .5em .75em;
    color: #999;
    font-size: inherit;
    line-height: normal;
    vertical-align: middle;
    background-color: #fdfdfd;
    cursor: pointer;
    border: 1px solid #ebebeb;
    border-bottom-color: #e2e2e2;
    border-radius: .25em;
}
.file-upload input[type="file"] {  /* 파일 필드 숨기기 */
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip:rect(0,0,0,0);
    border: 0;
}

.file-upload input[type="file"] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip:rect(0,0,0,0);
    border: 0;
}

.file-upload label {
    display: inline-block;
    padding: .5em .75em;
    color: #000;
    font-size: inherit;
    line-height: normal;
    vertical-align: middle;
    background-color: #fdfdfd;
    cursor: pointer;
    border: 1px solid #ebebeb;
    border-bottom-color: #e2e2e2;
    border-radius: .25em;
}

/* named upload */
.file-upload .upload-name {
    display: inline-block;
    padding: .5em .75em;  /* label의 패딩값과 일치 */
    font-size: inherit;
    font-family: inherit;
    line-height: normal;
    vertical-align: middle;
    background-color: #f5f5f5;
    border: 1px solid #ebebeb;
    border-bottom-color: #e2e2e2;
    border-radius: .25em;
    -webkit-appearance: none; /* 네이티브 외형 감추기 */
    -moz-appearance: none;
    appearance: none;
}
/* imaged preview */
.file-upload .upload-display {  /* 이미지가 표시될 지역 */
    margin-bottom: 5px;
}





/* ********************** 하루10분 운동 & 다른운동할래요 page ***************************  */



.daily .guide_txt {border: 1px solid #3b979b5c; background: #fff; padding: 20px 20px; border-radius: 8px; margin-bottom: 30px;}
.daily .guide_txt p {font-size: 17px; line-height: 1.45; border-bottom: 1px dotted #ddd; padding: 8px 0; }
.daily .guide_txt p:last-child {border-bottom: none;}
.daily .guide_video .g_itm { padding:  25px 30px 10px 30px; margin: 30px 0 0 0; background: var(--tc);}
.daily .guide_video .g_itm .itm_txt h3 {font-size: 20px; font-weight: 700; margin-bottom: 20px; text-align: center; color: #fff; border-bottom: 1px dotted rgba(255,255,255,.6); padding: 0 0 10px 0;}
.daily .guide_video .g_itm .itm_txt h3 br {display: none;}
.daily .guide_video .g_itm .v_content {width: 100%; height: auto; background: #eee; margin-bottom: 20px;}



.daily .test_wrap {margin-top: 20px;}
.daily .prev_btn02 { font-size: 18px; text-align: center; margin-bottom: 40px; }
.daily .prev_btn02 a {display: inline-block; background: #fff; width:175px; padding: 15px 10px; border-radius: 5px; color:  var(--sc); transition: .5s; border: 1px solid var(--sc); font-weight: 700;}
.daily .prev_btn02:hover a {color: #000;}

.daily .next_btn { font-size: 18px; text-align: center; margin-bottom: 40px; }
.daily .next_btn a {display: inline-block; background: var(--sc); width:175px; padding: 15px 10px; border-radius: 5px; color: #fff; transition: .5s; border: 1px solid var(--sc); font-weight: 700; }
.daily .next_btn:hover a {color: #000;}

/* **********************  health_savings.html - 나의 건강적금   ************************  */

.test01 .saving_list { padding: 110px 0 0 0 ; margin-bottom: 30px;}
.test01 .saving_list ul {display: grid; grid-template-columns: repeat(4,1fr); align-items: center; justify-content: center; text-align: center; gap: 0; margin-bottom: 0px; background: var(--tc);}
.test01 .saving_list ul>li {  height: 100%; padding: 20px 0px; border-right: 1px solid rgba(255,255,255,.3); transition: .5s; }
.test01 .saving_list ul>li:hover {background: var(--pc);}
.test01 .saving_list ul>li:last-child {border-right: 0;}
.test01 .saving_list ul>li .img_box img {width: 30px; height:30px;  margin-bottom: 8px;}
.test01 .saving_list ul>li strong {display: block; font-size: 18px; font-weight: 700; line-height: 1.25; color: #fff; transition: .5s;   }
.test01 .saving_list ul>li strong br {display:none;}
.test01 .grape_p {font-size: 16px; font-weight: 600; color: #444; text-align: center; margin-bottom: 8px;}

/* **********************  success - 하루 미션성공 페이지   ************************  */

.success .sc_wrap {background: #f9f9f9; padding: 40px 20px; text-align: center; border-radius: 15px;}
.success .sc_wrap .sc_txt strong {display: block;font-size: 18px; font-weight: 600; color: var(--pc); margin-bottom: 10px;}
.success .sc_wrap .sc_txt p {font-size: 22px; font-weight: 700; margin-bottom: 20px; line-height: 1.35; }
.success .sc_wrap .img_box {width: 200px; margin: 0 auto 30px auto; }


.success .sc_wrap .sc_txt02 {margin-bottom: 30px;}
.success .sc_wrap .sc_txt02 strong {display: block;font-size: 18px; font-weight: 600;  margin-bottom: 10px;}
.success .sc_wrap .sc_txt02 .sc_box {width: 60%; height: 100%; background: #fff; padding: 20px 15px; border-radius:15px;  margin: 0 auto;}
.success .sc_wrap .sc_txt02 .sc_box p {font-size: 16px; font-weight: 600; line-height: 1.45; color: var(--bc); margin-bottom: 10px; border-bottom: 1px dotted var(--pc); padding: 10px 0;}
.success .sc_wrap .sc_txt02 .sc_box p:last-child {margin-bottom: 0; border-bottom:none;}
.success .sc_wrap .sc_txt02 .sc_box p span {display: block; color: #666;font-weight: 400; margin-right: 5px; }
.success .sc_wrap .sc_txt02 .sc_box .sxx {color: #666;}

.success .suc_btn a{ display: inline-block; background: var(--sc);  width: 100%; padding: 15px 10px; border-radius: 5px; color: #fff; transition: .5s; border: 1px solid var(--sc); font-weight: 700;}
.success .suc_btn a:hover { background: #fff; color:var(--sc); border: 1px solid var(--sc);}



/* ********************** 체형분석 업로드 완료페이지   ************************  */


.upload .sc_wrap {background: #f9f9f9; padding: 40px 20px 10px 20px; text-align: center; border-radius: 15px;}
.upload .sc_wrap .sc_txt strong {display: block;font-size: 18px; font-weight: 600; color: var(--pc); margin-bottom: 10px;}
.upload .sc_wrap .sc_txt p {font-size: 22px; font-weight: 700; margin-bottom: 20px; line-height: 1.40; }
.upload .sc_wrap .img_box {width: 200px; margin: 0 auto 30px auto; }


.upload .test_wrap {margin-top: 20px;}
.upload .prev_btn02 { font-size: 18px; text-align: center; margin-bottom: 40px; }
.upload .prev_btn02 a {display: inline-block; background: #fff; width:175px; padding: 15px 10px; border-radius: 5px; color:  var(--sc); transition: .5s; border: 1px solid var(--sc); font-weight: 700;}
.upload .prev_btn02:hover a {color: #000;}

.upload .next_btn { font-size: 18px; text-align: center; margin-bottom: 40px; }
.upload .next_btn a {display: inline-block; background: var(--sc); width:175px; padding: 15px 10px; border-radius: 5px; color: #fff; transition: .5s; border: 1px solid var(--sc); font-weight: 700; }
.upload .next_btn:hover a {color: #000;}



.upload .test_wrap {margin-top: 20px;}
.upload .prev_btn02 { font-size: 18px; text-align: center; margin-bottom: 40px; }
.upload .prev_btn02 a {display: inline-block; background: #fff; width:175px; padding: 15px 10px; border-radius: 5px; color:  var(--sc); transition: .5s; border: 1px solid var(--sc); font-weight: 700;}
.upload .prev_btn02:hover a {color: #000;}

.upload .next_btn { font-size: 18px; text-align: center; margin-bottom: 40px; }
.upload .next_btn a {display: inline-block; background: var(--sc); width:175px; padding: 15px 10px; border-radius: 5px; color: #fff; transition: .5s; border: 1px solid var(--sc); font-weight: 700; }
.upload .next_btn:hover a {color: #000;}




/* ********************** 함께하기 - 참여가능 프로그램   ************************  */

.work .work_wrap h2 {font-size: 20px; font-weight: 600; margin: 30px 0 10px 0;}
.work .work_guide  { border: 1px solid var(--sc);  padding: 15px 20px; border-radius: 8px; margin-bottom: 30px;}
.work .work_guide p {font-size: 16px;  line-height: 1.45; border-bottom: 1px dotted #ddd; padding: 4px 0; }
.work .work_guide p:last-child {border-bottom: none;}
.work .work_guide p span {color:var(--pc); font-weight: 600;}


.work .work_wrap table {
  border: 1px #a39485 solid;
  font-size: 18px;
  box-shadow: 0 2px 5px rgba(0,0,0,.10);
  width: 100%;
  border-collapse: collapse;
  border-radius: 5px;
  overflow: hidden;
}

.work .work_wrap th {
  text-align: left;
}
  
.work .work_wrap thead {
  font-weight: bold;
  color: #fff;
  background: var(--sc);
}
  
 .work .work_wrap table td {
  padding: 20px 15px; 
  vertical-align: middle;
}

 .work .work_wrap table th {
  padding: 15px 15px; 
  vertical-align: middle;
}
  
 .work .work_wrap td {
  font-size: 18px;
  font-weight: 600;	
  line-height: 1.35;
  border-bottom: 1px dotted rgba(0,0,0,.3);
  background: #fff;
}


 .work .work_wrap tbody th:nth-child(3) {
   color: #bbdefb;
  }


 @media all and (max-width: 440px) {
    

	.work .work_wrap table td {
		font-size: 16px;
		padding: 20px 10px; 
		vertical-align: middle;
	}
	.work .work_wrap td {
    font-size: 16px;
  
  }
}

/* ********************** 상세정보 참여 페이지   ************************  */

.work .more_wrap h2 {font-size: 20px; font-weight: 600; margin: 30px 0 10px 0;}

.work .more_wrap .more_box p{font-size: 18px; font-weight: 500; line-height: 1.40;}
.work .more_wrap .more_box p br {display: none;}
.work .more_wrap .more_box span {font-size: 16px; font-weight: 600;}
.work .more_wrap .more_box strong {display: block; font-size: 22px; font-weight: 700; color: var(--bsc); text-align: center; margin: 40px 0 10px 0;}
.work .more_wrap .more_box ul {width: 80%; margin: 0 auto;}
.work .more_wrap .more_box ul>li {
    display: flex;
    gap: 60px;
    border-bottom: 1px solid #ddd;
    padding: 20px 20px;
    align-items: center;
}
.work .more_wrap .more_box ul>li:nth-child(1) { border-top: 2px solid #ddd;}

.work .test_wrap {margin-top: 20px;}


.work  .form_wrap {margin-bottom: 3px;}
.work .form_control { display: block; width: 100%;  font-size: 16px; line-height: 1.4; color: #555; background-color: #fff; background-image: none; border: 0;  border-bottom: 1px solid #ddd; padding-left: 6px;}



/* ********************** 운동모임 만들기   ************************  */

.work .make_wrap table {width: 100%; max-width: 500px; margin: 0 auto;  border-spacing: 20px 10px;  }

.work .make_wrap table .txt {display: flex;  flex-direction: column; gap:15px 0; padding: 15px 0;}

.work .make_wrap table .mobile {display: flex;}
.work .make_wrap table tr {}
.work .make_wrap table th {background: #f9f9f9; border-radius: 5px; border: 1px solid rgba(0, 0, 0, 0.02); line-height: 1.25; padding: 20px 10px}
.work .make_wrap .mobile_wrap {display: flex; } 
.work .make_wrap .mobile {width: 80px;  font-size: 16px; line-height: 1.4; color: #555; background-color: #fff; ; border: 0;  border-bottom: 1px solid #ddd;  } 
.work .make_wrap table td {vertical-align: bottom;}
.work .make_wrap table td span {margin: 0 10px;}
.work .make_wrap table td span.bar {padding: 0px 3px; color: #666}
.work .make_wrap table .cho {display: flex;  font-size: 17px; font-weight: 500; }
.work .make_wrap table .cho .cho01 { width: auto;  flex-grow: 1;}
.work .make_wrap table .date_time {display: inline-block;}
.work .work_guide strong {display: block; font-size: 18px; font-weight: 700; margin: 20px 0 10px 0;}

/* 강사 내용 토글 */
.work .th_wrap00 { flex-grow: 1;}
.work .th_wrap { display: flex;  justify-content: space-between; align-items: center; }
.work .th_wrap .toggle_button { display:block; color:var(--bc); font-weight: 700; transition: transform 0.4s; cursor: pointer;}
.work .th_wrap .toggle_button i {margin: 0 0 0 2px;}
.work .th_txt { display: none; overflow-x:hidden;  width:100%; height:250px; margin-top: 20px;}
.work .th_txt .img_box { margin-bottom: 10px; }
.work .th_txt .img_box img {border-radius: 50%;}
.work.th_box>li strong { display: block; font-size: 18px; color: #000;}
.work .th_box>li {
  display: flex;
  gap: 20px;
  border-bottom: 1px solid #ddd;
  padding: 20px 20px;
  align-items: center;
}

table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 20px;
}

table.th_table {
    border-collapse: collapse;
    width: 100%
}

table.th_table tr>* {
    border-bottom: 1px solid #ddd;
    padding: 10px 0;
}

table.th_table tbody tr>*:first-of-type {
    border-right: 1px solid #ddd;
	width: 80px;
}

table.th_table tbody tr>*:not(:first-of-type) {
    padding-left: 5px;
	
}






/* ***********************  게시판 - 리스트, 쓰기,보기  *************************  */

.bo_content h3 {font-size: 22px; font-weight: 600; border-bottom: 2px solid #00000061; padding: 0 0 10px 0; margin-bottom: 20px;}
.bo_content .v_table tbody > tr  {border-bottom: 1px solid #ddd;}


.pagination { display: flex; gap:10px;  align-items: center; justify-content: center; margin: 20px auto 0 auto; }
.pagination a.active {background: var(--sc); color: #fff; padding: 2px 5px; border-radius: 2px;}


.w_table {  width: 100%; max-width: 100%; table-layout: fixed;}

.board-write table.w_table textarea { min-height: 200px; resize: none;}
.w_table tbody > tr > td {vertical-align: middle; padding: 12px 7px; border-top: 0; border-bottom: 1px solid #ddd;}

.board .form-control { display: block; width: 100%;  height: 32px; padding: 6px 12px; font-size: 13px; line-height: 1.4; color: #555;
	background-color: #fff; background-image: none; border: 1px solid #ccc; outline: 0 !important; -webkit-box-shadow: none !important;}

.b_table tbody > tr > td {
    vertical-align: middle;
    padding: 12px 7px;
    border-top: 0;
    border-bottom: 1px solid #ddd;
   text-align: center;
	line-height: 1.25;
}


.v_table  tbody > tr {
	 border-top: 0;
    border-bottom: 1px solid #ddd;
}

.v_table  tbody > tr > td {
    vertical-align: middle;
    padding: 12px 7px;
    border-top: 0;
 
}


.btn_write {text-align: right;  margin-top: 20px; }
.btn_write a {font-size: 14px; padding: 6px 20px;  background: #f1f1f1; border-radius: 25px;}


 .content_list {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
	gap : 10px 0;
	margin-bottom:30px;
}

.content_list>li {
    padding: 30px;
    background: white;
    border-radius: 15px;
    box-shadow: 1px 1px 7px rgba(0, 0, 0, 0.1);
}

.content_list .title {
    display: flex;
    justify-content: space-between;
}

 .content_list .title h2 {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 20px;
	   color: var(--bc);
}

.content_list .title a {
    line-height: 10px;
	transition:.5s;
}

 .content_list .title a::after {
    content: '\e93f';
    font-family: xeicon;
}

.content_list .title a:hover {
    color: var(--bc);
}



/* ************* 건강적금 - 원격트레이닝, 운동모임 탭  ***************  *//

 .content_list>li .work_class {
    padding: 0;
    overflow: hidden;
}

 .work_class .class_list {
    display: flex;
}

 .work_class .class_list>li {
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1;
    height: 60px;
    font-size: 20px;
	cursor:pointer;
}

 .work_class .class_list>li.active {
    font-weight: 700;
    color: var(--pc);
	 
}

 .work_class .class_list>li:not(.active) {
    background: #f5f5f5;
	color: #666
}

.work_class .class_cont>li {
    padding: 15px 30px 20px;
	height: 100%;
}

 .work_class .class_cont>li:not(.active) {
    display: none;
}

 .work_class .board li {
	height: 40px;
    padding: 10px 0;
}

 .work_class .board li~li {
    border-top: 1px solid #f2f2f2;
}


 .work_class .board li a {
    display: flex;
    justify-content: space-between;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
}

 .work_class .board span {
    display: flex;
    align-items: center;
    background: var(--pc);
    color: white;
    font-weight: 300;
    font-size: 12px;
    padding: 5px 12px;
    border-radius: 12px;
}

 .work_class .board .wait{
    display: flex;
    align-items: center;
    background: #f1f1f1;
    color: #000;
    font-weight: 300;
    font-size: 12px;
    padding: 5px 12px;
    border-radius: 12px;
}



 .counsel .board li {
    padding: 5px 0;
}

 .counsel .board li:first-of-type {
    padding-top: 5px;
}

 .counsel .board li~li {
    border-top: 1px solid #f2f2f2;
}

 .counsel .board li a {
    display: flex;
    justify-content: space-between;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
}

 .counsel .board strong {
    line-height: 24px;
}

 .counsel .board span {
    display: flex;
    align-items: center;
    background: var(--bc);
    color: white;
    font-weight: 300;
    font-size: 12px;
    padding: 3px 12px;
    border-radius: 12px;
}

 .counsel .board .wait{
    display: flex;
    align-items: center;
    background: #f1f1f1;
    color: #000;
    font-weight: 300;
    font-size: 12px;
    padding: 5px 12px;
    border-radius: 12px;
}


/* *********************** 회원탈퇴 *************************  */

.member_out  .form_wrap {margin-bottom: 3px;}
.member_out .form_control { display: block; width: 100%;  font-size: 16px; line-height: 1.4; color: #555; background-color: #fff; background-image: none; border: 0;  border-bottom: 1px solid #ddd; padding-left: 6px;}
.member_out .form_control_m { display: block; width: 100%;  font-size: 16px; line-height: 1.4; color: #555; background-color: #fff; background-image: none; border: 0;  border: 1px solid #ddd; border-radius: 3px; padding-left: 6px;}
.member_out  table {width: 100%; max-width: 500px; margin: 0 auto;  border-spacing: 20px 10px;   border-top: 1px solid #666;
    border-bottom: 1px solid #ddd; padding: 20px 0; }
.member_out  table .txt {display: flex;  flex-direction: column; gap:15px 0; padding: 15px 0;}
.member_out  table .mobile {display: flex;}
.member_out  table tr {}
.member_out  table th {background: #f9f9f9; border-radius: 5px; border: 1px solid rgba(0, 0, 0, 0.02); line-height: 1.25; padding: 20px 10px}
.member_out  .mobile_wrap {display: flex; } 
.member_out  .mobile {width: 80px;  font-size: 16px; line-height: 1.4; color: #555; background-color: #fff; ; border: 0;  border-bottom: 1px solid #ddd;  } 
.member_out  table td {vertical-align: bottom;}
.member_out  table td span {margin: 0 10px;}
.member_out  table td span.bar {padding: 0px 3px; color: #666}
.member_out  table .cho {display: flex;  font-size: 16px; line-height: 1.40}
.member_out  table .cho .cho01 { width: auto;  flex-grow: 1;}
.member_out  table .date_time {display: inline-block;}

.member_out table.table td li .tit { float: left; min-width: 60px;}
.member_out table.table td li { line-height: 32px;}

.btn_out {margin: -10px 0 0 0; cursor: pointer;}
.btn_out a {display:inline-block;  background: #f1f1f1; padding: 10px; border-radius: 5px; }






/* ***********************  ☆☆☆☆☆☆☆☆ mobile ☆☆☆☆☆☆ *************************  */
@media all and (max-width: 1280px) {

}


@media all and (max-width: 1024px) {
    body {min-width: inherit;}
    .container {width: 100%;padding: 0 0;}
    #wrap {position: relative;overflow-x: hidden;}
    #wrap>#content {min-height: inherit;}
}


@media all and (max-width: 960px) {

/* ***********************  join02 - 회원가입 정보입력 *********************  */
    .join .table tr { padding: 20px 0; display: flex; flex-direction: column; align-items: stretch;}
    .join .table th { min-width: 0; margin-bottom: 15px;}
    .join .join-form table.table td .help-block { margin-top: 10px; line-height: 1.45;}
}


@media all and (max-width: 768px) {

    .all_tit h2 {font-size: 72px;}

/* ******************   membership01 - 회원가입  ****************  */
    .welcome .sns-login dd a {margin-left: 0; margin-top: 10px;}
    .welcome .sns-login dd {text-align: left; display: flex;
    flex-direction: column;}
    .welcome .sns-login dd .naver {font-size: 14px; padding: 6px;}
    .welcome .sns-login dd .kakao {font-size: 14px; padding: 6px;}

/* ******************* join02 - 회원가입 정보입력 ***************  */
    .join .birth .form_control {width: 60px;}
    .join .phone .form_control {width: 80%;}


 /* ******************   test - 나의 운동능력 측정   ****************  */    

}




@media all and (max-width: 580px) {
	
	.join .form_control {width: 100%;}

    /* ******************   test - 나의 운동능력 측정   ****************  */
        .test01 .guide_video .g_itm .itm_txt {flex-direction: column; align-items: flex-start;}
     
        .test01 .test_top ul>li .no_p  {font-size: 15px; line-height: 1.25; padding: 10px 20px; border-radius: 20px;}
        .test01 .test_top ul>li .no_p br {display: none;}
	   
        .test01 label { margin-bottom: 10px; }
	    .test01 .guide_video .g_itm .itm_txt h3 {font-size: 18px; }
	 .test01 .guide_video .form_wrap .txt { display: grid; grid-template-columns: repeat(3, 1fr);}
	.test01 .saving_list ul>li strong br {display:block;}

/* **********************  test03 - 측정결과  ************************  */
.test01 .result_wrap .result_box .box_inner {width: 90%; gap: 20px;}
	
	.analyze .guide_txt p {font-size: 16px;}	
	
	.work .make_wrap table .cho .cho01 {width: 100%;}
	.work .more_wrap .more_box ul>li {gap:30px;}
	
	
	
}


@media all and (max-width: 480px) {

/* *********************** 공통 *********************  */
    .all_tit h2 {font-size: 56px;}
    .all_wrap strong {font-size: 26px;}
    .all_wrap .smm_h2 {font-size: 16px; line-height: 1.45;}
    .sub-top h1 {font-size: 28px;}
    .sns-login dt {font-size: 18px;}
    .sns-login dd a {font-size: 16px;}
    .sns_btn a {width:100%; }
    .slex_btn a {width:100%; }

    .two_tit h2 {font-size: 24px; }
	.two_tit h2 br {display: none;}
    .two_tit p {font-size: 16px;}
   


    .idpw_result .login-footer span br{display: block;}

/* *********************** join02 - 회원가입 정보입력 *********************  */
    .join .table td span.bar {padding: 0px 3px;}
    .btn-box { margin: 30px 0 50px 0; text-align: center;}
    .btn.dark {margin-right: 0;}
    .btn-box .btn { width: 120px; height: 40px; font-size: 14px;}





/* ******************   test - 나의 운동능력 측정   ****************  */ 
    .test01 .test_tit h2 {font-size: 28px; line-height: 1.35;}   
    .test01 .test_top ul>li .no_p  {font-size: 14px; line-height: 1.25;padding: 10px 12px; border-radius: 20px;}
    .test01 .guide_video .g_itm .itm_txt h3{line-height: 1.45; }
    .test01 .guide_video .g_itm .itm_txt h3 br {display: none; }
    .test01 .guide_video .g_itm .itm_txt p {font-size: 18px;}
    .test01 label {margin-bottom: 10px;}
    .test01 .test_top ul>li .no_p br {display: none;}
	
	.test01 .test_top ul {gap : 30px;}
	.test01 .test_top ul>li~li::before {left:-20px;}

    .test01 .test02_wrap {text-align: center;}
    .test01 .test02_wrap .form_ab_wrap  { display: grid; grid-template-columns: repeat(2,1fr);}
    .test01 .test02_wrap label {width: 100px; text-align: center;}
	.test01 .guide_video .g_itm .itm_txt h3 {font-size: 16px; }

    .prev_btn a, .prev_btn02 a  {font-size: 16px; font-weight: 700; width: 170px;}
    .next_btn a {font-size: 16px; font-weight: 700; width: 170px;}


/* **********************  test03 - 측정결과  ************************  */


	.test01 .result_wrap .result_box {border-radius: 15px 15px 50px 50px}	

	.test01 .result_wrap .result_box .box_inner {flex-direction: column; height: 100%; bottom: -50%;}
	.test01 .result_list {padding: 220px 15px 0 15px; }
	.test01 .result_list ul { grid-template-columns: repeat(2,1fr); gap: 20px 10px;} 
	.test01 .result_wrap .rs_tit span {font-size: 28px;}
	.test01 .result_wrap .rs_tit p {font-size: 18px;}
	.test01 .saving_list ul>li {border-top: 1px solid rgba(255,255,255,.2);}
	.test01 .saving_list {padding:230px 0 0 0}	

	.health_btn a , .body_btn a {width: 100%;}
	.body_btn p {font-size: 16px; line-height: 1.45;}

/* **********************  membership02 - 회원가입완료  ************************  */
	.membership .mem_h2 {font-size: 38px; line-height: 1.25;}
	.membership .member_wrap .txt p {font-size: 16px;}
	
	
/* **********************  dlaily - 하루운동시작  ************************  */	
	.daily .guide_txt p {font-size: 16px}	
	.daily .guide_video .g_itm {padding: 25px 15px 10px 15px}
	
	
/* **********************  mypage - 나의 건강적금  ************************  */	
	.test01 .saving_list ul {gap: 0 0; padding: 0 0 0 0;}

	.success .sc_wrap .sc_txt02 .sc_box {width: 80%; }

	.upload .sc_wrap .sc_txt strong {font-size: 16px;}
	.upload .sc_wrap .sc_txt p {font-size: 18px;}

	.work .more_wrap .more_box ul>li {flex-direction: column; gap: 10px; border-bottom: 1px dotted #ddd; padding: 15px 20px;; align-items: flex-start;}
	.work .th_wrap {gap:20px;}

	.work .work_wrap h2 {font-size: 18px; text-align: center;}
	
	.work .form_control {margin-bottom: 20px;}	
	.work .make_wrap table tr { text-align: left; display: flex;flex-direction: column;}
	.work .make_wrap table th {padding: 10px 0; background: none;}	

	.work .make_wrap table .date_time {margin-top: 20px;}	
	.work .make_wrap table .mobile {margin-top: 20px;}	
	.work .make_wrap table td span.bar {margin: 20px 10px;}
	.work .th_wrap00 {width: 100%;}	
	.work_class .class_list>li {font-size: 18px;}	
	.content_list .title h2 {font-size: 18px;}

	.member_out .form_control {margin-bottom: 20px;}	
	.member_out  table tr { text-align: left; display: flex;flex-direction: column;}
	.member_out  table th {padding: 0 0; background: none;}		
	.member_out table .cho .cho01 {width: 100%; margin-top: 0;}	
	.member_out ul {margin-top: 10px;}
}    
    



@media all and (max-width: 380px) {
	
	.all_wrap .smm_h2 {line-height: 1.25;}
	.all_wrap .smm_h2 br {display: block;}
	
	.test_tit h2 {font-size: 24px; line-height: 1.25;} 
	
	.test01 .test_top ul {gap:25px;}
	.test01 .test_top ul>li~li::before {left: -20px;}
	 .test01 .test_top ul>li .no_p  {font-size: 12px; line-height: 1.25;  padding: 10px 12px; border-radius: 25px; height: 50px; display: flex; align-items: center;}
	
	.test01 .guide_video .g_itm {padding: 20px 10px;}
	.test01 .guide_video .g_itm .itm_txt h3 br {display: block; line-height: 1.65;}
	.test01 .guide_txt p {font-size: 16px;}
	
	 .test_tit h2 {font-size: 24px;}
	
	/* **********************  dlaily - 하루운동시작  ************************  */	
	.daily .guide_txt p {text-align: center;}
	
	.test_wrap {gap: 5px;}
	
	.prev_btn a, .prev_btn02 a {width: 100%;}
	.prev_btn02 a, .next_btn a {width: 100%;}
	.prev_btn {margin-bottom: 0;}
	
	.btn-box .btn {width: 100%;}
	.btn.dark {margin-bottom: 5px;}
	
	.work .more_wrap .more_box p br {display: block;}
	
	.test01 .saving_list ul {grid-template-columns: repeat(2,1fr);}
	
	.content_list>li { padding: 30px 15px;}
}



@media all and (max-width: 320px) {
	
	.two_tit p span {display: inline-block;}

    /* ******************* join02 - 회원가입 정보입력 ***************  */
    .join .birth .form_control {width: 100%;}

/* ******************   test - 나의 운동능력 측정   ****************  */ 

        .test01 .test_top ul{gap: 20px;}
        .test01 .test_top ul>li~li::before {top:40%; left: -18px; width: 10px;  height: 10px; }
        .test01 .test_top ul>li .no_p  {font-size: 12px; }
        .test01 .guide_video .g_itm .itm_txt p {font-size: 16px;line-height: 1.45; text-align: center; }

	.test01 .result_wrap .rs_tit span {font-size: 24px;}
	.test01 .result_wrap .rs_tit p {font-size: 16px;}
	
	.test01 .test02_wrap .form_ab_wrap {grid-template-columns : repeat(1,1fr);}
	.test01 .test02_wrap p {font-size: 16px; line-height: 1.25;}

    .login .id_desc p {font-size: 14px;}


/* **********************  test03 - 측정결과  ************************  */ 


	.success .sc_wrap .sc_txt02 .sc_box p span {display: block;}
	
	.work .more_wrap .more_box p{font-size: 16px;}
	.work_class .class_list>li {font-size: 16px;}	
	.content_list .title h2 {font-size: 16px;}


	.login .id_desc {gap:20px;}
	.login .id_desc>li~li::before {left: -10px;}

}