@charset "UTF-8";
@import url('/fonts/roboto.css');
@import url('/fonts/nanum-square.css');

::selection {background-color:#d8d8d8; color:#ffffff;}
::-moz-selection {background:#d8d8d8; color:#ffffff;}
::webkit-selection {background:#d8d8d8; color:#ffffff;}

@-mozdocument url-prefix(){
    selector {text-indent:20px;}
}
@media screen and (-webkit-min-device-pixel-ratio:0;){
    selector {text-indent:20px;}
}

/* 초기화 */
html {overflow-x:hidden;overflow-y:scroll;height:100%;-wekit-text-size-adjust:antialiased;-moz-osx-font-smoothing:grayscale;}
body {-webkit-font-smoothing: antialiased;margin:0;padding:0;font-size:0.95rem;height:100%;font-family:'nanum-square-r', sans-serif;background:#fff;/*min-width:320px;*/}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1.0rem}
article, aside, details, figcaption, figure, f, header, hgroup, menu, nav, section {display:block}
header ul, nav ul, footer ul {margin:0;padding:0;list-style:none}
legend {position:absolute;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select,img{vertical-align:middle;outline:none;}
input, button {margin:0;padding:0;font-size:0.95rem;}
button,input[type=submit]{cursor:pointer;font-family:'nanum-square-r', sans-serif;outline:none}
input[type=text], input[type=password], input[type=submit], input[type=image], button {border-radius:0;font-size:1em;-webkit-appearance:none;outline:none;}
textarea, select {font-size:0.95rem;font-family:'nanum-square-r', sans-serif;}
textarea {border-radius:0;-webkit-appearance:none}

p {margin:0;padding:0;word-break:break-all}
hr {display:none}
pre {overflow-x:scroll;font-size:1.1em;}
a:link, a:visited {color:#414141;text-decoration:none;}
a:hover,a:focus{color:#000;}

ul,li,ol,dt,dd,dl{list-style:none;padding:0;margin:0;}
/* any "checkable" element */
:checked {
  width: 17px;
  height: 17px;
  vertical-align:middle;
  margin:0 3px;
}

/* only radio elements */
input[type="radio"]:checked {
  width: 15px;
  height: 15px;
  margin:0 3px;
  vertical-align:middle;
}

/* only checkbox elements */
input[type="checkbox"]:checked {
  width: 15px;
  height: 15px;
  margin:0 3px;
  vertical-align:middle;
}

/* only option elements */
option:checked {
  color: blue;
  vertical-align:middle;
}

.checks {position: relative;} 
.checks input[type="checkbox"] { /* 실제 체크박스는 화면에서 숨김 */ position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0 }
.checks input[type="checkbox"] + label { display: inline-block; position: relative; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; }
.checks input[type="checkbox"] + label:before { /* 가짜 체크박스 */ content: ' '; display: inline-block; width: 21px; /* 체크박스의 너비를 지정 */ height: 21px; /* 체크박스의 높이를 지정 */ line-height: 21px; /* 세로정렬을 위해 높이값과 일치 */ margin: -2px 8px 0 0; text-align: center; vertical-align: middle; background: #fafafa; border: 1px solid #cacece; border-radius : 3px; box-shadow: 0px 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05); }
.checks input[type="checkbox"] + label:active:before, .checks input[type="checkbox"]:checked + label:active:before { box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1); }
.checks input[type="checkbox"]:checked + label:before { /* 체크박스를 체크했을때 */ content: '\2714'; /* 체크표시 유니코드 사용 */ color: #99a1a7; text-shadow: 1px 1px #fff; background: #e9ecee; border-color: #adb8c0; box-shadow: 0px 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05), inset 15px 10px -12px rgba(255,255,255,0.1); }


*, :after, :before {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;}

strong {
  font-family: 'nanum-square-b', sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.strong {
font-family: 'nanum-square-b', sans-serif !important;
-webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@media screen and (max-width: 1100px) {
strong {
  font-family: 'nanum-square-r', sans-serif !important;
}

.strong {
font-family: 'nanum-square-r', sans-serif !important;
}
}

.eng {
 font-family: 'Roboto', Arial, sans-serif !important;
 letter-spacing:0.010em;
 font-weight:normal;
 -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.eng-C {
 font-family: 'Roboto Condensed', Arial, sans-serif !important;
 letter-spacing:0.010em;
 font-weight:normal;
 -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/*------------------------------------
   공통 레이아웃CSS
------------------------------------*/
#wrap {float:left;width:100%;margin:0;padding:0px 0px;display:block;}

#header {position:fixed;top:0;left:0;width:100%;padding:15px 0px 15px 0;margin:0;display:block;cursor:pointer; background: rgba(255, 255, 255, 0.9);opacity : 1.0;filter: alpha(opacity=100);-moz-opacity:1.0;-khtml-opacity: 1.0;z-index:10000;}/*메뉴 MouseOver시 배경 #ffffff 나타나는 효과*/
#header .center {margin:0 auto;max-width:1500px;padding:0px 0px;display:block;}
#header .logo {float:left;width:30%;padding:0px 0 0 25px;margin:0;display:inline-block;}
#header .logo img {width:100%;max-width:110px;height:auto;}
#header .menu {float:left;width:70%;padding:0;margin:0;display:inline-block;}
#header .menu ul {float:right;padding:0;margin:15px 0 0 0;display:block;}
#header .menu li {float:left;padding:0 35px 0 0;margin:0;font-size:1.15rem;color:#000;font-weight:600;display:inline-block;}
#header .menu li:last-child {padding:0 30px 0 0;}

@media (min-width: 992px) and (max-width: 1280px) { 
#header {top:0px;padding:15px 10px 15px 10px;}
#header .logo img {max-width:100px;}
#header .menu ul {margin:15px 0 0 0;}
#header .menu li {padding:0 35px 0 0;font-size:1.0rem;}
}

@media (min-width: 0px) and (max-width: 991.99px) { 
#header {display:none;}
}

/*카피라이터*/
#footer {float:left;width:100%;margin:0px 0 0px 0;padding:0 0;background:#d3c7b7;display:block;}
#footer .copy {float:left;width:100%;padding:0px 0;margin:50px 0 50px 0;text-align:center;display:block;}
#footer .t1 {font-size:0.90rem;color:#fff;line-height:1.8em;letter-spacing:0.000em;padding:0;margin:0 0px 8px 0px;font-weight:400;display:block;}
#footer .t1 span {padding:0 5px;}
#footer .t2 {font-size:0.75rem;color:#fff;font-weight:300;letter-spacing:0.000em;padding:0;margin:5px 0 0 0;display:block;}

@media (min-width: 992px) and (max-width: 1280px) { 
#footer {padding:0 35px;}
#footer .copy {padding:35px 25px;margin:40px 0 40px 0;}
}

@media (min-width: 576px) and (max-width: 991.99px) { 
#footer {padding:0 0px;}
#footer .copy {padding:25px 150px;margin:0px 0 0px 0;}
#footer .t1 {font-size:0.75rem;line-height:1.5em;margin:0 0px 8px 0px;}
#footer .t2 {font-size:0.65rem;margin:5px 0 0 0;}
}

@media (min-width: 0px) and (max-width: 575.99px) {
#footer {padding:0 0px;}
#footer .copy {padding:25px 25px;margin:0px 0 0px 0;}
#footer .t1 {font-size:0.75rem;line-height:1.5em;margin:0 0px 8px 0px;}
#footer .t2 {font-size:0.65rem;margin:5px 0 0 0;}
}


/*------------------------------------
    폰트사이즈 및 정의 및 CSS
------------------------------------*/
.normal {font-weight: 400; }/*나눔스퀘어 보통*/
.bold {font-weight: 700;}/*두껍게*/
.bolder {font-weight: 800;}/*가장 두껍게*/
.light {font-weight: 300; }/*가늘게*/

.fweight-400 {font-weight:400;}
.letter-s0 {letter-spacing:0.00em;}

.text-left {text-align:left;}/*텍스트 왼쪽 정렬*/
.text-center {text-align:center;}/*텍스트 센터 정렬*/
.text-right {text-align:right;}/*텍스트 우측 정렬*/


.Title_f_22 {font-size:2.280em;letter-spacing:-0.050em;color:#0e6fc1;margin:20px 0 0 0;}/*서브 컨텐츠 타이틀*/
.Title_f_22_line {margin:19px 0 0 3px;width:50px;height:3px;background:#0e6fc1;}/*서브 컨텐츠 타이틀_라인*/
.c_f115 {font-size:1.150em;letter-spacing:-0.050em;line-height:1.6em;font-weight:400;color:#414141;}/*서브 컨텐츠 내용*/

.n_f100 {font-size:1.000em;letter-spacing:0.000em;color:#414141;}/*네비게이션 텍스트*/
.n_f100 a:link, .n_f100 a:visited {font-size:1.000em;letter-spacing:0.010em;color:#414141;}
.n_f100 a:hover, .n_f100 a:active {color:#000;}


::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  font-size:100% !important;letter-spacing:0.000em; color:#414141;
}
::-moz-placeholder { /* Firefox 19+ */
  font-size:100% !important;letter-spacing:0.000em; color:#414141;
}
:-ms-input-placeholder { /* IE 10+ */
  font-size:100% !important;letter-spacing:0.000em; color:#414141;
}
:-moz-placeholder { /* Firefox 18- */
  font-size:100% !important;letter-spacing:0.000em; color:#414141;
}


/*Top버튼*/
.up-btn {
	position: fixed;
	right: 3.5%;
	bottom: 1.5%;
}
.up-btn a {
	display: block;
  text-decoration: none;
	opacity:0.8; filter:alpha(opacity=80);  /*for ie8 and earlier*/
  -webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}
.up-btn a:hover {
	opacity:1.0; filter:alpha(opacity=100); /*for ie8 and earlier*/
  -webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	-ms-transition: all 300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;
}

.up-btn img {width:100%;max-width:58px;height:auto;}

@media (min-width: 992px) and (max-width: 1280px) { 
.up-btn img {max-width:48px;height:auto;}
}

@media (min-width: 0px) and (max-width: 991.99px) { 
.up-btn {right:3%;bottom:2%;}
.up-btn img {max-width:40px;height:auto;}
}


/*------------------------------------------------------------------
  	[Text Colors]
------------------------------------------------------------------*/
.color-base {
  color: #17bed2;
}

.color-white {
  color: #fff;
}

.color-heading {
  color: #515769;
}

.color-subtitle {
  color: #a6a7aa;
}

.color-link {
  color: #81848f;
}

.color-link-hover {
  color: #999caa;
}

.color-sky-light {
  color: #fafafa;
}

.color-black {
   color: #000;
}

.color-green {
   color: #72bd7d;
}

/*------------------------------------------------------------------
  	[Background Colors]
------------------------------------------------------------------*/
.bg-color-base {
  background: #17bed2;
}

.bg-color-white {
  background: #fff;
}

.bg-color-heading {
  background: #515769;
}

.bg-color-subtitle {
  background: #a6a7aa;
}

.bg-color-link {
  background: #81848f;
}

.bg-color-link-hover {
  background: #999caa;
}

.bg-color-sky-light {
  background: #fafafa;
}

/*------------------------------------------------------------------
    [Row]
------------------------------------------------------------------*/
.row-space-1 {
  margin-right: -1px;
  margin-left: -1px;
}

.row-space-1 > [class*="col-"] {
  padding-left: 1px;
  padding-right: 1px;
}

/*------------------------------------------------------------------
  	[Content]
------------------------------------------------------------------*/
.content {
  padding-top: 0px;
  padding-bottom: 0px;
}

.content-20 {
  padding-top: 20px;
  padding-bottom: 20px;
}

.content-nomal {
  padding-top: 40px;
  padding-bottom: 40px;
}

.content-sm {
  padding-top: 60px;
  padding-bottom: 60px;
}

.content-md {
  padding-top: 80px;
  padding-bottom: 80px;
}

.content-lg {
  padding-top: 100px;
  padding-bottom: 100px;
}

@media screen and (max-width:850px) {
.content-nomal {
  padding-top: 30px;
  padding-bottom: 30px;
}

.content-sm {
  padding-top: 40px;
  padding-bottom: 40px;
}

.content-md {
  padding-top: 50px;
  padding-bottom: 50px;
}

.content-lg {
  padding-top: 60px;
  padding-bottom: 60px;
}
}

@media screen and (max-width:640px) {
.content-nomal {
  padding-top: 20px;
  padding-bottom: 20px;
}

.content-sm {
  padding-top: 30px;
  padding-bottom: 30px;
}

.content-md {
  padding-top: 40px;
  padding-bottom: 40px;
}

.content-lg {
  padding-top: 50px;
  padding-bottom: 50px;
}
}


/*------------------------------------------------------------------
    [Parallax Content]
------------------------------------------------------------------*/
.parallax-content {
padding-top: 290px;
  padding-bottom: 290px;
  /*height:580px;*/
}

/*------------------------------------------------------------------
    [Full Width]
------------------------------------------------------------------*/
.full-width {
width:100%;max-width:100%;height:auto;
}
 .img-fluid {width:100%;max-width:100%;height:auto;}


/*------------------------------------------------------------------
    [Container Full Width]
------------------------------------------------------------------*/
.container-full-width {
  width: 100%;
}

.container-full-width:before, .container-full-width:after {
  content: " ";
  display: table;
}

.container-full-width:after {
  clear: both;
}


/*------------------------------------------------------------------
    [Overflow]
------------------------------------------------------------------*/
.overflow-h {
  overflow: hidden;
}

/*--------------------------------------------------
    [Font Weight]
----------------------------------------------------*/
.fweight-300 {
  font-weight: 300 !important;
}

.fweight-400 {
  font-weight: 400 !important;
}

.fweight-500 {
  font-weight: 500 !important;
}

.fweight-600 {
  font-weight: 600 !important;
}

.fweight-700 {
  font-weight: 700 !important;
}

/*------------------------------------------------------------------
    [Left margin]
------------------------------------------------------------------*/
.margin-l-0 {
  margin-left: 0 !important;
}

.margin-l-5 {
  margin-left: 5px !important;
}

.margin-l-10 {
  margin-left: 10px !important;
}

.margin-l-20 {
  margin-left: 20px !important;
}

/*------------------------------------------------------------------
    [Right margin]
------------------------------------------------------------------*/
.margin-r-0 {
  margin-right: 0 !important;
}

.margin-r-5 {
  margin-right: 5px !important;
}

.margin-r-10 {
  margin-right: 10px !important;
}

.margin-r-20 {
  margin-right: 20px !important;
}

/*------------------------------------------------------------------
    [Bottom margin]
------------------------------------------------------------------*/
.margin-b-0 {
  margin-bottom: 0 !important;
}

.margin-b-2 {
  margin-bottom: 2px !important;
}

.margin-b-5 {
  margin-bottom: 5px !important;
}

.margin-b-10 {
  margin-bottom: 10px !important;
}

.margin-b-20 {
  margin-bottom: 20px !important;
}

.margin-b-30 {
  margin-bottom: 30px !important;
}

.margin-b-40 {
  margin-bottom: 40px !important;
}

.margin-b-50 {
  margin-bottom: 50px !important;
}

.margin-b-60 {
  margin-bottom: 60px !important;
}

.margin-b-70 {
  margin-bottom: 70px !important;
}

.margin-b-80 {
  margin-bottom: 80px !important;
}

.margin-b-90 {
  margin-bottom: 90px !important;
}

.margin-b-100 {
  margin-bottom: 100px !important;
}

.margin-b-120 {
  margin-bottom: 120px !important;
}

.margin-b-150 {
  margin-bottom: 150px !important;
}

.margin-b-200 {
  margin-bottom: 200px !important;
}

/*------------------------------------------------------------------
    [Top margin below 992px]
------------------------------------------------------------------*/
@media (max-width: 992px) {
  .md-margin-b-0 {
    margin-bottom: 0 !important;
  }
  .md-margin-b-2 {
    margin-bottom: 2px !important;
  }
  .md-margin-b-5 {
    margin-bottom: 5px !important;
  }
  .md-margin-b-10 {
    margin-bottom: 10px !important;
  }
  .md-margin-b-20 {
    margin-bottom: 20px !important;
  }
  .md-margin-b-30 {
    margin-bottom: 30px !important;
  }
  .md-margin-b-40 {
    margin-bottom: 40px !important;
  }
  .md-margin-b-50 {
    margin-bottom: 50px !important;
  }
  .md-margin-b-60 {
    margin-bottom: 60px !important;
  }
  .md-margin-b-70 {
    margin-bottom: 70px !important;
  }
  .md-margin-b-80 {
    margin-bottom: 80px !important;
  }
  .md-margin-b-90 {
    margin-bottom: 90px !important;
  }
  .md-margin-b-100 {
    margin-bottom: 100px !important;
  }
  .md-margin-b-120 {
  margin-bottom: 120px !important;
}

  .md-margin-b-150 {
  margin-bottom: 150px !important;
}

  .md-margin-b-200 {
  margin-bottom: 200px !important;
}
}

/*------------------------------------------------------------------
    [Top margin below 768px]
------------------------------------------------------------------*/
@media (max-width: 768px) {
  .sm-margin-b-0 {
    margin-bottom: 0 !important;
  }
  .sm-margin-b-2 {
    margin-bottom: 2px !important;
  }
  .sm-margin-b-5 {
    margin-bottom: 5px !important;
  }
  .sm-margin-b-10 {
    margin-bottom: 10px !important;
  }
  .sm-margin-b-20 {
    margin-bottom: 20px !important;
  }
  .sm-margin-b-30 {
    margin-bottom: 30px !important;
  }
  .sm-margin-b-40 {
    margin-bottom: 40px !important;
  }
  .sm-margin-b-50 {
    margin-bottom: 50px !important;
  }
  .sm-margin-b-60 {
    margin-bottom: 60px !important;
  }
  .sm-margin-b-70 {
    margin-bottom: 70px !important;
  }
  .sm-margin-b-80 {
    margin-bottom: 80px !important;
  }
  .sm-margin-b-90 {
    margin-bottom: 90px !important;
  }
  .sm-margin-b-100 {
    margin-bottom: 100px !important;
  }
  .sm-margin-b-120 {
  margin-bottom: 120px !important;
}

  .sm-margin-b-150 {
  margin-bottom: 150px !important;
}

  .sm-margin-b-200 {
  margin-bottom: 200px !important;
}
}

/*------------------------------------------------------------------
    [Top margin below 480px]
------------------------------------------------------------------*/
@media (max-width: 480px) {
  .xs-margin-b-0 {
    margin-bottom: 0 !important;
  }
  .xs-margin-b-2 {
    margin-bottom: 2px !important;
  }
  .xs-margin-b-5 {
    margin-bottom: 5px !important;
  }
  .xs-margin-b-10 {
    margin-bottom: 10px !important;
  }
  .xs-margin-b-20 {
    margin-bottom: 20px !important;
  }
  .xs-margin-b-30 {
    margin-bottom: 30px !important;
  }
  .xs-margin-b-40 {
    margin-bottom: 40px !important;
  }
  .xs-margin-b-50 {
    margin-bottom: 50px !important;
  }
  .xs-margin-b-60 {
    margin-bottom: 60px !important;
  }
  .xs-margin-b-70 {
    margin-bottom: 70px !important;
  }
  .xs-margin-b-80 {
    margin-bottom: 80px !important;
  }
  .xs-margin-b-90 {
    margin-bottom: 90px !important;
  }
  .xs-margin-b-100 {
    margin-bottom: 100px !important;
  }
  .xs-margin-b-120 {
  margin-bottom: 120px !important;
}

  .xs-margin-b-150 {
  margin-bottom: 150px !important;
}

  .xs-margin-b-200 {
  margin-bottom: 200px !important;
}
}

/*--------------------------------------------------
    [Height]
----------------------------------------------------*/
.height-100 {
  height: 100px !important;
}

.height-200 {
  height: 200px !important;
}

.height-300 {
  height: 300px !important;
}

.height-400 {
  height: 400px !important;
}

.height-500 {
  height: 500px !important;
}

.height-100p {
  height: 100% !important;
  min-height: 100% !important;
}