@charset "utf-8";
/* common */
:root {
    --blue: #0079fa;
}

#sub_intro {
    width: 100%;
    height: 430px;
    color: #fff;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    box-sizing: border-box;
    overflow: hidden;

    margin-top: 105px;
}

.sub_intro_text{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

    text-align: center;
}

.sub_route{
    position: absolute;
    bottom: 0%;
    left: 50%;
    transform: translate(-50%, 0%);

    text-align: center;
}

.sub_route ul{
    display: flex;
}

.sub_route ul li{
    width: 240px;
    height: 60px;
    background-color: rgba(0, 0, 0, 0.2);

    display: flex;
    align-items: center;
    justify-content: center;
}

.sub_route ul li.on{
    background-color: var(--blue);
}

#sub_content{
    margin:40px 0 100px;
}

#sub_content .list1 ul {
    display: flex;
    flex-wrap: wrap;
    gap:17px;

    padding: 40px 0;
    border-top: 1px solid #111;

    justify-content: center;
}

/* flex 채우기 */
#sub_content .list1 ul::after,
#sub_content .list2 ul::after {
    content: "";
    /*flex: auto;*/
}

#sub_content .list2 ul {
    display: flex;
    flex-wrap: wrap;
    gap: 50px 10px;

    padding: 40px 0;
    border-top: 1px solid #111;

    justify-content: space-between;
}


#sub_content .list1 ul li{
    /*width: 24%; */
    width: 320px;
    height: 100%;

    cursor: pointer;
}

#sub_content .list2 ul li{
    width: 49%; 
    height: 100%;

    cursor: pointer;
}

#sub_content .list1 ul li .img_wrap{
    border: 1px solid #d7d7d7;
    width:320px;
    height: 320px;
}

#sub_content .list2 ul li .img_wrap{
    border: 1px solid #d7d7d7;
    width: 100%;
    height: 100%;

    padding: 30px;
    box-sizing: border-box;
}

#sub_content .list1 ul li .img_wrap img,
#sub_content .list2 ul li .img_wrap img{
    width: 100%;
    height: 100%;
    /*object-fit: cover;*/

    display: block ;
}

#sub_content .list1 ul li .title{
    margin: 20px 0 20px;
    text-align: center;
}


#sub_content .list3 table{
    border-collapse: collapse;
    width: 100%;

    border-top: 1px solid #111;
}



#sub_content .list3 table tr th,
#sub_content .list3 table tr td{
    padding: 24px 0;   
    text-align: center;

    border-bottom: 1px solid #d7d7d7;
}

#sub_content .list3 table tr th{
    background-color: #f3f3f3;
    font-family: 'Pretendard-Medium', sans-serif;
}

#sub_content .list3 table tr td{
    font-family: 'Pretendard-Regular', sans-serif;
    font-size: 18px;

    cursor: pointer;
}

#sub_content .list3 table tr td span{
    padding-left: 10px;
}

#sub_content .list3 table th:first-child,
#sub_content .list3 table td:first-child{
    width: 3%;
}

#sub_content .list3 table th:nth-child(2),
#sub_content .list3 table td:nth-child(2){
    width: 7%;
}

#sub_content .list3 table th:nth-child(3),
#sub_content .list3 table td:nth-child(3){
    width: 18%;
}

#sub_content .list3 table th:nth-child(4),
#sub_content .list3 table td:nth-child(4){
    width: 6%;
}

#sub_content .list3 table th:last-child,
#sub_content .list3 table td:last-child{
    width: 6%;
}


#sub_content .write_btn{
    color: white;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 100px;
    height: 44px;

    background-color: var(--blue);
    /* float: right; */
}


#sub_content .detail_wrap .name_date{
    border-bottom: 1px solid #d7d7d7;   
}

#sub_content .detail_wrap .name_date .date{
    color : #777777;
}

#sub_content .detail_wrap .content img{
    display: block;
    max-width: 100%;
	margin-bottom: 10px;
}

#sub_content .detail_wrap .attach_wrap{
    width: 100%;
    border: 1px solid #d7d7d7;   
}

#sub_content .detail_wrap .attach_wrap .attach_top{
    background-color: #d7d7d7;    
}

#sub_content .detail_wrap .attach_wrap .attach_bottom{
    padding: 0 16px;
}

#sub_content .detail_wrap .attach_wrap .attach_top{
    padding: 16px;
}

