@charset "utf-8";


/*누리웹 모든*/

* {
    margin: 0;
    padding: 0;
}

/*풀페이지 민하이 제안*/
html, body {
  width: 100%;
  height: 100%;
}

body {
  font-family: "Pretendard JP", sans-serif;
}

a {
    text-decoration: none;
}

img {
    border: 0;
}

li {
    list-style: none;
}



/*인트로 시작*/

.intro_bg {
  margin-top: -66px;
  min-width: 320px;

  background: url(../../../img/classification_img/main_gall_img_classification.png) no-repeat center center;
  background-size: cover;

  background-size: cover;
  box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1);
  position: relative;
}


.intro_wrap {
  margin: 0 auto;
  max-width: 1150px;
  height: 300px;

  padding: 0 15px 0 15px;

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


.intro_box {
  display: flex;
  align-items: center;
  height: 100%;
}

.intro_box > h2 {
  font-size: 40px;
  font-weight: 900;
  line-height: 70px;  
  margin: 50px 0 10px 0;
  color: #434343;
  word-break: break-all;

  /*중간맞추기*/
  text-align: center;
  display: block;

}


@media only screen and (min-width: 0px) and (max-width: 650px) {

  .intro_box {
    justify-content: center;
  }

  .intro_box > h2 {
    font-size: 30px;
    font-weight: 900;
    line-height: 50px;  
    margin: 50px 0 10px 0;
    color: #434343;
    word-break: break-all;
  
    /*중간맞추기*/
    text-align: center;
    display: block;
  }
  
}



/******************************
*
*
* 분류 기준표
*
*
*******************************/

.classification_bg {
  min-width: 320px;
  padding: 40px 0px 40px 0px;
  flex: 1 0 auto;
  background: #ffffff;
}

.classification_wrap {
  margin: 0 auto;
  max-width: 1150px;
  height: 100%;
  padding: 0 15px 0 15px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}






/***************************
*
*
* 테이블 꾸미기 시작
*
*
****************************/

.table_all_item {
  width: 100%;
  height: auto;
}


.table_wrap {
  width: 100%;
  height: auto;

  display: flex;
  flex-direction: column;
}

.table_head {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;

  border-radius: 5px;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.05);
  border: 1px solid #e7e7e7;
  background: #dbdbdb;
  margin-bottom: 8px;
}

.table_head_item {
  padding: 10px 15px 10px 15px;

  font-size: 14px;
  color: #434343;
  display: block;
  font-weight: 700;
  overflow: hidden;
  word-break: break-all;
  line-height: 26px;

  border-right: 1px solid #cccccc;
}

.table_row > .table_item:last-child > .table_head_item {
  border-right: none;
}

.table_row {
  display: flex;
  flex-direction: row;
  width: 100%;
}

.table_item {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
}

.table_body > .table_row {
    display: flex;
    flex-direction: row;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.05);
    margin-bottom: 8px;
    border-radius: 5px;
    border: 1px solid #eaeaea;
}

.table_body > .table_row > .table_item_min {
  background: #fafafa;
}

.table_body_item {
  padding: 10px 15px 10px 15px;

  font-size: 14px;
  color: #434343;
  display: block;
  font-weight: 700;
  overflow: hidden;
  word-break: break-all;
  line-height: 26px;

  height: 100%;

  border-right: 1px solid #eaeaea;
}




.table_item_min {
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  max-width: 300px !important;
  width: 100% !important;

  flex-shrink: 0;
  border-radius: 5px 0px 0px 5px;
}

.table_number {
  max-width: 50px;
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.table_text {
  max-width: 250px;
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
}

/*테이블 텍스트 아이콘*/

.table_text_icon {
  width: 12px;
  height: 12px;
  flex-shrink: 0;
  border-radius: 50%;
  margin-right: 8px;
}

.table_text_icon_normal {
  background: #19ff24;
  box-shadow: 0px 0px 5px #19ff24;
}

.table_text_icon_phishing {
  background: #ff1111;
  box-shadow: 0px 0px 5px #ff1111;
}

.table_text_icon_fraud {
  background: #7119ff;
  box-shadow: 0px 0px 5px #7119ff;
}

.table_text_icon_gambling {
  background: #ffc919;
  box-shadow: 0px 0px 5px #ffc919;
}

.table_text_icon_malware {
  background: #1100ff;
  box-shadow: 0px 0px 5px #1100ff;
}

.table_text_icon_illegal {
  background: #519cff;
  box-shadow: 0px 0px 5px #519cff;
}

.table_text_icon_privacy {
  background: #ff6d19;
  box-shadow: 0px 0px 5px #ff6d19;
}

.table_text_icon_adult {
  background: #ff41c0;
  box-shadow: 0px 0px 5px #ff41c0;
}

.table_text_icon_suspicious {
  background: #b698d8;
  box-shadow: 0px 0px 5px #b698d8;
}

.table_text_icon_inaccessible {
  background: #8f8f8f;
  box-shadow: 0px 0px 5px #8f8f8f;
}












.table_explanation {
    max-width: 100% !important;
    width: 100% !important;
    border-right: none;
}
.table_explanation > ul > li {
  list-style: disc;
  margin-left: 20px;
}

.table_explanation > ul > li > p {

}


.table_item_max {
  max-width: 100% !important;
  width: 100%;
}




@media only screen and (min-width: 0px) and (max-width: 830px) {
  .table_head {
    display: none;
  }

  .table_body > .table_row {
    flex-direction: column;
  }
  
  .table_item_min {
    max-width: 100% !important;
    border-radius: 5px 5px 0px 0px;
  }

  .table_item_min > .table_text {
    max-width: 100% !important;
  }
  .table_item_min > .table_text:last-child {
    max-width: 100% !important;
    border-right: none;
  }
  
  .table_body_item {
    border-right: 1px solid #d4d4d4;
  }
  
  .table_body > .table_row > .table_item_min {
    background: #ebebeb;
  }

  .table_explanation {
    border-right: none;
  }

}





.common_text {
  width: 100%;
  height: auto;
}

.common_line {
  width: 50px;
  height: 2px;
  background: #1d282e;
}

.common_text > h2 {
  font-size: 35px;
  line-height: 55px;
  font-weight: 900;
  margin: 30px 0 30px 0;
  color: #1d282e;
  word-break: break-all;
  text-align: left;
}