/* --------------------------------sec common------------------------------ */
#scrollable::-webkit-scrollbar {display: none;  width: 0 !important}
#scrollable {-ms-overflow-style: none; /* 인터넷 익스플로러 */scrollbar-width: none; /* 파이어폭스 */}
.sec {position: relative; width:100%; height: calc(var(--var, 1vh) * 100); overflow:hidden;}
.sec .inner{position:relative; width: 92%; height:100%; margin: 0 auto;}
.sec .scorll {position: absolute; left: 50%; bottom: 5.125rem; width: 1.625rem ; height: 4rem; margin-left: -0.8125rem; background: url(../images/ico_scroll.svg) no-repeat center center/100% auto; z-index: 99; opacity: 0; transition: opacity 0.5s;}
.sec .scorll.on {opacity: 0; animation: scroll 1.4s ease infinite;}
/* --------------------------------sec common end------------------------------ */


/* --------------------------------sec_01------------------------------ */
.sec_01 {position: relative; background: url(../images/sec_01_cont_01_bg.jpeg) no-repeat top center/cover;}
.sec_01 .bg_change {position: absolute; left: 0; bottom: 0; width: 100%; height: 0%; background:url(../images/sec_01_cont_02_bg.jpg) top center no-repeat;background-size:1920px;background-position:center;overflow-x:hidden;overflow-y:hidden;background-size:cover;z-index: 10;}
.sec_01.on .bg_change {height: 100%; transition: height 0.5s; transition-delay: 0.3s;}
.sec_01 .inner {max-width: 1500px;}
.sec_01 .scorll {bottom: 8.125rem;}