#sub_content .detail_wrap .attach_wrap .attach_bottom ul li{
    cursor: pointer;
    transition: 0.2s;

    padding: 8px 0px;
}

#sub_content .detail_wrap .attach_wrap .attach_bottom ul li:hover{
    color: var(--blue);
}

#sub_content .detail_wrap .btn_wrap{
    border-bottom: 1px solid #d7d7d7;
}

#sub_content .detail_wrap .btn_wrap .btn{
    width: 100px; 
    height: 45px; 
    border: 1px solid var(--blue);

    display: flex;
    align-items: center;
    justify-content: center;

    cursor: pointer;
}

#sub_content .detail_wrap .btn_wrap .btn1{
    background-color: var(--blue);
    color : white;
}

#sub_content .detail_wrap .btn_wrap .btn2{
    background-color: white;
    color: var(--blue);
}

#sub_content .detail_wrap .answer_wrap{
    border-bottom: 1px solid #d7d7d7;
}

#sub_content .detail_wrap .answer_wrap .title p span{
    color: #777;
}

#sub_content .detail_wrap .list_btn{
    display: flex;
    align-items: center;
    justify-content: center;

    width: 120px;
    height: 45px;
    background-color: var(--blue);
}

#sub_content .detail_wrap .list_btn i{
    padding-right: 8px;
}

#sub_content .sub3_1_w_section .btn_wrap .btn{
    width: 115px;
    height: 45px;
}

#sub_content .detail_wrap .form_info{
    text-align: right;
}

#sub_content .detail_wrap .form_info p{
    color: #777;
}

#sub_content .form_wrap ul li .title p{
    font-family: 'Pretendard-Regular', sans-serif;
}

#sub_content .detail_wrap .form_info p span,
#sub_content .form_wrap ul li .title p span{
    color: #f80000;
}

#sub_content .form_wrap ul{
    display: flex;
    flex-direction: column;
    border-top: 2px solid black;
}

#sub_content .form_wrap ul li{
    display: flex;
    align-items: center;

    border-bottom: 1px solid #d7d7d7;
}

#sub_content .form_wrap ul li .title{
    background-color: #f3f3f3;

    padding: 25px 30px;    
    min-width: 170px;
    width: 170px;

    display: flex;
    box-sizing: border-box;
}

#sub_content .form_wrap ul li .title.title_fix{
    padding: 0px 30px;
    align-items: center;
    height: 99px;
}

#sub_content .form_wrap ul li .input{
    width: 100%;
    padding: 0 25px;
}

#sub_content .form_wrap ul li .input input,
#sub_content .form_wrap ul li .input textarea{
    border: 1px solid #d7d7d7;
    padding: 12px 15px;
}

#sub_content .form_wrap ul li .input input{
    width: 510px;   
}

#sub_content .form_wrap ul li .input textarea{
    width: 100%;

    height: 450px;
}

#sub_content .form_wrap ul li.textarea_li .title{
    height: 500px;
}


#sub_content .form_wrap ul li .input input::placeholder,
#sub_content .form_wrap ul li .input textarea::placeholder{
    color: #606060;   
}


#sub_content .form_wrap ul li .input input,
#sub_content .form_wrap ul li .input input::placeholder,
#sub_content .form_wrap ul li .input textarea,
#sub_content .form_wrap ul li .input textarea::placeholder{
    font-size: 17px;    
}

.sub4_1_section{
    padding-top: 50px;
}

.sub4_1_section ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 54px 24px;
}

.sub4_1_section ul li{
    position: relative;
    border-radius: 16px;
    /*width:428px;*/
    width: 31%;
    height: 342px;
    border: 1px solid #d7d7d7;
}

.sub4_1_section ul li .circle{
    border-radius: 64px;
    background-color: var(--blue);
    width: 46px;
    height: 46px;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 26px;
    font-family: 'Pretendard-Bold', sans-serif;


    position: absolute;
    top: -25px;
    left: 50%;
    transform: translate(-50%, 0%);
}

.sub4_1_section ul li .title{
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;

    background-color: #e5f1fe;
    padding: 40px 0 20px;
    text-align: center;
}

.sub4_1_section ul li .content .img_wrap{
    margin-bottom: 20px;
}

.sub4_1_section ul li .content{
    height: 250px;
}

.sub4_1_section ul li .content p{
    color : #777777;
}

.sub4_2_section .total_wrap{
    border-bottom: 1px solid black;
}


