@charset "UTF-8";
@font-face {
    font-family: 'NotoSans';
    src: url(/sum/font/NotoSansCJKkr-Thin.woff) format('woff');
    font-style: normal;
    font-weight: 100;
}
@font-face {
    font-family: 'NotoSans';
    src: url(/sum/font/NotoSansCJKkr-DemiLight.woff) format('woff');
    font-style: normal;
    font-weight: 200;
}
@font-face {
    font-family: 'NotoSans';
    src: url(/sum/font/NotoSansCJKkr-Light.woff) format('woff');
    font-style: normal;
    font-weight: 300;
}
@font-face {
    font-family: 'NotoSans';
    src: url(/sum/font/NotoSansCJKkr-Regular.woff) format('woff');
    font-style: normal;
    font-weight: 400;
}
@font-face {
    font-family: 'NotoSans';
    src: url(/sum/font/NotoSansCJKkr-Medium.woff) format('woff');
    font-style: normal;
    font-weight: 500;
}
@font-face {
    font-family: 'NotoSans';
    src: url(/sum/font/NotoSansCJKkr-Bold.woff) format('woff');
    font-style: normal;
    font-weight: 700;
}
@font-face {
    font-family: 'NotoSans';
    src: url(/sum/font/NotoSansCJKkr-Black.woff) format('woff');
    font-style: normal;
    font-weight: 900;
}

/* 
폰트
font-family: 'Poppins', sans-serif;
font-family: 'Roboto', sans-serif;
font-family: 'NotoSans';
*/


/* reset */
*::selection { background-color: #ddd; }
* { margin: 0; padding: 0; box-sizing: border-box; font-family: inherit; font-weight: inherit; letter-spacing: -0.08em; }
html { overflow: hidden; }
body { width: 100%; font-family: 'NotoSans'; }
a { color: inherit; }

.wrap { width: 100vw; height: 100vh; overflow: hidden scroll; }

.cb::after { content: ""; clear: both; display: block; }
.cb > .left { float: left; }
.cb > .right { float: right; }
ul.cb > li { float: left; }

.roboto { font-family: 'Roboto', sans-serif; }
.poppins { font-family: 'Poppins', sans-serif; }

.inner { width: 100%; max-width: 1300px; padding: 0 10px; margin: auto; }

.pink { color: #FA3F5B; }

/* 버튼 */
.btn_move { font-size: 14px; height: 45px; line-height: 45px; text-align: center; display: inline-block; margin-top: 50px; border: 1px solid #000; position: relative; overflow: hidden; }
.btn_move::after { content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: -100%; background-color: #000; transition: left 0.5s; }
.btn_move span {position: relative; z-index: 5; transition: color 0.3s; }
.btn_move img { margin-left: 10px; transition: filter 0.3s; }

.btn_move:hover::after { left: 0; }
.btn_move:hover span { color: #fff; }
.btn_move:hover img { filter: invert(100%); transition-delay: 0.3s; }


.btn_move.white { border-color: #fff; }
.btn_move.white img { filter: invert(100%); }
.btn_move.white::after { background-color: #fff; }
.btn_move.white:hover span { color: #000; }
.btn_move.white:hover img { filter: invert(0%); }