/* common */
body {background:#f5f5f5; overflow-x:hidden;}
body.bg-white {background:#fff;}
.wrapper > .flex {height:100vh;}
.btn.bg-main {height:60px; background:#38d592; color:#fff; font-size:20px; font-weight:700;}
.btn.bg-main:hover {background:#1ea66c;}
.container {max-width:1170px; margin:0 auto; padding:0 15px;}
@media (max-width:991px){
body {background:#fff;}
.wrapper > .flex {height:auto;}
}

/* box */
.sub-box {background:#fff; padding:42px 30px 80px; width:420px; max-width:100%;}
.sub-box.auto {width:auto;}
.sub-box .sub-form .form-group.full {margin:0 -30px;}
.sub-box .sub-form .form-group.w-select {width:480px; margin:0 auto;}
.sub-box .sub-form .form-group ul li:after {display:inline-block; width:1px; height:15px; content:""; background:#e1e1e1; margin:0 30px;}
.sub-box .sub-form .form-group ul li:last-of-type:after {display:none;}
.sub-box .sub-form .form-group ul li a {font-size:16px; color:#000;}
.sub-box .sub-form .form-group p {position:relative; font-size:14px; line-height:20px; color:#666; padding-left:12px;}
.sub-box .sub-form .form-group p:before {position:absolute; left:0; top:9px; width:4px; height:4px; background:#666; content:""; border-radius:50%;}
.sub-box .sub-form .form-group p.txt {padding-left:0;}
.sub-box .sub-form .form-group p.txt:before {display:none;}
.sub-box .sub-form .form-group p a {color:rgba(48, 166, 233, 1); text-decoration:underline; font-size:14px; line-height:20px;}
.sub-box .sub-form .form-group h3 {text-align:center; font-size:26px; line-height:37px; font-weight:500;}
.sub-box .sub-form .form-group img {display:block; margin:0 auto;}
@media (max-width:500px){
.sub-box .sub-form .form-group.w-select {width:100%;}
}

/* title */
.sub-title.txt {border-bottom:1px solid #e1e1e1; padding:0 0 20px;}
.sub-title h2 img {width:217.99px; display:block; margin:0 auto;}
.sub-title h2 {text-align:center; font-size:26px; font-weight:500;}

/* form */
input[type=text], input[type=password] {width:100%; border:1px solid #e1e1e1; padding:0 15px; height:50px; font-size:16px;}
input[type=text]::placeholder, input[type=password]::placeholder {color:#666;}
.check-box {position:relative;}
.check-box input {position:absolute; left:0; top:0; width:100%; height:100%; opacity:0; cursor:pointer;}
.check-box label {display:flex; flex-wrap:wrap; align-items:center; font-size:14px; color:#666;}
.check-box label.flex-vt {align-items:flex-start;}
.check-box input[type=checkbox] ~ label:before {display:inline-block; content:""; width:20px; height:20px; background:url('../images/icon_check_off.svg') no-repeat center / cover; margin-right:10px;}
.check-box input[type=radio] ~ label:before {display:inline-block; content:""; width:16px; height:16px; background:url('../images/icon_radio_off.svg') no-repeat center / cover; margin-right:5px;}
.check-box label span {font-size:16px; color:#666; line-height:23px;}
.check-box label span a {font-size:16px; font-weight:700; color:#666; line-height:23px; position:relative; z-index:2;}
.check-box label b {font-size:16px; font-weight:500; color:#282828;}
.check-box input[type=checkbox]:checked ~ label:before {background:url('../images/icon_check_on.svg') no-repeat center / cover;}   
.check-box input[type=radio]:checked ~ label:before {background:url('../images/icon_radio_on.svg') no-repeat center / cover;}
.date-box {display:flex; flex-wrap:wrap; align-items:center;}
.date-box .date {display:flex; flex-wrap:wrap; align-items:center; flex:1; border:1px solid #e1e1e1; padding-right:10px;}
.date-box .date input {border:0; width:auto; flex:1;}
.date-box span {width:30px; text-align:center; display:inline-block;}
@media (max-width:991px){
.date-box .date {width:calc(50% - 15px);}
.date-box .date input {width:calc(100% - 13px); height:25px !important; line-height:28px; padding:0 5px !important; font-size:12px !important;}
}

/* heading */
.sub-heading h2 {font-size:24px; font-weight:500; padding:0 0 15px; border-bottom:1px solid #DEE2E6;}
.sub-heading h3 {font-size:16px; font-weight:500; padding:0 0 10px; border-bottom:1px solid #dee2e6;}

/* search */
.sub-search {background:#fff; border-radius:10px; overflow:hidden; box-shadow:0 0 10px rgba(0,0,0,0.15); padding:30px; border:1px solid #ccc;}
.sub-search ul {border-top:1px solid #ccc;}
.sub-search ul li {border:1px solid #ccc; border-width:0 0 1px;}
.sub-search ul li > .flex-box {display:flex; flex-wrap:wrap; width:100%;}
.sub-search ul li > .flex-box b {display:flex; flex-wrap:wrap; align-items:center; justify-content:center; width:120px; height:54px; font-size:14px; font-weight:600; background:#f7f7f7;}
.sub-search ul li > .flex-box .content {display:flex; flex-wrap:wrap; align-items:center; flex:1; padding:8px 20px;}
.sub-search ul li > .flex-box .content input[type=text] {height:32px; font-size:14px; padding:0 10px;}
@media (max-width:1200px){
.sub-search {padding:30px 15px; border-radius:10px;}
.sub-search ul li > .flex-box b {width:65px; min-height:54px; height:auto;} 
.sub-search ul li > .flex-box .content {padding:5px 10px;}
}
@media (max-width:991px){
.sub-search ul li > .flex-box > .col-6:last-of-type {border-top:1px solid #ccc;}
}

/* button */
.sub-button {display:flex; flex-wrap:wrap; align-items:center;}
.sub-button a, .sub-button button{width:80px !important; height:32px !important; font-size:14px !important; font-weight:500 !important; padding:0 !important; border-radius:4px;}
.sub-button a.bg-white, .sub-button button.bg-white {border:1px solid #dee2e6;}
.sub-button a.bg-white:hover, .sub-button button.bg-white:hover {background:#dee2e6; color:#fff;}
@media (max-width:575px){
.sub-button {justify-content:center !important;}
}

/* none */
.sub-list-none {padding:54px 0 113px;}
.sub-list-none p {font-size:22px; line-height:32px; font-weight:700; color:#222; text-align:center;}

/* table */
.sub-table .table-box table {border-top:2px solid #38d592;}
.sub-table .table-box table tr th {background:rgba(204,204,204,0.3); padding:10px; font-weight:500; font-size:14px; color:#222; border:1px solid #ccc; border-width:0 1px 1px 0;}
.sub-table .table-box table tr th:last-of-type {border-right:0;}
.sub-table .table-box table tr td {padding:10px; font-size:14px; color:#222; border:1px solid #ccc; border-width:0 1px 1px 0; font-weight:300;}
.sub-table .table-box table tr td:last-of-type {border-right:0;}
@media (max-width:991px){
.sub-table .table-box table tr td {font-size:13px;}
}