@charset "utf-8";
select {

   -webkit-appearance:none; /* for chrome */

   -moz-appearance:none; /*for firefox*/

   appearance:none;
   background: url(/img/select.png) no-repeat right 20px center ;

}
select:focus{
    outline: none;
}
input:focus{
    outline: none;
}

.contents_tit{
text-align: center;
font-size: 43px;
   line-height: 1.3;
 letter-spacing: -0.75px; 
}

.contents_tit h3{
      font-size: inherit;
font-weight: 700;
  margin-bottom: 30px;
     
 letter-spacing: inherit; 
}

select::-webkit-scrollbar{
    width: 5px;
    background: #eee;
}
select::-webkit-scrollbar-thumb{
    border-radius: 10px ;
    background: var(--navy);
}


 @media screen and (max-width: 1100px){
        .contents_tit p{
            font-size: 16px;
           
        }
        
        }
        @media screen and (max-width: 768px){
        .contents_tit{
        font-size: 28px;
        }
        .contents_tit h3{
            margin-bottom: 30px;
        }
        .contents_tit p{
            font-size: 14px;
           
        }
       
        
        }


.policy_bg{
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    left: 0;
    top: 0;
    z-index: 999;
    display: none;
}
.policy_box{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 60%;
    height: 70%;
    border-radius: 30px;
    overflow: hidden;
}
.policy_box .policy_tit{
    background: var(--navy);
    padding: 20px 40px;
    color: var(--white);
    font-size: 30px;
    font-weight: 700;
    position: relative;
	   
 letter-spacing: -0.75px; 
}
.policy_box .policy_tit p{
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
 
}
.policy_box .policy_tit .close{
    position: absolute;
    right: 20px;
    top: 50%;
	transform: translateY(-50%);
    stroke: #fff;
    cursor: pointer;    

}

.privacy_policy{
    height: 100%;
    overflow-y: scroll;
    background: #fff;
    color: #333;
    box-sizing: border-box;
    border:1px solid #ddd;
    padding: 30px 22px;
    line-height: 25px;
    font-size: 16px;
	 
}
.privacy_policy pre{
    padding-bottom:20px ;
    word-break: keep-all;
	 line-height: inherit;
 letter-spacing: inherit; 
}
.privacy_policy::-webkit-scrollbar{
    width: 5px;
    background: #eee;
}
.privacy_policy::-webkit-scrollbar-thumb{
    border-radius: 10px ;
    background: var(--navy);
}

legend{
  
    display: none;
}

.sec2_wrap{
    position: relative;
}
.sec2_wrap .important{
   
    display: block;
    font-weight: 500;
    display: flex;
    align-items: flex-start;
    gap: 5px;
    justify-content: right;
    margin-bottom: 15px;
}
.sec2_wrap .important span{
    color: #419ade;
    font-weight: 700;
}
.sec2_wrap table{
    border-collapse: collapse;
    width: 100%;
    border-top: 2px solid var(--navy);
   
}
.sec2_wrap table tr{
    border-bottom: 1px solid #ddd;
}
.sec2_wrap table tr th{
    width: 280px;
    background-color: #fafafa;
}
.sec2_wrap table tr th p{
    font-size: 18px;
    font-weight: var(--fw-700);

    padding: 55px 0;
}
.sec2_wrap table tr th p span{
    color: #419ad1;
    font-weight: 700;
    display: inline;
    margin-right: 3px;

}
.sec2_wrap table tr td{
    padding: 30px 20px;
    box-sizing: border-box;
    width: calc(100% - 280px);

   
}
input#name, input#company{
    border: 1px solid #ddd;
    width: 100%;
    padding: 16px 20px;
    box-sizing: border-box;
    font-size: 18px;
    border-radius: 15px;

}
.custom-select{
   width: 138px;
   border: 1px solid #ddd;
   padding: 0px 20px;
   transition: 0.2s;
   box-sizing:border-box;
   border-radius: 13px;
}
#tel01 ,#tel02, #tel03, #tel04{
    border: 1px solid #ddd;
    padding:  20px;
    box-sizing: border-box;
    font-size: 18px;
    overflow-y: scroll;
    border-radius: 13px;
}

