@charset "UTF-8";

/*=========================================================
  폰트
=========================================================*/
/*(rubik)*/
@font-face {
  font-family: "Rubik";
  src: url("../font/Outfit-Bold.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: "Rubik";
  src: url("../font/Outfit-BoldItalic.ttf") format("truetype");
  font-weight: bold;
  font-style: italic;
}
@font-face {
  font-family: "Rubik";
  src: url("../font/Outfit-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: "Rubik";
  src: url("../font/Outfit-MediumItalic.ttf") format("truetype");
  font-weight: 500;
  font-style: italic;
}
@font-face {
  font-family: "Rubik";
  src: url("../font/Outfit-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Rubik";
  src: url("../font/Outfit-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: "Rubik";
  src: url("../font/Outfit-LightItalic.ttf") format("truetype");
  font-weight: 300;
  font-style: italic;
}

/*=========================================================
  리셋
=========================================================*/
html {
  font-size: 1em;
}
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video,
button {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0;
  font-family: "Rubik", Helvetica, "Apple SD Gothic Neo", sans-serif;
  font-size: 100%;
  vertical-align: baseline;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
}

input[type="text"],
input[type="email"],
input[type="number"],
button,
input[type="submit"],
input[type="reset"],
button,
input[type="tel"],
button,
input[type="password"],
input[type="url"],
input[type="search"],
input[type="file"],
button,
textarea {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  background: none;
  font-family: "Noto Sans KR", Dotum, 돋움, Helvetica, "Apple SD Gothic Neo",
    sans-serif;
  font-size: 100%;
  -webkit-appearance: none;
  appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  -o-appearance: none;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -o-box-sizing: border-box;
}
body {
  position: relative;
  background: #fff;
  font-size: 20px;
  line-height: 1.5;
  color: #000000;
  word-wrap: break-word;
  word-break: keep-all;
  text-size-adjust: none;
  -webkit-text-size-adjust: none;
  -moz-text-size-adjust: none;
  font-weight: 300;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: normal;
}
ol,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
input:focus,
button:focus {
  border: none;
}
table {
  border-spacing: 0;
  border-collapse: collapse;
}
ul,
ol,
li {
  margin: 0;
  padding: 0;
}
li {
  list-style: none;
}
a:focus {
  outline: none !important;
}
a {
  text-decoration: none;
}
:invalid {
  box-shadow: none;
}
:-moz-submit-invalid {
  box-shadow: none;
}
:-moz-ui-invalid {
  box-shadow: none;
}
button::-moz-focus-inner {
  margin-top: -2px;
  margin-bottom: -2px;
  padding: 0;
  border: 0;
}
input::-moz-focus-inner {
  margin-top: -2px;
  margin-bottom: -2px;
  padding: 0;
  border: 0;
}
img {
  max-width: 100%;
}
button:hover {
  cursor: pointer;
}
button {
  background: transparent;
}
textarea:focus {
  outline: none;
}
:focus {
  outline: none;
}
html {
  overflow-y: scroll;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
input[type="text"]::-ms-clear {
  display: none;
}
input[type="email"]::-ms-clear {
  display: none;
}

/*=========================================================
  3. 여백
=========================================================*/

/*bottom*/
body .mb20 {
  margin-bottom: 20px;
}
body .mb30 {
  margin-bottom: 30px;
}
body .mb40 {
  margin-bottom: 40px;
}
body .mb50 {
  margin-bottom: 50px;
}
body .mb70 {
  margin-bottom: 70px;
}
body .mb145 {
  margin-bottom: 145px;
}
body .mb210 {
  margin-bottom: 210px;
}
body .mb270 {
  margin-bottom: 270px;
}

/*=========================================================
  4. 기타값
=========================================================*/
.ab_text {
  position: absolute;
  clip: rect(0 0 0 0);
  margin: -1px;
  border: 0;
  overflow: hidden;
  padding: 0;
  width: 1px;
  height: 1px;
  white-space: nowrap;
}

@media screen and (max-width: 1920px) and (min-width: 1024px) {
  /*bottom*/
  body .mb20 {
    margin-bottom: 1.0416vw;
  }
  body .mb30 {
    margin-bottom: 1.5625vw;
  }
  body .mb40 {
    margin-bottom: 2.0833vw;
  }
  body .mb50 {
    margin-bottom: 2.604vw;
  }
  body .mb70 {
    margin-bottom: 3.6458vw;
  }
  body .mb145 {
    margin-bottom: 7.552vw;
  }
  body .mb210 {
    margin-bottom: 10.9375vw;
  }
  body .mb270 {
    margin-bottom: 13.9375vw;
  }
}

@media screen and (max-width: 1023px) and (min-width: 640px) {
  /*bottom*/
  body .mb20 {
    margin-bottom: 2.0816vw;
  }
  body .mb30 {
    margin-bottom: 3.0625vw;
  }
  body .mb40 {
    margin-bottom: 4.0833vw;
  }
  body .mb50 {
    margin-bottom: 4.604vw;
  }
  body .mb70 {
    margin-bottom: 6.6458vw;
  }
  body .mb145 {
    margin-bottom: 14.552vw;
  }
  body .mb210 {
    margin-bottom: 20.9375vw;
  }
  body .mb270 {
    margin-bottom: 22.9375vw;
  }
}

@media screen and (max-width: 639px) and (min-width: 1px) {
  /*bottom*/
  body .mb20 {
    margin-bottom: 16px;
  }
  body .mb30 {
    margin-bottom: 30px;
  }
  body .mb40 {
    margin-bottom: 30px;
  }
  body .mb50 {
    margin-bottom: 45px;
  }
  body .mb70 {
    margin-bottom: 55px;
  }
  body .mb145 {
    margin-bottom: 80px;
  }
  body .mb210 {
    margin-bottom: 100px;
  }
  body .mb270 {
    margin-bottom: 140px;
  }
}

/*=========================================================
  5. 레이아웃
=========================================================*/
.site {
  padding-top: 194px;
  overflow: hidden;
}
.site_container {
  width: 100%;
  margin: 0 auto;
}
.max_container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
}
.max_container:after {
  content: "";
  display: table;
  clear: both;
}

@media screen and (max-width: 1920px) and (min-width: 1024px) {
  .site {
    padding-top: 10.1041vw;
  }
  .site_container {
    max-width: 100vw;
  }
  .max_container {
    max-width: 62.5vw;
  }
}

@media screen and (max-width: 1023px) and (min-width: 1px) {
  .site {
    padding-top: 120px;
  }
  .max_container {
    padding: 0 25px;
  }
  .content .max_container {
    padding: 0 10.5vw;
  }
}

@media screen and (max-width: 419px) and (min-width: 1px) {
  .site {
    padding-top: 95px;
  }
  .max_container {
    padding: 0 9.66vw;
  }
}

/*=========================================================
  6. 헤더
=========================================================*/
.header {
  padding: 45px 0;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  transition-property: background, padding;
  -webkit-transition-property: background, padding;
  -moz-transition-property: background, padding;
  transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  background: transparent;
}

/*픽시드*/
.fixed.site .header {
  background: rgba(255, 255, 255, 0.7);
  padding: 30px 0;
}

@media screen and (max-width: 1920px) and (min-width: 1024px) {
  .header {
    padding: 2.343vw 0;
  }

  /*픽시드*/
  .fixed.site .header {
    padding: 1.5625vw 0;
  }
}

@media screen and (max-width: 1023px) and (min-width: 1px) {
  .header {
    padding: 30px 0 !important;
  }
}

@media screen and (max-width: 419px) and (min-width: 1px) {
  .header {
    padding: 20px 0 !important;
  }
}

/* 로고
=========================================================*/
.logo {
  width: 175px;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
.logo a {
  display: block;
  line-height: 0;
}

@media screen and (max-width: 1920px) and (min-width: 1024px) {
  .logo {
    width: 9.11458vw;
  }
}

@media screen and (max-width: 1280px) and (min-width: 1024px) {
  .logo {
    width: 117px;
  }
}

@media screen and (max-width: 1023px) and (min-width: 1px) {
  .logo {
    position: relative;
    width: 130px;
    margin: 0 auto;
    transform: translateY(0%);
    -webkit-transform: translateY(0%);
    -moz-transform: translateY(0%);
    -ms-transform: translateY(0%);
    z-index: 50;
  }
}

@media screen and (max-width: 419px) and (min-width: 1px) {
  .logo {
    width: 110px;
  }
}

/* 네비게이션
=========================================================*/
.nav_bx {
  float: right;
}
.nav_bx ul:after {
  content: "";
  display: table;
  clear: both;
}
.nav_bx ul li {
  float: left;
  margin-left: 68px;
}
.nav_bx ul li:first-child {
  margin-left: 0;
}
.nav_bx ul li a {
  display: block;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: -0.23px;
  color: #000000;
  line-height: 1.25em;
}

/*호버*/
.nav_bx ul li a:hover {
  color: #fe4d0c;
}

@media screen and (max-width: 1920px) and (min-width: 1024px) {
  .nav_bx ul li {
    margin-left: 3.54166vw;
  }
  .nav_bx ul li a {
    font-size: 0.9375vw;
  }
}

@media screen and (max-width: 1490px) and (min-width: 1024px) {
  .nav_bx ul li a {
    font-size: 14px;
  }
}

@media screen and (max-width: 1023px) and (min-width: 1px) {
  .nav_bx {
    float: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.6);
    opacity: 0;
    visibility: hidden;
    transition-property: opacity, visibility;
    -webkit-transition-property: opacity, visibility;
    -moz-transition-property: opacity, visibility;
    transition-duration: 0.3s;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
  }
  .nav_bx ul {
    position: absolute;
    top: 20vh;
    left: 35px;
    right: 35px;
  }
  .nav_bx ul li {
    float: none;
    margin: 4vh 0 0;
  }
  .nav_bx ul li:first-child {
    margin-top: 0;
  }
  .nav_bx ul li a {
    font-size: 4.265vw;
    padding: 8px 0;
    border-bottom: solid 1px #000;
  }

  /*네비 조건값*/
  html.over_hidden {
    overflow: hidden;
  }
  .site.nav_open .header {
    background: transparent;
  }
  .site.nav_open .nav_bx {
    opacity: 1;
    visibility: visible;
  }
  .site.nav_open .content {
    opacity: 0.4;
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
  }
  .site.nav_open .footer {
    opacity: 0.4;
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
  }
}

@media screen and (max-width: 419px) and (min-width: 1px) {
  .nav_bx ul {
    left: 20px;
    right: 20px;
  }
  .nav_bx ul li a {
    font-size: 5.265vw;
  }
}

@media screen and (max-height: 450px) and (min-height: 1px) {
  .nav_bx ul {
    top: 25vh;
  }
  .nav_bx ul li a {
    font-size: 3vw;
  }
}

/*=========================================================
  7. 헤더 모바일
=========================================================*/
/* 헤더 메뉴바
=========================================================*/
.menu_bar {
  width: 18px;
  height: 16px;
  position: absolute;
  top: 50%;
  left: 25px;
  margin-top: -8px;
  z-index: 50;
  display: none;
}
.menu_bar .item {
  display: block;
  width: 100%;
  height: 2px;
  background: #000000;
  position: absolute;
  left: 0;
  transition-property: transform;
  -webkit-transition-property: transform;
  -moz-transition-property: transform;
  transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
}
.menu_bar .item:first-child {
  top: 0;
}
.menu_bar .item:nth-child(2) {
  width: 90%;
  top: 50%;
  margin-top: -1px;
}
.menu_bar .item:nth-child(3) {
  width: 90%;
  top: 50%;
  margin-top: -1px;
}
.menu_bar .item:nth-child(4) {
  bottom: 0;
}

/*조건값*/
.site.nav_open .menu_bar .item:nth-child(1) {
  display: none;
}
.site.nav_open .menu_bar .item:nth-child(2) {
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  width: 120%;
  left: 50%;
  margin-left: -60%;
}
.site.nav_open .menu_bar .item:nth-child(3) {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  width: 120%;
  left: 50%;
  margin-left: -60%;
}
.site.nav_open .menu_bar .item:nth-child(4) {
  display: none;
}

@media screen and (max-width: 1023px) and (min-width: 1px) {
  .menu_bar {
    display: block;
  }
}

@media screen and (max-width: 419px) and (min-width: 1px) {
  .menu_bar {
    left: 20px;
  }
}

/*=========================================================
  8. 푸터
=========================================================*/
.footer {
  padding-bottom: 85px;
  margin-top: 177px;
}

@media screen and (max-width: 1920px) and (min-width: 1024px) {
  .footer {
    padding-bottom: 4.427vw;
    margin-top: 9.218vw;
  }
}

@media screen and (max-width: 419px) and (min-width: 1px) {
  .footer {
    padding-bottom: 50px;
    margin-top: 41.062vw;
  }
}

/* sns
=========================================================*/
.f_snsbx {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
}
.f_snsbx ul:after {
  content: "";
  display: table;
  clear: both;
}
.f_snsbx ul li {
  float: left;
  margin-left: 37px;
}
.f_snsbx ul li:first-child {
  margin-left: 0;
}
.f_snsbx ul li a {
  display: block;
  width: 34px;
  height: 34px;
  text-indent: -99999px;
  background-size: 34px 34px !important;
}

/*아이콘*/
.f_snsbx ul li.instargram a {
  background: url(../images/icon/instagram.png) no-repeat;
}
.f_snsbx ul li.facebook a {
  background: url(../images/icon/facebook.png) no-repeat;
}

@media screen and (min-width: 1024px) {
  .f_snsbx ul li.instargram a:hover {
    background: url(../images/icon/instagram_h.png) no-repeat;
  }
  .f_snsbx ul li.facebook a:hover {
    background: url(../images/icon/facebook_h.png) no-repeat;
  }
}

@media screen and (max-width: 1920px) and (min-width: 1024px) {
  .f_snsbx ul li {
    margin-left: 1.92708vw;
  }
  .f_snsbx ul li a {
    width: 1.77083vw;
    height: 1.77083vw;
    background-size: 1.77083vw 1.77083vw !important;
  }
}

@media screen and (max-width: 1280px) and (min-width: 1024px) {
  .f_snsbx ul li {
    margin-left: 24px;
  }
  .f_snsbx ul li a {
    width: 22px;
    height: 22px;
    background-size: 22px 22px !important;
  }
}

@media screen and (max-width: 1023px) and (min-width: 1px) {
  .f_snsbx {
    left: 25px;
  }
  .f_snsbx ul li {
    margin-left: 28px;
  }
  .f_snsbx ul li a {
    width: 28px;
    height: 28px;
    background-size: 28px 28px !important;
  }
}

@media screen and (max-width: 499px) and (min-width: 1px) {
  .f_snsbx {
    position: static;
    text-align: center;
    line-height: 0;
    font-size: 0;
    transform: translateY(0%);
    -webkit-transform: translateY(0%);
    -moz-transform: translateY(0%);
    -ms-transform: translateY(0%);
    margin-bottom: 25px;
  }
  .f_snsbx ul {
    display: inline-block;
  }
}

/* 푸터 네비게이션
=========================================================*/
.f_navbx {
  float: right;
}
.f_navbx ul:after {
  content: "";
  display: table;
  clear: both;
}
.f_navbx ul li {
  float: left;
  margin-left: 46px;
}
.f_navbx ul li:first-child {
  margin-left: 0;
}
.f_navbx ul li a {
  display: block;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: -0.2px;
  color: #000000;
  line-height: 1.25em;
}

/*액션*/
.f_navbx ul li.active a {
  color: #fe4d0c;
}

@media screen and (min-width: 1024px) {
  .f_navbx ul li a:hover {
    color: #fe4d0c;
  }
}

@media screen and (max-width: 1920px) and (min-width: 1024px) {
  .f_navbx ul li {
    margin-left: 2.395vw;
  }
  .f_navbx ul li a {
    font-size: 0.8333vw;
  }
}

@media screen and (max-width: 1490px) and (min-width: 1024px) {
  .f_navbx ul li a {
    font-size: 13px;
  }
}

@media screen and (max-width: 1023px) and (min-width: 1px) {
  .f_navbx ul li {
    margin-left: 35px;
  }
  .f_navbx ul li a {
    font-size: 14px;
  }
}

@media screen and (max-width: 499px) and (min-width: 1px) {
  .f_navbx {
    float: none;
    text-align: center;
  }
  .f_navbx ul {
    font-size: 0;
    line-height: 0;
  }
  .f_navbx ul li {
    display: inline-block;
    vertical-align: middle;
    float: none;
  }
}

@media screen and (max-width: 419px) and (min-width: 1px) {
  .footer .max_container {
    padding: 0 4vw;
  }
  .f_navbx {
    margin-bottom: 8.454vw;
  }
  .f_navbx ul li {
    margin-left: 9.1787vw;
  }
  .f_navbx ul li a {
    font-size: 3.864vw;
  }
  .f_snsbx ul li {
    margin-left: 8.695vw;
  }
  .f_snsbx ul li a {
    width: 8.695vw;
    height: 8.695vw;
    background-size: 8.695vw 8.695vw !important;
  }
}

/*=========================================================
  9. 컨텐츠(cont_type_1)
=========================================================*/
.table_ro {
  display: table;
  width: 100%;
  table-layout: fixed;
}
.cont_type_1 .type_img {
  display: table-cell;
  vertical-align: middle;
  width: 482px;
  line-height: 0;
}
.cont_type_1 .type_cont {
  display: table-cell;
  vertical-align: middle;
  padding-left: 95px;
}

/*구글 플레이 버튼*/
.google_link {
  width: 330px;
  margin-left: -30px;
  transition-property: opacity, transform;
  -webkit-transition-property: opacity, transform;
  -moz-transition-property: opacity, transform;
  transition-duration: 0.8s;
  -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  transform: translateX(9.21vw);
  -webkit-transform: translateX(9.21vw);
  -moz-transform: translateX(9.21vw);
  -ms-transform: translateX(9.21vw);
  opacity: 0;
}
.google_link a {
  display: block;
  line-height: 0;
  transition-property: transform;
  -webkit-transition-property: transform;
  -moz-transition-property: transform;
  transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
}

/*구글 플레이 버튼 호버*/
.google_link a:hover {
  transform: scale(0.94);
  -webkit-transform: scale(0.94);
  -moz-transform: scale(0.94);
  -ms-transform: scale(0.94);
}

/* 타이틀
=========================================================*/
.ct_title {
  font-size: 54px;
  line-height: 1.48em;
  letter-spacing: -0.79px;
  color: #000000;
  font-weight: bold;
}
.bold {
  font-weight: bold;
}

.text_right .ct_title {
  transform: translateX(9.21vw);
  -webkit-transform: translateX(9.21vw);
  -moz-transform: translateX(9.21vw);
  -ms-transform: translateX(9.21vw);
}
.text_right .mt_title {
  transform: translateX(9.21vw);
  -webkit-transform: translateX(9.21vw);
  -moz-transform: translateX(9.21vw);
  -ms-transform: translateX(9.21vw);
}
.text_right .ct_sub_text {
  transform: translateX(9.21vw);
  -webkit-transform: translateX(9.21vw);
  -moz-transform: translateX(9.21vw);
  -ms-transform: translateX(9.21vw);
}
.text_right .icon_text {
  transform: translateX(9.21vw);
  -webkit-transform: translateX(9.21vw);
  -moz-transform: translateX(9.21vw);
  -ms-transform: translateX(9.21vw);
}
.text_right .btn_bx {
  transform: translateX(9.21vw);
  -webkit-transform: translateX(9.21vw);
  -moz-transform: translateX(9.21vw);
  -ms-transform: translateX(9.21vw);
}

.text_left .ct_title {
  transform: translateX(-9.21vw);
  -webkit-transform: translateX(-9.21vw);
  -moz-transform: translateX(-9.21vw);
  -ms-transform: translateX(-9.21vw);
}
.text_left .mt_title {
  transform: translateX(-9.21vw);
  -webkit-transform: translateX(-9.21vw);
  -moz-transform: translateX(-9.21vw);
  -ms-transform: translateX(-9.21vw);
}
.text_left .ct_sub_text {
  transform: translateX(-9.21vw);
  -webkit-transform: translateX(-9.21vw);
  -moz-transform: translateX(-9.21vw);
  -ms-transform: translateX(-9.21vw);
}
.text_left .icon_text {
  transform: translateX(-9.21vw);
  -webkit-transform: translateX(-9.21vw);
  -moz-transform: translateX(-9.21vw);
  -ms-transform: translateX(-9.21vw);
}
.text_left .btn_bx {
  transform: translateX(-9.21vw);
  -webkit-transform: translateX(-9.21vw);
  -moz-transform: translateX(-9.21vw);
  -ms-transform: translateX(-9.21vw);
}

/*액션 전*/
div[class*="text_"] .ct_title {
  transition-property: opacity, transform;
  -webkit-transition-property: opacity, transform;
  -moz-transition-property: opacity, transform;
  transition-duration: 0.8s;
  -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  opacity: 0;
}
div[class*="text_"] .ct_sub_text {
  transition-property: opacity, transform;
  -webkit-transition-property: opacity, transform;
  -moz-transition-property: opacity, transform;
  transition-duration: 0.8s;
  -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  opacity: 0;
}
div[class*="text_"] .mt_title {
  transition-property: opacity, transform;
  -webkit-transition-property: opacity, transform;
  -moz-transition-property: opacity, transform;
  transition-duration: 0.8s;
  -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  opacity: 0;
}
div[class*="text_"] .icon_text {
  transition-property: opacity, transform;
  -webkit-transition-property: opacity, transform;
  -moz-transition-property: opacity, transform;
  transition-duration: 0.8s;
  -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  opacity: 0;
}
div[class*="text_"] .btn_bx {
  transition-property: opacity, transform;
  -webkit-transition-property: opacity, transform;
  -moz-transition-property: opacity, transform;
  transition-duration: 0.8s;
  -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  opacity: 0;
}

/*액션후*/
div[class*="text_"].skrollable-after .ct_title {
  opacity: 1;
  transform: translateX(0);
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
}
div[class*="text_"].skrollable-after .ct_sub_text {
  opacity: 1;
  transform: translateX(0);
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
}
div[class*="text_"].skrollable-after .mt_title {
  opacity: 1;
  transform: translateX(0);
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
}
div[class*="text_"].skrollable-after .icon_text {
  opacity: 1;
  transform: translateX(0);
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
}
.text_right.skrollable-after .google_link {
  opacity: 1;
  transform: translateX(0);
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
}
div[class*="text_"].skrollable-after .btn_bx {
  opacity: 1;
  transform: translateX(0);
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
}

/*딜레이*/
.delay_1 {
  transition-delay: 0.3s;
  -webkit-transition-delay: 0.3s;
  -moz-transition-delay: 0.3s;
}
.delay_2 {
  transition-delay: 0.6s;
  -webkit-transition-delay: 0.6s;
  -moz-transition-delay: 0.6s;
}
.delay_3 {
  transition-delay: 0.9s;
  -webkit-transition-delay: 0.9s;
  -moz-transition-delay: 0.9s;
}
.delay_4 {
  transition-delay: 1.2s;
  -webkit-transition-delay: 1.2s;
  -moz-transition-delay: 1.2s;
}
.delay_5 {
  transition-delay: 1.5s;
  -webkit-transition-delay: 1.5s;
  -moz-transition-delay: 1.5s;
}

/* 이미지
=========================================================*/
.cont_type_1 .type_img span[class*="img_"] {
  display: block;
  text-align: center;
}

/*img_a*/
.cont_type_1 .type_img .img_a {
  margin-bottom: 32px;
  animation: img_a 3s linear infinite;
  -webkit-animation: img_a 3s linear infinite;
}

@keyframes img_a {
  0% {
    transform: translateY(0);
  }
  25% {
    transform: translateY(6px);
  }
  50% {
    transform: translateY(0);
  }
  75% {
    transform: translateY(-6px);
  }
  100% {
    transform: translateY(0);
  }
}

@-webkit-keyframes img_a {
  0% {
    -webkit-transform: translateY(0);
  }
  25% {
    -webkit-transform: translateY(6px);
  }
  50% {
    -webkit-ransform: translateY(0);
  }
  75% {
    -webkit-transform: translateY(-6px);
  }
  100% {
    -webkit-transform: translateY(0);
  }
}

/*img_b*/
.cont_type_1 .type_img .img_b {
  animation: img_b 3s linear infinite;
  -webkit-animation: img_b 3s linear infinite;
}

@keyframes img_b {
  0% {
    transform: scale(0.8);
  }
  25% {
    transform: scale(0.6);
  }
  50% {
    transform: scale(0.8);
  }
  75% {
    transform: scale(1);
  }
  100% {
    transform: scale(0.8);
  }
}

@-webkit-keyframes img_b {
  0% {
    -webkit-transform: scale(0.8);
  }
  25% {
    -webkit-transform: scale(0.6);
  }
  50% {
    -webkit-transform: scale(0.8);
  }
  75% {
    -webkit-transform: scale(1);
  }
  100% {
    -webkit-transform: scale(0.8);
  }
}

@media screen and (max-width: 1920px) and (min-width: 1024px) {
  .cont_type_1 .type_img {
    width: 25.1041vw;
  }
  .cont_type_1 .type_cont {
    padding-left: 4.9479vw;
  }
  .ct_title {
    font-size: 2.7125vw;
  }
  .ct_sub_text {
    font-size: 1.04166vw;
  }
  .google_link {
    width: 17.187vw;
    margin-left: -1.5625vw;
  }
}

@media screen and (max-width: 1150px) and (min-width: 1024px) {
  .ct_sub_text {
    font-size: 12px;
  }
  .google_link {
    width: 197px;
  }
}

@media screen and (max-width: 1023px) and (min-width: 1px) {
  .cont_type_1 .type_img {
    width: 37%;
  }
  .cont_type_1 .type_cont {
    padding-left: 4.9479vw;
  }
  .ct_title {
    font-size: 3.7785vw;
  }
  .ct_sub_text {
    font-size: 1.555vw;
  }
  .google_link {
    width: 27.258vw;
    margin-left: -2.5625vw;
  }
}

@media screen and (max-width: 639px) and (min-width: 1px) {
  .cont_type_1 {
    text-align: center;
  }
  .table_ro {
    display: block;
  }
  .cont_type_1 .table_ro {
    padding-top: calc(95vw + 25px);
    padding-top: -webkit-calc(95vw + 25px);
    padding-top: -moz-calc(95vw + 25px);
  }
  .cont_type_1 .type_img {
    width: 58%;
    display: block;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -29%;
  }
  .cont_type_1 .type_cont {
    display: block;
    width: 100%;
    padding-left: 0;
  }
  .ct_title {
    font-size: 7.1785vw;
  }
  .ct_sub_text {
    font-size: 4.2vw;
  }
  .google_link {
    width: 55.31vw;
    margin: -10px auto 0;
  }

  /*애니메이션 멈춤*/
  div[class*="text_"] .icon_text {
    top: 0 !important;
  }
}

/*=========================================================
  10. 컨텐츠(cont_type_2)
=========================================================*/
.cont_type_2 {
  position: relative;
}
.mt_title {
  font-size: 50px;
  color: #000000;
  font-weight: bold;
}
.cont_type_2 .type_cont {
  display: table-cell;
  vertical-align: middle;
  padding-right: 30px;
}
.cont_type_2 .type_img {
  display: table-cell;
  vertical-align: middle;
  width: 763px;
}
.type_img .ab_imgbx {
  position: relative;
  line-height: 0;
}
.type_img .ab_imgbx span[class*="img_"] {
  display: block;
}
.type_img .ab_imgbx .img_b {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
}
.type_img .ab_imgbx .img_c {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  width: 100%;
}

.icon_text {
  font-size: 0;
  line-height: 0;
}
.icon_text .text {
  font-size: 18px;
  font-weight: 500;
  color: #fe4d0c;
  position: relative;
  padding-left: 30px;
  display: inline-block;
  line-height: 1em;
}
.icon_text .text:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  margin-top: -3px;
}
.cont_type_2 .icon_text .text:before {
  width: 19px;
  height: 20px;
  background: url(../images/icon/sub_icon_1.png) no-repeat;
  background-size: 19px 20px;
}

/*img_b*/
.cont_type_2 .type_img .img_b {
  animation: img_b2 3s linear infinite;
  -webkit-animation: img_b2 3s linear infinite;
}

@keyframes img_b2 {
  0% {
    transform: translateY(0);
  }
  25% {
    transform: translateY(6px);
  }
  50% {
    transform: translateY(0);
  }
  75% {
    transform: translateY(-6px);
  }
  100% {
    transform: translateY(0);
  }
}

@-webkit-keyframes img_b2 {
  0% {
    -webkit-transform: translateY(0);
  }
  25% {
    -webkit-transform: translateY(6px);
  }
  50% {
    -webkit-ransform: translateY(0);
  }
  75% {
    -webkit-transform: translateY(-6px);
  }
  100% {
    -webkit-transform: translateY(0);
  }
}

/*캐릭터 등장*/
.cont_type_2 .c_bg {
  transition-property: opacity, transform;
  -webkit-transition-property: opacity, transform;
  -moz-transition-property: opacity, transform;
  transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  transform: translate(120%, -50%);
  -webkit-transform: translate(120%, -50%);
  -moz-transform: translate(120%, -50%);
  -ms-transform: translate(120%, -50%);
}

/*캐릭터 액션*/
.cont_type_2 .skrollable-after.c_bg {
  transform: translate(0, -50%);
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
}

@media screen and (max-width: 1920px) and (min-width: 1024px) {
  .cont_type_2 .type_img {
    width: 39.739vw;
  }
  .cont_type_2 .type_cont {
    padding-left: 1.562vw;
  }
  .mt_title {
    font-size: 2.604vw;
  }
  .icon_text .text {
    font-size: 0.9375vw;
  }
  .cont_type_2 .c_bg {
    width: 14.479vw;
    height: 25.572vw;
    background-size: 14.479vw 25.572vw;
  }
}

@media screen and (max-width: 1150px) and (min-width: 1024px) {
  .mt_title {
    font-size: 30px;
  }
  .icon_text .text {
    font-size: 11px;
  }
  .cont_type_2 .type_cont {
    padding-right: 0;
  }
}

@media screen and (max-width: 1023px) and (min-width: 1px) {
  .cont_type_2 .type_img {
    width: 56%;
  }
  .cont_type_2 .type_cont {
    padding-left: 1.9479vw;
  }
  .mt_title {
    font-size: 3.2785vw;
  }
  .icon_text .text {
    font-size: 1.555vw;
  }
  .cont_type_2 .c_bg {
    width: 14.479vw;
    height: 25.572vw;
    background-size: 14.479vw 25.572vw;
  }
}

@media screen and (max-width: 639px) and (min-width: 1px) {
  .cont_type_2 {
    text-align: center;
  }
  .cont_type_2 .table_ro {
    padding-top: calc(76vw + 45px);
    padding-top: -webkit-calc(76vw + 45px);
    padding-top: -moz-calc(76vw + 45px);
  }
  .cont_type_2 .type_cont {
    display: block;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
    position: relative;
    padding-top: calc(6vw + 8px);
    padding-top: -webkit-calc(6vw + 8px);
    padding-top: -moz-calc(6vw + 8px);
  }
  .cont_type_2 .type_img {
    width: 88%;
    display: block;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -50%;
  }
  .mt_title {
    font-size: 8vw;
  }
  .icon_text .text {
    font-size: 4.3vw;
  }
  .cont_type_2 .ct_sub_text {
    margin-bottom: 0;
  }
  .mo_ab_tp {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
  }
}

/*=========================================================
  11. 컨텐츠(cont_type_3)
=========================================================*/
/* 해더
=========================================================*/
.ty_head dl:after {
  content: "";
  display: table;
  clear: both;
}
.ty_head dl dt {
  float: left;
  margin-right: 108px;
  font-size: 20px;
  line-height: 1.7em;
  font-weight: 300;
  letter-spacing: -0.42px;
  color: #000000;
}
.ty_head dl dd {
  overflow: hidden;
}
.ty_head dl dd h2 {
  font-size: 48px;
  line-height: 1.17em;
  font-weight: bold;
  letter-spacing: -1px;
  color: #000000;
}
.ty_head dl dd h2 .mo_block {
  display: none;
}

.ty_head dl dt.text_right {
  transform: translateX(9.21vw);
  -webkit-transform: translateX(9.21vw);
  -moz-transform: translateX(9.21vw);
  -ms-transform: translateX(9.21vw);
}
.ty_head dl dd.text_right {
  transform: translateX(9.21vw);
  -webkit-transform: translateX(9.21vw);
  -moz-transform: translateX(9.21vw);
  -ms-transform: translateX(9.21vw);
}

.ty_head dl dt.text_left {
  transform: translateX(-9.21vw);
  -webkit-transform: translateX(-9.21vw);
  -moz-transform: translateX(-9.21vw);
  -ms-transform: translateX(-9.21vw);
}
.ty_head dl dd.text_left {
  transform: translateX(-9.21vw);
  -webkit-transform: translateX(-9.21vw);
  -moz-transform: translateX(-9.21vw);
  -ms-transform: translateX(-9.21vw);
}

/*액션 전*/
.ty_head dl dt {
  transition-property: opacity, transform;
  -webkit-transition-property: opacity, transform;
  -moz-transition-property: opacity, transform;
  transition-duration: 0.8s;
  -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  opacity: 0;
}
.ty_head dl dd {
  transition-property: opacity, transform;
  -webkit-transition-property: opacity, transform;
  -moz-transition-property: opacity, transform;
  transition-duration: 0.8s;
  -webkit-transition-duration: 0.8s;
  -moz-transition-duration: 0.8s;
  opacity: 0;
}

/*액션후*/
.skrollable-after.ty_head dl dt {
  opacity: 1;
  transform: translateX(0);
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
}
.skrollable-after.ty_head dl dd {
  opacity: 1;
  transform: translateX(0);
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
}

@media screen and (max-width: 1920px) and (min-width: 1024px) {
  .ty_head dl dt {
    font-size: 1.0416vw;
    margin-right: 5.625vw;
  }
  .ty_head dl dd h2 {
    font-size: 2.5vw;
  }
}

@media screen and (max-width: 1150px) and (min-width: 1024px) {
  .ty_head dl dt {
    font-size: 12px;
  }
  .ty_head dl dd h2 {
    font-size: 29px;
  }
}

@media screen and (max-width: 1023px) and (min-width: 1px) {
  .ty_head dl dt {
    font-size: 1.555vw;
    margin-right: 10vw;
    line-height: 1.8em;
  }
  .ty_head dl dd h2 {
    font-size: 3.2785vw;
    line-height: 1.25em;
  }
}

@media screen and (max-width: 639px) and (min-width: 1px) {
  .ty_head dl {
    text-align: center;
  }
  .ty_head dl dt {
    font-size: 4.3vw;
    margin-right: 0;
    margin-bottom: 10px;
    float: none;
  }
  .ty_head dl dd h2 {
    font-size: 7vw;
    line-height: 1.32em;
  }
  .cont_type_3 .ty_head.mb70 {
    margin-bottom: 35px;
  }
  .ty_head dl dd h2 br {
    display: none;
  }
  .ty_head dl dd h2 .mo_block {
    display: block;
  }
}

/* 포스트
=========================================================*/
.ty_ps_bx {
  padding-right: 24px;
}
.ty_ps_bx > ul {
  margin: 0 -26px;
}
.ty_ps_bx > ul:after {
  content: "";
  display: table;
  clear: both;
}
.ty_ps_bx > ul > li {
  float: left;
  width: 25%;
  padding: 0px 26px;
}
.ty_ps_item {
  background: #fff;
  position: relative;
  box-shadow: 10px 10px 10px rgba(0, 0, 0, 0);
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  padding-bottom: 91.8%;
  transition-property: box-shadow, transform;
  -webkit-transition-property: box-shadow, transform;
  -moz-transition-property: box-shadow, transform;
  transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  transform: scale(0.94);
  -webkit-transform: scale(0.94);
  -moz-transform: scale(0.94);
  -ms-transform: scale(0.94);
}
.ty_ps_item .bg {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #fff;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
}
.ty_ps_item:before {
  content: "";
  border-radius: 90px;
  -webkit-border-radius: 90px;
  -moz-border-radius: 90px;
  position: absolute;
  top: 10%;
  bottom: -30%;
  left: 20%;
  right: -48%;
  z-index: -1;
  background: -moz-linear-gradient(
    top,
    rgba(0, 0, 0, 0.01) 0%,
    rgba(0, 0, 0, 0.01) 1%,
    rgba(0, 0, 0, 0.008) 100%
  );
  background: -webkit-linear-gradient(
    top,
    rgba(0, 0, 0, 0.01) 0%,
    rgba(0, 0, 0, 0.01) 50%,
    rgba(0, 0, 0, 0.008) 100%
  );
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.01) 0%,
    rgba(0, 0, 0, 0.01) 50%,
    rgba(0, 0, 0, 0.008) 100%
  );
  transition-property: opacity;
  -webkit-transition-property: opacity;
  -moz-transition-property: opacity;
  transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  opacity: 0;
}
.ty_ps_item .icon_item {
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 1;
  width: 48px;
  height: 48px;
  background-size: 48px 48px !important;
  transition-property: opacity;
  -webkit-transition-property: opacity;
  -moz-transition-property: opacity;
  transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  opacity: 0;
}
.ty_ps_item .text_bx {
  position: absolute;
  bottom: 20px;
  left: 20px;
  right: 20px;
  z-index: 1;
}
.ps_title {
  font-size: 22px;
  font-weight: bold;
  line-height: 1.55em;
  color: #000000;
  margin-bottom: 5px;
}
.ps_sub_text {
  font-size: 15px;
  line-height: 1.6em;
  min-height: 3.2em;
  font-weight: 400;
  color: #000000;
}

/*아이콘*/
.ty_ps_bx > ul > li.step1 .ty_ps_item .icon_item {
  background: url(../images/icon/post_icon1.png) no-repeat;
}
.ty_ps_bx > ul > li.step2 .ty_ps_item .icon_item {
  background: url(../images/icon/post_icon2.png) no-repeat;
}
.ty_ps_bx > ul > li.step3 .ty_ps_item .icon_item {
  background: url(../images/icon/post_icon3.png) no-repeat;
}
.ty_ps_bx > ul > li.step4 .ty_ps_item .icon_item {
  background: url(../images/icon/post_icon4.png) no-repeat;
}

/*액션*/
.ty_ps_bx.skrollable-after .ty_ps_item {
  box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.01);
  transform: scale(1);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
}
.ty_ps_bx.skrollable-after .ty_ps_item:before {
  opacity: 1;
}
.ty_ps_bx.skrollable-after .ty_ps_item .icon_item {
  opacity: 1;
}

