@charset "utf-8";

/* NanumSqure Neo */
@font-face {
    font-family: 'NanumSquareNeo';
    font-style: normal;
    font-weight: 300;
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-aLt.eot);
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-aLt.eot?#iefix) format("embedded-opentype"),
    url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-aLt.woff) format("woff"),
    url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-aLt.ttf) format("truetype");
}

@font-face {
    font-family: 'NanumSquareNeo';
    font-style: normal;
    font-weight: 400;
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-bRg.eot);
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-bRg.eot?#iefix) format("embedded-opentype"),
    url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-bRg.woff) format("woff"),
    url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-bRg.ttf) format("truetype");
}

@font-face {
    font-family: 'NanumSquareNeo';
    font-style: normal;
    font-weight: 500;
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-cBd.eot);
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-cBd.eot?#iefix) format("embedded-opentype"),
    url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-cBd.woff) format("woff"),
    url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-cBd.ttf) format("truetype");
}

@font-face {
    font-family: 'NanumSquareNeo';
    font-style: normal;
    font-weight: 700;
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-dEb.eot);
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-dEb.eot?#iefix) format("embedded-opentype"),
    url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-dEb.woff) format("woff"),
    url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-dEb.ttf) format("truetype");
}

@font-face {
    font-family: 'NanumSquareNeo';
    font-style: normal;
    font-weight: 900;
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-eHv.eot);
    src: url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-eHv.eot?#iefix) format("embedded-opentype"),
    url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-eHv.woff) format("woff"),
    url(https://hangeul.pstatic.net/hangeul_static/webfont/NanumSquareNeo/NanumSquareNeoTTF-eHv.ttf) format("truetype");
}

