@font-face {
  font-family: 'fontawesome';
  font-weight: 500;
  font-style: normal;
  src: url('../fonts/fontawesome-webfont.eot'),
      url('../fonts/fontawesome-webfont.woff'),
      url('../fonts/fontawesome-webfont.ttf'),
      url('../fonts/fontawesome-webfont.woff2');
  
  font-display: swap;
}

*{
  margin: 0; padding: 0; box-sizing: border-box;
  font-family: 'KoPubWorldBatang', 'Pretendard', 'sans-serif';
  font-weight: 400; font-size: 16px; color: var(--text-primary);
}
ul{list-style: none;}
a{color: inherit; text-decoration: none; cursor: pointer; outline: none;}
table{border-collapse: collapse; border-spacing: 0;}
input, button{cursor: pointer; outline: none;}
button{border: none; background: none;}
body{width: 100%; height: 100vh;}

.flex{display: flex;}
.ali-cen{align-items: center;}
.jus-bet{justify-content: space-between;}
.jus-cen{justify-content: center;}

.gap5{gap: 5px;}

.inner{width: 1000px; margin: 0 auto; padding: 10px;}
.ojc_intro{display: flex; flex-direction: column; align-items: center; gap: 15px;}
.ojc_intro img{width: 100%;}
.ojc_intro p{padding: 10px 20px; font-size: 18px; font-weight: 700; text-align: justify; word-break: break-all; line-height: 1.5; letter-spacing: -0.2px;}
.ojc_main{padding: 10px 20px;}
.ojc_main span i{font-size: 20px;}
.ojc_main h2{font-size: 18px; font-weight: 500;}

.ojc_main table{width: 100%; margin-top: 5px; border-collapse: collapse; border-top: 2px solid #222; border-bottom: 2px solid #222;}
.ojc_main table tr:not(:last-child){border-bottom: 2px solid #222;}
.ojc_main table tr th{background: #eee; padding: 5px 10px;}
.ojc_main table tr td{padding: 5px 10px;}
.ojc_main table input[type=text]{width: 150px; padding: 5px; border: 1px solid #ccc;}

.ojc_main .btn_box{display: flex; flex-direction: column; align-items: center; margin-top: 10px;}
.ojc_main .btn_box .ok_btn{padding: 8px 20px; color: #fff; background-color: #2e95ed;}
.ojc_main .btn_box .title_box{width: 150px; padding: 8px 5px; border: 1px solid #878787;}

.agree_box{margin-top: 5px; padding: 10px; border: 1px solid #878787; color: #555;}
.agree_box h4{margin-bottom: 10px; font-size: 14px;}
.agree_box ul li{font-size: 14px;}
.agree_box ul li:not(:last-child){margin-bottom: 5px;}

.ojc_agree{padding: 10px; flex-direction: column; position: relative; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.ojc_agree div:first-child{margin-bottom: 15px;}
.ojc_agree div:last-child{width: 800px; border: 1px solid #222; padding: 10px 15px;}
.ojc_agree span i{font-size: 24px;}
.ojc_agree h2{font-size: 24px; font-weight: 700;}
.ojc_agree h3{margin-top: 20px; text-align: center;}
.ojc_agree p{font-size: 18px; line-height: 1.3; margin-bottom: 5px;}

@media screen and (max-width: 1000px){
  .inner{width: 100%;}
}
@media screen and (max-width: 944px){
  .input_box{flex-direction: column; align-items: start;}
}
@media screen and (max-width: 808px){
  .ojc_agree div:last-child{width: 100%;}
}