@media screen and (max-width: 1920px) and (min-width: 1024px) {
  .ps_title {
    font-size: 1.1458vw;
  }
  .ps_sub_text {
    font-size: 0.78125vw;
  }
  .ty_ps_bx {
    padding-right: 1.25vw;
  }
  .ty_ps_bx > ul {
    margin: 0 -1.3541vw;
  }
  .ty_ps_bx > ul > li {
    padding: 0 1.3541vw;
  }
  .ty_ps_item .icon_item {
    top: 1.0416vw;
    left: 1.0416vw;
    width: 2.5vw;
    height: 2.5vw;
    background-size: 2.5vw 2.5vw !important;
  }
  .ty_ps_item .text_bx {
    bottom: 1.0416vw;
    left: 1.0416vw;
    right: 1.0416vw;
  }
  .ty_ps_bx > ul > li.step4 .ty_ps_item:after {
    width: 10.26vw;
    height: 12.135vw;
    background-size: 10.26vw 12.135vw;
    top: -0.52vw;
    right: -5.208vw;
  }
  .ty_ps_item:before {
    border-radius: 4.6875vw;
    -webkit-border-radius: 4.6875vw;
    -moz-border-radius: 4.6875vw;
  }
}

@media screen and (max-width: 1490px) and (min-width: 1024px) {
  .ps_title {
    font-size: 17px;
  }
  .ps_sub_text {
    font-size: 11px;
  }
}