#tel02, #tel03{
    width:30% ;
}
#tel01 {
    margin-right: 10px;
}
#tel02 {
    margin:0 10px;
}
#tel03 {
    margin-left: 10px;
}
#tel04{
     width:138px;
     margin-right: 10px;
	 display:none;
}
#tel04:focus{
outline:none;
}
.tel01::-webkit-scrollbar{
    width: 5px;
    background: #eee;
}
.tel01::-webkit-scrollbar-thumb{
    border-radius: 13px ;
    background: #000;
}

.email03{
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    border-radius: 13px;
    width: 279px;

}
.tel03::-ms-expand{
    display: none;
}
.email_wrap{
    display: flex;
    align-items: center;
}
#email1, #email2, #email3{
    border: 1px solid #ddd;
    padding: 16px 20px;
    box-sizing: border-box;
    font-size: 18px;
    border-radius: 13px;
    width:30% ;

}
#email1{
    margin-right: 10px;
}
#email2{
display:none;
 margin-left:10px;
}
#email2:focus{
outline:none;
}
#email3{
    margin-left: 10px;
}
.sec2_wrap table tr.email .custom-select{
    width: 165px;
    transition: 0.2s;
}
.sec2_wrap table tr td textarea{
    padding: 20px;
    width: 100%;
    outline: 0;
    border: 1px solid #ddd;
    resize: none;
    box-sizing: border-box;
    font-size: 18px;
    line-height: 25px;
    border-radius: 20px;
    height: 330px;
}
.sec2_wrap table tr td textarea::-webkit-scrollbar{
    width: 5px;
    background: #eee;
}
.sec2_wrap table tr td textarea::-webkit-scrollbar-thumb{
    border-radius: 13px ;
    background: var(--navy);
}

.agree_btns{
    margin: 30px 0 40px;
    font-size: 16px;
    display: flex;
    align-items: center;
	 font-size:20px;
  font-weight:700;

}
.agree_btns label{
    display: flex;
    align-items: center;
    gap: 15px;
}
.agree_btns .text{
  font-size:20px;
  font-weight:700;
   line-height: inherit;
 letter-spacing: inherit; 
  
}
.agree_btns .text span{
    font-size: inherit;
    font-weight: 500;
	color:#777;
	   line-height: inherit;
 letter-spacing: inherit;
}
.agree_btns .more{
    font-size: inherit;
    font-weight: 500;
	color:#777;
	margin-left:10px;
}
  .check_box{
    display: inline-block; /* 영역적용가능해짐 */
    width: 30px; height: 30px;
    border: 2px solid #bebebe;
    box-sizing: border-box;
    position: relative; 
    cursor: pointer; /* 마우스 올렸을때 손모양 처리 */
  }
  .check_box::after{
    content: ''; 
    display: block;/* 체크박스 특수문자 */
    width: 100%;
    height: 100%;
    position: absolute; top: 50%; left: 50%;
    transform: translate(-50%,-50%);
    opacity: 0; /* 처음엔 안보이게 처리 */
    transition: 0.2s;
    background: url(/img/check.png) no-repeat center; /* CSS변화에 시간차 처리 */
  }
  
  /* input이 체크되면 특수문자 보이게 처리 */
  #chk:checked + .check_box:after{ opacity: 1; }
  
  /* 체크박스는 display:none;을 주면 데이터 처리가 안됨 */
  #chk{ position: absolute; left: -999em; }
  
  .agree_btns .more{
    cursor: pointer;
  }


  .submit_btns{
  
    display: flex;
    justify-content: center;
    gap: 20px;
}
.submit_btns button{
    border: 1px solid #f8f8f8;
    border-radius: 36.5px;
    font-weight: 500;
    font-size: 20px;
    color: #fff;
    letter-spacing: -0.8px;
    width: 192px;
    height: 77px;
    display: inline-block;
    padding: 0 30px ;
    text-align: left;

}
button.btn_submit{
    background:var(--navy);
    position: relative;
}
button.btn_submit .arrow{
    width: 17px;
    height: 16px;
    color: #fff;
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 30px;
	filter: invert(100%) sepia(0%) saturate(1193%) hue-rotate(45deg) brightness(122%) contrast(109%);
		
}

