input{border:1px solid #ddd !important;padding:10px;display: flex;border-radius: 10px;}
.login .text_input{width: 100% !important; padding:20px;margin-bottom:20px;}
.login .d-block{color:#666;}
.login .fin_ul{display: flex;font-size:0.9rem;color:#666;justify-content: center;}
.login .fin_ul li{margin:0 10px;}
.login .btn-secondary3{width: 100%;padding:20px;border-radius: 10px;}
.certified_n button {
    margin-left: 10px;
    padding: 5px;
    font-size: 0.9rem;
    font-weight: 500;
    border-radius: 0.2em;width: fit-content !important;
}
.certified_n button.btn-secondary4 {
    background-color: #fff !important;
    color: #999 !important;
    border: 1px solid #ddd !important;
}



h4{font-size:2.5rem !important;}


section.con{padding:180px 0 120px;;}
.certified_n {
    position: absolute;
    width: max-content;
    right:27%;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1em;
    color: #888;
}

/* .jion */
.join .filebox .upload-display {margin-bottom: 5px; width: 300px;   height: 300px;   display: block;   border-radius: 220px;   margin: 0 auto;   border: 1px solid #ddd;    overflow: hidden;}
.join .filebox .file_img_view {    width: 300px;   height: 300px;   display: block;   border-radius: 220px;   margin: 0 auto;   border: 1px solid #ddd;overflow: hidden;} 
  .join  .filebox .upload-thumb-wrap {display: inline-block;      width: 100%;
    height: 100%; padding: 0;  vertical-align: middle;border-radius: 5px;  background-color: #fff;} 
  .join  .filebox .upload-display img {display: block;    max-width: 100%;width: 100% \9;height: auto;}
  .join .upload-hidden{display: none;}

  .join  .filebox label{border:1px solid #ddd;    padding: 15px; border-radius: 10px;   width: 50%;display: block;margin:0 auto 30px;margin-top: 20px;color: #888;font-size: 0.9rem;text-align: center;}




.join > div > div{width:40%;margin: 0 auto;}
.join  h3{font-size:2rem; text-align: center;margin-bottom:40px;}

span.required{color:red;    display: contents;}
.join > div > div h6{margin-bottom:10px; font-size: 1.25rem; font-weight: bold;font-family: 'Pretendard-Bold';}
.bottom{margin-top:60px}
.bottom02{margin-top:60px}
.bottom .jion_list{border-top:1px solid #000;}
.jion_list{border-top:none;}
.jion_list li{margin:15px 0;display: flex;    justify-content: flex-start;}
.jion_list li.mt-2{margin-top: 1.2em !important;}
.jion_list li .jion_title{width:100%;font-size:1rem;width: 25%;}
.jion_list li .jion_title p{margin-bottom: 9px; padding-top: 8px;height: 100%;
    display: flex;
    align-items: center;}
.jion_list li .jion_right{width:100%;/* height: 100%; */}
.jion_list li .jion_right.cell { border:1px solid #ddd;width:85%;/* height: 100%; */}
.correction .jion_list li .jion_right.cell { border:none;width:85%;/* height: 100%; */}
.jion_list li .id_input{display: flex;position: relative;}
.jion_list li .jion_right select{ padding: 15px;outline: 0; width: 100%; border: 1px solid #ddd;    border-radius: 10px;}

.jion_list li .id_input .input_text{width:70%;}
.jion_list li .id_input button{width:30%; background-color: #000; color:#fff;font-weight: 300;}


.jion_list li .input_p{color: #666;margin-bottom:8px;;}
.jion_list li .input_p span{display: inline-block;color: #3d98d9;transform: translateY(-2px);margin-left:2px;}
.jion_list li .jion_right .input_text{padding:15px; outline:0; width:100%; border:1px solid #ddd}
.gender_input {margin-top: 8px;}
.jion_list li .birth_input{display: flex; align-items: center;}
.jion_list li .birth_input .input_text{border:none;}
.jion_list li .birth{border:1px solid #ddd; display: flex;align-items: center; width:70%; padding-right:10px;}
.jion_list li .jion_right.birth_input>div{width:100%;}
.jion_list li .birth_flex{display: flex;width: 100%;}
.jion_list li .birth>div{display: flex;width:33.3%;justify-content:center;align-items: center;}
.jion_list li .jion_right.birth_input>div>p{font-size:13px; color:#888;margin-top:5px;}
.jion_list li .birth select{padding:10px;width:100%; color:#888; border:none;/* margin-right:10px; */; box-shadow: none;}
.jion_list li .birth select option{border:1px solid #ddd !important; color:#000;width:100%;}

.but button{width: 100%;padding:20px;border-radius: 5px;margin-top:50px}
.delet_but{display: flex;justify-content: right;margin-top: 20px;}
.delet_but button{padding:12px ;width:100px;font-weight: 400;font-size: 0.9rem;}
.delet_but button + button{margin-left: 10px;;}


.join .check_sec li{display: block;margin-bottom:20px;}
.join .check_sec li:last-child{margin-bottom:0;}
.join .check_sec span.xsmall2{color:#666;}
.join .check_sec .scroll_box{min-height: 200px;overflow-y: scroll;border:1px solid #ddd;width: 100%;margin-top:10px;padding:10px;    height: 200px;color: #666;font-size: 0.9rem;}


/* join_next */
.join_next h3{margin:30px 0 10px 0}

.join_next{padding:180px 0 120px;}
.check_arr{width:100px; display: block; height:100px; margin:0px auto}
.check_arr img{width:100%;}
.join_next h3{text-align: center; font-size:2rem;}
.join_next .top{text-align: center; font-size:1rem;color: #666;}
.join_next_name{font-weight: bold;display: inline;}
.join_next .id_find_{margin-top:40px; text-align: center;}
.join_next .body.fint_next{margin-top:20px;}
.join_next .body{margin-top:60px;}
.join_next .body ul{ margin:0 auto;border-top:1px solid #000;border-bottom:1px solid #000}
.join_next .body ul li > div{padding:15px 0;display: flex;justify-content: space-between; border-bottom:1px solid #ddd}
.join_next .body ul li:last-child div{border-bottom:none}
.join_next .body ul li div .left{width: 20%; color:#888; font-weight: bold; }
.join_next .body ul li div .right{width: 80%;color:#000; font-weight: bold; text-align: right;}


.join_next .join_next_but{display: flex;justify-content: space-between; }
.join_next .join_next_but > div{width:calc(50% - 10px);margin-right:10px}
.join_next .join_next_but > div:last-child{margin-right:0;}
.join_next .join_next_but .button button{width:100%; padding:20px 0;margin-top:40px}
.join_next .join_next_but .login_but button{background-color: #000;color:#fff;border:1px solid #000}
.join_next .join_next_but .end_buts button{background-color: #fff;color:#000; border:1px solid #000}



/* 아이디비밀번호 찾기 */


.find_id .login_tabs{display: flex;justify-content: center;margin-bottom:20px;}
.find_id .login_tabs li{}
.find_id .login_tabs li a{margin:0 10px;font-size: 1rem;;border:1px solid #ddd;padding:15px 40px;display: block;border-radius: 10px;;}
.find_id .login_tabs li a.on{font-weight:500;border-color:#3d98d9;color:#fff;background: #3d98d9;}



.find_id .top p{font-size:0.9rem; color:#666}
.find_id .panel{text-align: center;margin-bottom:40px;display: none;}
.find_id .panel .center{font-size:1.125rem; margin-top:40px}
.find_id .panel .center p{text-align: left;}
.find_id .panel .certification_number{margin-top:10px;}
.find_id .panel .certification_number > div{display: flex; position:relative}
.sub_txt-wrap{position:absolute;top: 50%; transform: translateY(-50%);font-size: 12px;right: 140px;    display: flex;    align-items: center;}
.sub_txt-wrap .time{font-size:0.9rem;color:#666;transform: translateY(-1px);}
.certification_number .c-pointer {border: 1px solid #888; color: #888; margin-left: 5px; padding: 2px 8px 3px 8px;border-radius: 10px;}
.find_id .panel .certification_number.certification_number02 >div > div{width:100%;}
.find_id .panel .certification_number.certification_number02 >div > div input{width:100%;}
.find_id .panel .certification_number.certification_number02 >div {width: 87%;}


.find_id .panel .certification_number.email div{width:100%;}
.find_id .panel .certification_number.email > div input{width:100%;}
/* .find_id .panel .certification_number{border:1px solid #ddd} */
.find_id .panel .certification_number input{border:none;padding:15px 10px;outline: 0;width: 80%;    margin-right: 10px;}
.find_id .panel .certification_number button{border:1px solid #000;width:21%; background-color: #000; color:#fff}
.find_password .id_text.f_ce {display: flex;justify-content: space-between;
    align-content: center;
    align-items: center;}
    .find_password .id_text.f_ce p{margin-bottom:0;}
.find_id .panel .login02_but{margin-top:40px;}

.find_password .id_text{margin-bottom:20px;}
.find_password .id_text >div{display: flex;}
.find_password .id_text .d-block:first-child {margin-right:15px;}
.find_password .id_text .d-block {font-size:14px;}
.find_password .id_text .d-block input[type="checkbox"] + label {width: 15px; height:15px;    margin-right: 6px;;}
.find_password .id_text p{margin-bottom:10px; text-align: left; font-size:1rem;}
.find_password .id_text input{width:100%; border:1px solid #ddd; padding:15px 10px;}



/*community*/
.community .w_bot_but{text-align: right;margin-top:30px;}
.community .w_bot_but button{padding:10px 40px; border-radius: 40px;;}

/*check_box_category*/

.check_box_category .check-label {padding:0;position: relative;}
.check_box_category .check-label .checkmark{  padding: 15px 30px;;text-align: center;
    height: auto; position: initial;    width: 100%;   display: block;transform: none;color: #888;}


.check_box_category ul{display: flex; }
.check_box_category ul li{margin-right:.6em;width: 33.3%;}

.check_box_category .check-label input:checked ~ .checkmark {background: transparent;border: 1px solid #3d98d9; background-color: #fff;color: #3d98d9;}
.check_box_category .check-label input:checked ~ .checkmark:after{display: none;}


/*community_writing*/
.community_writing .insert > p{color: #666;}
.community_writing .w_bot_but{text-align: center;margin-top:30px;}
.community .w_bot_but button{padding:15px 80px; border-radius: 5px;;}
.community_writing input{width: 100%;border-radius: 5px;    padding: 10px;font-size: 1.125rem;;}
.community_writing textarea{width: 100%;border-radius: 5px;    padding: 10px;font-size: 1.125rem;;min-height: 400px;}

.community .section04 .notice_ul li:hover {border-color: #ddd; box-shadow: none; border-radius: 0;}
.community .section04 .notice_ul li p.txt{transition-duration: 0.2s;}
.community .section04 .notice_ul li:hover p.txt{color:#3d98d9}
.community_view .section04 .notice_ul li:hover p.txt{color:inherit}


.comment {margin-top: 70px;;}
.comment .comment_input{display: flex;background: #f5f5f5;padding:20px;margin-bottom: 40px;;;}
.comment .comment_input > div{width: 100%;border-radius: 0;height:160px;font-family: inherit; padding-right: 20px;}
.comment .comment_input > div textarea{height: calc(100% - 58px); width: 100%; font-family: inherit; font-size: 16px;}

.comment .comment_input button{padding:0 10px;width: 100px;border:1px solid #ddd;font-weight: 400;color: #666;background: #fff; border-radius: 4px;}
.comment .comment_input .filebox{height: 58px;}
.comment ul {padding:0px 0 20px;}
.comment ul li{padding:15px 0;border-bottom:1px solid #eee;}
.comment .com_name{font-weight: 600;font-size: 16px;}
.comment .comment_txt{margin:10px 0;font-size: 18px;color: #333;}
.comment .com_bot_info {display: flex;align-items: center;font-size: 0.85rem;color: #888;}
.comment .com_bot_info button{padding:0;font-size: 0.85rem;color: #888;font-weight: 400;}
.comment .com_bot_info .day + button,
.comment .com_bot_info button + button{margin-left: 6px;;}

.comment .com_bot_info .com_name{font-size: 1rem;color: #333;}

.comment .file_up{border:1px solid #ddd; font-size: 14px; color: #666; display: flex; width: max-content; padding:6px 12px; border-radius: 20px;margin-bottom: 10px;;}

.comment .file_up p{margin-right: 16px; }

/*search*/
.search section{padding:150px 0;}
.search .search_box{    border: 3px solid #3d98d9;    padding: 10px;    display: flex;    border-radius: 40px;width: 60%;margin:0 auto;}
.search .search_box input{width: calc(100% - 50px);    border: none !important;height: auto;font-size: 1.125rem;;}
.search .search_box button {width: 50px;display: flex;
    justify-content: center;
    align-items: center;}
.search .search_box button img {width: 80%;}
.search .search_con{margin-top:40px;}
.search .search_title{font-size: 1.5rem; text-align: center;margin-bottom:30px;border-bottom:3px solid #333;padding-bottom:20px;font-weight: 600;}
.search .search_title span{display: inline;color: #888;}
    .search .search_title strong{display: inline;color: #3d98d9;margin:0 3px;font-weight: 600;}


    .search .team_tabe.player ul li >div { flex-direction: column; padding:20px;border-radius: 15px;;   }
    .search .team_player .team_tabe.player ul li .right_info {width: 100%; }
    .search .team_player .team_tabe.player ul li .i{margin-right:0;margin-bottom:20px;}
    .search .team_player .team_tabe.player ul li{width: calc(33% - 17px);}

    .search .team.team_tabe ul li{width: 100%;}
    .search .team.team_tabe ul li > div{padding:20px;border-radius: 15px;}
    .search .team.team_tabe ul li i{    background-size: 90% !important;}


    
    .search .league.team_tabe ul li .tit{margin:12px 0 6px;}
    .search .league.team_tabe ul li{width: calc(20% - 17px) !important;}
    .search .league.team_tabe ul li .i{border:none;margin:0 !important;}
    .search .league.team_tabe ul li i{    background-size: 90% !important;}
    .search .league.team_tabe .team_name{margin:0;text-align: center;} 
    .search .league.team_tabe .team_name >div{justify-content: center;padding-top:0 !important;} 

    .search .league.team_tabe  i {padding-bottom: 70%;display: block;width: 80%;    }
    /* .search .league.player ul li >div{padding-top:0 !important;  } */


    #secWrap.join > .con {padding-top: 100px;}
    
    
/* ********************************************* *
* 1024px
* ********************************************* */
@media screen and (max-width: 1024px){
    .search .league.team_tabe ul li {width: calc(25% - 20px) !important;}

}
/* ********************************************* *
* 798px
* ********************************************* */
@media screen and (max-width: 798px){
    .search .search_title {  font-size: 1.25rem;}
    
    .search .league.team_tabe ul li {width: calc(33.3% - 20px) !important;    text-align: center;}
    .search .league.team_tabe ul li i { margin: 0 auto;  }

    .search .search_box {width: 100%;}
    .search .search_box input{padding:4px 10px;;}
    .search .search_box input {width: calc(100% - 45px);}
    .search .search_box button {width: 45px;}

    
h4 {font-size: 2rem !important;}
.find_id .login_tabs li a { padding: 12px 40px;   border-radius: 5px;}
.find_id .panel .center {font-size: 1rem; margin-top: 30px;}
.find_id .panel .certification_number input {padding: 12px 10px;border-radius: 5px;;}
.find_id .panel .certification_number button {padding: 12px 10px;border-radius: 5px;;}

.find_password .id_text input{padding: 12px 10px;border-radius: 5px;;}
.find_password .id_text {margin-bottom: 12px;}

.but button {  margin-top: 20px;padding: 15px;}
section.con {padding: 150px 0 70px;}

.check_arr {width: 50px;height: 50px;}
.join_next h3 {margin: 20px 0 10px 0;font-size: 1.5rem;}
.join_next .top { font-size: 0.9rem;}
.join_next .join_next_but .button button {  padding: 15px 0;border-radius: 5px;}




}
/* ********************************************* *
* 500px
* ********************************************* */
@media screen and (max-width: 500px){

    .jion_list li .jion_right .input_text {padding: 12px;border-radius: 4px;}
    .jion_list li .id_input button{font-size: 0.85rem;border-radius: 4px;    width: 150px;}

    .but button { padding: 16px;   border-radius: 4px;}

    .join h3 {font-size: 1.5rem;}

    section.con {padding: 100px 0 40px;   }
    .jion_list li.mt-2{margin-top:10px !important;}
    .jion_list li .jion_right select{ padding: 12px;border: 1px solid #ddd;    border-radius: 4px;font-size: .9em;}

    
/*community*/
.community .w_bot_but button{padding:8px 30px; border-radius: 30px;;}


.search .search_title {  font-size: 1.125rem;text-align: left; margin-bottom: 12px;border-bottom: 2px solid #333;padding-bottom: 12px;}
.search .league.team_tabe ul li {width: calc(33.3% - 10px) !important;}
.search .team_tabe.player ul li >div {border-radius: 5px;    padding: 12px;}
.search .league.team_tabe ul li i {background-size: 100% !important;    width: 100%;    padding-bottom: 100%;}


h4 {font-size: 1.5rem !important;}
.find_id .login_tabs li a {padding: 10px 30px;font-size: 0.9rem;}
.find_id .panel .center {font-size: 0.9rem;}
.find_id .panel .certification_number button {padding: 8px 10px; width: 85px;    font-size: 0.9rem;}
.find_id .panel .certification_number input{width: calc(100% - 85px);padding:10px;}
.but button {padding: 12px; margin: 0; font-size: 0.9rem;}

.find_password .id_text input{padding:10px;}


.join_next .join_next_but .button button {  padding: 12px 0;border-radius: 5px;}
}

/* ********************************************* *
* 400px
* ********************************************* */
@media screen and (max-width: 400px){

    .search .league.team_tabe ul li {width: calc(50% - 10px) !important;}

}

/* ********************************************* *
* 350px
* ********************************************* */
@media screen and (max-width: 350px){

    .jion_list li .id_input button {font-size: 0.75rem;   }
    .jion_list li .jion_right .input_text {padding: 8px}
    .jion_list li .jion_right select{ padding: 8px;}
}