@media screen and (max-width: 1170px) and (min-width: 1024px) {
  .ty_ps_bx > ul {
    margin: 0 -0.9vw;
  }
  .ty_ps_bx > ul > li {
    padding: 0 0.9vw;
  }
  .ps_sub_text {
    font-size: 10px;
  }
  .ty_ps_bx {
    padding-right: 0;
  }
}

@media screen and (max-width: 1023px) and (min-width: 1px) {
  .ps_title {
    font-size: 1.655vw;
  }
  .ps_sub_text {
    font-size: 11px;
  }
  .ty_ps_bx {
    padding-right: 1.25vw;
    padding-right: 0;
  }
  .ty_ps_bx > ul {
    margin: 0 -0.9vw;
  }
  .ty_ps_bx > ul > li {
    padding: 0 0.9vw;
  }
  .ty_ps_item .icon_item {
    top: 1.955vw;
    left: 1.955vw;
    width: 2.5vw;
    height: 2.5vw;
    background-size: 2.5vw 2.5vw !important;
  }
  .ty_ps_item .text_bx {
    bottom: 1.955vw;
    left: 1.955vw;
    right: 1.0416vw;
  }
  .ty_ps_bx > ul > li.step4 .ty_ps_item:after {
    width: 10.26vw;
    height: 12.135vw;
    background-size: 10.26vw 12.135vw;
    top: -0.52vw;
    right: -5.208vw;
  }
  .ty_ps_item:before {
    border-radius: 4.6875vw;
    -webkit-border-radius: 4.6875vw;
    -moz-border-radius: 4.6875vw;
  }
}