/* KCC 간판 */
@font-face {
    font-family: 'KCC-Ganpan';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2302@1.0/KCC-Ganpan.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

/* Pretendard */
@font-face {
    font-family: 'Pretendard';
    font-style: normal;
    font-weight: 100;
    src: url(../css/font/Pretendard-Thin.woff2) format('woff2'),
         url(../css/font/Pretendard-Thin.woff) format('woff');
}
@font-face {
    font-family: 'Pretendard';
    font-style: normal;
    font-weight: 200;
    src: url(../css/font/Pretendard-ExtraLight.woff2) format('woff2'),
         url(../css/font/Pretendard-ExtraLight.woff) format('woff');
}
@font-face {
    font-family: 'Pretendard';
    font-style: normal;
    font-weight: 300;
    src: url(../css/font/Pretendard-Light.woff2) format('woff2'),
         url(../css/font/Pretendard-Light.woff) format('woff');
}
@font-face {
    font-family: 'Pretendard';
    font-style: normal;
    font-weight: 400;
    src: url(../css/font/Pretendard-Regular.woff2) format('woff2'),
         url(../css/font/Pretendard-Regular.woff) format('woff');
}
@font-face {
    font-family: 'Pretendard';
    font-style: normal;
    font-weight: 500;
    src: url(../css/font/Pretendard-Medium.woff2) format('woff2'),
         url(../css/font/Pretendard-Medium.woff) format('woff');
}
@font-face {
    font-family: 'Pretendard';
    font-style: normal;
    font-weight: 600;
    src: url(../css/font/Pretendard-SemiBold.woff2) format('woff2'),
         url(../css/font/Pretendard-SemiBold.woff) format('woff');
}
@font-face {
    font-family: 'Pretendard';
    font-style: normal;
    font-weight: 700;
    src: url(../css/font/Pretendard-Bold.woff2) format('woff2'),
         url(../css/font/Pretendard-Bold.woff) format('woff');
}
@font-face {
    font-family: 'Pretendard';
    font-style: normal;
    font-weight: 800;
    src: url(../css/font/Pretendard-ExtraBold.woff2) format('woff2'),
         url(../css/font/Pretendard-ExtraBold.woff) format('woff');
}
@font-face {
    font-family: 'Pretendard';
    font-style: normal;
    font-weight: 900;
    src: url(../css/font/Pretendard-Black.woff2) format('woff2'),
         url(../css/font/Pretendard-Black.woff) format('woff');
}

/* Roboto */
@font-face {
    font-family: 'Roboto';
    font-weight: 100;
    src: url(../css/font/roboto-100.woff) format('woff'),
         url(../css/font/roboto-100.woff2) format('woff2');
}
@font-face {
    font-family: 'Roboto';
    font-weight: 300;
    src: url(../css/font/roboto-300.woff) format('woff'),
         url(../css/font/roboto-300.woff2) format('woff2');
}
@font-face {
    font-family: 'Roboto';
    font-weight: 400;
    src: url(../css/font/roboto-400.woff) format('woff'),
         url(../css/font/roboto-400.woff2) format('woff2');
}
@font-face {
    font-family: 'Roboto';
    font-weight: 500;
    src: url(../css/font/roboto-500.woff) format('woff'),
         url(../css/font/roboto-500.woff2) format('woff2');
}
@font-face {
    font-family: 'Roboto';
    font-weight: 600;
    src: url(../css/font/roboto-600.woff) format('woff'),
         url(../css/font/roboto-600.woff2) format('woff2');
}

/* Common */
* {
    margin: 0;
    padding: 0;
    -webkit-touch-callout: none;
    box-sizing: border-box;
}
html {
    overflow-y: scroll;
    word-break: keep-all;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -webkit-font-size-adjust: none;
    /*scroll-behavior: smooth;*/
 }
html, body {
    margin: 0; padding: 0;
    color: #333;
    font-size: 16px; line-height: 1.6;
    min-width: 320px; height: 100%;
    letter-spacing: -0.6px;
    font-weight: 400; font-style: normal;
    text-rendering: optimizeLegibility;
    font-family: 'NanumSquareNeo', sans-serif,'Sans-serif', 돋움, 'dotum';
}

body {-ms-overflow-style: none;}
body::-webkit-scrollbar {display: none;}

@media screen and (max-width:1280px){
    html, body {
        font-size: 15px;
        letter-spacing: -0.8px;
    }
}




html, body, div, span,
dl, dt, dd, ol, ul, li, object,
article, aside, canvas, details, embed, figure, figcaption,
h1, h2, h3, h4, h5, h6, p, a, abbr, address, cite, em, img, strong,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
footer, header, hgroup, menu, nav, section, summary, audio, video {
    margin: 0; padding: 0;
    border: 0;
    vertical-align:baseline
}
h1, h2, h3, h4, h5, h6 {
    font-weight: normal;
    font-size: 100%;
    line-height: normal;
}
dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6,
pre, form, fieldset, input, textarea, p, blockquote {
    margin: 0; padding: 0;
}
select {
    margin: 0; padding: 0;
    box-sizing: border-box;
    -webkit-border-radius: 0;
}
img {
    max-width: 100%; border: 0;
    vertical-align:middle;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -ms-interpolation-mode: bicubic;
}
legend, caption {
    visibility: hidden; overflow: hidden;
    position: absolute;
    width: 0; height: 0; line-height: 0;
    margin: 0; padding: 0;
}



a {color: inherit;}
a:link, a:visited {text-decoration: none;}
a:hover, a:active {text-decoration: none;}



textarea {overflow-y: auto;}
label {cursor: pointer;}
ol, ul, li {list-style: none;}
img, fieldset {border: 0 none;}
label, select, input, button {vertical-align: baseline; font-family: inherit;}
input, textarea, select {color: inherit; font-family: inherit;}
table {border-collapse: collapse; border-spacing: 0;}



em, address {font-style: normal;}
hr {display: none; clear: both; height: 0;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}



input[type=text], input[type=password] {-webkit-border-radius: 0; -webkit-appearance: none;}
input[type=checkbox], input[type=radio] {vertical-align: middle;}
input[type=submit] {-webkit-border-radius: 0; -webkit-appearance: none;}
input[type=image] {height: auto; border: 0;}
input[type=file] {border: 0; background: none;}



/* input 초기화 */

label{height: 44px; line-height: 44px;}
select{-webkit-appearance: none; -moz-appearance: none; appearance: none; box-sizing: border-box; width: 500px; height: 44px; padding: 0 2.5rem 0 1rem; border: 1px solid #dbdbdb;
    background: #fff url(/assets/site/img/common/form_sel_arrow.png) no-repeat right 1rem top 50%; font-size: 1rem; vertical-align: middle;}
select option{}
input{width: 500px; height: 44px; padding: 0 1rem; box-sizing: border-box; border: none; font-size: 1rem; outline: none; color: #222; vertical-align: middle; background: #fff; border: 1px solid #dbdbdb; transition: 0.3s;}
textarea{width: 100%; box-sizing: border-box; padding: 1rem; border: none; font-size: inherit; resize: none; border-radius: 0; background-color: #fff; border: 1px solid #dbdbdb; color: #222; transition: 0.3s; font-size: 1rem;}
button {background:none; border:0; padding:0; margin:0; cursor:pointer; overflow:visible; white-space:nowrap;}



select:focus,
textarea:focus,
input[type=text]:focus,
input[type=password]:focus {
	outline: none;
	border: 1px solid #222;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0px 1000px rgba(0,0,0,0) inset !important;
}



input:focus,
input:focus + label,
select:focus,
textarea:focus{border-color: #222; background-color: #fff;}
input::placeholder,
textarea::placeholder{font-weight: 300; color: #bbb !important;}
pre{color: inherit; font-family: inherit; white-space: pre-wrap;}
@media screen and (max-width:860px){
    input,
    select {
        width: 100%;

    }
}
@media screen and (max-width:568px){
    /* select,
    input{height: 40px;}
    label{height: 40px; line-height: 40px;} */
}



/* html5 구 버전 적용 위한 소스 */
area, base, basefont, command, datalist, head, link, meta,
noframes, param, script, source, style, track, title, noembed,
[hidden], input[type=hidden], menu[type=context], {
    display: none;
}
address, article, aside, blockquote, body, center, dd, dir, div, dl, dt, figure,
figcaption, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, html,
legend, listing, menu, nav, ol, p, plaintext, pre, section, summary, ul, xmp {
    display: block;
}
table { display: table; }
caption { display: table-caption; }
colgroup { display: table-column-group; }
col { display: table-column; }
thead { display: table-header-group; }
tbody { display: table-row-group; }
tfoot { display: table-footer-group; }
tr { display: table-row; }
td, th { display: table-cell; }
li { display: list-item; }
ruby { display: ruby; }
rt { display: ruby-text; display: inline; }



::selection { background: #222; color: #fff; }
.clearfix::after{ content: ''; display: block; clear: both; }
::-webkit-input-placeholder { /* WebKit browsers */ color: #a5a5a5 !important;  }
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #a5a5a5!important; opacity: 1; }
::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #a5a5a5!important; opacity: 1;  }
:-ms-input-placeholder { /* Internet Explorer 10+ */ color: #a5a5a5!important;}



/* 마진 및 정렬 */
.text_c {text-align:center;}
.text_l {text-align:left;}
.text_r {text-align:right;}
.float_r {float:right;}
.float_l {float:left;}

.clear {clear:both !important;}

.pat0{ padding-top:0 !important;}
.pab0{ padding-bottom:0 !important;}
.mat0{ margin-top:0 !important;}
.mab0{ margin-bottom:0 !important;}

.mat5{ margin-top:5px !important;}
.mar5{ margin-right:5px !important;}
.mab5{ margin-bottom:5px !important;}
.mal5{ margin-left:5px !important;}

.mat10{ margin-top:10px !important;}
.mar10{ margin-right:10px !important;}
.mab10{ margin-bottom:10px !important;}
.mal10{ margin-left:10px !important;}

.mat20{ margin-top:20px !important;}
.mar20{ margin-right:20px !important;}
.mab20{ margin-bottom:20px !important;}
.mal20{ margin-left:20px !important;}

.mat30{ margin-top:30px !important;}
.mar30{ margin-right:30px !important;}
.mab30{ margin-bottom:30px !important;}
.mal30{ margin-left:30px !important;}

.mat40{ margin-top:40px !important;}
.mar40{ margin-right:40px !important;}
.mab40{ margin-bottom:40px !important;}
.mal40{ margin-left:40px !important;}

.mat50{ margin-top:50px !important;}
.mar50{ margin-right:50px !important;}
.mab50{ margin-bottom:50px !important;}
.mal50{ margin-left:50px !important;}

.mat60{ margin-top:60px !important;}
.mar60{ margin-right:60px !important;}
.mab60{ margin-bottom:60px !important;}
.mal60{ margin-left:60px !important;}

.mat70{ margin-top:70px !important}
.mar70{ margin-right:70px !important}
.mab70{ margin-bottom:70px !important}
.mal70{ margin-left:70px !important}

.mat80{ margin-top:80px !important}
.mar80{ margin-right:80px !important}
.mab80{ margin-bottom:80px !important}
.mal80{ margin-left:80px !important}

.mat90{ margin-top:90px !important}
.mar90{ margin-right:90px !important}
.mab90{ margin-bottom:90px !important}
.mal90{ margin-left:90px !important}

.mat100{ margin-top:100px !important}
.mar100{ margin-right:100px !important}
.mab100{ margin-bottom:100px !important}
.mal100{ margin-left:100px !important}
@media screen and (max-width:1024px){
    .mat20{ margin-top:10px !important}
    .mab20{ margin-bottom:10px !important}

    .mat30{ margin-top:15px !important}
    .mab30{ margin-bottom:15px !important}

    .mat40{ margin-top:20px !important}
    .mab40{ margin-bottom:20px !important}

    .mat50{ margin-top:20px !important}
    .mab50{ margin-bottom:20px !important}

    .mat60{ margin-top:30px !important}
    .mab60{ margin-bottom:30px !important}

    .mat70{ margin-top:35px !important}
    .mab70{ margin-bottom:35px !important}

    .mat80{ margin-top:40px !important}
    .mab80{ margin-bottom:40px !important}

    .mat90{ margin-top:45px !important}
    .mab90{ margin-bottom:45px !important}

    .mat100{ margin-top:50px !important}
    .mab100{ margin-bottom:50px !important}
}



/* 너비 */
.w100{width:100% !important;}
.w80{width:80% !important;}
.w75{width:75% !important;}
.w70{width:70% !important;}
.w65{width:65% !important;}
.w60{width:60% !important;}
.w55{width:55% !important;}
.w50{width:50% !important;}
.w45{width:45% !important;}
.w40{width:40% !important;}
.w35{width:35% !important;}
.w30{width:30% !important;}
.w25{width:25% !important;}
.w20{width:20% !important;}
.w15{width:15% !important;}
.w10{width:10% !important;}

/* swiper set */
.swiper {width: 100%; height: 100%;}
.swiper-slide {display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center;}