.sub4_2_section .total_wrap .total p span{
    color: var(--blue);
}

.sub4_2_section .total_wrap ul{
    display: flex;
}

.sub4_2_section .total_wrap ul li{
    margin-right: 50px;
    padding-bottom: 20px;
}

.sub4_2_section .total_wrap ul li{
    position: relative;
    cursor: pointer;
    width: max-content;
    
    transition: 0.2s;

    border-bottom: 2px solid white;
}

.sub4_2_section .total_wrap ul li.on{
    border-bottom: 2px solid var(--blue);
    color: var(--blue);
}


#sub_content .sub4_3_section .total_wrap ul{
    width: 100%;
}


#sub_content .sub4_3_section .total_wrap ul li{
    width: 12.5%;
    text-align: center;
    margin-right: 0;
}

.search_box.more_btn input[type='button']{
    width: 170px;
    font-size: 20px;
}


#sub_content .sub4_4_section .total_search{
    align-items: flex-end;
}






.sub4_2_section .list ul{
    display: flex;
    flex-wrap: wrap;

    gap: 30px 16px;
    padding-top: 35px;

    justify-content: center;

}

.sub4_2_section .list ul li{
    width: 15.5%;
    height: 100%;
    cursor: pointer;
    border: 1px solid #d7d7d7;
}

/* flex 채우기 */
.sub4_2_section .list ul li::after{
    content: "";
    /*flex: auto;*/
}

.sub4_3_section .showList{
    text-align: center;
}


.sub4_2_section .list ul li img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.sub4_2_section .list ul li .title{
    border-top: 1px solid #d7d7d7;

    padding: 18px 0;
}

#sub_content .sub5_1_section .list3 table th:nth-child(2),
#sub_content .sub5_1_section .list3 table td:nth-child(2){
    width: 31%;
}

.sub5_1_d_section .content{
    border-bottom: 1px solid #d7d7d7;
}

.sub5_2_section table tr td.answered{
    color: var(--blue);
    font-family: 'Pretendard-Bold', sans-serif !important;
}


#sub_content .sub5_2_section .list3 table th:nth-child(1),
#sub_content .sub5_2_section .list3 table td:nth-child(1){
    width: 3%;
}

#sub_content .sub5_2_section .list3 table th:nth-child(2),
#sub_content .sub5_2_section .list3 table td:nth-child(2){
    width: 25%;
}

#sub_content .sub5_2_section .list3 table th:nth-child(3),
#sub_content .sub5_2_section .list3 table td:nth-child(3){
    width: 6%;
}

#sub_content .sub5_2_section .list3 table th:nth-child(4),
#sub_content .sub5_2_section .list3 table td:nth-child(4){
    width: 6%;
}

#sub_content .sub5_3_section .list1 ul li{
    /*width: 250px;*/
}

#sub_content .sub5_3_section .list1 ul{
    gap: 40px 20px;
}

#sub_content .sub5_3_section .list1 ul li .title span{
    color: var(--blue);
}


/* sub5_3_d_section */
.sub5_3_d_section .right .info1 .info_more {
    color :#777777;
}

.sub5_3_d_section .right span{
    color: #de0000 !important;
}


.sub5_3_d_section .left{
    width: 600px;
    margin-right: 20px;
}

.sub5_3_d_section .left .img_wrap img{
    width: 100%;
    height : 100%;
    object-fit: cover;
}


.sub5_3_d_section .right{
    width: 670px;
}

.sub5_3_d_section .right .title{
    border-top: 1px solid black;
}

.sub5_3_d_section .right .title,
.sub5_3_d_section .right .info1,
.sub5_3_d_section .right .info2,
.sub5_3_d_section .right .info3{
    border-bottom: 1px solid #d7d7d7;
}

.sub5_3_d_section .right .input_title{
    width: 120px;
    min-width:120px;
}

.sub5_3_d_section .right .input input{
    width: 200px;
    height:45px;
    border: 1px solid #d7d7d7;
    border-radius: 8px;

    padding: 14px 16px;
    font-size: 16px;
    font-family: 'Pretendard-Regular', sans-serif;
}

.sub5_3_d_section .right .input_fix input{
    width: 450px;
}

.sub5_3_d_section .right .radio_wrap .radio{
    width: 49%;
}


.sub5_3_d_section .btn_wrap2{
    
}