@media screen and (max-width: 810px) and (min-width: 1px) {
  .ps_sub_text {
    font-size: 10px;
  }
}

@media screen and (max-width: 767px) and (min-width: 1px) {
  .ps_title {
    font-size: 3.4vw;
    margin-bottom: 2px;
  }
  .ps_sub_text {
    font-size: 11px;
  }
  .ty_ps_bx > ul {
    margin: -2.415vw -1.207vw 0;
  }
  .ty_ps_bx > ul > li {
    width: 50%;
    padding: 2.415vw 1.207vw 0;
  }
  .ty_ps_item {
    padding-bottom: 72.8%;
  }
  .ty_ps_item .icon_item {
    top: 3.62vw;
    left: 3.62vw;
    width: 25px;
    height: 25px;
    background-size: 25px 25px !important;
  }
  .ty_ps_item .text_bx {
    bottom: 3.62vw;
    left: 3.62vw;
    right: 3.62vw;
  }
}

@media screen and (max-width: 419px) and (min-width: 1px) {
  .ps_title {
    font-size: 14px;
  }
  .ty_ps_item {
    padding-bottom: 96.8%;
  }
  .ps_sub_text {
    min-height: 4.8em;
  }
}

@media screen and (max-width: 374px) and (min-width: 1px) {
  .ty_ps_item {
    padding-bottom: 114.8%;
  }
}

