
/*서브검색영역*/
.searchArea{background: #F9FBFD; }
.searchArea .searchBox{margin-top: 0;}
.searchArea .searchBox .box select{width: 170px;}
.searchArea .searchBox .box input{width: 467px;}
.searchArea .pSearchBox{width: 900px;}
/* .searchArea .searchBox .box input{width: 200px;} */

/* 서브타이틀영역 */
.subCont .tit{border-bottom: 1px solid #333333; display: flex; justify-content: space-between; margin-top: 20px; padding: 20px 0; box-sizing: border-box;}
.subCont .tit h2{font-size: 50px; font-weight: bold; color: #000; line-height: normal;}
.subCont .tit> div{display: flex; align-items: end; gap: 40px;}
.subCont .tit> div> a{position: relative;}
.subCont .tit> div> a::after{content: ""; position: absolute; width: 7px; height: 12px; left: 35px; top: 8px; background: url(/bookFinder/images/alpasq/direct.png)no-repeat;}
.subCont .tit> div> a:last-child::after{display: none;}

/* 서브콘텐츠영역 */
.subCont .cont{margin-top: 40px; min-height: 400px;}
.subCont .cont .textType{margin-bottom: 50px;}
.subCont .cont .textType h3{font-size: 24px; font-weight: bold; margin-bottom: 20px; color: #000;}
.subCont .cont .textType h4{font-size: 20px; color: #0056AA; font-weight: bold; margin-bottom: 10px;}
.subCont .cont .textType> ul> li{position: relative; padding-left: 10px;}
.subCont .cont .textType> ul> li::before{content: ""; position: absolute; left: 0; top: 12px; width: 3px; height: 3px; background: #333;}
.subCont .cont .textType .grayBox{background: #f9f9f9; border: 1px solid #E2E2E2; box-sizing: border-box; padding: 30px;}
.subCont .cont .textType .grayBoxR{border-radius: 30px;}
.subCont .cont .textType .grayBox.inforBox{padding-left: 50px; display: inline-flex; gap: 30px; width: 100%; align-items: center;}
.subCont .cont .textType .grayBox.inforBox span{width: 100px; height: 100px; background: #fff; border-radius: 50%; box-shadow: 0px 2px 14px 4px rgba(0, 0, 0, 0.1) inset; display: flex; justify-content: center; align-items: center;}
.subCont .cont .textType .grayBox.inforBox span img{width: 42px; height: 42px; }
.subCont .cont .textType .grayBox .agreeTable{height: 200px; overflow-y: scroll;}
.subCont .cont .textType .grayBox .agreeTable2{height: 120px; overflow-y: scroll;}
.subCont .cont .textType .grayBox .agreeTable ol> li{position: relative; padding-left: 12px; }
.subCont .cont .textType .grayBox .agreeTable ol> li::before{content: ""; width: 5px; height: 5px; left: 0; top: 10px; background: #555; position: absolute;}
.subCont .cont .textType .grayBox> p{font-size: 20px; font-weight: bold; margin-bottom: 10px; color: #000;}
.subCont .cont .textType .grayBox> ul> li{position: relative; padding-left: 10px;}
.subCont .cont .textType .grayBox> ul> li::before{content: ""; position: absolute; left: 0; top: 12px; width: 3px; height: 3px; background: #333;}
.subCont .cont .textType .radioBox{background: #f9f9f9; padding: 20px; box-sizing: border-box; border: 1px solid #ddd; text-align: right; border-top: 0; display: flex; justify-content:space-between;}
.subCont .cont .textType .radioBox .radio{display: inline-flex; gap: 20px;}
.subCont .cont .textType .radioBox.allRadioBox{border-top: 1px solid #ddd; background: #E6F1FB;}
.subCont .cont .textType p.blue{margin-top: 10px;}
.subCont .cont textarea {width: 100%; min-height: 200px; border: 1px solid #ddd;}
.subCont .cont .btnType{border: 1px solid #ddd; padding: 7px 20px; box-sizing: border-box; border-radius: 5px; background: #f9f9f9; font-size: 17px; display: inline-block;}
.subCont .cont .btnType01{background: #0056AA; color: #fff; border: 1px solid #0056AA;}
.subCont .cont .btnType02{border: 1px solid #0056AA; color: #0056AA; background: #fff; background: #E6F1FB;}
.subCont .cont .btnType03{border: 1px solid #0056AA; color: #0056AA; background: #fff; }
.subCont .cont .btnType04{background: #F3DFD0;}
.subCont .cont .btnType05{background: #F8E4AD;}
.subCont .cont .btnType06{background: #CFEBE7;}
.subCont .cont .btnType07{background: #E6EBDF;}
.subCont .cont .btnType08{background: #E6E1F5;}
.subCont .cont .btnnope{background: #ebebeb; border: none; color: #555; border: 1px solid #ddd;}

/* 인풋, 셀렉트 공통크기 */
select.selectType00{width: 120px;}
select.selectType01{width: 150px;}
select.selectType02{width: 220px;}
select.selectType03{width: 97px;}
input.inputType00{width: 80px;}
input.inputType01, select.selectType01{width: 230px;}
input.inputType02{width: 300px;}
input.inputType03{width: 500px;}
input.inputType04{width: 100%;}
.ment {font-size: 13px; color: #0056AA; display: block; margin-top: 5px;}
.tableType01 thead tr th{background: #F9FBFD;}
.tableType01 tbody .btnType{font-size: 15px !important; padding: 0px 12px !important; border-radius: 20px !important;}
.tableType01 img{width: 20px;}


/*****테블릿가로*****/
@media all and (max-width:1530px) {  

  /*서브검색영역*/
  .searchArea .autoComplete{width: 890px !important; margin-right: -445px !important;}
  .searchArea .autoComplete> div> ul> li> a{width: 830px !important;}
 }
 
 
 /*****테블릿세로*****/
 @media all and (max-width:1220px) { 

  /*서브검색영역*/
  .searchArea .searchBox .box input{width: 380px;}
  .searchArea .pSearchBox{width: 590px;}
  .searchArea .autoComplete{width: 588px !important; margin-right: -294px !important; top: 122px;}
  .searchArea .autoComplete> div> ul> li> a{width: 510px !important;}

  /* 서브타이틀영역 */
  .subCont .tit h2{font-size: 40px;}

  /* 인풋, 셀렉트 공통크기 */
  .tablescroll{overflow-x: auto;}
  .tablescroll table{min-width: 1000px; }
  .tablescroll01 table{min-width: 700px; }

  /*테이블*/
  .mobileT .tableType02 table,
  .mobileT .tableType02 thead,
  .mobileT .tableType02 tbody,
  .mobileT .tableType02 th,
  .mobileT .tableType02 td,
  .mobileT .tableType02 tr {
    display: block;

  }

  .mobileT .tableType02 th {
    background: #f7f7f7;
    padding: 10px;
    font-weight: bold;
    
    border-bottom: 1px solid #ddd;
    border-right:none;
  }

  .mobileT .tableType02 td {
    padding: 10px;
    border-right:none;
    border-bottom: 1px solid #ddd;
  }

  .mobileT .tableType02 colgroup {
    display: none;
  }

 }
 
 
 /*****모바일*****/
 @media all and (max-width:767px) { 

  /*서브검색영역*/
  .searchArea input, .searchArea select, .searchArea button{margin: 0;}
  .searchArea .autoComplete{width: calc(100% - 50px) !important; margin-right: 0 !important; right: initial !important; top: 189px !important;}
  .searchArea .autoComplete> div> ul> li> a{width: 250px !important;}

  /* 서브타이틀영역 */
  .subCont .tit{padding: 20px 0;}
  .subCont .tit h2{font-size: 32px;}
  .subCont .tit> div{gap: 20px; margin-top: 10px;}
  .subCont .tit> div> a{font-size: 13px;}
  .subCont .tit> div> a::after{left: 18px;}
  .subCont .tit> div img{width: 10px; height: 10px;}
  .searchArea .pSearchBox{width: 100%; position: relative;}
  .searchArea .pSearchBox p{display: block; font-size: 15px;}

  /* 서브콘텐츠영역 */
  .subCont .cont .textType h3{margin-bottom: 10px;}
  .subCont .cont .textType{margin-bottom: 30px;}  
  .subCont .cont .textType> ul> li{font-size: 15px;}
  .subCont .cont .textType p{font-size: 15px; line-height: 22px;}
  .subCont .cont .textType .grayBox .agreeTable{overflow: scroll;}
  .subCont .cont .textType .grayBox .agreeTable table{min-width: 500px; font-size: 15px;}
  .subCont .cont .textType .grayBox .agreeTable ol> li{font-size: 15px; line-height: 20px;}
  .subCont .cont .textType .grayBox> ul> li{font-size: 15px; line-height: 22px;}
  .subCont .cont .textType .radioBox{display: block; text-align: left; font-size: 15px; line-height: 20px; }
  .subCont .cont .textType .radioBox .radio{padding-top: 10px; border-top: 1px dashed #ddd; width: 100%; margin-top: 10px;}
  .subCont .cont .textType p.blue{font-size: 13px; line-height: 20px;}
  .subCont .cont .btnType{font-size: 15px; width: 100%; margin-bottom: 5px;}
  .subCont .cont .textType .grayBox.inforBox{display: block; text-align: center; padding: 30px; font-size: 15px;}
  .subCont .cont .textType .grayBox.inforBox span{margin: 0 auto 20px auto;}

  /* 인풋, 셀렉트 공통크기 */
  input.inputType01, input.inputType02, input.inputType03, input.inputType04, select.selectType00, select.selectType01, select.selectType02, select.selectType03{width: 100%; font-size: 15px;}
  .tableType01 tbody .btnType{font-size: 13px !important;}



  
 }