.sub5_3_d_section .btn_wrap2 .btn{
    border-radius: 8px;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 330px;
    height: 60px;
}

.sub5_3_d_section .btn_wrap2 .btn1{
    color: white;

    background-color: var(--blue);
}

.sub5_3_d_section .btn_wrap2 .btn2{
    color: #777777;
    border: 1px solid #777;
    background-color: white;
}


    

/* 마이페이지 */
#mypage{
    margin-top: 105px;

    padding: 170px 0;
}

#mypage .common_content{
    width: 670px;
    /* height: 420px; */
    height: 100%;
    border: 1px solid #d7d7d7;

    padding: 60px 80px;
    box-sizing: border-box;
    text-align: center;
}

#mypage .common_content .title{
    border-top: 1px solid #d7d7d7;
    border-bottom: 1px solid #d7d7d7;
}

#mypage .common_content .title span{
    color: #777777;
}

#mypage .common_content .btn1{

}

#mypage .common_wrap{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

#mypage .common_wrap .btn1{
    display: flex;
    align-items: center;
    justify-content: center;

    color: white;
    background-color: var(--blue);
    width: 100%;
    height:64px;
    border-radius: 8px;
}

#mypage .content_wrap .left{
    width: 150px;
}

#mypage .content_wrap .left .route ul{
    display: flex;
    flex-direction: column;
}

#mypage #sub_content{
    margin: 0;
}

#mypage .content_wrap .left .route ul li:nth-child(1){
    border-bottom: 1px solid black;
}

#mypage .content_wrap .left .route ul li:nth-child(2),
#mypage .content_wrap .left .route ul li:nth-child(3){
    border-bottom: 1px solid #d7d7d7;
}

#mypage .content_wrap .left{
 
}

#mypage .content_wrap .first_pb{
    padding-bottom: 25px;
}

#mypage .content_wrap .right{
    width: 1160px;
    /* padding-left: 185px; */
}

#sub_content .table_fix .list3 table th:nth-child(1),
#sub_content .table_fix .list3 table td:nth-child(1){
    width: 7%;
}

#sub_content .table_fix .list3 table th:nth-child(2),
#sub_content .table_fix .list3 table td:nth-child(2){
    width: 13%;
}

#sub_content .table_fix .list3 table th:nth-child(3),
#sub_content .table_fix .list3 table td:nth-child(3){
    width: 6%;
}

#sub_content .table_fix .list3 table th:nth-child(4),
#sub_content .table_fix .list3 table td:nth-child(4){
    width: 6%;
}

#sub_content .list3.list3_fix table th:nth-child(5),
#sub_content .list3.list3_fix table td:nth-child(5){
    width: 6%;
}

#sub_content .table_fix .list3 table td.on{
    font-family: 'Pretendard-Bold', sans-serif;
    color: var(--blue);
}



#sub_content .table_fix .list3 table td:nth-child(2){
    text-align: left;
}

#sub_content .table_fix .list3 table tr th{
    font-family: 'Pretendard-Medium', sans-serif;
}

#sub_content .table_fix .list3 table tr td{
    font-family: 'Pretendard-Regular', sans-serif;
    font-size: 18px;
}

#mypage.mypage1_d_section {
    padding: 80px 0 110px;
}


#mypage.mypage1_d_section .btn_wrap2 .btn1{
    width: 100%;
}

.mypage3_section input{
    margin-right: 25px;
}

.mypage3_section .custom_checkbox1 label:before{
    left: -25px;
}

.mypage3_section .right .content{
    width: 100%;
    border-top: 1px solid black;
    border-bottom: 1px solid black;

    display: flex;
    align-items: center;
    justify-content: center;
}

.mypage3_section .right .content .box{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    width: 925px;
    height: 435px;
    border: 1px solid var(--blue);
}

.mypage3_section .right .btn1{
    display: flex;
    align-items: center;
    justify-content: center;

    width: 210px;
    height: 64px;
    color:white;
    background-color: var(--blue);
    border-radius: 8px;

    margin: 0 auto;
}

#mypage.login_section .common_content{
    text-align: initial;
}

.login_section .input_wrap input{
    width: 100%;
    padding: 20px;
    border: 1px solid #d7d7d7;
    border-radius: 8px;

    transition: border 0.2s;
}

.login_section .input_wrap input,
.login_section .input_wrap input::placeholder{
    /* font-size: 18px; */
    font-family: 'Pretendard-Light', sans-serif;
}