/*=========================================================
  12. 컨텐츠(cont_type_4)
=========================================================*/
.cont_type_4 {
  position: relative;
}
.cont_type_4 .type_cont {
  display: table-cell;
  vertical-align: middle;
  padding-left: 100px;
}
.cont_type_4 .type_img {
  display: table-cell;
  vertical-align: middle;
  width: 585px;
}
.cont_type_4 .icon_text .text {
  padding-left: 24px;
}
.cont_type_4 .icon_text .text:before {
  width: 15px;
  height: 16px;
  background: url(../images/icon/sub_icon_2.png) no-repeat;
  background-size: 15px 16px;
  margin-top: -1px;
}
.cont_type_4 .mt_title {
  line-height: 1.2em;
}

/*이미지*/
.cont_type_4 .type_img .img_a {
  line-height: 0;
  display: block;
}
.cont_type_4 .type_img .img_b {
  animation: img_b4 3s linear infinite;
  -webkit-animation: img_b4 3s linear infinite;
}

@keyframes img_b4 {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes img_b4 {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
  }
}

.cont_type_4 .type_img .img_c {
  animation: img_c4 3s linear infinite;
  -webkit-animation: img_c4 3s linear infinite;
}

@keyframes img_c4 {
  0% {
    transform: translateY(0);
  }
  25% {
    transform: translateY(6px);
  }
  50% {
    transform: translateY(0);
  }
  75% {
    transform: translateY(-6px);
  }
  100% {
    transform: translateY(0);
  }
}