@media screen and (max-width: 1400px){
    .policy_box{
        width: 90%;
    }

}

@media screen and (max-width: 1100px){
	.sec2_wrap table tr th{
		width: 25%;
	}
}

@media screen and (max-width: 900px){
	.agree_btns label{
		gap: 7px;
	}
	.check_box{
		widtH: 25px; height: 25px;
	}
	.agree_btns .text{
		font-size: 17px;
	}

	.agree_btns .more{
		font-size: 17px;
		margin-left: 5px;
	}

	#tel01,
	#email1{
		margin-right: 7px;
	}

	#tel02{
		margin: 0 7px;
	}

	#tel03,
	#email3{
		margin-left: 7px;
	}

	#email1, #email3{
		width: 35%;
	}

	#email2{
		width: 100%;
		margin-left: 0;
		margin-top: 7px;
	}

	.policy_box .policy_tit{
		font-size: 24px;
		padding: 20px 35px;
	}

	.privacy_policy{
		font-size: 15px;
	}
}


@media screen and (max-width: 767px){
    .sec2_wrap table tr{
		display: flex;
        flex-wrap: wrap;
	}
	.sec2_wrap table tr th{
		width: 100%;
	}
	.sec2_wrap table tr td{
		width: 100%;
		padding: 15px 0;
	}

	.sec2_wrap table tr.contact td{
		display: flex;
		align-items: center;
		gap: 5px;
	}

	.sec2_wrap table tr th p{
		text-align: left;
        padding: 12px 20px;
        font-size: 16px;
	}
	input#name, input#company{
        font-size: 14px;
        padding: 12px 20px;
	}
    #tel02, #tel03, #tel04{
		font-size: 14px;
        padding: 12px 20px;
    }
    
    #tel01 {
		font-size: 14px;
        padding: 12px 20px;
		width: 95px;
    }

	 #tel01 , #tel02, #tel03{
		margin: 0;
	 }

	 #tel02, #tel03{
		width: 45%;
	 }

	#tel04 {
        margin-right: 0px;
    }
	
	.sec2_wrap table tr.email .email_box{
		display: flex;
		align-items: center;
		flex-wrap: wrap;
		gap: 5px;
	}

    #email1, #email2, #email3{
    }
    #email1{
        margin-right: 0px;
		font-size: 14px;
        padding: 12px 20px;
		width: calc((100% - 1rem - 10px) / 2);
    }
	#email2{
       margin-left:0px;
		 font-size: 14px;
        padding: 12px 20px;
     }
    #email3{
        margin-left: 0px;
		font-size: 14px;
        padding: 12px 20px;
		width: 150px;
		width: calc((100% - 1rem - 10px) / 2);
    }

    .sec2_wrap table tr td textarea{
        height: 200px;
    }

	.agree_btns .text,
	.agree_btns .more{
		font-size: 14px;
	}

	.policy_box .policy_tit{
		font-size: 20px;
		padding: 15px 30px;
	}

	.policy_box .policy_tit .close{
		right: 30px;
	}

	.privacy_policy{
		padding: 20px 15px;
		font-size: 13px;
	}

}
@media screen and (max-width: 500px){
    .check_box{
        width: 20px;
        height: 20px;
    }
    .submit_btns button{
        width: 140px;
        font-size: 16px;
        padding: 0 20px;
        height: 50px;


    }
    button.btn_submit .arrow{
        width: 11px;
        height: 10px;
        color: #fff;
        display: block;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 20px;
    }
    button.btn_submit .arrow svg{
        width: 11px;
        height: 10px;
        stroke: var(--white);
    }
	
.agree_btns{

	 font-size:16px;
  font-weight:700;
}

    #tel02, #tel03 {
        width: 40%;
    }

}