@charset "utf-8";
/* **************************************** *
 * CSS Variables
 * **************************************** */
/*
 * File       : jt-strap.css
 * Author     : STUDIO-JT (KMS)
 * Guideline  : JTstyle.1.1
 *
 * Dependency : css/reset.css
 *
 * SUMMARY:
 * 1) BUTTON
 * 2) FORM
 * 3) CATEGORY
 * 4) SEARCH
 * 5) PAGINATION
 * 6) ISOTOPE
 */



/* **************************************** *
 * BUTTON
 * **************************************** */
.jt_btn {display: inline-block;min-width: 100px;padding: 6px 22px;font-size: 15px;font-weight: 400;line-height: 1.95;text-align: center;vertical-align: middle;border: 1px solid transparent;border-radius: 3px;cursor: pointer;-webkit-transition: all 300ms;transition: all 300ms;}

/* size */
.jt_btn_small {min-width: 80px;padding: 1px 12px;}
.jt_btn_large {padding: 7px 42px;}

/* block */
.jt_btn_block {display: block;width: 100%;}

/* basic-style */
.jt_btn_primary {color: #fff;background: #777;}
.jt_btn_primary:hover {color: #fff;background: #9a9a9a;}
.jt_btn_secondary {color: #fff;background: #bbb;}
.jt_btn_secondary:hover {color: #fff;background: #777;}
.jt_btn_point {color: #fff;background: #0b21ee;}
.jt_btn_point:hover {color: #fff;}

/* outline-style */
.jt_btn_outline_primary {color: #777;background-image: none;background-color: #fff;border-color: #777;}
.jt_btn_outline_primary:hover {color: #fff;background-color: #777;}
.jt_btn_outline_point {color: #0b21ee;background-image: none;background-color: #fff;border-color: #0b21ee;}
.jt_btn_outline_point:hover {color: #fff;background-color: #0b21ee;}



/* **************************************** *
 * FORM
 * **************************************** */
/* legend */
.jt_legend {display: block;width: 100%;font-size: 15px;font-weight: 400;color: #666;}

/* label */
.jt_label {display: inline-block;padding-bottom: 4px;padding-right: 4px;position: relative;vertical-align: middle;font-size: 14px;font-weight: 500;color: #444;}
.jt_label_required:after {content: '*';display: inline-block;padding-left: 4px;vertical-align: middle;font-size: 15px;font-weight: 400;color: #ff0000;}

/* 필수입력 마크 */
i.jt_required_symbol {font-style: normal;color: #ff0000;}

/* input */
.jt_form_field {display: inline-block;width: 390px;height: 43px;padding: 8px 12px;vertical-align: middle;font-size: 15px;color: #777;background: #f8f8f8;border: 2px solid #ddd;border-radius: 3px;}
.jt_form_field:focus {border-color: #222;}
textarea.jt_form_field {height: 200px;overflow: auto;resize: none;}

/* input block */
.jt_form_block_field {display: block;}

/* input block + width:100% */
.jt_form_full_field {display: block;width: 100%;}

/* file 커스텀 */
.jt_file_upload_input {cursor: pointer;}
.jt_file_upload_button {margin-left: 16px;background: #222;}
.jt_file_upload_button:hover {background: #444;}

/* icheck */
div[class^="icheckbox"] + label,
div[class^="iradio"] + label {padding-left: 4px;padding-right: 28px;vertical-align: middle;cursor: pointer;font-size: 15px;font-weight: 400;color: #333;}

/* selectric */
/*div[class$="jt_selectric"]*/
.selectric {background: #f8f8f8;border: 2px solid #ddd;border-radius: 3px;text-align: left;}
.selectric .label {height: 41px;margin: 0 41px 0 12px;font-size: 15px;font-weight: normal;line-height: 41px;color: #777;}
.selectric .button {width: 41px;height: 41px;}
.selectric .button:after {border-top-color: #777;}
.selectric-items {border-top: none;}
.selectric-items ul, .selectric-items li {width: 100%;}
.selectric-items ul {margin-bottom: 0;text-align: left;}
.selectric-items ul li {padding: 8px 12px;font-size: 15px;color: #777;}
.selectric-items ul li:before {display: none;}
.selectric-focus .selectric {border-color: #222;}
.selectric-hover .selectric {border-color: #222;}
.selectric-open .selectric {border-color: #222;border-radius: 3px 3px 0 0;}
.selectric-items {border: 2px solid #222;border-top: none;}

/* input 설명글 */
.jt_form_field_guide {padding-top: 8px;}
.jt_form_field_guide *, .jt_form_field_guide p {padding: 0;font-size: 13px;line-height: 1.87;font-style: normal;font-weight: 400;color: #666;}

/* 주소 */
.jt_form_field.jt_post_code {width: 160px;margin-right: 8px;}
.jt_addr_field {margin-top: 8px;}

/* jt_form_control */
.jt_form_control {position: relative;text-align: center;}
.jt_form_control input {margin-left: 4px;}
.jt_form_control input:first-child {margin-left: 0;}

/* 약관동의 */
.jt_agree_rule {width: 100%;height: 160px;padding: 24px 24px;background: #f8f8f8;border: 1px solid #dedede;overflow: auto;}
.jt_agree_rule p {padding-bottom: 0;}
.jt_agree_check {padding: 12px 0 48px;text-align: right;}
.jt_agree_check div[class^="icheckbox"] + label {padding-right: 0;padding-left: 8px;font-size: 13px;}

/* horizontal_form */
ul.jt_horizontal_form {display: table;width: 100%;margin-top: 16px;padding: 8px 0;border-top: 2px solid #0b21ee;border-bottom: 1px solid #dedede;}
ul.jt_horizontal_form > li {display: table-row;width: 100%;padding-left: 0;font-size: 0;}
ul.jt_horizontal_form > li:before {display: none;}
ul.jt_horizontal_form > li > div {display: table-cell;width: auto;padding: 8px 0;vertical-align: top;}
ul.jt_horizontal_form > li > div:first-child {width: 17%;}
ul.jt_horizontal_form > li > div .jt_label {padding-bottom: 0;}



/* **************************************** *
 * CATEGORY
 * **************************************** */
.jt_category {margin-bottom: 24px;}
.jt_category ul {margin-bottom: 0;font-size: 0;}
.jt_category ul li {display: inline-block;padding-left: 0;position: relative;cursor: pointer;}
.jt_category ul li:before {content: '';display: block;width: 1px;height: 14px;position: absolute;top: 50%;margin-top: -7px;left: 0;border: none;border-radius: 0px;background: #d7d7d7;}
.jt_category ul a {padding: 0 13px;font-size: 15px;font-weight: 500;color: #666;border: none;}
.jt_category ul li.active a,
.jt_category ul li:hover a {color: #0b21ee;}
.jt_category ul li:first-child:before {display: none;}
.jt_category ul li:first-child a {padding-left: 0;}
.jt_category ul li:last-child a {padding-right: 0;}

@media (max-width: 768px) {
    .jt_category ul {text-align: center;}
}



/* **************************************** *
 * SEARCH
 * **************************************** */
.jt_search {margin-top: 32px;font-size: 0;text-align: center;}
.jt_pagination + .jt_search {margin-top: 28px;}
.jt_search_category {display: inline-block;width: 110px;vertical-align: top;}
.jt_search_category .selectric .label {height: 32px;margin: 0 32px 0 10px;line-height: 32px;color: #444;}
.jt_search_category .selectric .button {width: 32px;height: 32px;}
.jt_search_category .selectric .button:after {border-top-color: #444;}
.jt_search_category .selectric-items ul li {padding: 4px 4px 4px 10px;}
.jt_search_field {display: inline-block;position: relative;vertical-align: top;}
.jt_search_input {width: 221px;height: 34px;padding: 4px 8px;color: #444;border-width: 1px 0;text-overflow: ellipsis;}
.jt_search_button {display: inline-block;width: 59px;height: 34px;padding: 0;vertical-align: middle;font-size: 14px;font-weight: 400;color: #fff;border: 1px solid #929394;background: #929394;outline: none;cursor: pointer;}

@media (max-width: 540px) {
    .jt_search {width: 100%;max-width: 390px;margin: 0 auto;}
    .jt_search_category {width: 28%;}
    .jt_search_field {width: 72%;}
    .jt_search_input {width: -webkit-calc(100% - 59px);width: calc(100% - 59px);}
}



/* **************************************** *
 * PAGINATION
 * **************************************** */
.jt_pagination {display: block;width: 100%;margin-top: 32px;font-size: 0;text-align: center;}
.jt_pagination .page-numbers {display: inline-block;min-width: 32px;height: 32px;margin-right: 4px;margin-bottom: 4px;font-size: 15px;font-weight: 400;line-height: 30px;text-align: center;vertical-align: top;color: #444;border: 1px solid #ddd;-webkit-transition: color 300ms, background 300ms, border 300ms;transition: color 300ms, background 300ms, border 300ms;}
.jt_pagination .page-numbers:last-child {margin-right: 0;}
.jt_pagination .page-numbers:hover {border-color: #0b21ee;}
.jt_pagination .page-numbers.current {color: #fff;border-color: #0b21ee;background: #0b21ee;}
.jt_pagination .page-numbers.first, .jt_pagination .page-numbers.prev, .jt_pagination .page-numbers.next, .jt_pagination .page-numbers.last {font-size: 0;background: #fff url(../images/icon/icon-pagination.png) no-repeat;}
.jt_pagination .page-numbers.first {background-position: -21px center;}
.jt_pagination .page-numbers.prev {background-position: -91px center;}
.jt_pagination .page-numbers.next {background-position: -158px center;}
.jt_pagination .page-numbers.last {background-position: -228px center;}



/* **************************************** *
 * ISOTOPE
 * **************************************** */
.jt_isotope { visibility:hidden}

/* 기본셋팅 : 2컬럼 */
.jt_isotope .isotope_grid_sizer {width: 49%;}
.jt_isotope .isotope_gutter_sizer {width: 2%;}
.jt_isotope .isotope_item {width: 49%;margin-bottom: 2%;}

/* 2컬럼 */
.jt_isotope.isotope_col_2 .isotope_grid_sizer, .jt_isotope.isotope_col_2 .isotope_item {width: 49%;}

/* 3컬럼 */
/*.jt_isotope.isotope_col_3 .isotope_grid_sizer, .jt_isotope.isotope_col_3 .isotope_item {width: 32%;}*/
.jt_isotope.isotope_col_3 .isotope_grid_sizer {width: 28.6%;}
.jt_isotope.isotope_col_3 .isotope_gutter_sizer {width: 7.1%;}
.jt_isotope.isotope_col_3 .isotope_item {width: 28.6%;margin-bottom: 7.1%;}

/* 4컬럼 */
.jt_isotope.isotope_col_4 .isotope_grid_sizer, .jt_isotope.isotope_col_4 .isotope_item {width: 23.5%;}

/* 5컬럼 */
.jt_isotope.isotope_col_5 .isotope_grid_sizer, .jt_isotope.isotope_col_5 .isotope_item {width: 18.4%;}

@media (max-width: 1023px) {
    /* 3컬럼 */
    .jt_isotope.isotope_col_3 .isotope_grid_sizer {width: 30%;}
    .jt_isotope.isotope_col_3 .isotope_gutter_sizer {width: 5%;}
    .jt_isotope.isotope_col_3 .isotope_item {width: 30%;margin-bottom: 5%;}
}
@media (max-width: 767px) {
    /* 3컬럼 */
    .jt_isotope.isotope_col_3 .isotope_grid_sizer {width: 48%;}
    .jt_isotope.isotope_col_3 .isotope_gutter_sizer {width: 4%;}
    .jt_isotope.isotope_col_3 .isotope_item {width: 48%;margin-bottom: 6%;}
}
