/* @charset "utf-8"; */ /* ie브라우저에서 아이콘폰트가 적용안되는 문제로 주석 */
/* ================================================================== */
/* Name	: style.css
/* Script : Grid, Button, Form, List, Tab, Table, Font icon CSS
/* Author : Design Geulggol
/* Date	: 2017-07-21
/* ================================================================== */

/* ----------------------------- */
/* Grid
/* ----------------------------- */
.grid_wrap {
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    /*justify-content: space-between;*/
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
/*.grid_wrap:after {
    content: "";
    display: block;
    clear: both;
}*/
/*.grid_left { float: left; }
.grid_right { float: right; }*/

/* gutter */
.grid_wrap [class*="gutter"] { margin: 1.1904%; }

/*.grid_wrap [class*="g_lg_gt"]:first-child,
.grid_wrap [class*="g_md_gt"]:first-child,
.grid_wrap [class*="g_sm_gt"]:first-child { margin-left: 0; }*/

.col_f_1 { width: 8.3333%; }
.col_f_2 { width: 16.6666%; }
.col_f_3 { width: 25%; }
.col_f_4 { width: 33.3333%; }
.col_f_5 { width: 41.6666%; }
.col_f_6 { width: 50%; }
.col_f_7 { width: 58.3334%; }
.col_f_8 { width: 66.6667%; }
.col_f_9 { width: 75%; }
.col_f_10 { width: 83.3334%; }
.col_f_11 { width: 91.6667%; }
.col_f_12 { width: 100%; }

.col_1 { width: 5.9523%; }
.col_2 { width: 14.2857%; }
.col_3 { width: 22.6190%; }
.col_4 { width: 30.9523%; }
.col_5 { width: 39.2857%; }
.col_6 { width: 47.6190%; }
.col_7 { width: 55.9523%; }
.col_8 { width: 64.2857%; }
.col_9 { width: 72.6190%; }
.col_10 { width: 80.9523%; }
.col_11 { width: 89.2857%; }
.col_12 { width: 97.6190%; }

.offset_1 { margin-left: 8.3333% }
.offset_2 { margin-left: 16.6666% }
.offset_3 { margin-left: 25% }
.offset_4 { margin-left: 33.3333% }
.offset_5 { margin-left: 41.6666%;  }
.offset_6 { margin-left: 50%; }
.offset_7 { margin-left: 58.3334% }
.offset_8 { margin-left: 66.6667% }
.offset_9 { margin-left: 75% }
.offset_10 { margin-left: 83.3334% }
.offset_11 { margin-left: 91.6667% }
.offset_12 { margin-left: 100% }


@media screen and (max-width:1240px) {

    .col_fl_1 { width: 8.3333%; }
    .col_fl_2 { width: 16.6666%; }
    .col_fl_3 { width: 25%; }
    .col_fl_4 { width: 33.3333%; }
    .col_fl_5 { width: 41.6666%; }
    .col_fl_6 { width: 50%; }
    .col_fl_7 { width: 58.3334%; }
    .col_fl_8 { width: 66.6667%; }
    .col_fl_9 { width: 75%; }
    .col_fl_10 { width: 83.3334%; }
    .col_fl_11 { width: 91.6667%; }
    .col_fl_12 { width: 100%; }

    .col_l_1 { width: 5.9523%; }
    .col_l_2 { width: 14.2857%; }
    .col_l_3 { width: 22.6190%; }
    .col_l_4 { width: 30.9523%; }
    .col_l_5 { width: 39.2857%; }
    .col_l_6 { width: 47.6190%; }
    .col_l_7 { width: 55.9523%; }
    .col_l_8 { width: 64.2857%; }
    .col_l_9 { width: 72.6190%; }
    .col_l_10 { width: 80.9523%; }
    .col_l_11 { width: 89.2857%; }
    .col_l_12 { width: 97.6190%; }
}


@media screen and (max-width:980px) {

    .col_fm_1 { width: 8.3333%; }
    .col_fm_2 { width: 16.6666%; }
    .col_fm_3 { width: 25%; }
    .col_fm_4 { width: 33.3333%; }
    .col_fm_5 { width: 41.6666%; }
    .col_fm_6 { width: 50%; }
    .col_fm_7 { width: 58.3334%; }
    .col_fm_8 { width: 66.6667%; }
    .col_fm_9 { width: 75%; }
    .col_fm_10 { width: 83.3334%; }
    .col_fm_11 { width: 91.6667%; }
    .col_fm_12 { width: 100%; }

    .col_m_1 { width: 5.9523%; }
    .col_m_2 { width: 14.2857%; }
    .col_m_3 { width: 22.6190%; }
    .col_m_4 { width: 30.9523%; }
    .col_m_5 { width: 39.2857%; }
    .col_m_6 { width: 47.6190%; }
    .col_m_7 { width: 55.9523%; }
    .col_m_8 { width: 64.2857%; }
    .col_m_9 { width: 72.6190%; }
    .col_m_10 { width: 80.9523%; }
    .col_m_11 { width: 89.2857%; }
    .col_m_12 { width: 97.6190%; }
}

@media screen and (max-width:767px) {

    .col_fs_1 { width: 8.3333%; }
    .col_fs_2 { width: 16.6666%; }
    .col_fs_3 { width: 25%; }
    .col_fs_4 { width: 33.3333%; }
    .col_fs_5 { width: 41.6666%; }
    .col_fs_6 { width: 50%; }
    .col_fs_7 { width: 58.3334%; }
    .col_fs_8 { width: 66.6667%; }
    .col_fs_9 { width: 75%; }
    .col_fs_10 { width: 83.3334%; }
    .col_fs_11 { width: 91.6667%; }
    .col_fs_12 { width: 100%; }

    .col_s_1 { width: 5.9523%; }
    .col_s_2 { width: 14.2857%; }
    .col_s_3 { width: 22.6190%; }
    .col_s_4 { width: 30.9523%; }
    .col_s_5 { width: 39.2857%; }
    .col_s_6 { width: 47.6190%; }
    .col_s_7 { width: 55.9523%; }
    .col_s_8 { width: 64.2857%; }
    .col_s_9 { width: 72.6190%; }
    .col_s_10 { width: 80.9523%; }
    .col_s_11 { width: 89.2857%; }
    .col_s_12 { width: 97.6190%; }
}

@media screen and (max-width:480px) {
    .col_xs_1 { width: 5.9523%; }
    .col_xs_2 { width: 14.2857%; }
    .col_xs_3 { width: 22.6190%; }
    .col_xs_4 { width: 30.9523%; }
    .col_xs_5 { width: 39.2857%; }
    .col_xs_6 { width: 47.6190%; }
    .col_xs_7 { width: 55.9523%; }
    .col_xs_8 { width: 64.2857%; }
    .col_xs_9 { width: 72.6190%; }
    .col_xs_10 { width: 80.9523%; }
    .col_xs_11 { width: 89.2857%; }
    .col_xs_12 { width: 97.6190%; }
}

/* ----------------------------- */
/* Align
/* ----------------------------- */
.al_cnt {
    margin: 20px auto;
    text-align: center;
}


/* ----------------------------- */
/* Button Style
/* ----------------------------- */
.button {
    position:relative;
    overflow: visible;
    display:-moz-inline-stack;
    display:inline-block;
    margin: 2px 1px ;
    text-align: center;
    vertical-align: top;
    text-decoration:none;
    color: #000;
    border: 2px solid #000;
    font-family: 'RobotoB', 'NotoT', 'malgun gothic', 맑은고딕, 'Dotum', 돋움, 'Arial', 'sans-serif';
    cursor:pointer;
}
.button.btntxt {
    letter-spacing: 0.6em;
    text-indent: 0.6em;
}

/* button size */
.button_block { width:100%; }
.button.large { font-size: 16px; padding: 22px 36px 20px; }
.button.medium { font-size: 15px; padding: 20px 30px 18px; }
.button.small { font-size: 14px; padding: 16px 28px 14px; }

input.button.large { padding: 30px 32px 30px;  }
input.button.medium { padding: 27px 29px 26px; }
input.button.small { padding: 22px 19px 21px; }

button.button.large { padding: 27px 46px 27px; }
button.button.medium { padding: 25px 40px 24px; }
button.button.small { padding: 20px 34px 19px; }


@media screen and (max-width:980px) {
    .button.RS_small { font-size: 14px; padding: 16px 24px 14px; }
}


/* color */
.button_white {
    color: #fff;
    border: 2px solid #fff;
}


/* hover */
.button:hover,
.button:focus,
.button:active {
    -webkit-transition:all 0.5s ease;
	transition:all 0.5s ease;
    background-color: #000;
    color: #fff;
}
.button.svg:hover,
.button.svg:focus,
.button.svg:active {
    fill: #fff;
}


/* icon */
.button.icotxt {
    position: relative;
}
.button.icotxt svg {
    position: absolute;
    /*top: 15px;
    left: 15px;*/
    top: 15%;
    left: 15%;
}
.button.icotxt i {
    display: block;
    margin-top:60%;
}

.button.lnr input[type="submit"] { padding: 0;}

/* hover */
.button:hover,
.button:focus,
.button:hover input,
.button:focus input { background: #000; color: #fff;
    -webkit-transition:all 0.5s ease;
	transition:all 0.5s ease;
}
/* .button_spot:hover,
.button_spot:focus,
.button_spot:hover input,
.button_spot:focus input { background: #242b53; color: #fff; } */
.button_white:hover,
.button_white:focus,
.button_white:hover input,
.button_white:focus input{ background: #efefef; color:#e70e0e; }

/* button position */
.button_wrap { width: 100%; margin: 20px 0; }
.button_wrap.left { text-align: left;}
.button_wrap.right { text-align: right;}
.button_wrap.center { text-align: center;}

input[type="text"] + .button,
input[type="password"] + .button,
input[type="email"] + .button,
input[type="number"] + .button,
input[type="search"] + .button,
input[type="tel"] + .button { margin: 0 1.2%;}

/* ----------------------------- */
/* Form Style
/* ----------------------------- */
/* form */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
textarea,
select {
    font-family:'NotoR', 'malgun gothic', 맑은고딕, 'Dotum', 돋움, 'Arial', 'sans-serif';
    font-size: 1.6rem;
    color:#555;
}

input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
textarea {
    border: 1px solid #cccfd5;
    vertical-align: middle;
}
input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"] {
    height:auto; padding: 13px 5px;
}
input[type="file"] {
    display: inline-block;
    height: 49px;
    padding: 5px;
    border: 1px solid #cccfd5;
    vertical-align: middle;
    background: #fff;
}
/* ----------------------------- */
/* Checkbox, Radio Style
/* ----------------------------- */

/* Basic styles */
input[type="checkbox"],
input[type="radio"] {
  position: absolute;
  opacity: 0;
  z-index: -1;
}
input[type="checkbox"] + label,
input[type="radio"] + label {
  position: relative;
  display: inline-block;
  padding: 0.25em 1em 2px 2.8em;
  line-height: 1.5em;
  cursor: pointer;
}
input[type="checkbox"] + label:before,
input[type="checkbox"] + label:after,
input[type="radio"] + label:before,
input[type="radio"] + label:after {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
}
/* Checkbox Style */
input[type="checkbox"] + label:before {
  content: " ";
  width: 28px;
  height: 28px;
  border: 2px solid #383838;
  border-radius: 5px;
  background: #fff;
}
input[type="checkbox"] + label:after {
    content: "\e926";
    width: 32px;
    height: 32px;
    color: #fff;
    line-height: 2.2em;
    text-align: center;
}
/* Radio Style */
input[type="radio"] + label::before {
    content: " ";
    width: 22px;
    height: 22px;
    margin: 3px 0 0 3px;
    border: 2px solid #cccfd8;
    border-radius: 10em;
}
input[type=radio] + label::after {
    content: " ";
    top: 10px;
    left: 10px;
    width: 12px;
    height: 12px;
    background: #29c6e2;
    border-radius: 10em;
}
input[type="checkbox"]:focus  + label::before {
    border-color: #383838;
}
/* :checked */
input[type="checkbox"]:checked + label::before {
    background: #383838;
    border-color: #383838;
}
input[type="radio"]:checked + label::before {
    background: #fff;
    border-color: #29c6e2;
}
input[type="checkbox"] + label::after,
input[type=radio] + label::after {
    -webkit-transform: scale(0);
    transform: scale(0);
}
input[type="checkbox"]:checked + label::after,
input[type=radio]:checked + label::after {
    -webkit-transform: scale(1);
    transform: scale(1);
}
/* Transition */
label::before,
label::after {
    -webkit-transition: .25s all ease;
    transition: .25s all ease;
}
textarea {
    width: 100%;
    padding: 10px;
}
select {
    display: inline-block;
    height: 47px;
    padding: 5px 10px;
    border: 1px solid #cccfd5;
    vertical-align: middle;
}
label { cursor: pointer;}



/* ----------------------------- */
/* List Style
/* ----------------------------- */
p.list_style,
.list_style  li,
.list_style dd {
    position: relative;
    padding:0 0 5px 10px;
    /* font-size: 0.938em; */
}
p.list_style:before,
.list_style li:before,
.list_style dd:before {
    content: "";
    display: block;
    position: absolute;
    top: 9px;
    left: 0;
    width: 6px;
    height: 2px;
    background-color: #727784;
}


/* ----------------------------- */
/* Tab Style
/* ----------------------------- */
.tab_style {}


/* ----------------------------- */
/* Table Style
/* ----------------------------- */
table caption { position:absolute; left:-9999px; width:0; height:0; overflow:hidden; font-size:0; text-indent:9999%; line-height:0; z-index:-1;}


.table {
    _overflow-x: auto;
    width: 100%;
    border-top:3px solid #eb4d00;
    border-left:1px solid #ced0d3 ;
    border-right:1px solid #ced0d3 ;
    border-bottom:1px solid #ced0d3 ;
    border-radius: 5px;
    margin-top: 15px;
}
.table > table {
    width: 100%;
}
.table > table th {
    background: #f2f2f2;
    font-family:'exo2-0-light', 'NotoR', 'malgun gothic', 맑은고딕, 'Dotum', 돋움, 'Arial', 'sans-serif';
    color: #000;
    border:1px solid #ced0d3;
    border-width: 0 0 3px 1px;
}
.table > table th,
.table > table td {
    padding: 15px;
}
.table > table td {
    border:1px solid #ced0d3;
    border-width:1px 0 0 1px
}
.table > table tbody tr:first-child td {
    border-top:0;
}
.table > table tr:first-child th:first-child,
.table > table td:first-child {
    border-left:0;
}
.table > table.t_cnt td {
    text-align: center;
}
.table > table tfoot {
    border-top:2px solid #ced0d3 ;
}
.table > table tfoot tr:first-child td:first-child {
    text-align: center;
    font-family:'exo2-0-light', 'NotoR', 'malgun gothic', 맑은고딕, 'Dotum', 돋움, 'Arial', 'sans-serif';
    color: #000;
}
.table > table tfoot tr:first-child td {
    background: #f2f2f2;
}

/* table : 열 */
.table_col th {
    padding: 15px 20px;
}
/* table : 행 */
.table_row th {
    border-width: 0 0 1px 0 !important;
}
.table_row tr:last-child th {
    border-bottom:none !important;
}







/* ----------------------------- */
/* Responsive
/* ----------------------------- */
/* Layout Max Size : 1680px (1640px)
/* Desktop : 1200px < Screen ≤ 1680px
/* Tablet Landscape ~ Desktop : 981px ≤ Screen ≤ 1240px
/* Tablet Portrait ~ Landscape : 768px ≤ Screen ≤ 980px
/* Mobile Portrait ~ Landscape : 480px ≤ Screen < 768px (landscape)
/* Mobile Landscape : 320px  ≤ Screen < 480px (portrait)
/* ----------------------------- */


	/* Tablet */
	@media screen and (max-width:980px) {

	}


	/* Mobile */
	@media screen and (max-width:480px) {

	}
