@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@font-face {
    font-family : 'Nanum Gothic';
    font-style : normal;
    font-weight : 400;
    src : url(https://themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.eot);
    src : url(https://themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.eot?#iefix) format('embedded-opentype'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.woff2) format('woff2'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.woff) format('woff'), url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanumgothic/v3/NanumGothic-Regular.ttf) format('truetype');
}

/* ============================== 기본 설정 ============================== */
* {
    margin: 0; padding: 0;
    font-size: 14px; color: #333; font-family: 'Nanum Gothic', '나눔고딕', 'dotum', '돋움', "Malgun Gothic", "맑은 고딕", Tahoma, Geneva, sans-serif;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:   border-box;
    box-sizing:        border-box;
    -webkit-tap-highlight-color: rgba( 1, 108, 136, 0 );
    -moz-tap-highlight-color:    rgba( 1, 108, 136, 0 );
    -ms-tap-highlight-color:     rgba( 1, 108, 136, 0 );
    -o-tap-highlight-color:      rgba( 1, 108, 136, 0 );
    
    -webkit-text-size-adjust: none;
}
*::selection { color: #fff; background-color: #59004d; }
header, nav, article, section, aside, footer { display: block; }

a:link, a:visited, a:active { text-decoration:none; color: #555f65; }
a:hover { color: rgba( 99, 36, 93, 1 ); font-weight: 700; }

ul, ol { list-style: none; }
body > h1 {
    position: absolute; top: -100px;
    font-size: 1px;
    /*text-indent: -10000px;*/
}

/* ------------------------------ Top Button ------------------------------ */

#top-btn {
    width: 50px; height: 50px; line-height: 42px; z-index: 1000; cursor: pointer;
    position: fixed; bottom: -100px; right: 30px;
    border-radius: 50%; border: 1px solid #dedede; text-align: center;
    background-color: rgba( 255, 255, 255, 0.7 );
    -webkit-box-shadow: 5px 5px 10px rgba( 0, 0, 0, 0.2 );
    -moz-box-shadow:    5px 5px 10px rgba( 0, 0, 0, 0.2 );
    -ms-box-shadow:     5px 5px 10px rgba( 0, 0, 0, 0.2 );
    -o-box-shadow:      5px 5px 10px rgba( 0, 0, 0, 0.2 );
    box-shadow:         5px 5px 10px rgba( 0, 0, 0, 0.2 );
    -webkit-transition: all .4s ease-out;
    -moz-transition:    all .4s ease-out;
    -o-transition:      all .4s ease-out;
    transition:         all .4s ease-out;
    opacity: 0;
}
#top-btn.active { bottom: 30px; opacity: 1; }

#kakao-talk {
    width: 50px; height: 50px; z-index: 1000; cursor: pointer; text-align: center;
    position: fixed; bottom: 30px; right: 30px;
    border-radius: 50%; border: 1px solid #dedede; text-align: center;
    background-color: #fbe300;
    -webkit-box-shadow: 5px 5px 10px rgba( 0, 0, 0, 0.2 );
    -moz-box-shadow:    5px 5px 10px rgba( 0, 0, 0, 0.2 );
    -ms-box-shadow:     5px 5px 10px rgba( 0, 0, 0, 0.2 );
    -o-box-shadow:      5px 5px 10px rgba( 0, 0, 0, 0.2 );
    box-shadow:         5px 5px 10px rgba( 0, 0, 0, 0.2 );
    -webkit-transition: all .4s ease-out;
    -moz-transition:    all .4s ease-out;
    -o-transition:      all .4s ease-out;
    transition:         all .4s ease-out;
    opacity: .8;
}
#kakao-talk.active { bottom: 100px; }
#kakao-talk > i {
    font-size: 25px; color: #3b1e1e; line-height: 45px;
}
#kakao-talk:hover {
    opacity: 1;
}
/* ------------------------------ /Top Button ------------------------------ */