@charset "utf-8";
/* form */
input,
label,
select,
button
{
    margin:0;
    border:0;
    padding:0;
    display:inline-block;
    vertical-align:middle;
    white-space:normal;
    background:none;
    line-height:1;
    font-family:inherit;
}
textarea
{
    margin:0;
    border:0;
    padding:0;
    display:inline-block;
    vertical-align:middle;   
    background:none;
    line-height:1;
    font-family:inherit;
}

/* Input Reset  */
input[type="checkbox"]{-webkit-appearance:none; -webkit-border-radius:0; background-color:transparent;}
input[type="radio"]{-webkit-appearance:none; -webkit-border-radius:0; background-color:transparent;}
input[type="file"] {border:0px solid #ccc;}
input[type="text"], input[type="password"], input[type="email"], input[type="search"], input[type="image"], input[type="tel"], input[type="number"], textarea {border-radius: 0px;-ms-border-radius: 0;-webkit-border-radius: 0;-moz-border-radius: 0;-webkit-appearance: none;}

input:not([type='checkbox,radio']):focus::-webkit-input-placeholder {color: transparent;}
input:hover {border-radius:0px}
input:focus {outline: none;background-color:#fff;border-color:#727a82}

/* Mobile Reset */
*{-webkit-text-size-adjust:none}

input::placeholder {color:#a7a7a7 !important;font-size:16px;font-weight: 400;}
input:-ms-input-placeholder {color:#a7a7a7 !important;font-size:16px;font-weight: 400;}
input::-ms-input-placeholder { color:#a7a7a7 !important;font-size:16px;font-weight: 400;}
input::-webkit-input-placeholder {color:#a7a7a7 !important;font-size:16px;font-weight: 400;}
input::-moz-placeholder {color:#a7a7a7 !important;font-size:16px;font-weight: 400;}

textarea::placeholder {color:#a7a7a7 !important;font-size:16px;font-weight: 400;}
textarea:-ms-input-placeholder {color:#a7a7a7 !important;font-size:16px;font-weight: 400;}
textarea::-ms-input-placeholder { color:#a7a7a7 !important;font-size:16px;font-weight: 400;}
textarea::-webkit-input-placeholder {color:#a7a7a7 !important;font-size:16px;font-weight: 400;}
textarea::-moz-placeholder {color:#a7a7a7 !important;font-size:16px;font-weight: 400;}

select{-webkit-border-radius:0}

button {font-family: 'NotoSansKR', 'Montserrat', sans-serif;font-style: normal;font-weight: 400; cursor:pointer;}
button * { margin:0; padding:0;}
button::-moz-focus-inner { padding:0; border:0;}

input[type=checkbox] { display: none;  }
input[type=checkbox] + label{display: inline-block;  cursor: pointer;  position: relative;padding-left:30px;margin-right:0px; font-size: 15px; line-height:20px;font-weight: 400;color:#545454;vertical-align:top;}
input[type=checkbox]+ label:before {content: "";  display: inline-block;width:20px;height:20px;transition:all .2s;position:absolute; left:0; top:0;background:url(/img/i_chkbox_wh.png) 50% 50% no-repeat #d9d9d9;border:0px solid #d9d9d9;border-radius:4px;} 
input[type=checkbox]:checked + label:before { background:url(/img/i_chkbox_wh.png) 50% 50% no-repeat var(--concept-color);border:0px solid var(--concept-color);}  

input[type=radio] { display: none;  }
input[type=radio] + label{display: inline-block;  cursor: pointer;  position: relative;padding-left:24px;margin-right:0px; font-size:15px; line-height:16px;font-weight: 400;color:#545454;vertical-align:top;}
input[type=radio]+ label:before {content: "";  display: inline-block;width:16px;height:16px;transition:all .2s;position:absolute; left:0; top:0; border:4px solid #ccc; border-radius:50%;} 
input[type=radio]:checked + label:before {border:5px solid var(--concept-color); text-align: center;} 

button,
input[type=reset],
input[type=button],
input[type=submit],
input[type=checkbox],
input[type=radio],
select, 
input,
textarea
{
    -webkit-box-sizing:content-box;
    -moz-box-sizing:content-box;
    box-sizing:content-box;
}

/*  placeholder 적용시에만 사용 */
textarea.placeholder-color{color:#666 !important;font-size:16px;font-weight: 400;}
input.placeholder-color{color:#666 !important;font-size:16px;font-weight: 400;}
.text-placeholder {color:#666 !important;font-size:16px;font-weight: 400;}

input[type=date],
input[type=datetime],
input[type=datetime-local],
input[type=email],
input[type=month],
input[type=number],
input[type=password],
input[type=range],
input[type=search],
input[type=tel],
input[type=text],
input[type=time],
input[type=url],
input[type=week]
{
    font-size:16px;
}

input[type=checkbox],
input[type=radio]
{
    width:20px;
    height:20px;
}

input[type=search]
{
    -webkit-appearance:textfield;
    -webkit-box-sizing:content-box;
}

::-webkit-search-decoration
{
    display:none;
}

button,
input[type="reset"],
input[type="button"],
input[type="submit"]
{
    overflow:visible;
    width:auto;
}

::-webkit-file-upload-button
{
    padding:0;
    border:0;
    background:none;
}

textarea
{
    vertical-align:top;overflow:auto;
}
select
{
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    appearance: none;
    outline-width:0;
    font-size:16px;
}
select::-ms-expand {
    display: none;
}
select[multiple]
{
    vertical-align:top;
}
input[type=text]::-ms-clear {
    display:none;
}


.select_sty1{position:relative;display:inline-block;vertical-align:middle;}
.select_sty1 select{width:100%;height:60px;padding:0px 30px 0px 10px;border:1px solid #e5e5e5;background:#fff;cursor: pointer;color:#a7a7a7;border-radius:4px;box-sizing:border-box;}
.select__arrow{position: absolute;top: 40%;right: 10px;width: 0;height: 0;pointer-events: none;border-style :solid;border-width: 9px 6px 0 6px;border-color: #3e4358 transparent transparent transparent;}

.input_sty1{display:inline-block;vertical-align:middle;transition: all 0.3s ease-out}
.input_sty1 input{width:100%;height:60px;padding:0px 10px;border:1px solid #e5e5e5;background:#fff;color:#444;border-radius:4px;box-sizing:border-box;}
.input_sty1 input:focus {outline: none;background:#fff;border-color:#727a82}
.input_sty1 input:disabled {background:#f1f1f1;}

.input_search{position:relative;display:inline-block;vertical-align:middle;height:55px;transition: all 0.3s ease-out}
.input_search input{width:100%;color:#444;height:55px;padding:0px 30px 0 10px;border:1px solid #e5e5e5;background:#f9f9f9;border-radius:4px;box-sizing:border-box;}
.input_search input:focus {outline: none;background-color: transparent;border-color:#727a82}
.input_search .btn__search{ position: absolute;top: 35%;right:20px;width:14px;height:14px;background:url(/images/layout/i_search.png) 0 50% no-repeat;text-indent: -9999px;}

.search-sm-w{width:280px;}
.search-lg-w{width:100%;}

.input_calendar{position: relative;display:inline-block;vertical-align:middle;height:35px;border:0px solid #d1d1d1;background-color: transparent;border-radius:0px;box-sizing:border-box;transition: all 0.3s ease-out}
.input_calendar input{height:35px;padding:0px 25px 0px 2px;text-align:center;box-sizing:border-box;color:#666;font-size:13px;font-family: 'NotoSansKR'; font-style: normal; font-weight: 400;border-radius:0px;width:100%;}
.input_calendar input:focus {outline: none;background-color: transparent;border-color:#727a82}
.input_calendar input:disabled {background:#f1f1f1;}
.input_calendar .i_calendar{position: absolute;right:5px;top:0;border:0;display: inline-block;width:16px; height:20px;background:url(../img/icon_calendar.png) 0 50% no-repeat;text-indent: -9999px;}

.textArea_sty1 textarea{display: inline-block;width:100%;border:1px solid #e5e5e5;height:300px;font-size:16px; padding: 10px;color:#444;background:#fff;box-sizing: border-box;}
.textArea_sty1 textarea:focus {outline: none;border-color:#727a82}

.textArea_sty2 textarea{display: inline-block;width:100%;border:1px solid #e5e5e5;height:150px; font-size:16px;padding: 10px;white-space: pre-wrap;color:#444;background:#fff;box-sizing: border-box;}
.textArea_sty2 textarea:focus {outline: none;border-color:#727a82}


.select_sty{position:relative;display:inline-block;vertical-align:middle;background:#fff;}
.select_sty select{width:100%;height:40px;padding:0px 30px 0px 10px;border:1px solid #dfdfdf;background:#fff;color:#000;font-size:15px;cursor: pointer;  border-radius:4px;box-sizing:border-box;}
.select_sty.lg select{height:50px;}
.select_sty.sm select{height:26px;font-size:14px;}

.select__arrow{position: absolute;top: 40%;right:15px;width: 0;height: 0;pointer-events: none;border-style :solid;border-width: 8px 5px 0 5px;border-color: #3e4358 transparent transparent transparent;}
.select__arrow_2{position: absolute;top: 40%;right:5px;pointer-events: none;width:9px; height:9px;border: 2px solid #3e4358;border-top: none;border-right: none; transform: rotate(-45deg);} /* line */

.input_sty{display:inline-block;vertical-align:middle;transition: all 0.3s ease-out}
.input_sty input{width:100%;height:40px;padding:0 10px;border:1px solid #dfdfdf;background:#fff;color:#000;font-size:15px;border-radius:4px;box-sizing:border-box;}
.input_sty input:focus {outline: none;background:#fff;border-color:var(--concept-color);}
.input_sty input:disabled, .input_sty input:read-only {background:#f1f1f1;}
.input_sty input:disabled:focus, .input_sty input:read-only:focus {border-color:#dfdfdf; }
.input_sty.lg input{height:50px;}
.input_sty.sm input{height:26px;}

/* btn-type -------------------------------------------------------------------*/
.btn-group { display: flex; margin:0px 0px;}
.btn-group.right { justify-content: flex-end;}
.btn-group > * {min-width: 220px;margin-left: 10px;}
.btn-group > *:first-child { margin-left: 0;}
.btn-group.center { display: flex;justify-content: center;}

.btn-group-A {display: flex; margin:40px 0px;}
.btn-group-A.right { justify-content: flex-end;}
.btn-group-A > * {min-width: 220px;margin-left:20px;}
.btn-group-A > *:first-child { margin-left: 0;}
.btn-group-A.center { display: flex;justify-content: center;}

.btn-type {display:inline-flex;align-items: center; position:relative;cursor:pointer;transition:all 0.3s; justify-content: center;text-transform:capitalize;/*text-transform:uppercase;*/}

.btn-type.btn {height:40px;font-weight:500;font-size:15px; line-height:1;padding:0 20px;text-align:center;border-radius:4px;box-sizing: border-box;} /* basic */
.btn-type.btn-lg {height:48px;font-weight:500;font-size:18px; line-height:1;padding:0 30px;text-align:center;border-radius:4px;box-sizing: border-box;}


.btn-type.rbtn1 {height:60px;line-height:57px;padding:0px 10px;text-align:center; font-size:15px;text-transform:uppercase;font-family: 'NotoSansKR'; font-style: normal;font-weight:400;border-radius:4px;box-sizing: border-box;-webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
.btn-type.rbtn2 {position: relative;height:60px;line-height:57px;padding:0px 35px 0px 25px;text-align:left; font-size:16px;text-transform:uppercase;font-family: 'NotoSansKR'; font-style: normal;font-weight:200;border-radius:4px;box-sizing: border-box;-webkit-box-sizing:border-box; -moz-box-sizing:border-box;}
.btn-type.rbtn2::after { content: ' ';position: absolute; top: 50%;right: 20px; width: 8px; height: 8px; margin-top: -4px;border: 1px solid #fff;border-top: none;border-right: none; transform: rotate(-135deg);}

.i_arrow {position: relative; padding-right:20px; text-align: left;}
.i_arrow::after { content: ' ';position: absolute; top: 50%;right: 0px; width: 8px; height: 8px; margin-top: -4px;border: 1px solid #fff;border-top: none;border-right: none; transform: rotate(-135deg);}

.i_left_arrow {position: relative; padding-left:15px; text-align: left;}
.i_left_arrow::after { content: ' ';position: absolute; top: 50%;left: 0px; width: 8px; height: 8px; margin-top: -4px;border: 1px solid #333;border-top: none;border-right: none; transform: rotate(45deg);}

.i_apple {display:inline-block;min-height:32px; padding-left:45px; text-align: left;background:url(/img/i_apple.png) left center no-repeat;}
.i_google {display:inline-block;min-height:32px; padding-left:45px; text-align: left;background:url(/img/i_google.png) left center no-repeat;}


/* color */
.btn-type.black {color:#fff !important;border:1px solid #000;background:#000}
.btn-type.blue {color:#fff !important;border:1px solid #337bcc;background:#337bcc}
.btn-type.dblue {color:#fff !important;border:1px solid #2f3858;background:#2f3858}
.btn-type.dgray {color:#fff !important;border:1px solid #3c3e44;background:#3c3e44}
.btn-type.gray {color:#fff !important;border:1px solid #87888d;background:#87888d}
.btn-type.lgray {color:#fff !important;border:1px solid #a3a5aa;background:#a3a5aa}
.btn-type.white{color:#323232 !important;border:1px solid #707070;background:#fff}
.btn-type.red {color:#fff !important;border:1px solid #e60012;background:#e60012}
.btn-type.black_line {color:#262729 !important;border:1px solid #262729;background:#fff}
.btn-type.gray_line {color:#717379 !important;border:1px solid #717379;background:#fff}
.btn-type.lgray_line {color:#a3a5aa !important;border:1px solid #a3a5aa;background:#fff}
.btn-type.white_line {color:#fff !important;border:1px solid #fff;background-color:transparent; }
.btn-type.main {color:#fff !important;border:1px solid #0e6eb8;background:#0e6eb8}
.btn-type.main_line {color:#0e6eb8 !important;border:1px solid #0e6eb8;background:#fff}


.btn-type.black:hover {cursor:pointer;background:#fff !important;color:#262729 !important;}
.btn-type.blue:hover {cursor:pointer;background:#fff !important;color:#007dc6 !important;}
.btn-type.dblue:hover {cursor:pointer;background:#fff !important;color:#2f3858 !important;}
.btn-type.dgray:hover {cursor:pointer;background:#fff !important;color:#3c3e44 !important;}
.btn-type.gray:hover {cursor:pointer;background:#fff !important;color:#717379 !important;}
.btn-type.lgray:hover {cursor:pointer;background:#fff !important;color:#a3a5aa !important;}
.btn-type.white:hover {cursor:pointer;background:#707070 !important;color:#fff !important;}
.btn-type.black_line:hover {cursor:pointer;background:#262729 !important;color:#fff !important;}
.btn-type.gray_line:hover {cursor:pointer;border:1px solid #262729; background:#262729 !important;color:#fff !important;}
.btn-type.white_line:hover {cursor:pointer;background:#28a7e1;border:1px solid #28a7e1 !important;}
.btn-type.red:hover {cursor:pointer;background:#fff !important;color:#e60012 !important;}
.btn-type.lgray_line:hover {cursor:pointer;color:#fff !important;border:1px solid #a3a5aa;background:#a3a5aa}
.btn-type.main:hover {cursor:pointer;color:#fff !important;border:1px solid #262729;background:#262729}
.btn-type.main_line:hover {color:#fff !important;border:1px solid #0e6eb8;background:#0e6eb8}
.btn-type.off:hover { paint-order:none; cursor:not-allowed;}


.btn-type.black:hover span.i_arrow::after{border: 1px solid #262729;}
.btn-type.blue:hover span.i_arrow::after{border: 1px solid #007dc6;}
.btn-type.dblue:hover span.i_arrow::after{border: 1px solid #2f3858;}
.btn-type.dgray:hover span.i_arrow::after{border: 1px solid #3c3e44;}
.btn-type.gray:hover span.i_arrow::after{border: 1px solid #717379;}
.btn-type.red:hover span.i_arrow::after{border: 1px solid #e60012;}


.ico-type {display:inline-block;position:relative;cursor:pointer;transition:all 0.3s}
.ico-type.btn_ico {height:35px;line-height:32px; padding:0 20px;text-align:center; font-size:14px;letter-spacing:-0.03em;text-transform:uppercase;font-family: 'NotoSansKR'; font-style: normal;font-weight:400;box-sizing: border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;}
.ico-type.btn_ico.black_line {color:#333 !important;border:1px solid #262729; background:#fff;}
.ico-type.btn_ico span{display:inline-block;padding-left:25px;}

.ico-type.ico1 {line-height:1;padding:5px 10px 6px;text-align:center; font-size:12px;text-transform:uppercase;font-family: 'NotoSansKR'; font-style: normal;font-weight: 400;box-sizing: border-box;-webkit-box-sizing:border-box; -moz-box-sizing:border-box;}

/* color */
.ico-type.black {color:#fff !important;border:1px solid #000;background:#000}
.ico-type.blue {color:#fff !important;border:1px solid #337bcc;background:#337bcc}
.ico-type.dblue {color:#fff !important;border:1px solid #2f3858;background:#2f3858}
.ico-type.dgray {color:#fff !important;border:1px solid #3c3e44;background:#3c3e44}
.ico-type.gray {color:#fff !important;border:1px solid #717379;background:#717379}
.ico-type.lgray {color:#fff !important;border:1px solid #a3a5aa;background:#a3a5aa}
.ico-type.white{color:#323232 !important;border:1px solid #707070;background:#fff}
.ico-type.red {color:#fff !important;border:1px solid #e60012;background:#e60012}
.ico-type.orange {color:#fff !important;border:1px solid #fb9347;background:#fb9347}
.ico-type.black_line {color:#262729 !important;border:1px solid #262729;background:#fff}
.ico-type.gray_line {color:#717379 !important;border:1px solid #717379;background:#fff}
.ico-type.lgray_line {color:#a3a5aa !important;border:1px solid #a3a5aa;background:#fff}
.ico-type.white_line {color:#fff !important;border:1px solid #fff;background-color:transparent; }
.ico-type.main {color:#fff !important;border:1px solid #2699d6;background:#2699d6}
.ico-type.main_line {color:#2699d6 !important;border:1px solid #2699d6;background:#fff}


@media screen and (max-width: 768px) {
.btn-type.rbtn1 {height:50px;line-height:47px;padding:0px 10px;font-size:13px;}

.btn-group-A { display: flex; margin:0px 0px;}
.btn-group-A > * {flex: 1; min-width: auto;margin-left:5px;}

.btn-group > * {flex: 1; min-width: auto;margin-left: 10px;}

.select_sty1 select{height:50px;line-height:47px;}
.input_sty1 input{height:50px;}

input[type=checkbox] + label{font-size:14px;line-height:18px;padding-left:28px;} 
input[type=checkbox]+ label:before {width:18px;height:18px;} 
    
input[type=radio] + label{font-size:14px;}


input::placeholder {font-size:15px;}
input:-ms-input-placeholder {font-size:15px;}
input::-ms-input-placeholder {font-size:15px;}
input::-webkit-input-placeholder {font-size:15px;}
input::-moz-placeholder {font-size:15px;}

.i_apple {min-height:24px; padding-left:30px; background-size:auto 24px;}
.i_google {min-height:24px; padding-left:30px; background-size:auto 24px;}


}

@media screen and (max-width: 360px) {
.btn-group-A { display: flex; margin:0px 0px;padding:0 3%;box-sizing: border-box;}
.btn-group-A > * {flex: 1; min-width: auto;margin-left:5px;}

.btn-type.rbtn1 {height:50px;line-height:47px;padding:0px 10px;font-size:13px;}

.btn-group { display: flex; flex-wrap: wrap; flex-direction: column;}
.btn-group > * {width:100%;margin-left: 0px;margin-top:10px;}
.btn-group > *:first-child { margin-top:0px;}

}