@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
          html {overflow: hidden;overflow-y:scroll;height:100%;min-width:320px;  }
            body {margin:0;padding:0;font-size:0.75em; height:100%;font-family: 'Noto Sans KR', sans-serif; -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;} 
            html, h1, h2, h3, h4, h5, h6, form, fieldset, img { margin:0;padding:0;border:0}
            h1, h2, h3, h4, h5, h6 {font-size:1em;font-family: 'Noto Sans KR', sans-serif;}
            article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
            legend {position:absolute;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
            label, input, button, select, img {vertical-align:middle}
            input, button {margin:0;padding:0;font-size:1em;font-family: 'Noto Sans KR', sans-serif;}
            button {cursor:pointer}
            input[type=text], input[type=password], input[type=submit], input[type=image], button {font-size:1em;-webkit-appearance:none}
            textarea, select {font-size:1em;font-family: 'Noto Sans KR', sans-serif;}
            textarea {border-radius:0;-webkit-appearance:none;font-family: 'Noto Sans KR', sans-serif;}
            select {margin:0;background:none;font-family: 'Noto Sans KR', sans-serif;}
            p {margin:0;padding:0;word-break:break-all}
            hr {display:none}
            pre {overflow-x:scroll;font-size:1.1em}
            a {color:#000;text-decoration:none}
            ul,li,dl,dt,dd {padding:0;margin:0}
            ul {list-style:none}

            *,:after,:before {
              -webkit-box-sizing:border-box;
              -moz-box-sizing:border-box;
              box-sizing:border-box;
            }
            @font-face {
                font-family: 'GmarketSansMedium';
                src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
                font-weight: normal;
                font-style: normal;
            }
            @font-face {
                font-family: 'GmarketSansLight';
                src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff');
                font-weight: normal;
                font-style: normal;
            }
            @font-face {
          font-family: 'GmarketSansBold';
          src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
          font-weight: normal;
          font-style: normal;
      }
        
        /* 헤더시작 */
        .hd {width:100%; }
        .hd .hd_cont {padding:0px 0px;position: relative; width:100%;}
        .hd .hd_cont .logo img {margin-top:10px; margin-left:60px;}
        .hd .hd_cont .gnb {position: absolute; top:37px; width:100%; text-align:center; }
        .hd .hd_cont .gnb .li1 {display:inline-block; position:relative; text-align:center;}
        .hd .hd_cont .gnb .li1 a {display:inline-block; padding:0 22px 15px 22px; color:#fff; font-size:1.1em; font-family: 'GmarketSansMedium';}
        .hd .hd_cont .gnb .li1 .ul2 {position: absolute; opacity: 0 ;visibility:hidden; transition: 0.3s; border-radius:5px; overflow: hidden;}
        .hd .hd_cont .gnb .li1:after {}
        .hd .hd_cont .gnb .li1:hover {}
        .hd .hd_cont .gnb .li1:hover .ul2 {visibility:visible; opacity: 1;}
        .hd .hd_cont .gnb .li1 .ul2 li a {display:inline-block; background:#444; color:#fff; padding:10px 0 9px 0; width:120px; font-size:0.9em; transition:0.3s; font-weight:400; letter-spacing: 0.5px;}
        .hd .hd_cont .gnb .li1 .ul2 li a:hover {background:#5ac2d3;}
        .hd .hd_cont .gnb .li1:nth-child(2) .ul2 {margin-left:-8px;}
        .hd .hd_cont .gnb .li1:nth-child(4) .ul2 {margin-left:12px;}
        /* 헤더끝 */

        .ft {padding:32px 180px 0 150px; position: relative;}
        .ft span {color:#fff; display:inline-block; line-height:1.7em; font-size:1.0em; margin:0 5px; font-weight:100; letter-spacing: 1px;}
        .ft span .mo {display:none;}
        .ft span.copy {margin-top:15px;}
        .ft span.sns {float:right; margin-top:-17px; text-align:right; font-size:1.0em;}
        .ft span.sns strong {font-weight:400;}
        .ft span.sns a {color:#fff; display:inline-block; font-size:1.4em; margin-left:15px; margin-top:8px;}


        

        @media screen and (max-width:1580px){
            .hd .hd_cont .logo img {margin-left:30px;}

            .ft {padding:32px 60px 0 60px;}
          }
          @media screen and (max-width:1440px){

            .hd .hd_cont .gnb .li1:first-child {margin-left:195px;}


          }
           @media screen and (max-width:1360px){

             .ft {padding:32px 30px 0 30px;}
           }

           @media screen and (max-width:1280px){
                .hd .hd_cont .gnb .li1 a {padding:0 14px 15px 14px;}
           }

           @media screen and (max-width:1080px){
                .hd .hd_cont .gnb {display:none;}
           }
           @media screen and (max-width:769px){
                .ft span {font-size:1em;}
                .ft span.sns{font-size:1em;}
                
           }
           @media screen and (max-width:550px){
                .hd .hd_cont .logo img {margin-left:15px; width:190px;margin-top:0;}

                .ft {padding:22px 15px 0 15px;}
                .ft span {font-size:0.9em;}
                .ft span .mo {display:block;}
                .ft span.sns {float:none; margin-top:-10px;width:100%; text-align:left;}
                .ft span.sns strong {display:none;}
                .ft span.sns a {margin-left:0; margin-right:15px;}
           }