.login_section .input_wrap input:focus{
    border : 1px solid var(--blue);
}

.login_section #idsave{
    margin-right: 15px;
}

.login_section .btn_wrap .btn{
    width: 100%;
    height: 64px;

    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;

    border: 1px solid var(--blue);

}

.login_section .btn_wrap .btn1{
    background-color: var(--blue);
    color: white;
}

.login_section .btn_wrap .btn2{
    background-color: white;
    color: var(--blue);
}

.login_section .id_pw_wrap p{
    font-family: 'Pretendard-Regular', sans-serif;
    text-decoration: underline; 
    text-underline-position:under;
}


.login_section .id_show{
    border-top: 1px solid #d7d7d7;
    border-bottom: 1px solid #d7d7d7;
    text-align: center;
}

#mypage.join_section .common_content{
    text-align: initial;
}

.join_section .input_wrap{

}

.join_section .input_wrap input{
    border: 1px solid #d7d7d7;
    border-radius: 8px;
    padding: 20px;
    width: 100%;
}

.join_section .input_wrap input,
.join_section .input_wrap input::placeholder{
    font-family: 'Pretendard-Light', sans-serif;
    /* font-size: 18px; */
}

.join_section .input_wrap input::placeholder{
    color: #d7d7d7;
}

.join_section .input_wrap .addr1_wrap .btn{
    display: flex;
    align-items: center;
    justify-content: center;

    background-color: var(--blue);
    color: white;
    border-radius: 8px;

    width: 140px;
    min-width: 140px;
    height: 63px;
}

.join_section .policy_wrap .policy{
    border: 1px solid #d7d7d7;
}

.join_section .policy_wrap .policy_title{
    padding: 20px;
    border-bottom: 1px solid #d7d7d7;
    background-color: #f3f3f3;
}

.join_section .policy_wrap .policy_content{
    width: 100%;
    height: 290px;
    padding: 20px;
    box-sizing: border-box;
    overflow-y: scroll;
}

.join_section .policy_wrap #chk1,
.join_section .policy_wrap #chk2{
    margin-right: 20px;
}

#mypage.join_section .common_wrap .btn1{
    width: 180px;
    height: 64px;
}

#mypage.join2_section .common_wrap .btn1{
    width: 100%;
}

#mypage.join2_section .common_wrap .btn1{
    width: 100%;
}

#mypage.mypage2_section .input_wrap{
    display: flex;
    align-items: center;
}

#mypage.mypage2_section .title{
    width: 200px;
    min-width: 200px;
}

#mypage.mypage2_section .id_show{
    border-top: 1px solid #111;
    border-bottom: 1px solid #111;
}

#mypage.mypage2_section .input_wrap input{
    width: 500px;
}

#mypage.mypage2_section .input_wrap .addr1_wrap input{
    width: 350px;
}

#mypage.mypage2_section .right .btn3{
    display: flex;
    align-items: center;
    justify-content: center;

    background-color: var(--blue);
    color: white;
    border-radius: 8px;

    width: 208px;
    height: 64px;
    margin: 0 auto;
}


/* 페이징 */
.page_btn a{
    width: 38px;
    height: 38px;
    border-radius: 8px;
    border: 1px solid #ccc;

    display: flex;
    align-items: center;
    justify-content: center;
}

.page_btn a.page_num{
    border:none;
    color: white;
    background-color: var(--blue);
}


.total_search {
    width: 100%;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
}

.total_search > p span{
    color: var(--blue);
}


.search_box{
    display: flex;
}

.search_select{
    width: 150px;
    height: 50px;
    border: 1px solid #ccc;
    box-sizing: border-box;
    position: relative;
    margin-right: 5px;
}

.search_select i{
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    font-size: 18px;
    color: #666;
}

.search_select select{
    font-size: 17px;
    color: #333;
    font-family: 'Pretendard-Light', sans-serif;
}

.search_box input[type='text']{
    width: 300px;
    height: 50px;
    border: 1px solid #ccc;
    margin-right: 5px;
    font-size: 17px;
}

.search_box input[type='text']::placeholder{
    font-size: 17px;
    color: #999;
    font-family: 'Pretendard-Regular', sans-serif;
}

.search_box input[type='text']:-ms-input-placeholder{
    font-size: 17px;
    color: #999;
    font-family: 'Pretendard-Regular', sans-serif;
}