@-webkit-keyframes img_c4 {
  0% {
    -webkit-transform: translateY(0);
  }
  25% {
    -webkit-transform: translateY(6px);
  }
  50% {
    -webkit-ransform: translateY(0);
  }
  75% {
    -webkit-transform: translateY(-6px);
  }
  100% {
    -webkit-transform: translateY(0);
  }
}

@media screen and (max-width: 1920px) and (min-width: 1024px) {
  .cont_type_4 .type_img {
    width: 30.468vw;
  }
  .cont_type_4 .type_cont {
    padding-left: 5.208vw;
  }
}

@media screen and (max-width: 1150px) and (min-width: 1024px) {
  .cont_type_4 .type_cont {
    padding-left: 2.508vw;
  }
}

@media screen and (max-width: 1023px) and (min-width: 1px) {
  .cont_type_4 .type_img {
    width: 44%;
  }
  .cont_type_4 .type_cont {
    padding-left: 5.9479vw;
  }
}

@media screen and (max-width: 639px) and (min-width: 1px) {
  .cont_type_4 {
    text-align: center;
  }
  .cont_type_4 .table_ro {
    padding-top: calc(85vw + 30px);
    padding-top: -webkit-calc(85vw + 30px);
    padding-top: -moz-calc(85vw + 30px);
  }
  .cont_type_4 .type_cont {
    display: block;
    width: 100%;
    padding-left: 0;
    position: relative;
    padding-top: calc(7vw + 8px);
    padding-top: -webkit-calc(7vw + 8px);
    padding-top: -moz-calc(7vw + 8px);
  }
  .cont_type_4 .type_img {
    display: block;
    width: 76%;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -37%;
  }
  .cont_type_4 .mt_title br {
    display: none;
  }
  .cont_type_4 .icon_text .text:before {
    margin-top: 0;
  }
  .cont_type_4 .ct_sub_text {
    margin-bottom: 0;
  }
}

