@charset "UTF-8";
@import url("../../font/webfonts_Notable.css");
/*-------------------------------------------------
title       : 콘텐츠
Author      : 플랜아이 momi
Create date : 2024-01-18
-------------------------------------------------*/
#wrap.kep40 {
  font-family: "NanumSquareNeo";
}
#wrap.kep40 #header {
  position: absolute;
  width: 100%;
  top: 0;
}
#wrap.kep40 #header.active {
  background: #fff;
}
#wrap.kep40 #header.active #logo a {
  background-image: url(../img/layout/logo.svg);
}
#wrap.kep40 #header.active #gnb1 > ul > li > a {
  color: #111;
}
#wrap.kep40 #header.active #hnb .list a {
  color: #111;
}
#wrap.kep40 #header.active #search .control.open {
  color: #111;
}
#wrap.kep40 #header #gnb1 {
  border-bottom: none;
}
#wrap.kep40 #logo a {
  background-image: url(../img/layout/logo_2.svg);
}
#wrap.kep40 #gnb1 > ul > li > a {
  color: #fff;
}
#wrap.kep40 #hnb .list a {
  color: #fff;
}
#wrap.kep40 #search .control.open {
  color: #fff;
}
#wrap.kep40 .main_wrap {
  width: 100%;
  max-width: 100%;
  padding: 0;
}
#wrap.kep40 #snb {
  display: none;
}
#wrap.kep40 #contents {
  width: 100%;
  float: initial;
}
#wrap.kep40 .contents_util {
  display: none;
}
#wrap.kep40 #contents_body {
  margin-bottom: 0;
}
#wrap.kep40 .contents_info {
  display: none;
}
#wrap.kep40 #footer {
  display: none;
}
#wrap.kep40 .inner { /* max-width: 1920px; margin: 0 auto;*/
  position: relative;
}
#wrap.kep40 .bg {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 100vw;
  height: 100vh;
  z-index: -1;
}
#wrap.kep40 .sec1,
#wrap.kep40 .sec2 {
  height: 100vh;
  text-align: center;
  position: relative;
}
#wrap.kep40 .sec1 .inner,
#wrap.kep40 .sec2 .inner {
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
#wrap.kep40 .sec1 .inner .txt_wrap,
#wrap.kep40 .sec2 .inner .txt_wrap {
  max-width: calc(100% - 4rem);
}
#wrap.kep40 .sec1 .txt1 {
  display: block;
  margin-bottom: 1.2rem;
  color: #ED1C24;
  font-size: 2.8rem;
  font-weight: 700;
  word-break: keep-all;
  -webkit-animation: txt_Ani1 1s 0.2s ease-in-out forwards;
          animation: txt_Ani1 1s 0.2s ease-in-out forwards;
  opacity: 0;
}
#wrap.kep40 .sec1 h2 {
  font-size: 7.2rem;
  color: #fff;
  line-height: 1.3;
  font-weight: 800;
  letter-spacing: -0.216rem;
  word-break: keep-all;
  -webkit-animation: pic_show2 0.5s 1s ease-in-out forwards;
          animation: pic_show2 0.5s 1s ease-in-out forwards;
  opacity: 0;
}
#wrap.kep40 .sec1 .bg {
  background-image: url(../img/sub/kep40/section1_bg.jpg);
}
#wrap.kep40 .kep40_tab {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
#wrap.kep40 .kep40_tab a {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 20%;
          flex: 1 1 20%;
  width: 20%;
  height: 8rem;
  color: #fff;
  font-size: 2rem;
  background-color: rgba(0, 0, 0, 0.5);
  position: relative;
  -webkit-transition: 0.2s;
  transition: 0.2s;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  line-height: 1.4;
}
#wrap.kep40 .kep40_tab a:before {
  content: "";
  width: 1px;
  height: 22px;
  background-color: rgba(255, 255, 255, 0.3);
  position: absolute;
  top: 50%;
  left: -1px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}
