@charset "UTF-8";
/*-------------------------------------------------------------------
    파일정의 : 공통스타일
-------------------------------------------------------------------*/
@import url("../../../../fonts/Pretendard.css");
:root {
  --blue-color: #3898FF;
  /* 포인트파란색 */
  --navy-color: #2D6DB2;
  /* 포인트파란색 */
  --red-color: #BD3A65;
  /* 포인트하늘색 */
  --blue-gradient-color: #2E67B9;
  /* 그라데이션 블루 */
  --green-gradient-color: #11AE4F;
  /* 그라데이션 그린 */
  --border-color: #DEDEDE;
  /* 보더색상 */
  --txt-gray-color: #C8C8C8;
  /* 텍스트그레이색상 */ }

html {
  font-size: 62.5%; }
  html.active {
    visibility: visible; }
  html.disable-outline * {
    outline: none; }

body {
  font-size: 1.4rem;
  line-height: 1.5;
  font-weight: 400;
  color: #000000;
  letter-spacing: -0.04em;
  font-family: 'Pretendard', '맑은 고딕', '돋움', sans-serif; }

#wrap {
  position: relative;
  width: 100%;
  min-width: 320px; }

#skipNav {
  position: relative;
  z-index: 99999; }
  #skipNav a {
    position: absolute;
    top: -200px;
    left: 0;
    color: #333;
    width: 100%;
    line-height: 30px;
    border: 1px solid var(--border-color);
    background-color: #fff;
    text-align: center;
    box-sizing: border-box; }
    #skipNav a:focus, #skipNav a:active {
      top: 0; }

header {
  position: relative;
  top: 2rem;
  z-index: 9999;
  width: 100%; }
  header .inner {
    max-width: 140rem;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center; }
  header .logo {
    width: 13.6rem;
    height: 4.8rem;
    background: url("../img_en/common/logo.png") no-repeat center;
    background-size: contain; }
    @media (max-width: 767px) {
      header .logo {
        width: 8.5rem;
        height: 3rem; } }
  @media (max-width: 767px) {
    header .btn-wrap .fill-gradient {
      font-size: 1.4rem;
      padding: 0 1.8rem;
      height: 2.5rem; } }

#footer {
  background-color: #2A2E39;
  padding: 4.5rem 0 7.4rem 0; }
  #footer .f_logo a {
    width: 16.1rem;
    height: 5.7rem;
    display: block;
    background: url("../img_en/common/logo.png") no-repeat center;
    background-size: contain; }
    @media (max-width: 767px) {
      #footer .f_logo a {
        width: 12rem;
        height: 6rem; } }
  #footer .address {
    margin-top: 2.4rem; }
    #footer .address address {
      margin-top: 3.2rem; }
      #footer .address address .txt {
        display: block;
        font-size: 1.6rem;
        line-height: 1.6;
        color: #fff; }
        @media (max-width: 1199px) {
          #footer .address address .txt {
            font-size: 1.5rem;
            color: rgba(255, 255, 255, 0.5); } }
    #footer .address .copy {
      margin-top: 0.5rem;
      font-size: 1.6rem;
      line-height: 1.6;
      color: rgba(255, 255, 255, 0.3);
      display: block; }
      @media (max-width: 1199px) {
        #footer .address .copy {
          font-size: 1.4rem; } }

#wrap .hide-txt,
#contents .hide-txt,
.hide-txt {
  overflow: hidden;
  position: absolute;
  width: 1px;
  height: 1px;
  border: none;
  clip: rect(1px, 1px, 1px, 1px); }

#container {
  position: relative;
  top: -4.8rem; }

.contents {
  max-width: 160rem;
  margin: 0 auto;
  padding: 12.5rem 0 30rem 0;
  position: relative; }
  @media (max-width: 1199px) {
    .contents {
      width: calc(100% - 4rem);
      padding: 4rem 0 12rem 0; } }
  @media (max-width: 767px) {
    .contents {
      padding: 3rem 0 10rem 0; } }

.inner {
  max-width: 140rem;
  margin: 0 auto;
  width: calc(100% - 4rem); }

.contents-wrap {
  width: calc(100% - 28rem - 8rem); }
  @media (max-width: 1199px) {
    .contents-wrap {
      width: 100%; } }