/*=========================================================
  13. 컨텐츠(cont_type_5)
=========================================================*/
.cont_type_5 {
  position: relative;
}
.cont_type_5 .type_cont {
  display: table-cell;
  vertical-align: middle;
  padding-right: 100px;
}
.cont_type_5 .type_img {
  display: table-cell;
  vertical-align: middle;
  width: 595px;
}
.cont_type_5 .icon_text .text {
  padding-left: 31px;
}
.cont_type_5 .icon_text .text:before {
  width: 19px;
  height: 18px;
  background: url(../images/icon/sub_icon_3.png) no-repeat;
  background-size: 19px 18px;
  margin-top: -3px;
}
.cont_type_5 .mt_title {
  line-height: 1.2em;
}

/*이미지*/
.cont_type_5 .type_img .img_a {
  line-height: 0;
  display: block;
}

.cont_type_5 .type_img .img_b {
  animation: img_b5 3s linear infinite;
  -webkit-animation: img_b5 3s linear infinite;
}

@keyframes img_b5 {
  0% {
    transform: translateY(0);
  }
  25% {
    transform: translateY(6px);
  }
  50% {
    transform: translateY(0);
  }
  75% {
    transform: translateY(-6px);
  }
  100% {
    transform: translateY(0);
  }
}

@-webkit-keyframes img_b5 {
  0% {
    -webkit-transform: translateY(0);
  }
  25% {
    -webkit-transform: translateY(6px);
  }
  50% {
    -webkit-ransform: translateY(0);
  }
  75% {
    -webkit-transform: translateY(-6px);
  }
  100% {
    -webkit-transform: translateY(0);
  }
}

@media screen and (max-width: 1920px) and (min-width: 1024px) {
  .cont_type_5 .type_img {
    width: 30.989vw;
  }
  .cont_type_5 .type_cont {
    padding-right: 3.208vw;
  }
}

@media screen and (max-width: 1150px) and (min-width: 1024px) {
  .cont_type_5 .type_cont {
    padding-right: 1.508vw;
  }
}

@media screen and (max-width: 1023px) and (min-width: 1px) {
  .cont_type_5 .type_img {
    width: 45%;
  }
  .cont_type_5 .type_cont {
    padding-right: 3.208vw;
  }
}

@media screen and (max-width: 639px) and (min-width: 1px) {
  .cont_type_5 {
    text-align: center;
  }
  .cont_type_5 .table_ro {
    position: relative;
    padding-top: calc(87vw + 35px);
    padding-top: -webkit-calc(87vw + 35px);
    padding-top: -moz-calc(87vw + 35px);
  }
  .cont_type_5 .type_cont {
    display: block;
    width: 100%;
    padding-left: 0;
    position: relative;
    padding-top: calc(7vw + 8px);
    padding-top: -webkit-calc(7vw + 8px);
    padding-top: -moz-calc(7vw + 8px);
  }
  .cont_type_5 .type_img {
    display: block;
    width: 96%;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -48%;
  }

  .cont_type_5 .icon_text .text:before {
    margin-top: 0;
  }
  .cont_type_4 .ct_sub_text {
    margin-bottom: 0;
  }
}

/*=========================================================
  14. 슬릭 코드 컨텐츠(cont_type_6)
=========================================================*/
.slider {
  opacity: 0;
  visibility: hidden;
}
.slick-slider {
  position: relative;
  display: block;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}
.slick-list {
  position: relative;
  display: block;
  overflow: hidden;
  padding: 0 !important;
}
.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
.slick-track {
  position: relative;
  top: 0;
  left: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
  line-height: 0;
}
.slick-track:before,
.slick-track:after {
  display: table;
  content: "";
}
.slick-track:after {
  clear: both;
}
.slick-loading .slick-track {
  visibility: hidden;
}
.slick-slide {
  display: none;
  float: left;
  height: 100%;
  min-height: 1px;
}
[dir="rtl"] .slick-slide {
  float: right;
}
.slick-slide img {
  display: block;
  width: 100%;
}
.slick-slide.slick-loading img {
  display: none;
}
.slick-slide.dragging img {
  pointer-events: none;
}
.slick-initialized .slick-slide {
  display: block;
}
.slick-loading .slick-slide {
  visibility: hidden;
}
.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
  display: none;
}

/*active*/
.slider.slick-initialized {
  opacity: 1;
  visibility: visible;
}