.sec_01 [class^="title_"] {z-index: 10; position: absolute; background-size: 100% auto;background-position: center center;background-repeat: no-repeat;}
.sec_01 .title_01 {left: 50%; top: 50%; width: 17.75rem; height: 13rem; transform: translate(-50%,-100%); background-image: url(../images/sec_01_logo.svg); transition: top 0.2s;}
.sec_01 .title_01.hide {top: -10%;}
.sec_01 .title_02 {left: -50%; top: 50%; width: 500px; height: 277px; transform: translate(-50%,-60%); background-image: url(../images/sec_01_logo_on.svg); transition: left 0.2s; z-index: 11;}
.sec_01 .title_02.show {left: 50%;}
.sec_01 .sub_title {position: absolute; left: 50%; top: 50%; transform: translate(-50%,300%); font-size: 4rem; z-index: 10; white-space: nowrap; opacity: 0; transition: opacity 0.3s, transform 0.3s; color: #005E58; font-weight: 600; z-index: 11;}
.sec_01 .sub_title span {font-size: 5rem; font-weight: 900;}
.sec_01 .sub_title.on {opacity: 1; transform: translate(-50%, 150%);}

.sec_01 .earth {position: absolute; left: 50%; top: 50%;  width: 946px; height: 1102px; transform: translateX(-50%); background-image: url(../images/sec_01_earth.png);background-size: 100% auto;background-position: center center;background-repeat: no-repeat;}
.sec_01 [class^="img_"] {position: absolute; z-index: 10; background-size: 100% auto;background-position: center center;background-repeat: no-repeat;}
.sec_01 .img_01 {left: 50%; top: 41%; width: 194px; height: 203px; margin-left: -97px; background-image: url(../images/sec_01_ele_01.png);}
.sec_01 .img_02 {left: 18%; top: 70%; width: 242px; height: 214px; background-image: url(../images/sec_01_ele_02.png);}
.sec_01 .img_03 {right: 2%; top: 60%; width: 183px; height: 165px; background-image: url(../images/sec_01_ele_03.png);}
.sec_01 .img_04 {right: 2%; top: 20vh; width: 155px; height: 83px; background-image: url(../images/sec_01_ele_04.png);}
.sec_01 .img_05 {left: 20%; top: 23vh; width: 128px; height: 70px; background-image: url(../images/sec_01_ele_05.png);}
.sec_01 .img_06 {left: 50%; top: 56vh; width: 166px; height: 152px; background-image: url(../images/sec_01_ele_06.png); transform: translate(100%,0) rotate(35deg);}
.sec_01 .img_07 {right: 30%; top: 29vh; width: 54px; height: 57px; background-image: url(../images/sec_01_ele_07.png);}
.sec_01 .img_08 {left: 2%; top: 15vh; width: 102px; height: 102px; background-image: url(../images/sec_01_ele_08.png);}
.sec_01 .img_09 {left: 10%; top: 64vh; width: 74px; height: 63px; background-image: url(../images/sec_01_ele_09.png);}
.sec_01 .img_10 {left: 22%; top: 54vh; width: 138px; height: 144px; background-image: url(../images/sec_01_ele_10.png);}
.sec_01 .img_11 {left: 65%; top: 60vh; width: 125px; height: 147px; background-image: url(../images/sec_01_ele_11.png);}
.sec_01 .img_12 {left: 0%; top: 72vh; width: 88px; height: 92px; background-image: url(../images/sec_01_ele_12.png);}
.sec_01 .img_13 {left: 23%; top: 45vh; width: 130px; height: 162px; background-image: url(../images/sec_01_ele_13.png);}
.sec_01 .img_14 {right: 12%; top: 37vh; width: 83px; height: 133px; background-image: url(../images/sec_01_ele_14.png);}
.sec_01 .img_15 {right: 0%; top: 72vh; width: 112px; height: 81px; background-image: url(../images/sec_01_ele_15.png);}
.sec_01 .img_16 {right: 26%; top: 82vh; width: 56px; height: 48px; background-image: url(../images/sec_01_ele_16.png);}
.sec_01 .img_17 {left: 28%; top: 89vh; width: 56px; height: 48px; background-image: url(../images/sec_01_ele_16.png);}
.sec_01 .img_18 {left: 39%; top: 64vh; width: 78px; height: 112px; background-image: url(../images/sec_01_ele_17.png);}
.sec_01 [class^="img_"].ani {transform-origin: center center;}
.sec_01 .img_04.ani {transform: translateY(-15px);}
.sec_01 .img_05.ani {transform: translateY(-15px);}
.sec_01 .img_06.ani {transform: translate(100%,0) rotate(20deg)}
.sec_01 .img_13.ani {transform: rotate(15deg);}
.sec_01 .img_14.ani {transform: rotate(15deg);}

.sec_01 [class^="ball_"] {position:absolute; top: -200px; z-index:11;}
.sec_01 .ball_01 {left: 55%; width: 290px; height: 111px; background: url(../images/tag_01.png) no-repeat center bottom/100% auto;}
.sec_01 .ball_02 {left: 22%; width: 160px; height: 112px; background: url(../images/tag_02.png) no-repeat center bottom/100% auto;}
.sec_01 .ball_03 {right: 10%; width: 248px; height: 111px; background: url(../images/tag_03.png) no-repeat center bottom/100% auto;}
.sec_01 .ball_04 {left: 0%; width: 221px; height: 134px; background: url(../images/tag_04.png) no-repeat center bottom/100% auto;}
.sec_01 .ball_05 {left: 28%; width: 238px; height: 125px; background: url(../images/tag_05.png) no-repeat center bottom/100% auto;}
.sec_01 .ball_06 {right: 2%; width: 290px; height: 118px; background: url(../images/tag_06.png) no-repeat center bottom/100% auto;}
.sec_01 .ball_07 {left: 10%; width: 266px; height: 130px; background: url(../images/tag_07.png) no-repeat center bottom/100% auto;}
.sec_01 .ball_08 {right: 30%; width: 159px; height: 106px; background: url(../images/tag_08.png) no-repeat center bottom/100% auto;}
.sec_01 .ball_09 {left: 2%; width: 157px; height: 101px; background: url(../images/tag_09.png) no-repeat center bottom/100% auto;}
.sec_01 .ball_10 {right: 0%; width: 300px; height: 149px; background: url(../images/tag_10.png) no-repeat center bottom/100% auto;}
.sec_01 .ball_01.on {animation: bounce_01 1s; animation-fill-mode:forwards; animation-delay: 0s;}
.sec_01 .ball_02.on {animation: bounce_02 1.3s; animation-fill-mode:forwards; animation-delay: 0.1s;}
.sec_01 .ball_03.on {animation: bounce_03 1.6s; animation-fill-mode:forwards; animation-delay: 0.2s;}
.sec_01 .ball_04.on {animation: bounce_04 1s; animation-fill-mode:forwards; animation-delay: 0.3s;}
.sec_01 .ball_05.on {animation: bounce_05 1.3s; animation-fill-mode:forwards; animation-delay: 0s;}
.sec_01 .ball_06.on {animation: bounce_06 1.6s; animation-fill-mode:forwards; animation-delay: 0.1s;}
.sec_01 .ball_07.on {animation: bounce_07 1s; animation-fill-mode:forwards; animation-delay: 0.2s;}
.sec_01 .ball_08.on {animation: bounce_08 1.3s; animation-fill-mode:forwards; animation-delay: 0.3s;}
.sec_01 .ball_09.on {animation: bounce_09 1.6s; animation-fill-mode:forwards; animation-delay: 0.1s;}
.sec_01 .ball_10.on {animation: bounce_10 1.3s; animation-fill-mode:forwards; animation-delay: 0.2s;}
@media screen and (max-width: 1800px) {
    .sec_01 [class^="ball_"] {transform: scale(0.7);}
    .sec_01 .title_02 {width: 400px;}
    .sec_01 .sub_title {font-size: 3rem;}
    .sec_01 .sub_title span {font-size: 4rem;}
}/* xlg */
@media screen and (max-width:1200px) {
    .sec_01 .img_04,
    .sec_01 .img_05,
    .sec_01 .img_07,
    .sec_01 .img_08,
    .sec_01 .img_09,
    .sec_01 .img_12,
    .sec_01 .img_13,
    .sec_01 .img_14,
    .sec_01 .img_15,
    .sec_01 .img_16,
    .sec_01 .img_17,
    .sec_01 .img_18 {transform: scale(0.8);}
    .sec_01 .img_06 {transform: translate(100%,0) rotate(35deg) scale(0.8);}
    .sec_01 .img_07 {right: 25%;}
    .sec_01 .img_13 {left: 14%;}
    .sec_01 .img_04.ani {transform: translateY(-15px) scale(0.8);}
    .sec_01 .img_05.ani {transform: translateY(-15px) scale(0.8);}
    .sec_01 .img_06.ani {transform: translate(100%,0) rotate(20deg) scale(0.8);}
    .sec_01 .img_13.ani {transform: rotate(15deg) scale(0.8);}
    .sec_01 .img_14.ani {transform: rotate(15deg) scale(0.8);}
    .sec_01 [class^="ball_"] {transform: scale(0.6);}
    .sec_01 .ball_01,
    .sec_01 .ball_02,
    .sec_01 .ball_04,
    .sec_01 .ball_05,
    .sec_01 .ball_07,
    .sec_01 .ball_09 {transform-origin: left bottom;}
    .sec_01 .ball_03,
    .sec_01 .ball_06,
    .sec_01 .ball_08,
    .sec_01 .ball_10 {transform-origin: right bottom;}
}/* lg */
@media screen and (max-width:1024px) {
    .sec_01 .title_01 {transform: translate(-50%,-100%) scale(0.8);}
    .sec_01 .title_02 {transform: translate(-50%,-80%) scale(0.8);}
    .sec_01 .sub_title.on {transform: translate(-50%, 100%);}
    .sec_01 .img_04,
    .sec_01 .img_05,
    .sec_01 .img_07,
    .sec_01 .img_08,
    .sec_01 .img_09,
    .sec_01 .img_12,
    .sec_01 .img_13,
    .sec_01 .img_14,
    .sec_01 .img_15,
    .sec_01 .img_16,
    .sec_01 .img_17,
    .sec_01 .img_18 {transform: scale(0.7);}
    .sec_01 .img_06 {transform: translate(100%,0) rotate(35deg) scale(0.7);}
    .sec_01 .img_12 {top: 80vh;}
    .sec_01 .img_15 {top: 83vh;}
    .sec_01 .img_04.ani {transform: translateY(-15px) scale(0.7);}
    .sec_01 .img_05.ani {transform: translateY(-15px) scale(0.7);}
    .sec_01 .img_06.ani {transform: translate(100%,0) rotate(20deg) scale(0.7);}
    .sec_01 .img_13.ani {transform: rotate(15deg) scale(0.7);}
    .sec_01 .img_14.ani {transform: rotate(15deg) scale(0.7);}
    .sec_01 .ball_02 {left: 0%;}
    .sec_01 .ball_03 {right: 0%;}
    .sec_01 .ball_05 {left: 20%;}
    .sec_01 .ball_06 {right: 0%;}
    .sec_01 .ball_07 {left: -7%;}
    .sec_01 .ball_09 {left: 20%;}
    .sec_01 .ball_10 {right: -10%;}
}/* md */
@media screen and (max-width:767px) {
    .sec_01 .scorll {bottom: 5.125rem;}
    .sec_01 .inner {width: 100%;}
    .sec_01 .title_01 {transform: translate(-50%,-100%) scale(0.7);}
    .sec_01 .title_02 {transform: translate(-50%,-85%) scale(0.6);}
    .sec_01 .sub_title {font-size: 2.25rem;}
    .sec_01 .sub_title span {font-size: 3.25rem;}
    .sec_01 .sub_title.on {transform: translate(-50%, 25%);}
    .sec_01 .img_04,
    .sec_01 .img_05,
    .sec_01 .img_07,
    .sec_01 .img_08,
    .sec_01 .img_09,
    .sec_01 .img_12,
    .sec_01 .img_13,
    .sec_01 .img_14,
    .sec_01 .img_15,
    .sec_01 .img_16,
    .sec_01 .img_17,
    .sec_01 .img_18 {transform: scale(0.5);}
    .sec_01 .img_04 {top: 16vh;}
    .sec_01 .img_06 {top: 51vh; transform: translate(22%,0) rotate(35deg) scale(0.5);}
    .sec_01 .img_07 {right: 15%;}
    .sec_01 .img_08 {top: 10vh;}
    .sec_01 .img_13 {left: 8%; top: 44vh;}
    .sec_01 .img_14 {right: 0;}
    .sec_01 .img_15 {top: 83vh;}
    .sec_01 .img_04.ani {transform: translateY(-15px) scale(0.5);}
    .sec_01 .img_05.ani {transform: translateY(-15px) scale(0.5);}
    .sec_01 .img_06.ani {transform: translate(20%,0) rotate(20deg) scale(0.5);}
    .sec_01 .img_13.ani {transform: rotate(15deg) scale(0.5);}
    .sec_01 .img_14.ani {transform: rotate(15deg) scale(0.5);}
    .sec_01 .ball_01,
    .sec_01 .ball_02,
    .sec_01 .ball_04,
    .sec_01 .ball_05,
    .sec_01 .ball_07,
    .sec_01 .ball_09 {transform-origin: left top;}
    .sec_01 .ball_03,
    .sec_01 .ball_06,
    .sec_01 .ball_08,
    .sec_01 .ball_10 {transform-origin: right top;}
    .sec_01 .ball_05 {left: 5%;}
    .sec_01 .ball_06 {transform: scale(0.6) rotate(-15deg);}
}/* sm */
/* --------------------------------sec_01 end------------------------------ */


/* --------------------------------sec_02------------------------------ */
.sec_02 {width: 100%; background:url(../images/sec_02_bg.jpg) no-repeat top center/cover;}
.sec_02 .inner {display: flex; align-items: center; justify-content: center; max-width: 1580px;}
.sec_02 .img_wrap {position: relative; width: 70%; max-width: 739px; margin: 0 auto;  transform: scale(1);}
.sec_02 .img_wrap img {display: block; width: 100%; height: 100%;}
.sec_02 .img_wrap h2 {position: absolute; left: 14%; top: 14%; font-size: 3.25rem; color: #fff; font-weight: 900; line-height: 140%;}
.sec_02 .img_wrap h2:after {content: '';margin-left: .4rem;border-right: 2px solid #777;animation: cursor .9s infinite steps(2);}
.sec_02 [class^="img_"] {z-index: 10; background-size: 100% auto;background-position: center center;background-repeat: no-repeat;}
.sec_02 .img_01 {position: absolute; left: 0; top: 40vh; width: 125px; height: 122px;; background-image: url(../images/sec_02_ele_01.png);}
.sec_02 .img_02 {position: absolute; left: 10%; top: 70vh; width: 175px; height: 240px; background-image: url(../images/sec_02_ele_05.gif);}
.sec_02 .img_03 {position: absolute; right: 10%; top: 20vh; width: 190px; height: 180px; background-image: url(../images/sec_02_ele_06.gif);}
.sec_02 .img_04 {position: absolute; right: 0; top: 50vh; width: 108px; height: 120px; background-image: url(../images/sec_02_ele_04.png);}
@media screen and (max-width: 1800px) {
    .sec_02 .img_wrap {max-width: 600px;}
    .sec_02 .img_wrap h2 {font-size: 2.75rem;}
}/* xlg */
@media screen and (max-width:1024px) {
    .sec_02 .img_wrap h2 {font-size: 2.5rem;}
    .sec_02 .img_01 {top: 10vh;}
    .sec_02 .img_02 {left: 5%; top: 60vh;}
    .sec_02 .img_03 {right: 5%; top: 5vh;}
    .sec_02 .img_04 {top: 70vh;}
}/* md */
@media screen and (max-width:767px) {
    .sec_02 .img_wrap {width: 80%; max-width: 440px;}
    .sec_02 .img_wrap h2 {font-size: 2.25rem;}
    .sec_02 .img_01 {top: 10vh; transform-origin: left center; transform: scale(0.7);}
    .sec_02 .img_02 {left: 5%; top: 60vh; transform-origin: left center; transform: scale(0.7);}
    .sec_02 .img_03 {right: 5%; top: 5vh; transform-origin: right center; transform: scale(0.7);}
    .sec_02 .img_04 {top: 70vh; transform-origin: right center; transform: scale(0.7);}
}/* sm */
@media screen and (max-width:500px) {
    .sec_02 .inner {width: 100%;}
    .sec_02 .img_wrap {width: 100%;}
    .sec_02 .img_01 {left: 5%; top: 16vh;}
    .sec_02 .img_02 {left: 10%; top: 69vh;}
    .sec_02 .img_03 {right: 5%; top: 5vh;}
    .sec_02 .img_04 {right: 5%; top: 77vh;}
}/* xsm */
/* --------------------------------sec_02 end------------------------------ */


/* --------------------------------sec_03------------------------------ */
.sec_03 {display: flex; align-items: center; width: 100%; height: calc(var(--var, 1vh) * 100) !important;; background:url(../images/sec_02_bg.jpg) no-repeat top center/cover; overflow-x:hidden;overflow-y:hidden; }
.sec_03 #horiscroll {display:flex;flex-wrap:wrap;flex-direction:column; height: 65%;}
.sec_03 #horiscroll img {display: block; width: auto; height: 100%;}
@media screen and (min-width:767.1px) {
    .sec_03 #horiscroll .img_sm {display: none !important;}
}/* lg ~ */
@media screen and (max-width:767px) {
    .sec_03 #horiscroll .img_lg {display: none !important;}
}/* sm */
@media screen and (max-width:500px) {
    .sec_03 #horiscroll .img_lg {display: none !important;}
    .sec_03 #horiscroll {height: 62%;}
}/* sm */
/* --------------------------------sec_03 end------------------------------ */


/* --------------------------------sec_04------------------------------ */
.sec_04 {background:url(../images/sec_04_bg.jpg) no-repeat top center/cover;background-position:center;overflow-x:hidden;overflow-y:hidden;}
.sec_04 .inner {display: flex; justify-content: center; align-items: center; max-width: 1200px;}
.sec_04 .text_wrap {width: 100%; word-break: keep-all; transform: translateY(-5%);}
.sec_04 .title {position: relative; width: 30.25rem; height: 20rem; margin: 0 auto; background: url(../images/sec_04_logo_bg.png) no-repeat center center/100% auto; }
.sec_04 .title img {position: absolute; left: 50%; top: 50%; width: 80%; transform: translate(-52.5%,-52.5%);}
.sec_04 .title [class^="logo_ele_"] {position: absolute; width: 5.125rem;}
.sec_04 .title [class^="logo_ele_"] img {display: block; width: 100%;}
.sec_04 .title .logo_ele_01 {left: 38%; top: 52%;}
.sec_04 .title .logo_ele_02 {left: 55%; top: 67%;}
.sec_04 .title .logo_ele_03 {left: 72%; top: 82%;}
.sec_04 .title.on .logo_ele_01 {animation: title_move_03 0.5s 0.9s forwards ease-out;}
.sec_04 .title.on .logo_ele_02 {animation: title_move_03 0.5s 0.6s forwards ease-out;}
.sec_04 .title.on .logo_ele_03 {animation: title_move_03 0.5s 0.3s forwards ease-out;}

.sec_04 .text_de,
.sec_04 .text_mo {margin-top: 2rem; font-weight: 800;}
.sec_04 .text_de,
.sec_04 .text_mo,
.sec_04 .desc {line-height: 180%; text-align: center; font-size: 1.875rem; color: #555555;}
.sec_04 .underline {position: relative; z-index: 10;}
.sec_04 .underline::before {content: "";position: absolute; left: 0; bottom: 0; width: 0%; height: 60%; z-index: -1; background-color: #FFF7D9; transition: width 2s; transition-delay: 1s;}
.sec_04 .underline.on::before {width: 100%;}
@media screen and (min-width:767.1px) {
    .sec_04 .text_mo {display: none !important}
}/* md ~ */
@media screen and (max-width:1240px) {
    .sec_04 {background-position: top left;}
    .sec_04 .title {width: 24rem; height: 15.5rem;}
    .sec_04 .title [class^="logo_ele_"] {width: 4rem;}
    .sec_04 .text_de,
    .sec_04 .text_mo,
    .sec_04 .desc {font-size: 1.5rem}
}/* lg */
@media screen and (max-width:1024px) {
    .sec_04 .title {width: 22rem; height: 15.5rem;}
    .sec_04 .title [class^="logo_ele_"] {width: 3.5rem;}
    .sec_04 .title .logo_ele_02 {top: 65.5%;}
    .sec_04 .title .logo_ele_03 {top: 80%;}
    .sec_04 .text_de,
    .sec_04 .text_mo,
    .sec_04 .desc {font-size: 1.315rem}
}/* md */
@media screen and (max-width:767px) {
    .sec_04 {background:url(../images/sec_04_bg_mo.jpg) no-repeat center center/cover}
    .sec_04 .text_wrap {width: 100%;}
    .sec_04 .title {width: 20rem; height: 12.5rem;}
    .sec_04 .title [class^="logo_ele_"] {width: 3.25rem;}
    .sec_04 .title .logo_ele_02 {top: 68%;}
    .sec_04 .title .logo_ele_03 {top: 84.5%;}

    .sec_04 .text_de {display: none}
    .sec_04 .text_de,
    .sec_04 .text_mo,
    .sec_04 .desc {font-size: 1.5rem;}
    .sec_04 .underline::before {transition: width 1.2s; transition-delay: 1s;}
    .sec_04 .underline:nth-of-type(2):before {transition-delay: 1.5s;}
    .sec_04 .underline:nth-of-type(3):before {transition-delay: 2s;}
}/* sm */
/* --------------------------------sec_04 end------------------------------ */


/* --------------------------------sec_05------------------------------ */
.sec_05 {display: flex; align-items: center; height: auto; padding: 8.75rem 0; background:url(../images/sec_05_bg.jpg) no-repeat top center/cover;overflow-x:hidden;overflow-y:hidden;}
.sec_05 .inner {max-width: 1260px; height: auto;}
.sec_05 .title {font-size: 3.5rem; font-weight: 900; color: #ffffff;}
.sec_05 .flex_box {display: flex; justify-content: space-between; align-items: center; margin-top: 7.875rem;}
.sec_05 .ck_box {position: relative;  width: 30%; height: auto; padding-bottom: 4rem; background: #FFF48E; border-radius: 0.625rem;}
.sec_05 [class^="sub_title_"] {position: relative; height: 5rem; margin-top: -2.5rem; color: #ffffff; font-size: 1.875rem; font-weight: 800; line-height: 5rem; text-align: center;}
.sec_05 .sub_title_01 {background: url(../images/sec_05_title_01.png) no-repeat center bottom/auto 100%;}
.sec_05 .sub_title_02 {background: url(../images/sec_05_title_02.png) no-repeat center bottom/auto 100%;}
.sec_05 .sub_title_03 {background: url(../images/sec_05_title_03.png) no-repeat center bottom/auto 100%;}
.sec_05 [class^="sub_title_"]::after {content: ""; position: absolute; left: 50%; top: 50%;}
.sec_05 .sub_title_01::after {width: 110px; height: 52px; margin-top: -80px; margin-left: -98px; background: url(../images/sec_05_ele_01.png) no-repeat center center/100% auto; transform: rotate(0deg);}
.sec_05 .sub_title_02::after {width: 89px; height: 86px; margin-top: -80px; margin-left: 68px; background: url(../images/sec_05_ele_02.png) no-repeat center center/100% auto;  transform: rotate(0deg);}
.sec_05 .sub_title_03::after {width: 54px; height: 71px;  margin-top: -90px; background: url(../images/sec_05_ele_03.png) no-repeat center center/100% auto; transform: rotate(0deg);}
.sec_05 .sub_title_01.on::after {animation: title_move_01 1s infinite steps(2);}
.sec_05 .sub_title_02.on::after {animation: title_move_02 1s infinite steps(2);}
.sec_05 .sub_title_03.on::after {animation: title_move_01 1s infinite steps(2);}

.sec_05 .ck_box ul {margin: 2.5rem 0 0 10%;}
.sec_05 .ck_box li:not(:last-child) {margin-bottom: 1.625rem;}
.sec_05 .ck_wrap {position: relative;}
.sec_05 .ck_wrap input[type="checkbox"] {position: absolute; left: 0.2rem; top: 0.2rem; width: 1rem; height: 1rem; z-index: 0; appearance: none;}
.sec_05 .ck_wrap input[type="checkbox"] + label {padding-left: 2rem; cursor: pointer; font-size: 1.5rem; font-weight: 600;}
.sec_05 .ck_wrap input[type="checkbox"] + label:hover {color: #00827D;}
.sec_05 .ck_wrap input[type="checkbox"] + label span {position: absolute; left: 0px; top: 50%; width: 1.313rem; height: 1.313rem; cursor:pointer; box-sizing: border-box; background:url(../images/ico_check.svg) no-repeat center /auto 100%; transform: translateY(-50%);}
.sec_05 .ck_wrap input[type="checkbox"]:checked + label {font-weight: 800; color: #333333;}
.sec_05 .ck_wrap input[type="checkbox"]:checked + label span {background:url(../images/ico_check_on.svg) no-repeat center /auto 100%;}
.sec_05 .btn_comfirm {position: relative; display: block; width: 14.375rem; height: 4.375rem; margin: 4.375rem auto 0; background: url(../images/sec_05_btn.png) no-repeat center center/100% auto ;cursor: pointer; font-weight: 800; color: #00C89D; font-size: 1.625rem;}
.sec_05 .btn_comfirm.blink {animation: blink 2s infinite ease-in-out;}

/*타이틀 추가*/
.sec_05 .title_wrap {text-align: center; opacity: 0; transform: translateY(5rem); transition: opacity 0.8s, transform 0.8s;}
.sec_05 .title_wrap h3 {display: inline-block; margin-bottom: 1.5rem; padding: 1.25rem 2.625rem; background-color: #FFE072; border: 0.375rem solid #fff; border-radius: 6.25rem; font-size: 2rem; color: #444; font-weight: 900;}
.sec_05 .title_wrap h4 {margin-top: 0.75rem; font-size: 1.625rem; color: #F1F1F1; font-weight: 600; line-height: 150%;}
.sec_05 .title_wrap.on {opacity: 1; transform: translateY(0);}
@media screen and (max-width: 1240px) {
    .sec_05 {background-position: bottom left;}
    .sec_05 .title {font-size: 3rem;}
    .sec_05 [class^="sub_title_"] {font-size: 1.75rem;}
    .sec_05 .ck_box {width: 32%;}
    .sec_05 .ck_wrap input[type="checkbox"] + label {font-size: 1.315rem;}
}/* lg */
@media screen and (max-width: 1024px) {
    .sec_05 .title {font-size: 2.75rem;}
    .sec_05 [class^="sub_title_"] {font-size: 1.5rem;}
    .sec_05 .sub_title_01::after {width: 80px; height: 38px; margin-top: -60px;}
    .sec_05 .sub_title_02::after {width: 60px; height: 58px; margin-top: -60px;}
    .sec_05 .sub_title_03::after {width: 40px; height: 52px; margin-top: -70px;}
    .sec_05 .ck_wrap input[type="checkbox"] + label {font-size: 1.25rem;}
}/* md */
@media screen and (max-width: 900px) {
    .sec_05 .ck_box ul {margin: 2.5rem 0 0 7%;}
    .sec_05 .ck_wrap input[type="checkbox"] + label {font-size: 1.125rem;}
}/* md2 */
@media screen and (max-width:767px) {
    .sec_05 {padding: 6rem 0; background:url(../images/sec_05_bg_mo.jpg) no-repeat center center/cover;}
    .sec_05 .title {font-size: 2.25rem;}
    .sec_05 [class^="sub_title_"] {margin: 0px; font-size: 1.45rem; transform: translateY(-2rem);}
    .sec_05 .sub_title_01::after {width: 70px; height: 32px; margin-top: -50px; margin-left: -86px;}
    .sec_05 .sub_title_02::after {width: 52px; height: 50px; margin-left: 48px;}
    .sec_05 .sub_title_03::after {width: 34px; height: 44px; margin-top: -60px;}

    .sec_05 .flex_box {display: block; margin-top: 6rem;}
    .sec_05 .ck_box {width: 100%; max-width: 310px; margin: 0 auto; padding-bottom: 3rem;}
    .sec_05 .ck_box:not(:last-child) {margin-bottom: 6rem;}
    .sec_05 .ck_box ul {margin: 0 0 0 10%;}
    .sec_05 .ck_wrap input[type="checkbox"] + label {font-size: 1.315rem;}
    .sec_05 .btn_comfirm {width: 11.375rem; height: 3.375rem; font-size: 1.25rem;}
    .sec_05 .title_wrap h3 {padding: 1rem 2rem; font-size: 1.5rem;}
    .sec_05 .title_wrap h4 {font-size: 1.315rem;}
}/* sm */

/* hidden cont */
[class*="sec_05_"] {display: none;}
[class*="sec_05_"] .inner {display: flex; align-items: center; max-width: 1200px;}
.sec_05_cont_01 {background-color: #FFE897;}
.sec_05_cont_02 {background-color: #BBE2F3;}
.sec_05_cont_03 {background-color: #97F0DD;}
[class*="sec_05_"] .flex_wrap {display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 5rem 4.625rem; background: url(../images/sec_05_cont_bg.png) no-repeat center center/cover;-webkit-box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.1); box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.1)}
[class*="sec_05_"] .btn_comfirm {position: relative; display: block; width: 14.375rem; height: 4.375rem; background: url(../images/sec_05_cont_btn.png) no-repeat center center/100% auto ;cursor: pointer; font-weight: 800; color: #ffffff; font-size: 1.625rem; animation: blink 2s infinite ease-in-out;}
[class*="sec_05_"] .text_wrap {width: 62%;}
[class*="sec_05_"] .img_wrap {width: 34%;}
[class*="sec_05_"] .img_wrap img {display: block; width: 100%;}
[class*="sec_05_"] .title {margin-bottom: 1.5rem; font-size: 3.5rem; font-weight: 900; line-height: 145%;}
[class*="sec_05_"] .title .underline  {position: relative; z-index: 10;}
[class*="sec_05_"] .title .underline::before {content: "";position: absolute; left: 0; bottom: 0; width: 0%; height: 60%; z-index: -1; transition: width 1s;}
[class*="sec_05_"] .title .underline.on::before {width: 100%;}
.sec_05_cont_01 .title .underline::before {background-color: #DBFFE7;}
.sec_05_cont_01 .title .underline:nth-of-type(2):before {transition-delay: 0.8s;}
.sec_05_cont_02 .title .underline::before {background-color: #FCD6FF;}
.sec_05_cont_03 .title .underline::before {background-color: #FFF9BE;}
[class*="sec_05_"] .desc {margin-bottom: 3.625rem; line-height: 160%; font-size: 1.875rem; font-weight: 500; word-break: keep-all;}
@media screen and (min-width:767.1px) {
    [class*="sec_05_"] .text_mo {display: none;}
}/* md~ */
@media screen and (max-width:1200px) {
    [class*="sec_05_"] .title {font-size: 2.75rem;}
    [class*="sec_05_"] .desc {font-size: 1.625rem;}
}/* lg */
@media screen and (max-width:1024px) {
    [class*="sec_05_"] .flex_wrap {padding: 3rem;}
    [class*="sec_05_"] .title {font-size: 2.5rem;}
    [class*="sec_05_"] .desc {font-size: 1.5rem;}
    [class*="sec_05_"] .img_wrap {width: 40%;}
}/* md */
@media screen and (max-width:767px) {
    [class*="sec_05_"] {height: auto; padding: 4rem 0;}
    [class*="sec_05_"] .inner {height: auto;}
    [class*="sec_05_"] .flex_wrap {flex-wrap: wrap; padding: 2rem 1.5rem; background: url(../images/sec_05_cont_bg_mo.png) no-repeat top center/cover;}
    [class*="sec_05_"] .text_wrap {width: 100%;}
    [class*="sec_05_"] .text_inner_wrap {width: 100%; max-width: 280px; margin: 0 auto;}
    [class*="sec_05_"] .text_de {display: none;}
    .sec_05_cont_02 .title .underline:nth-of-type(2):before {transition-delay: 0.8s;}
    .sec_05_cont_03 .title .underline:nth-of-type(2):before {transition-delay: 0.8s;}
    [class*="sec_05_"] .img_wrap {width: 100%; max-width: 280px; margin: 5rem auto 0;}
    [class*="sec_05_"] .img_wrap img {display: block; width: 100%;}
}/* sm */
@media screen and (max-width:400px) {
    [class*="sec_05_"] .title {margin-bottom: 1rem; font-size: 1.75em;}
    [class*="sec_05_"] .desc {margin-bottom: 1.5rem; font-size: 1.25rem;}
    [class*="sec_05_"] .btn_comfirm {width: 11.375rem; height: 3.375rem; font-size: 1.25rem;}
    [class*="sec_05_"] .img_wrap {margin: 2rem auto 0;}
}/* xsm */
/* --------------------------------sec_05 end------------------------------ */


/* --------------------------------sec_06------------------------------ */
.sec_06 {height: auto; padding: 5.625rem 0 13.75rem; background:url(../images/sec_06_bg.jpg) no-repeat top center/cover; overflow:hidden;}
.sec_06 .inner {max-width: 1160px; height: auto;}
.sec_06 .inner::after {content: ""; position: absolute; left: 50%; bottom: -70vh; width: 370px; height: 238px; background: url(../images/envelope_entire.svg) no-repeat center center/cover; transform: translate(-150%, 35%) rotate(30deg); transition: bottom 0.5s;}
.sec_06 .inner.on::after {bottom: 0vh;}
.sec_06 .title {width: 27.75rem; padding: 0.75rem 1.25rem; border-radius: 10rem; background-color: #DAFFF6; color: #36C8B6; font-size: 1.25rem; font-weight: 600; opacity: 0.7; line-height: 140%;}
.sec_06 .logo {display: inline-block; width: 3.875rem; height: 2.625rem; margin-right: 0.875rem; background: url(../images/sec_06_logo.svg) no-repeat center center/100% auto; vertical-align: -0.875rem;}
.sec_06 .title span {display: inline-block; margin-right: 0.625rem; font-weight: 800; font-size: 1.5rem;}
.sec_06 .flex_wrap {position: relative; display: flex; justify-content: left; align-items: center; margin-top: 3.5rem;}
.sec_06 .flex_wrap.hide {opacity: 0 !important; pointer-events: none;}
.sec_06 .img_wrap {position: relative; width: 55%; padding-bottom: 47%; background: url(../images/sec_06_img_01.png) no-repeat center center/contain; z-index: 10;}
.sec_06 .text_wrap {position: absolute; right: 0; top: 50%; width: 50%; transform: translateY(-50%);  background: url(../images/sec_06_img_02.png) no-repeat center center/cover #ffffff; border: 1px solid #D2D2D2;}
.sec_06 .text_wrap:after {content: "";display: block;padding-bottom: 100%;}
.sec_06 .text_cont {position: absolute; left: 50%; top: 50%; width: 100%; transform: translate(-50%,-50%); text-align: center;}
.sec_06 .sub_title {margin-bottom: 1.875rem; color: #80DBD5; font-size: 2.25rem; font-weight: 700;}
.sec_06 .desc {margin-bottom: 4.375rem; color: #1BADA4; font-size: 3.375rem; font-weight: 900;}
.sec_06 .btn_comfirm {position: relative; display: block; width: 14.375rem; height: 4.375rem; margin: 0 auto; background: url(../images/sec_06_btn.png) no-repeat center center/100% auto; cursor: pointer; font-weight: 800; color: #ffffff; font-size: 1.625rem; animation: blink 2s infinite ease-in-out;}

.sec_06 .envelope_wrap {display: none; position: absolute; left: 50%; top: 50%; width: 100%; transform: translate(-50%, 0%); z-index: 10;}
.sec_06 .envelope_wrap .envelope {position: relative; width: 100%; max-width: 724px; margin: 0 auto;}
.sec_06 .envelope_wrap .envelope::before {content: ""; position: absolute; left: 0; top: 0; width: 100%; max-width: 724px; height: 0; padding-bottom: 41.75%; background: url(../images/envelope_cover.svg) no-repeat center bottom/contain; z-index: 4; transform:rotateX(0deg); transition: all ease-in-out 0.5s; transform-origin: center top;}
.sec_06 .envelope_wrap .envelope img {position: relative; display: block; width: 100%; z-index: 3; transition: transform 0.5s, opacity 0.5s;}
.sec_06 .envelope_wrap .envelope .envelope_bg {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #8be4d1; transition: transform 0.5s, opacity 0.5s;} 

.sec_06 .envelope_wrap .letter {position: absolute; left: 50%; top: 0; width: 100%; max-width: 724px; height: 90%; transform: translate(-50%, 0);  overflow: hidden; border: 1px solid #E3E3E3; background-color: #ffffff; transition: all ease-in-out 0.5s; overflow: hidden;}
.sec_06 .envelope_wrap .letter::after {content: ""; position: absolute; left: 3rem; bottom: 0.75rem; width: 216px; height: 130px; background: url(../images/sec_06_letter_img.png) no-repeat center center/100% auto; z-index: 3;}
.sec_06 .envelope_wrap .letter .text {padding: 3rem 3rem 0 3rem; z-index: 3;}
.sec_06 .envelope_wrap .letter h6 {margin-bottom: 2.375rem; color: #00827D; font-size: 1.75rem; font-weight: 900;}
.sec_06 .envelope_wrap .letter li {font-size: 1.375rem; font-weight: 500; line-height: 245%; border-bottom: 1px solid #e6ebf2;}
.sec_06 .envelope_wrap .letter li:first-child {border-top: 1px solid #e6ebf2;}
.sec_06 .envelope_wrap .letter li.empty {color: #ffffff;}
.sec_06 .envelope_wrap .letter .btn_go_sub {position: absolute; right: 3rem; bottom: 3rem; width: 14.375rem; height: 4.375rem; margin: 0 auto; text-align: center; line-height: 4.375rem; background: url(../images/sec_05_cont_btn.png) no-repeat center center/100% auto; cursor: pointer; font-weight: 800; color: #ffffff; font-size: 1.625rem;  animation: blink 2s infinite ease-in-out;}
/* envelope ani */
.sec_06 .envelope_wrap.flap .envelope:before{background: url(../images/envelope_cover.svg) no-repeat center bottom/contain; transform:rotateX(180deg); z-index:0;}
.sec_06 .envelope_wrap.up .letter {height: 610px; transform: translate(-50%, -33%);}
.sec_06 .envelope_wrap.hide .envelope img {transform: translateY(500px); opacity: 0;}
.sec_06 .envelope_wrap.hide .envelope .envelope_bg {transform: translateY(500px); opacity: 0;}
.sec_06 .envelope_wrap.hide .envelope:before {transform: rotateX(180deg) translateY(-500px); opacity: 0;}
@media screen and (max-width: 1200px) { 
    .sec_06 {background-position: right bottom;}
    .sec_06 .sub_title {margin-bottom: 1.5rem; font-size: 2rem;}
    .sec_06 .desc {margin-bottom: 4rem; font-size: 3rem;}

    .sec_06 .flex_wrap {margin-top: 0; transform: translateY(4rem);}
    .sec_06 .envelope_wrap .envelope,
    .sec_06 .envelope_wrap .letter {width: 600px;}
    .sec_06 .envelope_wrap .letter h6 {margin-bottom: 2rem; font-size: 1.5rem;}
    .sec_06 .envelope_wrap .letter li {font-size: 1.25rem;}
    .sec_06 .envelope_wrap .letter .btn_go_sub {bottom: 1.75rem; width: 11.375rem; height: 3.375rem; line-height: 3.375rem; font-size: 1.25rem;}

    .sec_06 .envelope_wrap.up .letter {height: 500px;}
    .sec_06 .envelope_wrap .letter::after {transform: scale(0.8); transform-origin: left bottom;}
}/* lg */

@media screen and (max-width: 1024px) { 
    .sec_06 {padding: 8rem 0 16rem;}
    .sec_06 .inner::after {width: 300px; height: 198px; background: url(../images/envelope_entire.svg) no-repeat center center/100% auto;}
    .sec_06 .inner.on::after {bottom: -8vh;}
    .sec_06 .sub_title {font-size: 1.5rem;}
    .sec_06 .desc {margin-bottom: 3rem; font-size: 2.5rem;}

    .sec_06 .envelope_wrap .envelope,
    .sec_06 .envelope_wrap .letter {width: 520px;}
    .sec_06 .envelope_wrap .letter h6 {margin-bottom: 1.5rem; font-size: 1.35rem;}
    .sec_06 .envelope_wrap .letter li {font-size: 1.15rem;}

    .sec_06 .envelope_wrap.up .letter {height: 440px; transform: translate(-50%, -22%);}
    .sec_06 .envelope_wrap .letter::after {transform: scale(0.6); transform-origin: left bottom;}
}/* md */
@media screen and (max-width:767px) {
    .sec_06 {padding: 5.625rem 0;}
    .sec_06 .inner::after {left: 50%; bottom: -60vh; width: 220px; height: 160px; background: url(../images/envelope_entire.svg) no-repeat center center/100% auto; transform: translate(-100%, 35%) rotate(30deg);}
    .sec_06 .inner.on::after {bottom: 18vh;}
    .sec_06 .title {margin: 0 auto;}
    .sec_06 .flex_wrap {justify-content: center; flex-wrap: wrap; flex-direction: column-reverse; transform: translateY(2rem);}
    .sec_06 .img_wrap {margin-top: -3rem; width: 350px; height: 300px; padding-bottom: 0; background-position: center top;}
    .sec_06 .text_wrap {position: static; width: 350px; height: 350px; padding-bottom: 0; transform: translateY(0);}
    .sec_06 .btn_comfirm {width: 11.375rem; height: 3.375rem; font-size: 1.25rem;}

    .sec_06 .envelope_wrap .envelope,
    .sec_06 .envelope_wrap .letter {width: 400px;}
    .sec_06 .envelope_wrap .letter::after {left: auto; right: -2.5rem; bottom: 1.5rem; transform: scale3d(-0.5, 0.5, 0.5); transform-origin: center bottom;}
    .sec_06 .envelope_wrap .letter .text {padding: 2rem 2rem 0rem 2rem;}
    .sec_06 .envelope_wrap .letter h6 {margin-bottom: 1.25rem; font-size: 1.25rem;}
    .sec_06 .envelope_wrap .letter li {font-size: 1rem; line-height: 220%;}
    .sec_06 .envelope_wrap .letter .btn_go_sub {right: auto; left: 2rem; bottom: 1.5rem;}
    .sec_06 .envelope_wrap.up .letter {height: 360px; transform: translate(-50%, -60%);}
}/* sm */
@media screen and (min-width:500.1px) {
    .sec_06 .envelope_wrap .letter .text_sm {display: none !important;}
}
@media screen and (max-width:500px) {
    .sec_06 .envelope_wrap .letter .text_lg {display: none !important;}
    .sec_06 .title {width: 25rem; font-size: 1.125rem;;}
    .sec_06 .title span {font-size: 1.25rem;}
    .sec_06 .img_wrap {width: 100%; height: 300px;}
    .sec_06 .text_wrap {width: 100%; height: 350px;}
    .sec_06 .envelope_wrap .envelope,
    .sec_06 .envelope_wrap .letter {width: 100%;}
}
@media screen and (max-width: 400px) {
    .sec_06 .envelope_wrap .letter li {line-height: 200%;}
    .sec_06 .envelope_wrap.up .letter {height: 332px;}
}
/* --------------------------------sec_06 end------------------------------ */


/* --------------------------------sec_06 modi------------------------------ */
.sec_06_modi {height: auto; padding: 10.625rem 0; background:url(../images/sec_06_modi_bg.jpg) no-repeat top center/cover; overflow:hidden;}
.sec_06_modi .inner {width: 100%;}
.sec_06_modi .slide_wrap {position: relative; width: 100%;}
.sec_06_modi .slide_wrap [class^="cont_"] {transform: scale(0.85); filter: blur(1px) saturate(50%); transition: all 0.5s;}
.sec_06_modi .slide_wrap .swiper-slide-active [class^="cont_"] {transform: scale(1); filter: blur(0) saturate(100%); transform-origin: top;}
.sec_06_modi .slide_wrap .text_box {opacity: 0;}
.sec_06_modi .slide_wrap .swiper-slide-active .text_box {opacity: 1;}
.sec_06_modi .slide_wrap .figure {width: 100%;}
.sec_06_modi .slide_wrap .swiper-slide-active figure {width: 90%;}
/*슬라이드 컨텐츠*/
.sec_06_modi .swiper-slide {position: relative; padding: 1rem 0;}
.sec_06_modi .swiper-slide figure {height: 0; padding-bottom: 53.5%; border: 8px solid #fff; background-size: cover; background-repeat: no-repeat; background-position: center; -webkit-box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.1); box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.1)}
.sec_06_modi .swiper-slide figure img {display: block; width: 100%;}
.sec_06_modi .swiper-slide .text_box {position: absolute; right: 0; top: 50%; min-width: 33rem; padding: 3.5rem 3rem; transform: translateY(-50%); box-sizing: border-box; border: 1px solid #D9D9D9; background-color: #fff;}
.sec_06_modi .swiper-slide .text_box h3 {margin-bottom: 0.75rem; font-size: 1.5rem; font-weight: 700; color: #999;}
.sec_06_modi .swiper-slide .text_box h2 {margin-bottom: 3rem; font-size: 2.75rem; font-weight: 900; line-height: 148%;}
.sec_06_modi .swiper-slide .text_box button,
.sec_06_modi .swiper-slide .text_box a {position: relative; display: inline-block; min-width: 14.375rem; height: 4.375rem; line-height: 4.375rem; padding: 0 2rem; text-align: center; background: url(../images/sec_06_modi_btn.png) no-repeat center center/ 100% auto; cursor: pointer; font-weight: 800;color: #fff;font-size: 1.625rem;}
/*슬라이드 버튼*/
.sec_06_modi .slide_wrap .btn_prev,
.sec_06_modi .slide_wrap .btn_next {position: absolute; top: 50%; width: 3.75rem; height: 3.75rem; transform: translateY(-50%); z-index: 10; cursor: pointer;}
.sec_06_modi .slide_wrap .btn_prev {left: 12%; background: url(../images/sec_06_modi_btn_prev.svg) no-repeat center center/100% auto;}
.sec_06_modi .slide_wrap .btn_next {right: 12%; background: url(../images/sec_06_modi_btn_next.svg) no-repeat center center/100% auto;}
.sec_06_modi .slide_wrap .swiper-button-disabled {display: none;}
@media screen and (max-width: 1600px){
    /*슬라이드 컨텐츠*/
    .sec_06_modi .swiper-slide .text_box {min-width: 28rem; padding: 3rem;}
    .sec_06_modi .swiper-slide .text_box h3 {font-size: 1.25rem;}
    .sec_06_modi .swiper-slide .text_box h2 {margin-bottom: 2rem; font-size: 2rem;}
    .sec_06_modi .swiper-slide .text_box button,
    .sec_06_modi .swiper-slide .text_box a {min-width: 11.375rem; height: 3.375rem; line-height: 3.375rem; font-size: 1.25rem;}
}/* xlg */
@media screen and (max-width: 1480px){
    /*슬라이드 컨텐츠*/
    .sec_06_modi .swiper-slide .text_box {min-width: 22rem; padding: 2rem;}
    .sec_06_modi .swiper-slide .text_box h3 {font-size: 1.125rem;}
    .sec_06_modi .swiper-slide .text_box h2 {margin-bottom: 1.75rem; font-size: 1.75rem;}
}/* lg */
@media screen and (max-width: 960px){
    /*슬라이드 컨텐츠*/
    .sec_06_modi .swiper-slide figure {border: 6px solid #fff;}
    .sec_06_modi .swiper-slide .text_box {min-width: 18rem; padding: 1.5rem;}
    .sec_06_modi .swiper-slide .text_box h3 {font-size: 1rem;}
    .sec_06_modi .swiper-slide .text_box h2 {margin-bottom: 1.55rem; font-size: 1.5rem;}
    /*슬라이드 버튼*/
    .sec_06_modi .slide_wrap .btn_prev,
    .sec_06_modi .slide_wrap .btn_next {width: 3rem; height: 3rem;}
    .sec_06_modi .slide_wrap .btn_prev {left: 10%}
    .sec_06_modi .slide_wrap .btn_next {right: 10%;}
}/* md */
@media screen and (max-width: 767px){
    .sec_06_modi {padding: 7.625rem 0;}
    .sec_06_modi .slide_wrap [class^="cont_"] {-webkit-box-shadow: 6px 6px 0px 0px rgba(0,0,0,0.1); box-shadow: 6px 6px 0px 0px rgba(0,0,0,0.1)}
    .sec_06_modi .slide_wrap .text_box {opacity: 1;}
    .sec_06_modi .slide_wrap .swiper-slide-active figure {width: 100%;}
    /*슬라이드 컨텐츠*/
    .sec_06_modi .swiper-slide figure {padding-bottom: 50%; border: none; box-shadow: none;}
    .sec_06_modi .swiper-slide .text_box {position: static; width: 100%; transform: translate(0,0); border-top: none;}
    /*슬라이드 버튼*/
    .sec_06_modi .slide_wrap .btn_prev,
    .sec_06_modi .slide_wrap .btn_next {width: 2rem; height: 2rem;}
    .sec_06_modi .slide_wrap .btn_prev {left: 8%;}
    .sec_06_modi .slide_wrap .btn_next {right: 8%;}
    .sec_06_modi .swiper-slide .text_box button,
    .sec_06_modi .swiper-slide .text_box a {min-width: auto; width: 100%; padding: 0;}
}/* sm */
/* --------------------------------sec_06 modi end------------------------------ */


/* --------------------------------sec_06 modi popup------------------------------ */
.pop_quest .in_layer_box {width: 92%; max-width: 600px; padding: 3.5rem 3rem; background:url(../images/sec_06_modi_popup_bg.jpg) no-repeat top center/cover;text-align: left;}
.pop_quest .title {margin-bottom: 1.5rem; font-size: 1.75rem; line-height: 142%; color: #00827D; font-weight: 800;}
.pop_quest .desc {margin-bottom: 3rem; font-size: 1.25rem; line-height: 200%;}
.pop_quest .btn {position: relative; display: inline-block; height: 4.375rem; padding: 0 2rem; line-height: 4.375rem;  text-align: center; background: url(../images/sec_06_modi_btn.png) no-repeat bottom right/ 100% auto; cursor: pointer; font-weight: 800;color: #fff;font-size: 1.625rem;}
@media screen and (max-width: 767px){
    .pop_quest .in_layer_box {padding: 2.5rem 2rem;}
    .pop_quest .title {margin-bottom: 1.25rem; font-size: 1.5rem}
    .pop_quest .desc {margin-bottom: 2rem; font-size: 1.125rem}
    .pop_quest .btn {height: 3.375rem; line-height: 3.375rem; font-size: 1.25rem;}
}
/* --------------------------------sec_06 modi popup end------------------------------ */



[id^="popupResult"] .in_layer_box {width: 92%; max-width: 1200px;}
[id^="popupResult"] .inner {display: flex; align-items: center; text-align: left;}
[id^="popupResult"] .flex_wrap {display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 5rem 4.625rem; background: url(../images/sec_05_cont_bg.png) no-repeat center center/cover;-webkit-box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.1); box-shadow: 8px 8px 0px 0px rgba(0,0,0,0.1)}
[id^="popupResult"] .btn_comfirm {position: relative; display: block; width: 14.375rem; height: 4.375rem; background: url(../images/sec_05_cont_btn.png) no-repeat center center/100% auto ;cursor: pointer; font-weight: 800; color: #ffffff; font-size: 1.625rem; animation: blink 2s infinite ease-in-out;}
[id^="popupResult"] .text_wrap {width: 62%;}
[id^="popupResult"] .img_wrap {width: 34%;}
[id^="popupResult"] .img_wrap img {display: block; width: 100%;}
[id^="popupResult"] .title {margin-bottom: 1.5rem; font-size: 3.5rem; font-weight: 900; line-height: 145%;}
[id^="popupResult"] .title .underline  {position: relative; z-index: 10;}
[id^="popupResult"] .title .underline::before {content: "";position: absolute; left: 0; bottom: 0; width: 0%; height: 60%; z-index: -1; transition: width 1s;}
[id^="popupResult"] .title .underline.on::before {width: 100%;}
#popupResult1 .title .underline::before {background-color: #DBFFE7;}
#popupResult1 .title .underline:nth-of-type(2):before {transition-delay: 0.8s;}
#popupResult2 .title .underline::before {background-color: #FCD6FF;}
#popupResult3 .title .underline::before {background-color: #FFF9BE;}
[id^="popupResult"] .desc {margin-bottom: 3.625rem; line-height: 160%; font-size: 1.875rem; font-weight: 500; word-break: keep-all;}
[id^="popupResult"] .pop_btn_close {position: absolute; right: 0; top: -2rem; width: 1.5rem; height: 1.5rem; background: url(../images/ico_close.svg) no-repeat center/100% auto;}
@media screen and (min-width:767.1px) {
    [id^="popupResult"] .text_mo {display: none;}
}/* md~ */
@media screen and (max-width:1200px) {
    [id^="popupResult"] .title {font-size: 2.75rem;}
    [id^="popupResult"] .desc {font-size: 1.625rem;}
}/* lg */
@media screen and (max-width:1024px) {
    [id^="popupResult"] .flex_wrap {padding: 3rem;}
    [id^="popupResult"] .title {font-size: 2.5rem;}
    [id^="popupResult"] .desc {font-size: 1.5rem;}
    [id^="popupResult"] .img_wrap {width: 40%;}
}/* md */
@media screen and (max-width:767px) {
    [id^="popupResult"] {height: auto; padding: 4rem 0;}
    [id^="popupResult"] .inner {height: auto;}
    [id^="popupResult"] .flex_wrap {flex-wrap: wrap; padding: 2rem 1.5rem; background: url(../images/sec_05_cont_bg_mo.png) no-repeat top center/cover;}
    [id^="popupResult"] .text_wrap {width: 100%;}
    [id^="popupResult"] .text_inner_wrap {width: 100%; max-width: 280px; margin: 0 auto;}
    [id^="popupResult"] .text_de {display: none;}
    #popupResult2 .title .underline:nth-of-type(2):before {transition-delay: 0.8s;}
    #popupResult3 .title .underline:nth-of-type(2):before {transition-delay: 0.8s;}
    [id^="popupResult"] .img_wrap {width: 100%; max-width: 280px; margin: 5rem auto 0;}
    [id^="popupResult"] .img_wrap img {display: block; width: 100%;}
}/* sm */
@media screen and (max-width:400px) {
    [id^="popupResult"] .title {margin-bottom: 1rem; font-size: 1.75em;}
    [id^="popupResult"] .desc {margin-bottom: 1.5rem; font-size: 1.25rem;}
    [id^="popupResult"] .btn_comfirm {width: 11.375rem; height: 3.375rem; font-size: 1.25rem;}
    [id^="popupResult"] .img_wrap {margin: 2rem auto 0;}
}/* xsm */


/* ------ani-------- */
@keyframes blink {
	0% {opacity:1;}
    10% {opacity:1;}
    40% {opacity:0;}
    90% {opacity:1;}
	100% {opacity:1;}
}

@keyframes scroll {
	0% {opacity: 0; transform: translateY(0px);}
    50% {opacity: 1;}
	100% {opacity: 0; transform: translateY(40px);}
}

@keyframes up {
	0% {opacity: 0; transform: translateY(0.45rem);}
    50% {opacity: 1;}
	100% {opacity: 0; transform: translateY(-0.45rem);}
}

@keyframes cursor {
    from {border-right: 2px solid rgba(255,255,255,0.1);}
    to {border-right: 2px solid rgba(255,255,255,1);}
}

@keyframes bounce_01 {
	0% {top: -200px;-webkit-animation-timing-function: ease-in;}
	20% {}
	40% {top: 13vh; -webkit-animation-timing-function: ease-out;}
	50% {top: 0vh; -webkit-animation-timing-function: ease-in;}
	60% {top: 13vh;  -webkit-animation-timing-function: ease-out;}
	70% {top: 5vh; -webkit-animation-timing-function: ease-in;}
    80% {top: 13vh;  -webkit-animation-timing-function: ease-out;}
    90% {top: 8vh; -webkit-animation-timing-function: ease-in;}
	100% {top: 13vh;  -webkit-animation-timing-function: ease-in;}
}
@media screen and (max-width: 1024px) {
    @keyframes bounce_01 {
        0% {top: -200px;-webkit-animation-timing-function: ease-in;}
        20% {}
        40% {top: 6vh; -webkit-animation-timing-function: ease-out;}
        50% {top: -6vh; -webkit-animation-timing-function: ease-in;}
        60% {top: 6vh;  -webkit-animation-timing-function: ease-out;}
        70% {top: 0vh; -webkit-animation-timing-function: ease-in;}
        80% {top: 6vh;  -webkit-animation-timing-function: ease-out;}
        90% {top: 3vh; -webkit-animation-timing-function: ease-in;}
        100% {top: 6vh;  -webkit-animation-timing-function: ease-in;}
    }
}/* md */
@media screen and (max-width: 767px) {
    @keyframes bounce_01 {
        0% {top: -200px;-webkit-animation-timing-function: ease-in;}
        20% {}
        40% {top: 8vh; -webkit-animation-timing-function: ease-out;}
        50% {top: -6vh; -webkit-animation-timing-function: ease-in;}
        60% {top: 8vh;  -webkit-animation-timing-function: ease-out;}
        70% {top: 0vh; -webkit-animation-timing-function: ease-in;}
        80% {top: 8vh;  -webkit-animation-timing-function: ease-out;}
        90% {top: 3vh; -webkit-animation-timing-function: ease-in;}
        100% {top: 8vh;  -webkit-animation-timing-function: ease-in;}
    }
}/* xs */

@keyframes bounce_02 {
    0% {top: -200px;-webkit-animation-timing-function: ease-in;}
    20% {}
    40% {top: 20vh; -webkit-animation-timing-function: ease-out;}
    50% {top: 7vh; -webkit-animation-timing-function: ease-in;}
    60% {top: 20vh;  -webkit-animation-timing-function: ease-out;}
    70% {top: 10vh; -webkit-animation-timing-function: ease-in;}
    80% {top: 20vh;  -webkit-animation-timing-function: ease-out;}
    90% {top: 12vh; -webkit-animation-timing-function: ease-in;}
    100% {top: 20vh;  -webkit-animation-timing-function: ease-in;}
}
@media screen and (max-width: 1024px) {
    @keyframes bounce_02 {
        0% {top: -200px;-webkit-animation-timing-function: ease-in;}
        20% {}
        40% {top: 12vh; -webkit-animation-timing-function: ease-out;}
        50% {top: 0vh; -webkit-animation-timing-function: ease-in;}
        60% {top: 12vh;  -webkit-animation-timing-function: ease-out;}
        70% {top: 6vh; -webkit-animation-timing-function: ease-in;}
        80% {top: 12vh;  -webkit-animation-timing-function: ease-out;}
        90% {top: 8vh; -webkit-animation-timing-function: ease-in;}
        100% {top: 12vh;  -webkit-animation-timing-function: ease-in;}
    }
}/* md */
@media screen and (max-width: 767px) {
    @keyframes bounce_02 {
        0% {top: -200px;-webkit-animation-timing-function: ease-in;}
        20% {}
        40% {top: 12vh; -webkit-animation-timing-function: ease-out;}
        50% {top: -6vh; -webkit-animation-timing-function: ease-in;}
        60% {top: 12vh;  -webkit-animation-timing-function: ease-out;}
        70% {top: 0vh; -webkit-animation-timing-function: ease-in;}
        80% {top: 12vh;  -webkit-animation-timing-function: ease-out;}
        90% {top: 3vh; -webkit-animation-timing-function: ease-in;}
        100% {top: 12vh;  -webkit-animation-timing-function: ease-in;}
    }
}/* sm */

@keyframes bounce_03 {
    0% {top: -200px;-webkit-animation-timing-function: ease-in;}
    20% {}
    40% {top: 45vh; -webkit-animation-timing-function: ease-out;}
    50% {top: 13vh; -webkit-animation-timing-function: ease-in;}
    60% {top: 45vh;  -webkit-animation-timing-function: ease-out;}
    70% {top: 28vh; -webkit-animation-timing-function: ease-in;}
    80% {top: 45vh;  -webkit-animation-timing-function: ease-out;}
    90% {top: 38vh; -webkit-animation-timing-function: ease-in;}
    100% {top: 45vh;  -webkit-animation-timing-function: ease-in;}
}
@media screen and (max-width: 767px) {
    @keyframes bounce_03 {
        0% {top: -200px;-webkit-animation-timing-function: ease-in;}
        20% {}
        40% {top: 68vh; -webkit-animation-timing-function: ease-out;}
        50% {top: 30vh; -webkit-animation-timing-function: ease-in;}
        60% {top: 68vh;  -webkit-animation-timing-function: ease-out;}
        70% {top: 45vh; -webkit-animation-timing-function: ease-in;}
        80% {top: 68vh;  -webkit-animation-timing-function: ease-out;}
        90% {top: 50vh; -webkit-animation-timing-function: ease-in;}
        100% {top: 68vh;  -webkit-animation-timing-function: ease-in;}
    }
}/* sm */

@keyframes bounce_04 {
	0% {top: -200px;-webkit-animation-timing-function: ease-in;}
	20% {}
	40% {top: 80vh; -webkit-animation-timing-function: ease-out;}
	50% {top: 50vh; -webkit-animation-timing-function: ease-in;}
	60% {top: 80vh;  -webkit-animation-timing-function: ease-out;}
	70% {top: 62vh; -webkit-animation-timing-function: ease-in;}
    80% {top: 80vh;  -webkit-animation-timing-function: ease-out;}
    90% {top: 72vh; -webkit-animation-timing-function: ease-in;}
	100% {top: 80vh;  -webkit-animation-timing-function: ease-in;}
}
@media screen and (max-width: 1024px) {
    @keyframes bounce_04 {
        0% {top: -200px;-webkit-animation-timing-function: ease-in;}
        20% {}
        40% {top: 66vh; -webkit-animation-timing-function: ease-out;}
        50% {top: 40vh; -webkit-animation-timing-function: ease-in;}
        60% {top: 66vh;  -webkit-animation-timing-function: ease-out;}
        70% {top: 55vh; -webkit-animation-timing-function: ease-in;}
        80% {top: 66vh;  -webkit-animation-timing-function: ease-out;}
        90% {top: 60vh; -webkit-animation-timing-function: ease-in;}
        100% {top: 66vh;  -webkit-animation-timing-function: ease-in;}
    }
}/* md */
@media screen and (max-width: 767px) {
    @keyframes bounce_04 {
        0% {top: -200px;-webkit-animation-timing-function: ease-in;}
        20% {}
        40% {top: 66vh; -webkit-animation-timing-function: ease-out;}
        50% {top: 30vh; -webkit-animation-timing-function: ease-in;}
        60% {top: 66vh;  -webkit-animation-timing-function: ease-out;}
        70% {top: 40vh; -webkit-animation-timing-function: ease-in;}
        80% {top: 66vh;  -webkit-animation-timing-function: ease-out;}
        90% {top: 55vh; -webkit-animation-timing-function: ease-in;}
        100% {top: 66vh;  -webkit-animation-timing-function: ease-in;}
    }
}/* sm */

@keyframes bounce_05 {
	0% {top: -200px;-webkit-animation-timing-function: ease-in;}
	20% {}
	40% {top: 78vh; -webkit-animation-timing-function: ease-out;}
	50% {top: 50vh; -webkit-animation-timing-function: ease-in;}
	60% {top: 78vh; -webkit-animation-timing-function: ease-out;}
	70% {top: 64vh; -webkit-animation-timing-function: ease-in;}
    80% {top: 78vh; -webkit-animation-timing-function: ease-out;}
    90% {top: 74vh; -webkit-animation-timing-function: ease-in;}
	100% {top: 78vh;  -webkit-animation-timing-function: ease-in;}
}
@media screen and (max-width: 1024px) {
    @keyframes bounce_05 {
        0% {top: -200px;-webkit-animation-timing-function: ease-in;}
        20% {}
        40% {top: 80vh; -webkit-animation-timing-function: ease-out;}
        50% {top: 50vh; -webkit-animation-timing-function: ease-in;}
        60% {top: 80vh; -webkit-animation-timing-function: ease-out;}
        70% {top: 64vh; -webkit-animation-timing-function: ease-in;}
        80% {top: 80vh; -webkit-animation-timing-function: ease-out;}
        90% {top: 74vh; -webkit-animation-timing-function: ease-in;}
        100% {top: 80vh;  -webkit-animation-timing-function: ease-in;}
    }
}/* md */
@media screen and (max-width: 767px) {
    @keyframes bounce_05 {
        0% {top: -200px;-webkit-animation-timing-function: ease-in;}
        20% {}
        40% {top: 82vh; -webkit-animation-timing-function: ease-out;}
        50% {top: 53vh; -webkit-animation-timing-function: ease-in;}
        60% {top: 82vh; -webkit-animation-timing-function: ease-out;}
        70% {top: 68vh; -webkit-animation-timing-function: ease-in;}
        80% {top: 82vh; -webkit-animation-timing-function: ease-out;}
        90% {top: 78vh; -webkit-animation-timing-function: ease-in;}
        100% {top: 82vh;  -webkit-animation-timing-function: ease-in;}
    }
}/* sm */

@keyframes bounce_06 {
	0% {top: -200px;-webkit-animation-timing-function: ease-in;}
	20% {}
	40% {top: 80vh; -webkit-animation-timing-function: ease-out;}
	50% {top: 50vh; -webkit-animation-timing-function: ease-in;}
	60% {top: 80vh;  -webkit-animation-timing-function: ease-out;}
	70% {top: 62vh; -webkit-animation-timing-function: ease-in;}
    80% {top: 80vh;  -webkit-animation-timing-function: ease-out;}
    90% {top: 72vh; -webkit-animation-timing-function: ease-in;}
	100% {top: 80vh;  -webkit-animation-timing-function: ease-in;}
}
@media screen and (max-width: 767px) {
    @keyframes bounce_06 {
        0% {top: -200px;-webkit-animation-timing-function: ease-in;}
        20% {}
        40% {top: 87vh; -webkit-animation-timing-function: ease-out;}
        50% {top: 50vh; -webkit-animation-timing-function: ease-in;}
        60% {top: 87vh;  -webkit-animation-timing-function: ease-out;}
        70% {top: 62vh; -webkit-animation-timing-function: ease-in;}
        80% {top: 87vh;  -webkit-animation-timing-function: ease-out;}
        90% {top: 72vh; -webkit-animation-timing-function: ease-in;}
        100% {top: 87vh;  -webkit-animation-timing-function: ease-in;}
    }
}/* sm */

@keyframes bounce_07 {
    0% {top: -200px;-webkit-animation-timing-function: ease-in;}
    20% {}
    40% {top: 42vh; -webkit-animation-timing-function: ease-out;}
    50% {top: 12vh; -webkit-animation-timing-function: ease-in;}
    60% {top: 42vh;  -webkit-animation-timing-function: ease-out;}
    70% {top: 22vh; -webkit-animation-timing-function: ease-in;}
    80% {top: 42vh;  -webkit-animation-timing-function: ease-out;}
    90% {top: 28vh; -webkit-animation-timing-function: ease-in;}
    100% {top: 42vh;  -webkit-animation-timing-function: ease-in;}
}
@media screen and (max-width: 767px) {
    @keyframes bounce_07 {
        0% {top: -200px;-webkit-animation-timing-function: ease-in;}
        20% {}
        40% {top: 44vh; -webkit-animation-timing-function: ease-out;}
        50% {top: 22vh; -webkit-animation-timing-function: ease-in;}
        60% {top: 44vh;  -webkit-animation-timing-function: ease-out;}
        70% {top: 32vh; -webkit-animation-timing-function: ease-in;}
        80% {top: 44vh;  -webkit-animation-timing-function: ease-out;}
        90% {top: 40vh; -webkit-animation-timing-function: ease-in;}
        100% {top: 44vh;  -webkit-animation-timing-function: ease-in;}
    }
}/* sm */

@keyframes bounce_08 {
	0% {top: -200px;-webkit-animation-timing-function: ease-in;}
	20% {}
	40% {top: 85vh; -webkit-animation-timing-function: ease-out;}
	50% {top: 50vh; -webkit-animation-timing-function: ease-in;}
	60% {top: 85vh;  -webkit-animation-timing-function: ease-out;}
	70% {top: 62vh; -webkit-animation-timing-function: ease-in;}
    80% {top: 85vh;  -webkit-animation-timing-function: ease-out;}
    90% {top: 72vh; -webkit-animation-timing-function: ease-in;}
	100% {top: 85vh;  -webkit-animation-timing-function: ease-in;}
}
@media screen and (max-width: 1024px) {
    @keyframes bounce_08 {
        0% {top: -200px;-webkit-animation-timing-function: ease-in;}
        20% {}
        40% {top: 70vh; -webkit-animation-timing-function: ease-out;}
        50% {top: 40vh; -webkit-animation-timing-function: ease-in;}
        60% {top: 70vh;  -webkit-animation-timing-function: ease-out;}
        70% {top: 55vh; -webkit-animation-timing-function: ease-in;}
        80% {top: 70vh;  -webkit-animation-timing-function: ease-out;}
        90% {top: 60vh; -webkit-animation-timing-function: ease-in;}
        100% {top: 70vh;  -webkit-animation-timing-function: ease-in;}
    }
}/* md */
@media screen and (max-width: 767px) {
    @keyframes bounce_08 {
        0% {top: -200px;-webkit-animation-timing-function: ease-in;}
        20% {}
        40% {top: 77vh; -webkit-animation-timing-function: ease-out;}
        50% {top: 40vh; -webkit-animation-timing-function: ease-in;}
        60% {top: 77vh;  -webkit-animation-timing-function: ease-out;}
        70% {top: 55vh; -webkit-animation-timing-function: ease-in;}
        80% {top: 77vh;  -webkit-animation-timing-function: ease-out;}
        90% {top: 60vh; -webkit-animation-timing-function: ease-in;}
        100% {top: 77vh;  -webkit-animation-timing-function: ease-in;}
    }
}/* sm */

@keyframes bounce_09 {
    0% {top: -200px;-webkit-animation-timing-function: ease-in;}
    20% {}
    40% {top: 12vh; -webkit-animation-timing-function: ease-out;}
    50% {top: 3vh; -webkit-animation-timing-function: ease-in;}
    60% {top: 12vh;  -webkit-animation-timing-function: ease-out;}
    70% {top: 7vh; -webkit-animation-timing-function: ease-in;}
    80% {top: 12vh;  -webkit-animation-timing-function: ease-out;}
    90% {top: 10vh; -webkit-animation-timing-function: ease-in;}
    100% {top: 12vh;  -webkit-animation-timing-function: ease-in;}
}
@media screen and (max-width: 1024px) {
    @keyframes bounce_09 {
        0% {top: -200px;-webkit-animation-timing-function: ease-in;}
        20% {}
        40% {top: 22vh; -webkit-animation-timing-function: ease-out;}
        50% {top: 3vh; -webkit-animation-timing-function: ease-in;}
        60% {top: 22vh;  -webkit-animation-timing-function: ease-out;}
        70% {top: 7vh; -webkit-animation-timing-function: ease-in;}
        80% {top: 22vh;  -webkit-animation-timing-function: ease-out;}
        90% {top: 10vh; -webkit-animation-timing-function: ease-in;}
        100% {top: 22vh;  -webkit-animation-timing-function: ease-in;}
    }
}/* md */
@media screen and (max-width: 767px) {
    @keyframes bounce_09 {
        0% {top: -200px;-webkit-animation-timing-function: ease-in;}
        20% {}
        40% {top: 20vh; -webkit-animation-timing-function: ease-out;}
        50% {top: 3vh; -webkit-animation-timing-function: ease-in;}
        60% {top: 20vh;  -webkit-animation-timing-function: ease-out;}
        70% {top: 7vh; -webkit-animation-timing-function: ease-in;}
        80% {top: 20vh;  -webkit-animation-timing-function: ease-out;}
        90% {top: 10vh; -webkit-animation-timing-function: ease-in;}
        100% {top: 20vh;  -webkit-animation-timing-function: ease-in;}
    }
}/* sm */

@keyframes bounce_10 {
    0% {top: -200px;-webkit-animation-timing-function: ease-in;}
    20% {}
    40% {top: 20vh; -webkit-animation-timing-function: ease-out;}
    50% {top: 7vh; -webkit-animation-timing-function: ease-in;}
    60% {top: 20vh;  -webkit-animation-timing-function: ease-out;}
    70% {top: 10vh; -webkit-animation-timing-function: ease-in;}
    80% {top: 20vh;  -webkit-animation-timing-function: ease-out;}
    90% {top: 12vh; -webkit-animation-timing-function: ease-in;}
    100% {top: 20vh;  -webkit-animation-timing-function: ease-in;}
}
@media screen and (max-width: 767px) {
    @keyframes bounce_10 {
        0% {top: -200px;-webkit-animation-timing-function: ease-in;}
        20% {}
        40% {top: 18vh; -webkit-animation-timing-function: ease-out;}
        50% {top: 7vh; -webkit-animation-timing-function: ease-in;}
        60% {top: 18vh;  -webkit-animation-timing-function: ease-out;}
        70% {top: 10vh; -webkit-animation-timing-function: ease-in;}
        80% {top: 18vh;  -webkit-animation-timing-function: ease-out;}
        90% {top: 12vh; -webkit-animation-timing-function: ease-in;}
        100% {top: 18vh;  -webkit-animation-timing-function: ease-in;}
    }
}/* sm */

@keyframes title_move_01 {
	0% {transform: rotate(0deg);}
	100% {transform: rotate(-15deg);}
}

@keyframes title_move_02 {
	0% {transform: rotate(0deg);}
	100% {transform: rotate(15deg);}
}

@keyframes title_move_03 {
    0% {transform: translate3d(0,0,0);}
    40% {transform: translate3d(0,8px,10px);}
    100% {transform: translate3d(0,0,0);}
}