.search_box input[type='button']{
    width: 110px;
    height: 50px;
    background-color: var(--blue);
    border: 0;
    font-size: 17px;
    color: #fff;
    font-family: 'Pretendard-Regular', sans-serif;
}






/* sub1 */
.sub1_intro {
    background-image: url("../images/sub_intro1.jpg");
}

/* sub2 */
.sub2_intro {
    background-image: url("../images/sub_intro2.jpg");
}

.sub3_intro {
    background-image: url("../images/sub_intro3.jpg");
}

.sub4_intro {
    background-image: url("../images/sub_intro4.jpg");
}

.sub5_intro {
    background-image: url("../images/sub_intro5.jpg");
}

.login_section .custom_checkbox1 label:before{
    transform: translate(-50%, -3px);
}

.join_section .checkbox_wrapper{
    padding-left: 16px;
}

#mypage.login_section .checkbox_wrapper{
    margin-right: 0;
}

.custom_checkbox1{
    font-family: 'Pretendard-Medium', sans-serif;
}

.custom_checkbox1 label {
    cursor: pointer;
    /* display: inline-block; */
    position: relative;
}

.custom_checkbox1 label:before {  
    content: "";
    width: 25px;
    height: 25px;
    position: absolute;  
    left: -10px;
    transform: translate(-50%, 1px);
}
	
.custom_checkbox1 input[type=checkbox] {  
    /* display: none;   */
    visibility: hidden;
}
	
.custom_checkbox1 label:before {
    background: url('../images/icon_checkbox_unchecked.png') left center no-repeat;
}

.custom_checkbox1 input[type=checkbox]:checked + label:before {  
    background: url('../images/icon_checkbox.png') left center no-repeat;  
} 

.custom_checkbox1 label:before {
    left: -20px;
}





/* 라디오 버튼 크기 및 스타일 커스텀 */
input[type="radio"] {
    appearance: none; /* 기본 스타일 제거 */
    -webkit-appearance: none;
    width: 12px;
    height: 22px;
    border: 1px solid #ddd; /* 테두리 색상 옅게 */
    border-radius: 50%; /* 동그라미 모양 */
    margin: 0;
    cursor: pointer;
    position: relative;
}

/* 체크됐을 때 내부 동그라미 스타일 */
input[type="radio"]:checked {
    /* border-color: var(--blue);  */
    /* 체크됐을 때 테두리 색상 */
}