/* 슬라이드
=========================================================*/
.type_slider {
  overflow: hidden;
}
.slick-slide {
  padding: 0px 13px;
  opacity: 0.3;
  transition-property: opacity;
  -webkit-transition-property: opacity;
  -moz-transition-property: opacity;
  transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
}
.slick-slide.slick-active {
  opacity: 1;
}
.slick-list {
  padding: 0 50px !important;
}
.slide_ps_item {
  display: block !important;
  position: relative;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
}
.slide_ps_item .img {
  display: block;
  line-height: 0;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.slide_ps_item .text_bx {
  position: absolute;
  bottom: 25px;
  left: 25px;
  right: 25px;
  z-index: 1;
}
.slide_ps_item .text_bx .sub_text {
  font-size: 14px;
  line-height: 1.36em;
  font-weight: 400;
  color: #fff;
  transition-property: opacity;
  -webkit-transition-property: opacity;
  -moz-transition-property: opacity;
  transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  opacity: 0;
}
.slide_ps_item .text_bx .name {
  font-size: 12px;
  line-height: 1.7em;
  font-weight: bold;
  color: #fff;
  transition-property: opacity;
  -webkit-transition-property: opacity;
  -moz-transition-property: opacity;
  transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  opacity: 0;
}

/*액션*/
.type_slider.skrollable-after .slide_ps_item .text_bx .sub_text {
  opacity: 1;
}
.type_slider.skrollable-after .slide_ps_item .text_bx .name {
  opacity: 1;
}

@media screen and (min-width: 1921px) {
}

@media screen and (max-width: 1920px) and (min-width: 1024px) {
  .slick-slide {
    width: 14.583vw;
    padding: 0 0.577vw;
  }
  .slick-list {
    padding: 0 2.6041vw !important;
  }
  .slide_ps_item {
    border-radius: 0.5208vw;
    -webkit-border-radius: 0.5208vw;
    -moz-border-radius: 0.5208vw;
  }
  .slide_ps_item .text_bx {
    bottom: 1.302vw;
    left: 1.302vw;
    right: 1.302vw;
  }
  .slide_ps_item .text_bx .sub_text {
    font-size: 0.729vw;
  }
  .slide_ps_item .text_bx .name {
    font-size: 0.625vw;
  }
}

@media screen and (max-width: 1630px) and (min-width: 1024px) {
  .slide_ps_item .text_bx .sub_text {
    font-size: 12px;
  }
  .slide_ps_item .text_bx .name {
    font-size: 10px;
  }
}

@media screen and (max-width: 1023px) and (min-width: 1px) {
  .slick-slide {
    width: 22.8739vw;
    padding: 0 0.684vw;
  }
  .slick-list {
    padding: 0 2.6041vw !important;
  }
  .slide_ps_item {
    border-radius: 0.9775vw;
    -webkit-border-radius: 0.9775vw;
    -moz-border-radius: 0.9775vw;
  }
  .slide_ps_item .text_bx {
    bottom: 2.443vw;
    left: 2.443vw;
    right: 2.443vw;
  }
  .slide_ps_item .text_bx .sub_text {
    font-size: 12px;
    line-height: 1.45em;
  }
  .slide_ps_item .text_bx .name {
    font-size: 10px;
  }
}

@media screen and (max-width: 1023px) and (min-width: 1px) {
}

@media screen and (max-width: 639px) and (min-width: 1px) {
  .slick-slide {
    padding: 0 5px;
  }
  .slick-list {
    padding: 0 20px !important;
  }
  .slide_ps_item .text_bx {
    left: 14px;
    right: 14px;
    bottom: 15px;
  }
  .slide_ps_item .text_bx .sub_text {
    font-size: 11px;
    margin-bottom: 7px;
  }
  .cont_type_6 .max_container {
    text-align: center;
  }
  .cont_type_6 .max_container .mt_title {
    line-height: 1.3em;
  }
  .cont_type_6 .mb70.type_heade {
    margin-bottom: 30px;
  }
}

@media screen and (max-width: 570px) and (min-width: 1px) {
}

@media screen and (max-width: 374px) and (min-width: 1px) {
  .slick-slide {
    padding: 0 3px;
  }
  .slide_ps_item .text_bx {
    left: 10px;
    right: 10px;
    bottom: 12px;
  }
  .slide_ps_item .text_bx .sub_text {
    margin-bottom: 5px;
  }
}

/*=========================================================
  14. 컨텐츠(cont_type_7)
=========================================================*/
.cont_type_7 {
  position: relative;
}
.cont_type_7 .type_cont {
  display: table-cell;
  vertical-align: middle;
  padding-left: 150px;
}
.cont_type_7 .type_img {
  display: table-cell;
  vertical-align: middle;
  width: 515px;
}
.cont_type_7 .mt_title {
  line-height: 1.2em;
  font-size: 48px;
}

/*이미지*/
.cont_type_7 .type_img .img_a {
  line-height: 0;
  display: block;
}

/*버튼*/
.btn_bx {
  line-height: 0;
  font-size: 0;
}
.btn_item {
  font-size: 22px;
  font-weight: 500;
  color: #fff;
  line-height: 1.2em;
  padding: 20px 78px 18px;
  background: #fe4d0c;
  border-radius: 9px;
  -webkit-border-radius: 9px;
  -moz-border-radius: 9px;
  display: inline-block;
  transition-property: transform;
  -webkit-transition-property: transform;
  -moz-transition-property: transform;
  transition-duration: 0.3s;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
}

/*호버*/
.btn_item:hover {
  background: #000000;
  transform: scale(0.94);
  -webkit-transform: scale(0.94);
  -moz-transform: scale(0.94);
  -ms-transform: scale(0.94);
}

.cont_type_7 .type_img .img_a {
  position: relative;
}
.cont_type_7 .type_img .img_b {
  animation: img_b7 8s linear infinite;
  -webkit-animation: img_b7 8s linear infinite;
}

@keyframes img_b7 {
  0% {
    transform: rotate(0);
  }
  25% {
    transform: rotate(20deg);
  }
  50% {
    transform: rotate(0deg);
  }
  75% {
    transform: rotate(-20deg);
  }
  100% {
    transform: rotate(0);
  }
}

@-webkit-keyframes img_b7 {
  0% {
    -webkit-transform: rotate(0);
  }
  25% {
    -webkit-transform: rotate(20deg);
  }
  50% {
    -webkit-transform: rotate(0deg);
  }
  75% {
    -webkit-transform: rotate(-20deg);
  }
  100% {
    -webkit-transform: rotate(0);
  }
}

@media screen and (max-width: 1920px) and (min-width: 1024px) {
  .cont_type_7 .type_img {
    width: 26.8229vw;
  }
  .cont_type_7 .type_cont {
    padding-left: 7.85416vw;
  }
  .cont_type_7 .mt_title {
    font-size: 2.5vw;
  }
  .btn_item {
    font-size: 1.1458vw;
    padding: 1.0416vw 4.0625vw 0.9375vw;
    border-radius: 0.4687vw;
    -webkit-border-radius: 0.4687vw;
    -moz-border-radius: 0.4687vw;
  }
}

@media screen and (max-width: 1490px) and (min-width: 1024px) {
  .btn_item {
    font-size: 14px;
    padding: 16px 60px 14px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
  }
}

@media screen and (max-width: 1150px) and (min-width: 1024px) {
  .cont_type_7 .mt_title {
    font-size: 29px;
  }
}

@media screen and (max-width: 1023px) and (min-width: 1px) {
  .cont_type_7 .type_img {
    width: 44%;
  }
  .cont_type_7 .type_cont {
    padding-left: 7.9479vw;
  }
  .cont_type_7 .mt_title {
    font-size: 3.2785vw;
  }
  .btn_item {
    font-size: 2vw;
    padding: 1.5416vw 5.5625vw 1.7375vw;
    border-radius: 0.6687vw;
    -webkit-border-radius: 0.6687vw;
    -moz-border-radius: 0.6687vw;
  }
}

@media screen and (max-width: 639px) and (min-width: 1px) {
  .cont_type_7 {
    text-align: center;
  }
  .cont_type_7 .table_ro {
    position: relative;
  }
  .cont_type_7 .type_cont {
    display: block;
    width: 100%;
    padding-left: 0;
  }
  .cont_type_7 .type_img {
    display: block;
    width: 93%;
    position: absolute;
    top: calc(28vw + 28px);
    top: -webkit-calc(28vw + 28px);
    top: -moz-calc(28vw + 28px);
    left: 50%;
    margin-left: -46%;
  }
  .cont_type_7 .mt_title {
    font-size: 7.5vw;
    margin-bottom: calc(64vw + 30px);
    margin-bottom: -webkit-calc(64vw + 30px);
    margin-bottom: -moz-calc(64vw + 30px);
  }
  .cont_type_7 .mt_title br {
    display: none;
  }
  .btn_item {
    font-size: 5.314vw;
    padding: 4.106vw 21.73vw 3.864vw;
    border-radius: 2.415vw;
    -webkit-border-radius: 2.415vw;
    -moz-border-radius: 2.415vw;
  }
}

/*=========================================================
  15. 본문 컨텐츠
=========================================================*/
.static_bx .title_bx {
  text-align: center;
}
.static_bx .title_bx h2 {
  font-weight: 400;
}
.static_contbx {
  border: 1px solid #ddd;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  padding: 40px 25px;
}
.static_contbx h3 {
  font-weight: 500;
}
.static_contbx a {
  color: #fe4d0c;
}
.bullet_ls li:after {
  content: "";
  display: table;
  clear: both;
}
.bullet_ls li span {
  display: block;
}
.bullet_ls li .bullet {
  margin-right: 6px;
  float: left;
}
.bullet_ls li .text {
  overflow: hidden;
}

@media screen and (min-width: 1024px) {
  .static_contbx a:hover {
    text-decoration: underline;
  }
}

@media screen and (max-width: 1920px) and (min-width: 1024px) {
  .static_contbx {
    padding: 2.083vw 1.302vw;
    border-radius: 0.5208vw;
    -webkit-border-radius: 0.5208vw;
    -moz-border-radius: 0.5208vw;
  }
  .bullet_ls li .bullet {
    margin-right: 0.3125vw;
  }
  .static_contbx {
    font-size: 1.04166vw;
  }
}

@media screen and (max-width: 1150px) and (min-width: 1024px) {
  .bullet_ls li .bullet {
    margin-right: 4px;
  }
  .static_contbx {
    font-size: 12px;
  }
}

@media screen and (max-width: 1023px) and (min-width: 1px) {
  .static_contbx {
    padding: 4.083vw 3vw;
    border-radius: 0.8208vw;
    -webkit-border-radius: 0.8208vw;
    -moz-border-radius: 0.8208vw;
  }
  .bullet_ls li .bullet {
    margin-right: 4px;
  }
  .static_contbx {
    font-size: 1.555vw;
  }
}

@media screen and (max-width: 639px) and (min-width: 1px) {
  .static_contbx {
    font-size: 3.8vw;
  }
}

@media screen and (max-width: 419px) and (min-width: 1px) {
  .static_bx .max_container {
    padding: 0 20px;
  }
  .static_contbx .ps_title {
    font-size: 18px;
    margin-bottom: 15px;
  }
  .static_contbx {
    padding: 25px 15px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
  }
}