#wrap.kep40 .kep40_tab a:first-child::before {
  display: none;
}
#wrap.kep40 .kep40_tab a br {
  display: none;
}
#wrap.kep40 .kep40_tab a:hover, #wrap.kep40 .kep40_tab a:focus {
  font-weight: 800;
  letter-spacing: -0.04rem;
}
#wrap.kep40 .kep40_tab a.active {
  background: rgba(195, 17, 31, 0.5);
  -webkit-backdrop-filter: blur(15px);
          backdrop-filter: blur(15px);
}
#wrap.kep40 .kep40_tab a.active::before {
  display: none;
}
#wrap.kep40 .kep40_tab a.active + a::before {
  display: none;
}
#wrap.kep40 .kep40_tab.fixed {
  position: fixed;
  bottom: initial;
  top: 0;
  z-index: 50;
}
#wrap.kep40 .mouse_scr {
  position: absolute;
  bottom: 100px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  -webkit-animation: txt_Ani1 1s 1.8s ease forwards;
          animation: txt_Ani1 1s 1.8s ease forwards;
  opacity: 0;
}
#wrap.kep40 .mouse_scr > * {
  display: block;
  text-align: center;
}
#wrap.kep40 .mouse_scr span {
  color: #fff;
  font-size: 16px;
}
#wrap.kep40 .mouse_scr em {
  width: 16px;
  height: 22px;
  border: 2px solid #fff;
  border-radius: 6px;
  margin: 0 auto 8px;
  position: relative;
}
#wrap.kep40 .mouse_scr em:before {
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  content: "";
  width: 1.5px;
  height: 5px;
  background-color: #fff;
  top: 3px;
  position: absolute;
  border-radius: 3px;
  -webkit-animation: mouse_Ani 1.2s ease infinite;
          animation: mouse_Ani 1.2s ease infinite;
}
@-webkit-keyframes mouse_Ani {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(-50%, 4px);
            transform: translate(-50%, 4px);
  }
}
@keyframes mouse_Ani {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, 0);
            transform: translate(-50%, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(-50%, 4px);
            transform: translate(-50%, 4px);
  }
}
#wrap.kep40 .sec2 .txt_wrap div {
  opacity: 0;
}
#wrap.kep40 .sec2 .txt_wrap div:first-child {
  margin-bottom: 4.8rem;
}
#wrap.kep40 .sec2 .txt_wrap div:last-child {
  margin-top: 2.8rem;
}
#wrap.kep40 .sec2 .txt1 {
  color: rgba(255, 255, 255, 0.8);
  font-size: 2.2rem;
  letter-spacing: -0.066rem;
  width: 68rem;
  max-width: 100%;
  line-height: 1.8;
  word-break: keep-all;
}
#wrap.kep40 .sec2 .bg {
  background-image: url(../img/sub/kep40/section2_bg.jpg);
}
#wrap.kep40 .sec2.active .txt_wrap div {
  -webkit-animation: txt_Ani2 0.8s 1s ease-in-out forwards;
          animation: txt_Ani2 0.8s 1s ease-in-out forwards;
}
#wrap.kep40 .sec2.active .txt_wrap div:first-child {
  -webkit-animation: pic_show 1s 0.2s ease-in-out forwards;
          animation: pic_show 1s 0.2s ease-in-out forwards;
}
#wrap.kep40 .sec2.active .txt_wrap div:last-child {
  -webkit-animation-delay: 1.2s;
          animation-delay: 1.2s;
}
#wrap.kep40 .sec3 {
  background-image: url(../img/sub/kep40/section3_bg.jpg);
  background-repeat: repeat;
  position: relative;
}
#wrap.kep40 .sec3 .inner {
  height: 100%;
  max-width: 100vw;
}
#wrap.kep40 .sec3 .cont {
  position: relative;
}
#wrap.kep40 .sec3 .txt img {
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
#wrap.kep40 .sec3 .cont1 {
  -webkit-transition: 0.5s;
  transition: 0.5s;
  height: 2400px;
}
#wrap.kep40 .sec3 .cont1 .cont1_wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column; /*height: 100vh;padding-bottom: 100rem; */
}
#wrap.kep40 .sec3 .cont1 .txt_wrap {
  opacity: 0;
  padding-top: 20rem;
  width: 64rem;
  max-width: calc(100% - 4rem);
  margin: 0 auto 10rem;
  text-align: center;
  position: relative;
  z-index: 1;
}
#wrap.kep40 .sec3 .cont1 .bigyear {
  color: #C3111F;
  font-family: "Notable";
  font-size: 14rem;
  line-height: 0.9;
  margin-bottom: 6rem;
}
#wrap.kep40 .sec3 .cont1 .txt2 {
  color: rgba(34, 34, 34, 0.8);
  font-size: 1.8rem;
  text-align: left;
  font-weight: 700;
  line-height: 2;
  margin-bottom: 2rem;
}
#wrap.kep40 .sec3 .cont1 .txt_img {
  margin-bottom: 4rem;
}
#wrap.kep40 .sec3 .cont1 .pic {
  position: absolute;
  opacity: 0;
}
#wrap.kep40 .sec3 .cont1 .pic:not(.pic5).active {
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  -webkit-animation-timing-function: ease-in;
          animation-timing-function: ease-in;
}
#wrap.kep40 .sec3 .cont1 .pic1 {
  top: 5%;
  left: -4%;
}
#wrap.kep40 .sec3 .cont1 .pic1.active {
  -webkit-animation-name: pic_show1_1;
          animation-name: pic_show1_1;
}
#wrap.kep40 .sec3 .cont1 .pic2 {
  top: 15%;
  right: -3%;
}
#wrap.kep40 .sec3 .cont1 .pic2.active {
  -webkit-animation-name: pic_show1_2;
          animation-name: pic_show1_2;
}
#wrap.kep40 .sec3 .cont1 .pic4 {
  top: 80rem;
  left: -1%;
}
#wrap.kep40 .sec3 .cont1 .pic4.active {
  -webkit-animation-name: pic_show1_3;
          animation-name: pic_show1_3;
}
#wrap.kep40 .sec3 .cont1 .pic11 {
  top: 20%;
  left: 0%;
}
#wrap.kep40 .sec3 .cont1 .pic11.active {
  -webkit-animation-name: pic_show1_1;
          animation-name: pic_show1_1;
}
#wrap.kep40 .sec3 .cont1 .pic12 {
  top: 6%;
  right: -3%;
}
#wrap.kep40 .sec3 .cont1 .pic12.active {
  -webkit-animation-name: pic_show1_2;
          animation-name: pic_show1_2;
}
#wrap.kep40 .sec3 .cont1 .pic14 {
  top: 80rem;
  right: -1%;
}
#wrap.kep40 .sec3 .cont1 .pic14.active {
  -webkit-animation-name: pic_show1_3;
          animation-name: pic_show1_3;
}
#wrap.kep40 .sec3 .cont1 .pic5 {
  position: relative;
  top: 0rem;
  display: block;
  margin: 0 auto;
  width: 60rem;
  height: 34.5rem;
  border: 0.9rem solid #F5F2E7;
  -webkit-box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
          box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  overflow: hidden;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  -webkit-transform: translate(5px, 5px) rotate(-15deg);
          transform: translate(5px, 5px) rotate(-15deg);
}
#wrap.kep40 .sec3 .cont1 .pic5:after {
  content: "";
  width: 10%;
  height: 10%;
  background-color: #211D19;
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  -webkit-transition: 0.8s;
  transition: 0.8s;
}
#wrap.kep40 .sec3 .cont1 .pic5.active {
  -webkit-animation-duration: 0.6s;
          animation-duration: 0.6s;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  opacity: 1;
  -webkit-transform: rotate(-10deg);
          transform: rotate(-10deg);
}
#wrap.kep40 .sec3 .cont1.active .txt_wrap {
  -webkit-animation: txt_Ani2 0.4s ease-in-out forwards;
          animation: txt_Ani2 0.4s ease-in-out forwards;
}
#wrap.kep40 .sec3 .cont2 .bg2 {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
#wrap.kep40 .sec3 .cont2 .item_wrap {
  z-index: 0;
  position: relative; /*margin-top: -300px;*/
  width: 112rem;
  left: calc(50% + 28rem);
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
#wrap.kep40 .sec3 .cont2 .item {
  position: relative;
  margin: 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 13rem 0 34rem;
}
#wrap.kep40 .sec3 .cont2 .item::before {
  content: "";
  width: 11.4rem;
  height: calc(100% - 5rem);
  background: #C3111F;
  position: absolute;
  top: 5rem;
  left: 22.5rem;
}
#wrap.kep40 .sec3 .cont2 .item.item4 {
  padding-bottom: 80rem;
}
#wrap.kep40 .sec3 .cont2 .item .imgbox {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 56.4rem;
          flex: 1 1 56.4rem;
  position: relative;
}
#wrap.kep40 .sec3 .cont2 .item .imgbox .year {
  color: #C3111F;
  text-align: center;
  font-family: "Notable";
  font-size: 4.4rem;
  font-weight: 400;
  line-height: 85%;
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  top: -13rem;
}
#wrap.kep40 .sec3 .cont2 .item .imgbox .date {
  opacity: 0;
  visibility: hidden;
  height: 0;
}
#wrap.kep40 .sec3 .cont2 .item .imgbox img {
  border: 2px solid #ACA5A5;
  -webkit-box-shadow: 20px 20px 30px 0px rgba(0, 0, 0, 0.4);
          box-shadow: 20px 20px 30px 0px rgba(0, 0, 0, 0.4);
}
#wrap.kep40 .sec3 .cont2 .item .txtbox {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 calc(100% - 56.4rem);
          flex: 1 1 calc(100% - 56.4rem);
  padding-left: 6rem;
  color: rgba(255, 255, 255, 0.8);
  font-size: 1.8rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.9;
  letter-spacing: -0.054rem;
}
#wrap.kep40 .sec3 .cont2 .item .txtbox .imgtxt {
  opacity: 0;
  visibility: hidden;
  height: 0;
}
#wrap.kep40 .sec3 .cont2 .title_wrap {
  z-index: 10;
  position: relative;
  position: absolute;
  top: 0;
  left: 0;
  width: 30%;
  height: 100%;
  padding: 13rem 0 0 6rem; /*opacity: 0;*/
  -webkit-transition: 0.2s;
  transition: 0.2s;
  -webkit-transition-delay: 0.8s;
          transition-delay: 0.8s;
}
#wrap.kep40 .sec3 .cont2 .title_wrap .ti_box {
  position: absolute;
}
#wrap.kep40 .sec3 .cont2 .title_wrap .ti_box.active .year {
  opacity: 1;
  -webkit-transform-origin: top;
          transform-origin: top;
  -webkit-transform: rotateX(0);
          transform: rotateX(0);
  -webkit-transition: -webkit-transform 0.8s cubic-bezier(0.76, 0, 0.24, 1);
  transition: -webkit-transform 0.8s cubic-bezier(0.76, 0, 0.24, 1);
  transition: transform 0.8s cubic-bezier(0.76, 0, 0.24, 1);
  transition: transform 0.8s cubic-bezier(0.76, 0, 0.24, 1), -webkit-transform 0.8s cubic-bezier(0.76, 0, 0.24, 1);
}
#wrap.kep40 .sec3 .cont2 .title_wrap .ti_box.active .date {
  opacity: 1;
  -webkit-transform-origin: top;
          transform-origin: top;
  -webkit-transform: rotateX(0);
          transform: rotateX(0);
  -webkit-transition: -webkit-transform 0.8s cubic-bezier(0.76, 0, 0.24, 1) 0.2s;
  transition: -webkit-transform 0.8s cubic-bezier(0.76, 0, 0.24, 1) 0.2s;
  transition: transform 0.8s cubic-bezier(0.76, 0, 0.24, 1) 0.2s;
  transition: transform 0.8s cubic-bezier(0.76, 0, 0.24, 1) 0.2s, -webkit-transform 0.8s cubic-bezier(0.76, 0, 0.24, 1) 0.2s;
}
#wrap.kep40 .sec3 .cont2 .title_wrap .ti_box.active .txt1 {
  opacity: 1;
  -webkit-transform-origin: top;
          transform-origin: top;
  -webkit-transform: rotateX(0);
          transform: rotateX(0);
  -webkit-transition: -webkit-transform 0.8s cubic-bezier(0.76, 0, 0.24, 1) 0.4s;
  transition: -webkit-transform 0.8s cubic-bezier(0.76, 0, 0.24, 1) 0.4s;
  transition: transform 0.8s cubic-bezier(0.76, 0, 0.24, 1) 0.4s;
  transition: transform 0.8s cubic-bezier(0.76, 0, 0.24, 1) 0.4s, -webkit-transform 0.8s cubic-bezier(0.76, 0, 0.24, 1) 0.4s;
}
#wrap.kep40 .sec3 .cont2 .title_wrap .year,
#wrap.kep40 .sec3 .cont2 .title_wrap .date {
  opacity: 0;
  font-size: 10.8rem;
  color: #C3111F;
  font-family: "Notable";
  line-height: 0.9;
  -webkit-transform: rotateX(90deg);
          transform: rotateX(90deg);
  -webkit-transform-origin: bottom;
          transform-origin: bottom;
  -webkit-transition: opacity 0.8s cubic-bezier(0.76, 0, 0.24, 1), -webkit-transform 0.8s cubic-bezier(0.76, 0, 0.24, 1);
  transition: opacity 0.8s cubic-bezier(0.76, 0, 0.24, 1), -webkit-transform 0.8s cubic-bezier(0.76, 0, 0.24, 1);
  transition: transform 0.8s cubic-bezier(0.76, 0, 0.24, 1), opacity 0.8s cubic-bezier(0.76, 0, 0.24, 1);
  transition: transform 0.8s cubic-bezier(0.76, 0, 0.24, 1), opacity 0.8s cubic-bezier(0.76, 0, 0.24, 1), -webkit-transform 0.8s cubic-bezier(0.76, 0, 0.24, 1);
}
#wrap.kep40 .sec3 .cont2 .title_wrap .txt1 {
  opacity: 0;
  margin-top: 3.5rem;
  -webkit-transform: rotateX(90deg);
          transform: rotateX(90deg);
  -webkit-transform-origin: bottom;
          transform-origin: bottom;
  -webkit-transition: opacity 0.8s cubic-bezier(0.76, 0, 0.24, 1), -webkit-transform 0.8s cubic-bezier(0.76, 0, 0.24, 1);
  transition: opacity 0.8s cubic-bezier(0.76, 0, 0.24, 1), -webkit-transform 0.8s cubic-bezier(0.76, 0, 0.24, 1);
  transition: transform 0.8s cubic-bezier(0.76, 0, 0.24, 1), opacity 0.8s cubic-bezier(0.76, 0, 0.24, 1);
  transition: transform 0.8s cubic-bezier(0.76, 0, 0.24, 1), opacity 0.8s cubic-bezier(0.76, 0, 0.24, 1), -webkit-transform 0.8s cubic-bezier(0.76, 0, 0.24, 1);
}
#wrap.kep40 .sec3 .cont2 .txt2 img {
  -webkit-transform: translateY(-10px);
          transform: translateY(-10px);
}
#wrap.kep40 .sec3 .cont2.active1 .txt1 img {
  -webkit-transform: translateY(-100px);
          transform: translateY(-100px);
}
#wrap.kep40 .sec3 .cont2.active1 .txt2 img {
  -webkit-transform: translateY(-110px);
          transform: translateY(-110px);
}
#wrap.kep40 .sec3 .cont2.active1 .txt3 img {
  -webkit-transform: translateY(-120px);
          transform: translateY(-120px);
}
#wrap.kep40 .sec3 .cont2.active2 .txt1 img {
  -webkit-transform: translateY(-200px);
          transform: translateY(-200px);
}
#wrap.kep40 .sec3 .cont2.active2 .txt2 img {
  -webkit-transform: translateY(-210px);
          transform: translateY(-210px);
}
#wrap.kep40 .sec3 .cont2.active2 .txt3 img {
  -webkit-transform: translateY(-240px);
          transform: translateY(-240px);
}
#wrap.kep40 .sec3.bg_active .cont1 .pic5 {
  -webkit-animation-name: pic_show_dif;
          animation-name: pic_show_dif;
  -webkit-animation-duration: 0.5s;
          animation-duration: 0.5s;
  -webkit-animation-timing-function: cubic-bezier(0.62, 0.21, 0.7, 0.79);
          animation-timing-function: cubic-bezier(0.62, 0.21, 0.7, 0.79);
  border: 0;
  -webkit-box-shadow: none;
          box-shadow: none;
  margin: 0;
  -webkit-transition: none;
  transition: none;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
  z-index: 2;
  left: 50%;
}
#wrap.kep40 .sec3.bg_active .cont1 .pic5:after {
  opacity: 0.8;
  width: 1000%;
  height: 1000%;
}
#wrap.kep40 .sec3.bg_active .cont1 .pic5 img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
#wrap.kep40 .sec3.bg_active .cont2 {
  opacity: 1;
  z-index: 10;
}
#wrap.kep40 .sec3.bg_active .cont2 .bg2 {
  position: fixed;
  background-image: url(../img/sub/kep40/section4_bg_2.jpg);
}
#wrap.kep40 .sec3.bg_active .cont2 .item_wrap {
  z-index: 9;
  position: relative;
}
#wrap.kep40 .sec3.bg_active .cont2 .title_wrap {
  position: fixed;
  opacity: 1;
}
#wrap.kep40 .sec3.sec3-2 {
  z-index: 3;
}
#wrap.kep40 .sec3.sec3-3 {
  z-index: 4;
}
#wrap.kep40 .sec3.sec3-4 {
  z-index: 5;
}
@-webkit-keyframes pic_show_dif {
  0% {
    opacity: 1;
    -webkit-transform: rotate(-10deg) translateX(-50%);
            transform: rotate(-10deg) translateX(-50%);
  }
  50% {
    opacity: 1;
    -webkit-transform: rotate(0deg) translateX(-50%);
            transform: rotate(0deg) translateX(-50%);
  }
  80% {
    opacity: 1;
    -webkit-transform: rotate(0deg) translateX(-50%);
            transform: rotate(0deg) translateX(-50%);
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 1%;
    -webkit-box-shadow: none;
            box-shadow: none;
    z-index: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: rotate(0deg) translateX(-50%);
            transform: rotate(0deg) translateX(-50%);
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
  }
}
@keyframes pic_show_dif {
  0% {
    opacity: 1;
    -webkit-transform: rotate(-10deg) translateX(-50%);
            transform: rotate(-10deg) translateX(-50%);
  }
  50% {
    opacity: 1;
    -webkit-transform: rotate(0deg) translateX(-50%);
            transform: rotate(0deg) translateX(-50%);
  }
  80% {
    opacity: 1;
    -webkit-transform: rotate(0deg) translateX(-50%);
            transform: rotate(0deg) translateX(-50%);
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 1%;
    -webkit-box-shadow: none;
            box-shadow: none;
    z-index: 1;
  }
  100% {
    opacity: 1;
    -webkit-transform: rotate(0deg) translateX(-50%);
            transform: rotate(0deg) translateX(-50%);
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
  }
}
#wrap.kep40 #mobile {
  display: none;
  margin: 0 auto;
}
#wrap.kep40 #mobile img {
  width: 100%;
}
@-webkit-keyframes txt_Ani1 {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes txt_Ani1 {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes txt_Ani2 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes txt_Ani2 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes pic_show {
  0% {
    opacity: 0;
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes pic_show {
  0% {
    opacity: 0;
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@-webkit-keyframes pic_show1_1 {
  0% {
    opacity: 0;
    -webkit-transform: rotate(8deg);
            transform: rotate(8deg);
  }
  50% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
}
@keyframes pic_show1_1 {
  0% {
    opacity: 0;
    -webkit-transform: rotate(8deg);
            transform: rotate(8deg);
  }
  50% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
}
@-webkit-keyframes pic_show1_2 {
  0% {
    opacity: 0;
    -webkit-transform: rotate(-6deg);
            transform: rotate(-6deg);
  }
  50% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
}
@keyframes pic_show1_2 {
  0% {
    opacity: 0;
    -webkit-transform: rotate(-6deg);
            transform: rotate(-6deg);
  }
  50% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
}
@-webkit-keyframes pic_show1_3 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(30px);
            transform: translateY(30px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@keyframes pic_show1_3 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(30px);
            transform: translateY(30px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
}
@-webkit-keyframes pic_show1_4 {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, 20px) rotate(-10deg);
            transform: translate(-50%, 20px) rotate(-10deg);
  }
  50% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(-50%, 0) rotate(-6deg);
            transform: translate(-50%, 0) rotate(-6deg);
  }
}
@keyframes pic_show1_4 {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, 20px) rotate(-10deg);
            transform: translate(-50%, 20px) rotate(-10deg);
  }
  50% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(-50%, 0) rotate(-6deg);
            transform: translate(-50%, 0) rotate(-6deg);
  }
}
@-webkit-keyframes pic_show2 {
  0% {
    opacity: 0;
    -webkit-transform: scale(1.2);
            transform: scale(1.2);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes pic_show2 {
  0% {
    opacity: 0;
    -webkit-transform: scale(1.2);
            transform: scale(1.2);
  }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@media (max-width: 768px) {
  #wrap.kep40 #wrap {
    display: none;
  }
  #wrap.kep40 #mobile {
    display: block;
  }
}