input[type="radio"]:checked::after {
    content: '';
    width: 10px; /* 내부 동그라미 크기 */
    height: 10px; /* 내부 동그라미 크기 */
    background: white; /* 내부 동그라미 색상 */
    border: 5px solid var(--blue);
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.radio_wrap .radio label {
    display: flex;
    align-items: center;
    gap: 20px;
}


/* 커스텀 select  */
.custom-select-wrapper {
    position: relative;
    user-select: none;
    width: 100%;
}

.custom-select {
    position: relative;
    display: flex;
    flex-direction: column;
    border: 1px solid #d7d7d7;
}

.custom-select_trigger {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #3b3b3b;
    height: 3vw;
    line-height: 0px;
    background: #ffffff;
    cursor: pointer;
    padding: 0 0.5vw;
}

.custom-options {
    width: 100.1%;
    position: absolute;
    display: block;
    top: 100%;
    left: -1px;
    right: 0;
    border: 1px solid #d7d7d7;
    border-top: 0;
    background: #fff;
    transition: all 0.5s;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 2;
}

.custom-select.open .custom-options {
    opacity: 1;
    visibility: visible;
    pointer-events: all;
}

.custom-option {
    position: relative;
    display: block;
    padding: 0 0.5vw;
    line-height: 57px;
    cursor: pointer;
    transition: all 0.5s;
}

.custom-option:hover {
    cursor: pointer;
    background-color: #f6f6f6;
}

.custom-option.selected {
    color: #ffffff;
    background-color: var(--main-color)
}

.join_section .policy_wrap{
    width: 100%;
}


.join_section .custom_checkbox1 label:before{
    transform: translate(-50%, -3px);
}

.policy_content pre {
    white-space: pre-wrap;
}




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


    #sub_content .list2 ul li .img_wrap{
        width: 100%;
        height: 100%;

        padding: 10px;
    }


    .sub4_1_section ul li .title{
        font-size: 20px;
    }

    #sub_content .form_wrap ul li .title.title_fix{
        padding: 10px;
    }

    .page_btn a{
        width: 30px;
        height: 30px;
    }

    #sub_content .list1 ul{
        gap: 8px;
        padding: 30px 0 50px;
    }

    #sub_intro{
        height: 330px;
        margin-top: 80px;
    }

    .sub_route ul li{
        width: 200px;
        height: 45px;
    }

    #sub_content .list2 ul li{
        width: 100%;
        
    }

    #sub_content .list2 ul{
        padding: 20px 0;
        gap: 20px;
    }

    .total_search{
        flex-direction: column;
        gap: 10px;
    }

    .search_select select,
    .search_select{
        font-size: 14px;
        height: 44px;
    }

    .search_box input[type='text']{
        width: 100%;
        height: 44px;
    }

    .search_box input[type='text'],
    .search_box input[type='text']::placeholder,
    .search_box input[type='button']{
        font-size: 14px;
    }

    .sub1_1_section .total_search #search{
        width: 100%;
    }

    .search_box input[type='button']{
        height: 44px;
    }

    .search_select{
        width: 50%;
    }

    #sub_content .list3 table tr td{
        font-size: 13px;
    }
    
    #sub_content .list3 table tr th, #sub_content .list3 table tr td{
        padding: 16px 3px;
    }

    #sub_content .list3 table tr td span{
        padding-left: 5px;
    }

    #sub_content .list3 table tr td img{
        width: 12px;
    }

    #sub_content .write_btn{
        margin-bottom: 20px;
    }

    #sub_content .form_wrap ul li .title{
        width: 110px;
        min-width: initial;
        padding: 10px;
        font-size: 14px;
        height: 50px;

        align-items: center;
    }

    #sub_content .form_wrap ul li .title p{
        font-size: 14px;
    }

    #sub_content .form_wrap ul li .input{
        padding: 0px 10px;
    }

    #sub_content .form_wrap ul li .input input, #sub_content .form_wrap ul li .input input::placeholder, #sub_content .form_wrap ul li .input textarea, #sub_content .form_wrap ul li .input textarea::placeholder{
        font-size: 13px;
    }

    #sub_content .form_wrap ul li .input input, #sub_content .form_wrap ul li .input textarea{
        padding: 8px 8px;
    }

    #sub_content .form_wrap ul li .input input{
        width: 100%;
    }

    #sub_content .form_wrap ul li .input textarea{
        height: 320px;
    }

    #sub_content .form_wrap ul li.textarea_li .title{
        height: 350px;
    }

    #sub_content .detail_wrap .attach_wrap .attach_bottom ul li{
        font-size: 12px;
    }

    .sub_route ul li{
        width: max-content;
        padding: 0 20px;
        box-sizing: border-box;
        height: 45px;
    }

    .sub4_1_section ul li{
        width: 100%;
    }

    .sub4_2_section .total_wrap ul li{
        width: max-content;
        padding: 10px 20px;
        margin-right: 0;
    }

    .sub4_2_section .list ul li{
        width: 47%;
    }

    .sub4_2_section .list ul{
        gap: 20px 15px;
        padding-top: 20px;
    }

    .sub4_2_section .list ul li .title{
        padding: 12px 0;
    }

    #sub_content .sub4_3_section .total_wrap ul{
        flex-wrap: wrap;
        word-break: keep-all;
        justify-content: center;
    }

    .sub4_3_section .showList{
        overflow-x: scroll;
    }

    .search_box.more_btn input[type='button']{
        font-size: 14px;
        width: 130px;
    }

    .sub4_4_section .more_btn_wrap {
        align-items: flex-end;
    }

    .sub4_4_section .more_btn_wrap{
        width: 100%;
        flex-direction: column-reverse; 
    }

    .sub4_4_section .more_btn_wrap > p{
        align-self: flex-start;
    }

    .total_search #search{
        width: 100%;
    }

    #sub_content .sub5_1_section .list3 table th:nth-child(2), #sub_content .sub5_1_section .list3 table td:nth-child(2){
        width: 16%;
    }

    #sub_content .sub5_2_section .list3 table th:nth-child(2), #sub_content .sub5_2_section .list3 table td:nth-child(2) {
        width: 15%;
    }

    #sub_content .sub5_3_section .list1 ul{
        gap: 20px;
    }

    #sub_content .sub5_3_section .list1 ul li{
        width: 47%;
    }

    #sub_content .list1 ul li{
        width: 47%;
    }

    #sub_content .list1 ul li .title{
        margin: 20px 0 10px;
    }

    .sub5_3_d_section .detail_wrap {
        flex-direction: column;
    }

    .sub5_3_d_section .left,
    .sub5_3_d_section .right{
        width: 100%;
    }

    .sub5_3_d_section .left{
        margin-right: 0;
    }

    .sub5_3_d_section .right .title{
        border-top: 1px solid #d7d7d7;
    }

    .sub5_3_d_section .right{
        margin-top: 20px;
    }

    .sub5_3_d_section .right .input_title{
        width: 80px;
        min-width: initial;
    }

    .sub5_3_d_section .right .input_title{
        width: 70px;
        min-width: 70px;
    }

    .sub5_3_d_section .right .input input{
        width: 100%;
        height: 40px;
    }

    .sub5_3_d_section .right .input_fix input{
        width: 100%;
    }

    .radio_wrap .radio label{
        gap: 10px;
    }

    #mypage{
        margin-top: 0;
        padding: 170px 0;
    }

    #mypage .common_content{
        width: 100%;
        height: 100%;
        border: none;
        padding: 0px;
    }

    #mypage .common_wrap .btn1,
    .login_section .btn_wrap .btn{
        height: 50px;
    }

    .join_section .policy_wrap{
        width : 100%;
    }

    .custom_checkbox1 label:before{
        transform: translate(-50%, -4px);
    }

    #mypage.join_section .common_wrap .btn1{
        height: 50px;
    }

    .join_section .input_wrap input{
        padding: 17px;
    }

    .join_section .input_wrap .addr1_wrap .btn{
        width: 140px;
        min-width: initial;
        height: 51px;
    }

    #mypage .content_wrap {
        flex-direction: column;
    }

    #mypage .content_wrap .left{
        width: 100%;
    }

    #mypage .m_route{
        width: 100%;
        padding: 20px;
        box-sizing: border-box;
        border: 1px solid #ccc;
    }

    #mypage .m_route .title{
        width: 100px;
        min-width: 100px;
    }

    #mypage .m_route ul li{
        border-bottom: 1px solid #ccc;
    }

    #mypage .m_route ul li:last-child{
        border-bottom: none;
    }

    #sub_content .table_fix .list3 table tr td{
        font-size: 13px;

        /* white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden; */
    }

    #mypage .content_wrap .right{
        width: 100%;
    }

    /* #sub_content .table_fix .list3 table th:nth-child(1),
    #sub_content .table_fix .list3 table td:nth-child(1){
        width: 7%;
    }

    #sub_content .table_fix .list3 table th:nth-child(2),
    #sub_content .table_fix .list3 table td:nth-child(2){
        width: 13%;
    }

    #sub_content .table_fix .list3 table th:nth-child(3),
    #sub_content .table_fix .list3 table td:nth-child(3){
        width: 6%;
    }

    #sub_content .table_fix .list3 table th:nth-child(4),
    #sub_content .table_fix .list3 table td:nth-child(4){
        width: 6%;
    } */

    #mypage.mypage1_d_section{
        padding: 170px 0;
    }

    #mypage.mypage2_section .title{
        width: 100px;
        min-width: 100px;
    }

    #mypage.mypage2_section .input_wrap input{
        width: 100%;
    }

    #mypage.mypage2_section .input_wrap .addr1_wrap input{
        width: 100%;
    }

    #mypage.mypage2_section .input_wrap input{
        width: 100%;
    }

    #mypage.mypage2_section .right .btn3,
    .mypage3_section .right .btn1{
        height: 50px;
    }

    .mypage3_section .right .content .box{
        width: 100%;
        padding: 50px 30px;
        height: 100%;
    }

    .mypage1_section #sub_content .table_fix .list3 table th:nth-child(2),
    .mypage1_section #sub_content .table_fix .list3 table td:nth-child(2){
        width: 7%;
        text-align: center;
    }

    .mypage1_section #sub_content .table_fix .list3 table th:nth-child(3),
    .mypage1_section #sub_content .table_fix .list3 table td:nth-child(3){
        width: 11%;
    }

    #sub_content .list1 ul li .img_wrap, #sub_content .list2 ul li .img_wrap{
        width: 100%;
        height: 150px;
    }








}

/* tablet */
@media screen and (min-width: 768px) and (max-width: 1024px) {
    #sub_content .list2 ul{
        gap: 10px;
    }
}