@charset "utf-8";

/**
* import
*/

/**
 * common
 */
.primary{color:#1960e7 !important;}
.secondary{color:#F7B633;}
.c-naver{color:#33f74d;}
.pc_hidden{display:none !important;}
.bg-primary{background-color:#1960e7 !important; color:#fff;}
.bg-gray{background-color:#f5f5f5;}
a:hover, .a:active{text-decoration: none;}

/* flex */
.flex {position:relative; display:flex;}
.flex.flex-wrap{flex-wrap: wrap;}
.flex.ai-top{align-items: flex-start;}
.flex.ai-center{align-items:center;}
.flex.ai-bottom{align-items: flex-start;}
.flex.ju-between{justify-content: space-between;}
.flex.ju-around{justify-content: space-around;}
.flex.ju-end{justify-content: end;}
.flex.ju-center{justify-content: center;}
.flex.fd-column{flex-direction: column;}
.flex.di-reverse{flex-direction: row-reverse;}

/* 반응형 속성 */
.pc-hidden{display:none !important; }


/**
 * layout
 */

h3, p{line-height: 160%; word-break: keep-all;}
html { font-size:100%; font-size:10px;}
body, button, input, select, textarea{font-family: 'GmarketSans', "Noto Sans Korean", "돋움" !important;}
body {color:#666; font-size:1.6rem;}
.inner{margin:0 auto; width:1240px;}
.txt-center{text-align: center;}
.bold {font-weight:600;}
.txt.thin{font-weight: 300;}

header{position: relative;}
header h1{position:absolute; top:0; left:50%; padding:2rem 0; transform: translateX(-50%);}
header h1 a{display:block; width:200px; height:70px; margin:0px auto; padding:0; background:url('../img/layout/h1-logo.png') center center no-repeat; background-size:70%;}

footer{text-align:center; padding:5rem 0; background:#333; color:#fff;}
footer .f-top{border-bottom:1px solid #555; line-height:1.2; font-weight:block; font-size:3rem;}
footer .f-top li{padding-bottom:1rem; font-weight:bold;}
footer .f-top li dl {padding-bottom:1rem;}
footer .f-top li dl dt img{width:58px; margin-right:1rem;}
footer .f-top li dl dd{padding-left:1rem; }
footer .f-btm{padding-top:3rem;}
footer .f-btm dl{padding-bottom:0.5rem; color:#f5f5f5;}
footer .f-btm dl dd{padding-left:1rem; color:#ccc;}
footer .fix-area{position:fixed;  right: 1rem; bottom:1rem;  width: 30%; text-align: center; z-index:100;}
footer .fix-area a{display:block; animation: color-change ease-out 1s infinite; background:#333; width:100%; padding:2rem 1rem;border-radius:50px; color:#fff; font-size:2.4rem; font-weight:bold; box-shadow: 0 0 20px #aaa;}
footer .fix-area a img{width:30px; margin-right:1rem;}


@keyframes color-change {
    0% { background: #F7B633; }
    50% { background: #333;}
    100% { background: #F7B633;}    
  }



@media screen and (max-width: 1240px) {
  .inner{margin:0 auto; width:94%;}

  footer .fix-area{width:auto; }
  footer .fix-area a{display:block; }
}

@media screen and (max-width: 1024px) {
  header h1 a{padding:0;}
  footer{padding-bottom:8rem;}
}

@media screen and (max-width: 740px) {
  header h1 a{padding:0;}
  footer{padding-bottom:10rem; }
  footer .f-top{font-size:2.4rem;}
  footer .f-top li dl {flex-direction: column; }
  footer .f-top li dl.flex.ai-center{align-items: baseline;}
  footer .f-top ul.flex.ai-center{align-items: baseline;}
  footer .fix-area{width:94%; margin:0 auto; font-size:1.8rem;}
}