* { -webkit-box-sizing: border-box; box-sizing: border-box; }

body { overflow-x: hidden; min-width: 320px; }

@media all and (max-width: 1280px) { html { font-size: 16px; } }

@media all and (max-width: 500px) { html { font-size: 14px; overflow-x: hidden; } }

@media screen and (min-width: 1040px) { .display_m { display: none; }
  .display_w { display: block; } }

@media all and (max-width: 1040px) { .display_m { display: block; }
  .display_w { display: none !important; } }

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .visual_area .title_copy > p > span:nth-child(1)::after { margin-top: 15px; }
  .time_box .head_title { width: 25%; }
  .time_box #timer { width: 73%; padding: 60px 20px; }
  .time_box #timer div { font-size: 55px; }
  .apply .inner > .con_wrap > ul > li p { font-size: 28px; }
  .btn_direct .tit { top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
  .visual_area .title_copy > h2 { width: 55%; } }

.slider { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }

img { max-width: 100%; }

.inner { width: 1200px; margin: auto; }

@media all and (max-width: 1400px) { .inner { width: 100%; max-width: inherit; padding: 0 50px; } }

@media all and (max-width: 500px) { .inner { padding: 0 20px; } }

h3.head_title { font-family: 'Noto Sans KR','loreal_m'; font-size: 50px; font-weight: 700; line-height: 150%; letter-spacing: -0.005em; }

@media all and (max-width: 1400px) { h3.head_title { font-size: 40px; } }

@media all and (max-width: 768px) { h3.head_title { font-size: 30px; } }

@media all and (max-width: 500px) { h3.head_title { font-size: 28px; } }

.contents { width: 100%; padding: 150px 0; }

@media all and (max-width: 1040px) { .contents { padding: 100px 0; } }

.num_style { font-family: 'Montserrat'; color: #3ae2d8; }

.mark_ye { color: #e3a535; }

.mark_gy { color: #737373; }

.font_wh { color: #fff; }

.font_bold { font-weight: 800 !important; }

header { display: block; background: #fff; position: fixed; left: 0; right: 0; top: 0; z-index: 100; }

header .inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; height: 90px; max-width: 1200px; margin: auto; }

@media all and (max-width: 1400px) { header .inner { padding: 0 50px; } }

@media all and (max-width: 1040px) { header .inner { height: 75px; } }

@media all and (max-width: 500px) { header .inner { height: 60px; padding: 0 15px 0 20px; } }

@media all and (max-width: 500px) { header .logo { width: 120px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding-top: 2px; } }

header .logo a { display: block; width: 146px; font-size: 0; }

header .gnb_wrap { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

header .gnb_wrap .btn_sns { display: block; width: 30px; height: 30px; text-indent: -9999px; font-size: 0; background: url("../images/sns_share.png") no-repeat center center; background-size: 25px; }

@media all and (max-width: 500px) { header .gnb_wrap .btn_sns { margin: 0; background-size: 20px; } }

header .gnb { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

@media all and (max-width: 1040px) { header .gnb { display: none; } }

header .gnb li { margin-right: 50px; }

header .gnb li a { font-size: 22px; font-weight: 500; }

.ground_wrap { position: relative; margin: auto; }

.visual_area { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; overflow-x: hidden; margin-top: 90px; padding-top: 152px; padding-bottom: 152px; background-color: #3ae2d8; }

@media all and (max-width: 1400px) { .visual_area { padding: 152px 0 110px; } }

@media all and (max-width: 1040px) { .visual_area { margin-top: 75px; overflow: hidden; padding: 152px 50px 110px 50px; } }

@media all and (max-width: 500px) { .visual_area { margin-top: 60px; padding: 124px 5px 90px 5px; } }

.visual_area::before { content: ''; opacity: 0; position: absolute; top: -30px; left: 604px; width: 150px; height: 150px; background-image: url("../images/deco/deco1.svg"); background-size: contain; background-repeat: no-repeat; -webkit-animation: float 3s ease-in-out infinite, fadeInOn 1.5s linear 1; animation: float 3s ease-in-out infinite, fadeInOn 1.5s linear 1; -webkit-animation-delay: 0, .5s; animation-delay: 0, .5s; }

@media all and (max-width: 1600px) { .visual_area::before { width: 120px; height: 120px; } }

@media all and (max-width: 1040px) { .visual_area::before { left: 35%; } }

@media all and (max-width: 768px) { .visual_area::before { top: -20px; height: 90px; width: 90px; } }

.visual_area::after { content: ''; opacity: 0; position: absolute; top: 245px; right: 244px; width: 103px; height: 103px; background-image: url("../images/deco/deco4.svg"); background-size: contain; background-repeat: no-repeat; -webkit-animation: float 3s ease-in-out infinite, fadeInOn 1.5s linear 1; animation: float 3s ease-in-out infinite, fadeInOn 1.5s linear 1; -webkit-animation-delay: 0, 2s; animation-delay: 0, 2s; }

@media all and (max-width: 1600px) { .visual_area::after { right: 5%; width: 90px; height: 90px; } }

@media all and (max-width: 1280px) { .visual_area::after { top: 200px; } }

@media all and (max-width: 1040px) { .visual_area::after { top: 200px; right: -30px; } }

@media all and (max-width: 768px) { .visual_area::after { width: 51px; height: 51px; right: -15px; top: 163px; } }

.visual_area .title_copy { position: relative; z-index: 9; text-align: center; }

.visual_area .title_copy > h2 { position: relative; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; margin: 0 auto; z-index: 99; font-family: 'loreal_b'; font-size: 132px; line-height: 140%; letter-spacing: -0.005em; }

@media all and (max-width: 1400px) { .visual_area .title_copy > h2 { font-size: 110px; } }

@media all and (max-width: 1040px) { .visual_area .title_copy > h2 { font-size: 48px; } }

.visual_area .title_copy > h2::before { content: ''; opacity: 0; position: absolute; top: 0px; left: -240px; z-index: 0; width: 312px; height: 225px; background-image: url("../images/deco/deco2.svg"); background-size: contain; background-repeat: no-repeat; -webkit-animation: float 3s ease-in-out infinite; animation: float 3s ease-in-out infinite; -webkit-animation-delay: .5s; animation-delay: .5s; }

@media all and (max-width: 1600px) { .visual_area .title_copy > h2::before { width: 250px; height: 200px; } }

@media all and (max-width: 1040px) { .visual_area .title_copy > h2::before { top: -80px; left: -200px; width: 200px; height: 150px; } }

@media all and (max-width: 768px) { .visual_area .title_copy > h2::before { left: -70px; width: 135px; height: 98px; } }

.visual_area .title_copy > h2::after { content: ''; position: absolute; top: -70px; right: -140px; z-index: 0; width: 290px; height: 167px; background-image: url("../images/deco/main-apply.svg"); background-size: contain; background-repeat: no-repeat; }

@media all and (max-width: 1600px) { .visual_area .title_copy > h2::after { right: -100px; width: 230px; height: 110px; } }

@media all and (max-width: 1040px) { .visual_area .title_copy > h2::after { top: -93px; right: -160px; } }

@media all and (max-width: 768px) { .visual_area .title_copy > h2::after { right: -77px; width: 155px; height: 88px; } }

@media all and (max-width: 500px) { .visual_area .title_copy > h2::after { top: -50px; right: -30px; width: 109px; height: 62px; } }

.visual_area .title_copy > p { position: relative; z-index: 9; margin: 36px 0 32px 0; font-size: 40px; line-height: 150%; letter-spacing: -0.005em; }

@media all and (max-width: 1040px) { .visual_area .title_copy > p { margin: 16px 0 38px 0; font-size: 30px; } }

@media all and (max-width: 500px) { .visual_area .title_copy > p { margin: 24px 0 36px 0; font-size: 20px; } }

.visual_area .title_copy > p::before { content: ''; opacity: 0; position: absolute; top: 95px; left: 40px; z-index: 0; width: 372px; height: 334px; background-image: url("../images/deco/deco5.svg"); background-size: contain; background-repeat: no-repeat; -webkit-animation: float 3s ease-in-out infinite; animation: float 3s ease-in-out infinite; -webkit-animation-delay: .5s; animation-delay: .5s; }

@media all and (max-width: 1600px) { .visual_area .title_copy > p::before { left: 0; width: 300px; height: 250px; } }

@media all and (max-width: 1040px) { .visual_area .title_copy > p::before { top: auto; bottom: -250px; right: -70px; } }

@media all and (max-width: 768px) { .visual_area .title_copy > p::before { width: 250px; height: 200px; top: 100px; left: -50px; } }

.visual_area .title_copy > p::after { content: ''; opacity: 0; position: absolute; top: -200px; z-index: 0; right: 83px; width: 333px; height: 340px; background-image: url("../images/deco/deco3.svg"); background-size: contain; background-repeat: no-repeat; -webkit-animation: float 3s ease-in-out infinite; animation: float 3s ease-in-out infinite; -webkit-animation-delay: 0s; animation-delay: 0s; }

@media all and (max-width: 1600px) { .visual_area .title_copy > p::after { top: -100px; right: 0; width: 200px; height: 210px; } }

@media all and (max-width: 1040px) { .visual_area .title_copy > p::after { top: 73px; right: -62px; width: 140px; } }

@media all and (max-width: 500px) { .visual_area .title_copy > p::after { right: -45px; } }

.visual_area .title_copy > p > span { position: relative; z-index: 9; display: block; }

.visual_area .title_copy > p > span + span { margin-top: 16px; }

@media all and (max-width: 768px) { .visual_area .title_copy > p > span + span { font-size: 23px; } }

@media all and (max-width: 500px) { .visual_area .title_copy > p > span + span { margin-top: 12px; font-size: 15px; } }

@media all and (max-width: 768px) { .visual_area .title_copy > p > span em { display: block; } }

.visual_area .title_copy.fade_in_up { -webkit-animation-delay: .5s; animation-delay: .5s; }

.visual_area .title_copy > a { 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; width: 366px; height: 100px; margin: 0 auto; border-radius: 50px; background-color: #fff; border: 10px solid #3ae2d8; -webkit-box-shadow: 1px 1px 20px rgba(0, 0, 0, 0.14); box-shadow: 1px 1px 20px rgba(0, 0, 0, 0.14); font-size: 32px; font-weight: 700; }

@media all and (max-width: 1400px) { .visual_area .title_copy > a { width: 320px; height: 80px; font-size: 25px; } }

@media all and (max-width: 1040px) { .visual_area .title_copy > a { position: relative; z-index: 99; width: 280px; padding: 10px; background-color: rgba(255, 255, 255, 0.3); border: none; }
  .visual_area .title_copy > a span { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; height: 100%; border-radius: 48px; background-color: #fff; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } }

@media all and (max-width: 768px) { .visual_area .title_copy > a { width: 270px; height: 75px; padding: 7px; } }

@media all and (max-width: 500px) { .visual_area .title_copy > a { width: 190px; height: 52px; font-size: 18px; } }

.visual_area .title_copy .display_w { display: inline-block; }

@media all and (max-width: 1040px) { .visual_area .title_copy .display_m { position: relative; z-index: 99; font-family: 'loreal_r'; } }

@media all and (max-width: 768px) { .visual_area .title_copy .display_m { font-size: 23px; } }

@media all and (max-width: 500px) { .visual_area .title_copy .display_m { font-size: 15px; } }

.marquee_wrap { position: relative; z-index: 99; overflow: hidden; width: 100%; height: 70px; margin-top: 100px; }

@media all and (max-width: 1400px) { .marquee_wrap { height: 65px; } }

@media all and (max-width: 1040px) { .marquee_wrap { height: auto; } }

@media all and (max-width: 500px) { .marquee_wrap { margin-top: 70px; } }

.marquee_group { position: absolute; overflow: hidden; width: 300%; height: 100%; -webkit-animation: marquee 20s linear infinite; animation: marquee 20s linear infinite; }

@media all and (max-width: 1040px) { .marquee_group { display: -webkit-box; display: -ms-flexbox; display: flex; position: static; width: 90%; margin: 0 auto; -webkit-animation: none; animation: none; height: auto; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; } }

.marquee_group > li { float: left; margin: 0 10px; padding: 21px 32px 17px 32px; font-family: 'loreal_m'; font-size: 30px; border-radius: 32px; background-color: #00cabf; color: #fff; border: solid 1px #00cabf; text-align: center; }

@media all and (max-width: 1400px) { .marquee_group > li { font-size: 25px; } }

@media all and (max-width: 1040px) { .marquee_group > li { margin: 5px; padding: 14px 30px; font-size: 18px; }
  .marquee_group > li.atM { display: none; } }

@media all and (max-width: 768px) { .marquee_group > li { padding: 8px 15px 10px 15px; font-size: 15px; } }

@-webkit-keyframes marquee { 0% { left: 0; }
  100% { left: -180%; } }

@keyframes marquee { 0% { left: 0; }
  100% { left: -180%; } }

.time_box { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; padding: 140px 0; background-color: #f9f9f9; overflow: hidden; }

@media all and (max-width: 1040px) { .time_box { padding: 60px 0 !important; } }

.time_box::before { content: ''; display: block; position: absolute; bottom: -20px; left: 50%; width: 345px; height: 228px; background-image: url("../images/deco/deco7.svg"); background-size: contain; background-repeat: no-repeat; -webkit-transform: translateX(-50%); transform: translateX(-50%); }

@media all and (max-width: 768px) { .time_box::before { bottom: 0; width: 250px; height: 130px; } }

.time_box .inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }

@media all and (max-width: 1400px) { .time_box .inner { width: 95%; padding: 0 60px 0 0; } }

@media all and (max-width: 1040px) { .time_box .inner { width: 100%; padding: 0 50px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; text-align: center; } }

@media all and (max-width: 500px) { .time_box .inner { padding: 0 20px; } }

.time_box #timer { display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; padding: 47px 75px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; background-color: #fff; border-radius: 20px; -webkit-box-shadow: 20px 30px 50px 10px rgba(0, 0, 0, 0.1); box-shadow: 20px 30px 50px 10px rgba(0, 0, 0, 0.1); gap: 24px; }

@media all and (max-width: 1400px) { .time_box #timer { padding: 38px 68px; } }

@media all and (max-width: 1040px) { .time_box #timer { margin-top: 47px; } }

@media all and (max-width: 768px) { .time_box #timer { padding: 24px 0; width: 100%; } }

@media all and (max-width: 500px) { .time_box #timer { padding: 32px 0; width: 100%; gap: 8px; } }

.time_box #timer::before { content: ''; display: block; position: absolute; top: -80px; right: -120px; z-index: 1; width: 176px; height: 183px; background-image: url("../images/deco/bell.svg"); background-size: contain; background-repeat: no-repeat; -webkit-animation: bell 1s ease-in-out 4; animation: bell 1s ease-in-out 4; }

@media all and (max-width: 1400px) { .time_box #timer::before { right: -80px; width: 140px; height: 160px; } }

@media all and (max-width: 1040px) { .time_box #timer::before { right: -10px; width: 140px; height: 160px; } }

@media all and (max-width: 768px) { .time_box #timer::before { top: -50px; width: 80px; height: 100px; } }

@media all and (max-width: 500px) { .time_box #timer::before { top: -30px; width: 60px; height: 80px; } }

.time_box #timer div { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 128px; height: 128px; font-size: 67px; font-weight: 700; line-height: 100%; letter-spacing: -0.005em; font-family: 'loreal_r'; background: url("../images/timerbg.svg") no-repeat center top; background-size: 100% auto; }

@media all and (max-width: 1400px) { .time_box #timer div { font-size: 55px; } }

@media all and (max-width: 768px) { .time_box #timer div { padding: 0 20px; font-size: 35px; width: 100px; height: 100px; } }

@media all and (max-width: 500px) { .time_box #timer div { padding: 0 10px; font-size: 24px; width: 70px; height: 70px; } }

.time_box #timer div > span { display: block; margin-top: 2px; font-size: 16px; line-height: normal; }

@media all and (max-width: 768px) { .time_box #timer div > span { font-size: 14px; } }

@media all and (max-width: 500px) { .time_box #timer div > span { font-size: 10px; } }

.btn_direct { display: -webkit-box; display: -ms-flexbox; display: flex; width: 250px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: fixed; right: 20px; bottom: 20px; z-index: 100; }

@media all and (max-width: 1040px) { .btn_direct { width: 150px; right: 20px; bottom: 20px; } }

@media all and (max-width: 768px) { .btn_direct { width: 100px; } }

.btn_direct .tit { position: absolute; left: 0; width: 100%; height: 100%; color: #fff; font-size: 26px; font-weight: 700; 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; z-index: 1; text-align: center; line-height: 1.3; }

@media all and (max-width: 1040px) { .btn_direct .tit { font-size: 20px; } }

@media all and (max-width: 768px) { .btn_direct .tit { font-size: 17px; } }

.btn_direct .hall { width: 176px; height: 176px; background-color: #e3a535; display: block; border-radius: 50%; -webkit-box-shadow: 20px 20px 35px rgba(0, 0, 0, 0.15); box-shadow: 20px 20px 35px rgba(0, 0, 0, 0.15); }

@media all and (max-width: 1040px) { .btn_direct .hall { width: 150px; height: 150px; } }

@media all and (max-width: 768px) { .btn_direct .hall { width: 100px; height: 100px; } }

@-webkit-keyframes bell { 0% { -webkit-transform: rotate(0); transform: rotate(0); }
  50% { -webkit-transform: rotate(10deg); transform: rotate(10deg); }
  100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } }

@keyframes bell { 0% { -webkit-transform: rotate(0); transform: rotate(0); }
  50% { -webkit-transform: rotate(10deg); transform: rotate(10deg); }
  100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } }

.introduce .wrap_head { margin-bottom: 30px; }

@media all and (max-width: 500px) { .introduce .wrap_head { margin-bottom: 20px; } }

.introduce .inner > ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; width: 100%; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }

.introduce .inner > ul > li { position: relative; width: 48.7%; height: 450px; margin-top: 30px; padding: 40px; background-color: #f9f9f9; border-radius: 15px; }

@media all and (max-width: 1040px) { .introduce .inner > ul > li { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; height: auto; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } }

@media all and (max-width: 768px) { .introduce .inner > ul > li { height: 220px; padding: 30px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } }

@media all and (max-width: 500px) { .introduce .inner > ul > li { margin: 10px 0; padding: 20px; } }

.introduce .inner > ul > li img { position: absolute; bottom: 40px; right: 40px; }

@media all and (max-width: 1280px) { .introduce .inner > ul > li img { width: 250px; } }

@media all and (max-width: 1040px) { .introduce .inner > ul > li img { position: static; top: auto; bottom: auto; right: auto; left: auto; width: 200px; } }

@media all and (max-width: 768px) { .introduce .inner > ul > li img { position: absolute; right: 30px; bottom: 30px; width: 140px; } }

@media all and (max-width: 500px) { .introduce .inner > ul > li img { width: 120px; bottom: 20px; right: 20px; } }

.introduce .inner > ul > li h4 { font-size: 24px; margin-bottom: 30px; }

@media all and (max-width: 1040px) { .introduce .inner > ul > li h4 { margin-bottom: 20px; font-size: 22px; } }

@media all and (max-width: 768px) { .introduce .inner > ul > li h4 { font-size: 17px; } }

.introduce .inner > ul > li p { font-size: 24px; font-weight: 500; line-height: 1.4; }

@media all and (max-width: 1040px) { .introduce .inner > ul > li p { font-size: 20px; } }

@media all and (max-width: 768px) { .introduce .inner > ul > li p { font-size: 17px; }
  .introduce .inner > ul > li p .ws { white-space: nowrap; } }

.introduce .inner > ul > li:nth-child(2n) { position: relative; top: 75px; }

@media all and (max-width: 1040px) { .introduce .inner > ul > li:nth-child(2n) { top: 0; } }

@media all and (max-width: 500px) { .introduce .inner > ul > li:last-child { padding: 20px 20px 230px 20px; } }

.apply { padding: 100px 0 0 0; }

.apply .wrap_head { padding-bottom: 40px; border-bottom: 1px solid #000; }

@media all and (max-width: 768px) { .apply .wrap_head { padding-bottom: 20px; } }

.apply .inner > .con_wrap { padding-top: 50px; }

@media all and (max-width: 768px) { .apply .inner > .con_wrap { padding-top: 40px; } }

.apply .inner > .con_wrap > ul > li { display: -webkit-box; display: -ms-flexbox; display: flex; margin: 40px 0; -ms-flex-wrap: wrap; flex-wrap: wrap; }

@media all and (max-width: 768px) { .apply .inner > .con_wrap > ul > li { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; margin: 25px 0; } }

.apply .inner > .con_wrap > ul > li:first-child { margin: 0 0 40px 0; }

@media all and (max-width: 768px) { .apply .inner > .con_wrap > ul > li:first-child { margin: 0 0 25px 0; } }

.apply .inner > .con_wrap > ul > li h4 { width: 17%; font-size: 30px; font-weight: 700; line-height: 1.5; }

@media all and (max-width: 1040px) { .apply .inner > .con_wrap > ul > li h4 { font-size: 22px; } }

@media all and (max-width: 768px) { .apply .inner > .con_wrap > ul > li h4 { width: 100%; margin-bottom: 20px; } }

.apply .inner > .con_wrap > ul > li p { font-size: 30px; line-height: 1.5; }

.apply .inner > .con_wrap > ul > li > p { width: 83%; }

@media all and (max-width: 1040px) { .apply .inner > .con_wrap > ul > li > p { font-size: 22px; } }

@media all and (max-width: 768px) { .apply .inner > .con_wrap > ul > li > p { width: 100%; font-size: 18px; } }

.apply .inner > .con_wrap > ul > li > .con_wrap { width: 83%; }

@media all and (max-width: 768px) { .apply .inner > .con_wrap > ul > li > .con_wrap { width: 100%; } }

.apply .con_wrap > p { margin-left: 10px; }

.apply .mark_ye { margin-top: 5px; font-size: 24px !important; }

@media all and (max-width: 1040px) { .apply .mark_ye { font-size: 20px !important; } }

@media all and (max-width: 1040px) { .apply .mark_ye { display: block; } }

@media all and (max-width: 768px) { .apply .mark_ye { display: block; font-size: 16px !important; } }

.apply li > span.mark_ye { margin-left: 5px; font-size: 30px !important; line-height: 1; }

@media all and (max-width: 1040px) { .apply li > span.mark_ye { display: inline-block; } }

.mozip { margin-top: 24px; margin-bottom: 30px; display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; }

@media all and (max-width: 1040px) { .mozip { display: block; margin-top: 18px; } }

.mozip dl { position: relative; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; background: #F9F9F9; border-radius: 0 0 20px 20px; }

.mozip dl + dl { margin-left: 20px; }

@media all and (max-width: 1040px) { .mozip dl + dl { margin-left: 0; margin-top: 24px; } }

.mozip dt { font-weight: 500; font-size: 30px; line-height: 150%; text-align: center; letter-spacing: -0.005em; padding: 12px 0 15px 0; background: #3AE2D8; border-radius: 20px 20px 0 0; }

@media all and (max-width: 768px) { .mozip dt { font-size: 24px; } }

@media all and (max-width: 500px) { .mozip dt { font-size: 22px; } }

.mozip dd { padding: 30px 30px 60px 30px; }

@media all and (max-width: 500px) { .mozip dd { padding-bottom: 100px; } }

.mozip ul.type2 { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }

@media all and (max-width: 768px) { .mozip ul.type2 { display: block; } }

.mozip ul.type2 li { width: 100%; }

.mozip ul.type2 li.half { width: 50%; }

@media all and (max-width: 768px) { .mozip ul.type2 li.half { width: 100%; } }

.mozip li { position: relative; font-size: 20px; padding-left: 24px; line-height: 150%; letter-spacing: -0.005em; margin-bottom: 12px; }

@media all and (max-width: 500px) { .mozip li { font-size: 18px; } }

.mozip li:before { content: ""; position: absolute; top: 13px; left: 0; width: 8px; height: 8px; border-radius: 50%; background: #D9D9D9; }

.mozip .bt { position: absolute; right: 30px; bottom: 30px; font-weight: 700; font-size: 18px; line-height: 150%; letter-spacing: -0.005em; -webkit-text-decoration-line: underline; text-decoration-line: underline; color: #000; }

@media all and (max-width: 500px) { .mozip .bt { bottom: 45px; } }

.mozip .bt:after { content: ""; display: inline-block; vertical-align: middle; margin: -4px 0 0 20px; width: 28px; height: 19px; background: url("../images/arrow3.svg") no-repeat; background-size: 100% auto; }

.layer_exp, .layer_notice { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 200; background: rgba(0, 0, 0, 0.55); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; height: 100%; padding: 20px; }

@media all and (max-width: 768px) { .layer_exp { padding: 0; } }

.layer_core { position: relative; width: 100%; max-width: 1220px; background-color: #FFF; padding: 53px 35px 30px 40px; }

@media all and (max-width: 768px) { .layer_core { padding: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: 100%; } }

.layer_core .close { position: absolute; top: 28px; right: 28px; }

@media all and (max-width: 768px) { .layer_core .close { position: relative; top: 0; right: 0; padding-right: 28px; height: 54px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border-bottom: solid 1px #E9E9E9; } }

.layer_core .close .bt { width: 24px; height: 24px; background: url("../images/close.svg") no-repeat center; background-size: 22px auto; text-indent: -9999em; }

.layer_core .ltitle { font-weight: 700; font-size: 24px; line-height: 150%; letter-spacing: -0.005em; }

@media all and (max-width: 768px) { .layer_core .ltitle { padding: 24px 0 6px 30px; font-size: 18px; } }

.layer_core .exp { display: -webkit-box; display: -ms-flexbox; display: flex; border-bottom: solid 1px #D9D9D9; }

@media all and (max-width: 768px) { .layer_core .exp { display: block; padding-bottom: 16px; } }

.layer_core .exp:first-child { border-top: solid 1px #D9D9D9; }

@media all and (max-width: 768px) { .layer_core .exp:first-child { border-top-width: 0; } }

.layer_core .exp:not(:first-of-type) .stit { display: none; }

@media all and (max-width: 768px) { .layer_core .exp:not(:first-of-type) .stit { display: block; } }

.layer_core .exp dt { width: 21%; padding: 10px 36px 10px 0; font-weight: 500; font-size: 20px; line-height: 150%; letter-spacing: -0.005em; }

@media all and (max-width: 768px) { .layer_core .exp dt { width: 100%; padding: 16px 0 12px 0; font-size: 16px; } }

.layer_core .exp dt .sm { font-size: 0.8em; }

.layer_core .exp dd { position: relative; width: 42%; padding: 10px 56px 10px 0; }

.layer_core .exp dd + dd { width: 37%; padding-right: 0; }

@media all and (max-width: 768px) { .layer_core .exp dd { width: 100%; padding: 0; }
  .layer_core .exp dd + dd { width: 100%; margin-top: 24px; } }

.layer_core .exp .stit { position: absolute; top: -30px; font-size: 16px; line-height: 150%; letter-spacing: -0.005em; color: #424242; }

@media all and (max-width: 768px) { .layer_core .exp .stit { position: relative; top: auto; margin-bottom: 8px; font-size: 12px; } }

.layer_core .exp .txt { font-size: 18px; line-height: 150%; letter-spacing: -0.005em; }

@media all and (max-width: 768px) { .layer_core .exp .txt { font-size: 16px; } }

.layer_core .exp .txt + .txt { margin-top: 4px; }

.layer_scroll { padding: 38px 16px 38px 0; max-height: 60vh; overflow-y: auto; scrollbar-3dlight-color: #FFF; scrollbar-arrow-color: #d3d2d2; scrollbar-track-color: #FFF; scrollbar-darkshadow-color: #FFF; scrollbar-face-color: #d3d2d2; scrollbar-highlight-color: #d3d2d2; scrollbar-shadow-color: #d3d2d2; }

@media all and (max-width: 768px) { .layer_scroll { max-height: none; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; padding: 0 30px 30px 30px; } }

.layer_scroll::-webkit-scrollbar { width: 8px; }

.layer_scroll::-webkit-scrollbar-track { background-color: #D9D9D9; border-radius: 4px; }

.layer_scroll::-webkit-scrollbar-track-piece { background-color: transparent; }

.layer_scroll::-webkit-scrollbar-thumb { background-color: #424242; border-radius: 4px; }

.layer_scroll::-webkit-scrollbar-corner { background-color: transparent; }

.layer_scroll::-webkit-resizer { background-color: transparent; }

.layer_btn { position: relative; text-align: center; }

@media all and (max-width: 768px) { .layer_btn { padding: 0 30px 44px 30px; } }

.layer_btn:before { content: ""; position: absolute; right: 16px; bottom: -30px; left: 0; height: 122px; background: -webkit-gradient(linear, left top, left bottom, color-stop(-36.07%, rgba(255, 255, 255, 0)), color-stop(25.82%, #FFFFFF)); background: linear-gradient(180deg, rgba(255, 255, 255, 0) -36.07%, #FFFFFF 25.82%); }

@media all and (max-width: 768px) { .layer_btn:before { right: 0; bottom: 0; height: 120px; } }

.layer_btn .bt { position: relative; display: inline-block; height: 52px; line-height: 52px; background: #3AE2D8; border-radius: 50px; padding: 0 84px; font-weight: 700; font-size: 20px; letter-spacing: -0.005em; }

@media all and (max-width: 768px) { .layer_btn .bt { padding: 0; display: block; } }

.layer_notice_core { position: relative; width: 398px; background-color: #000; border: 2px solid #FFF; padding: 80px 20px; text-align: center; }

@media all and (max-width: 500px) { .layer_notice_core { width: 100%; padding: 50px 20px; } }

.layer_notice_core p { color: #FFF; }

.layer_notice_core .close { position: absolute; top: 28px; right: 28px; }

@media all and (max-width: 500px) { .layer_notice_core .close { top: 15px; right: 15px; } }

.layer_notice_core .close .bt { width: 24px; height: 24px; background: url("../images/close_w.svg") no-repeat center; background-size: 22px auto; text-indent: -9999em; }

@media all and (max-width: 500px) { .layer_notice_core .close .bt { background-size: 15px auto; } }

.layer_notice_core .ltitle { font-weight: 700; font-size: 24px; line-height: 150%; letter-spacing: -0.005em; margin-bottom: 56px; }

@media all and (max-width: 500px) { .layer_notice_core .ltitle { font-size: 18px; margin-bottom: 40px; } }

.layer_notice_core .ltitle .sm { display: block; font-size: 0.85em; line-height: 150%; margin-top: 10px; }

.layer_notice_core .notice_t1, .layer_notice_core .notice_t2 { font-size: 20px; line-height: 150%; letter-spacing: -0.005em; }

.layer_notice_core .notice_t1 { font-weight: 500; margin-bottom: 4px; }

@media all and (max-width: 500px) { .layer_notice_core .notice_t1 { font-size: 18px; } }

.layer_notice_core .notice_t2 { font-weight: 300; }

@media all and (max-width: 500px) { .layer_notice_core .notice_t2 { font-size: 16px; } }

.layer_notice_core .notice_t2 + .notice_t1 { margin-top: 30px; }

.layer_notice_core .notice_t2 + .notice_t2 { margin-top: 8px; }

@media all and (max-width: 1280px) { .qa_wrap #Accordion_wrap { margin-bottom: 50px; }
  .que span { font-size: 22px; }
  .anw .cont { padding-left: 130px; } }

.process_steps { width: 100%; }

.process_steps ol { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 24px; margin-top: 50px; margin-bottom: 30px; }

@media all and (max-width: 1040px) { .process_steps ol { margin-top: 23px; gap: 15px; } }

@media all and (max-width: 768px) { .process_steps ol { gap: 0; margin-top: 0; } }

.process_steps li { position: relative; width: calc((100% - 24px * 3) / 4); height: 376px; background: #F9F9F9; border-radius: 20px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; text-align: center; padding-top: 68px; }

@media all and (max-width: 1040px) { .process_steps li { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: calc((100% - 15px) / 2); height: 167px; margin-top: 19px; padding-left: 24px; padding-top: 0; text-align: left; } }

@media all and (max-width: 768px) { .process_steps li { width: 100%; } }

@media all and (max-width: 1040px) { .process_steps .ico { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); right: 24px; } }

@media all and (max-width: 500px) { .process_steps .ico { right: 16px; } }

.process_steps .ico img { width: 120px; }

@media all and (max-width: 500px) { .process_steps .ico img { width: 100px; } }

.process_steps .t1 { font-weight: 500; font-size: 24px; line-height: 150%; letter-spacing: -0.005em; height: 72px; margin-top: 16px; }

@media all and (max-width: 1040px) { .process_steps .t1 { font-size: 18px; height: 54px; margin-top: 0; } }

.process_steps .t2 { font-weight: 500; font-size: 20px; line-height: 150%; letter-spacing: -0.005em; color: #424242; margin-top: 16px; }

.process_steps .t2 .sm { display: block; font-size: 14px; }

@media all and (max-width: 1040px) { .process_steps .t2 { font-size: 14px; margin-top: 8px; } }

.event { overflow-x: hidden; }

.event .recruiting { width: 100%; background-color: #000; overflow-x: hidden; }

@media all and (max-width: 768px) { .event .recruiting { overflow: hidden; } }

.event .recruiting .inner { position: relative; }

.event .recruiting .inner .img_tit { position: relative; width: 100%; margin: 0 auto; }

.event .recruiting .inner .img_tit img { display: block; margin: 0 auto; }

.event .recruiting .inner > .con_wrap { padding: 100px; border-radius: 20px; }

@media all and (max-width: 1400px) { .event .recruiting .inner > .con_wrap { padding: 100px 50px; } }

@media all and (max-width: 768px) { .event .recruiting .inner > .con_wrap { padding: 50px 30px; } }

@media all and (max-width: 500px) { .event .recruiting .inner > .con_wrap { padding: 30px 10px; } }

.event .recruiting .inner .university_wrap { background-color: rgba(255, 255, 255, 0.1); }

.event .recruiting .inner .university_wrap .bx-wrapper { margin: 0 auto; }

.event .recruiting .inner .university_wrap .bx-controls { text-align: center; margin-top: 20px; }

@media all and (max-width: 768px) { .event .recruiting .inner .university_wrap .bx-controls { margin-top: 0; } }

.event .recruiting .inner .university_wrap .bx-controls .bx-prev { left: -40px; background: url("../images/arrow1-g.png") no-repeat 0 0; }

@media all and (max-width: 768px) { .event .recruiting .inner .university_wrap .bx-controls .bx-prev { display: none; } }

.event .recruiting .inner .university_wrap .bx-controls .bx-next { right: -50px; background: url("../images/arrow2-g.png") no-repeat 0 0; }

@media all and (max-width: 768px) { .event .recruiting .inner .university_wrap .bx-controls .bx-next { display: none; } }

.event .recruiting .inner .university_wrap .bx-controls .bx-pager { display: inline-block; background: #333333; border-radius: 50px; width: auto; bottom: auto; font-size: 0; padding: 10px 2px; }

@media all and (max-width: 768px) { .event .recruiting .inner .university_wrap .bx-controls .bx-pager { padding: 4px 2px; } }

.event .recruiting .inner .university_wrap .bx-controls .bx-pager a { margin: 0 8px; }

.event .recruiting .inner .university_wrap .bx-controls .bx-pager a, .event .recruiting .inner .university_wrap .bx-controls .bx-pager a:hover, .event .recruiting .inner .university_wrap .bx-controls .bx-pager a:hover { width: 8px; height: 8px; }

@media all and (max-width: 768px) { .event .recruiting .inner .university_wrap .bx-controls .bx-pager a, .event .recruiting .inner .university_wrap .bx-controls .bx-pager a:hover, .event .recruiting .inner .university_wrap .bx-controls .bx-pager a:hover { width: 6px; height: 6px; margin: 0 4px; } }

.event .recruiting .inner .con_wrap .mark_gy { font-size: 22px; font-weight: 300; }

@media all and (max-width: 1040px) { .event .recruiting .inner .con_wrap .mark_gy { font-size: 18px; } }

@media all and (max-width: 768px) { .event .recruiting .inner .con_wrap .mark_gy { font-size: 15px; } }

.event .recruiting .mark_gy { font-size: 20px; }

@media all and (max-width: 768px) { .event .recruiting .con_flex .con_l, .event .recruiting .con_flex .con_r { width: 100%; } }

.event .recruiting .talk { margin-bottom: 100px; }

@media all and (max-width: 768px) { .event .recruiting .talk { margin-bottom: 42px; } }

@media all and (max-width: 500px) { .event .recruiting .talk { margin-bottom: 36px; } }

.event .recruiting .talk .copy { margin-top: 50px; }

@media all and (max-width: 1280px) { .event .recruiting .talk .copy { margin-top: 28px; } }

@media all and (max-width: 768px) { .event .recruiting .talk .copy { margin-top: 24px; } }

@media all and (max-width: 500px) { .event .recruiting .talk .copy { margin-top: 16px; } }

.event .recruiting .talk .copy p { font-size: 30px; line-height: 150%; letter-spacing: -0.005em; color: #FFF; }

@media all and (max-width: 768px) { .event .recruiting .talk .copy p { font-size: 18px; } }

@media all and (max-width: 500px) { .event .recruiting .talk .copy p { font-size: 16px; } }

.event .recruiting .talk .copy p + p { margin-top: 8px; }

@media all and (max-width: 500px) { .event .recruiting .talk .copy p + p { margin-top: 16px; } }

.event .recruiting .list_talk img { width: 100%; }

.event .recruiting .schedule { width: 100%; border-radius: 10px; border: 0; overflow: hidden; margin-bottom: 35px; }

@media all and (max-width: 1040px) { .event .recruiting .schedule { margin-top: 16px; } }

@media all and (max-width: 500px) { .event .recruiting .schedule { margin-top: 36px; } }

.event .recruiting .schedule th { background: #3AE2D8; font-weight: 500; font-size: 20px; line-height: 150%; letter-spacing: -0.005em; padding: 22px 0; }

.event .recruiting .schedule th span { white-space: nowrap; }

@media all and (max-width: 1040px) { .event .recruiting .schedule th { font-size: 18px; padding: 26px 0; } }

@media all and (max-width: 500px) { .event .recruiting .schedule th { font-size: 15px; padding: 16px 0; } }

.event .recruiting .schedule td { font-size: 20px; line-height: 150%; letter-spacing: -0.005em; padding: 0; text-align: center; border: solid 1px #9C9C9C; }

.event .recruiting .schedule td span { white-space: nowrap; }

@media all and (max-width: 1040px) { .event .recruiting .schedule td { font-size: 16px; } }

@media all and (max-width: 500px) { .event .recruiting .schedule td { font-size: 14px; } }

.event .recruiting .schedule td:nth-child(2n-1) { background: #FFF; }

.event .recruiting .schedule td:nth-child(2n) { background: #D9D9D9; }

.event .recruiting .schedule td b { font-weight: 700; }

.event .recruiting .schedule .btn { padding: 15px 0; }

@media all and (max-width: 1040px) { .event .recruiting .schedule .btn { padding: 24px 15px; } }

@media all and (max-width: 768px) { .event .recruiting .schedule .btn { padding: 22px 0.5em; } }

.event .recruiting .schedule .bt { display: block; max-width: 138px; height: 44px; line-height: 44px; background: #3AE2D8; border-radius: 50px; font-weight: 700; margin: 0 auto; }

@media all and (max-width: 1040px) { .event .recruiting .schedule .bt { max-width: none; height: 40px; line-height: 40px; } }

@media all and (max-width: 768px) { .event .recruiting .schedule .bt { height: 27px; line-height: 27px; }
  .event .recruiting .schedule .bt em { display: none; } }

.event .tit_deco { display: block; position: absolute; bottom: 100px; left: 50%; width: auto; height: 50px; font-size: 30px; -webkit-transform: translateX(-8%); transform: translateX(-8%); width: 100%; }

@media all and (max-width: 1280px) { .event .tit_deco { font-size: 25px; } }

@media all and (max-width: 1040px) { .event .tit_deco { font-size: 22px; bottom: 80px; } }

@media all and (max-width: 768px) { .event .tit_deco { font-size: 13px; bottom: 10%; -webkit-transform: translateX(-10%); transform: translateX(-10%); } }

@media all and (max-width: 500px) { .event .tit_deco { font-size: 10px; bottom: 3%; -webkit-transform: translateX(-11%); transform: translateX(-11%); } }

.event .recruiting .inner > .con_wrap ul li p, .event .recruiting .inner > .con_wrap ul li .con_wrap { width: 90%; }

.story { overflow-x: hidden; }

.story .wrap_head { margin-bottom: 50px; }

.story .iframe_bx { position: relative; width: 100%; padding-bottom: calc(9 / 16 * 100%); }

.story .iframe_bx iframe { position: absolute; width: 100%; height: 100%; }

.story .con_wrap:nth-child(2) { margin-top: 100px; }

@media all and (max-width: 1040px) { .story .con_wrap:nth-child(2) { margin: 50px 0; } }

.story .con_wrap:nth-child(3) { margin: 100px 0; }

.story .con_wrap h4 { font-size: 35px; font-weight: 500; margin-bottom: 50px; font-family: 'loreal_m', 'Noto Sans KR'; }

@media all and (max-width: 1040px) { .story .con_wrap h4 { margin-bottom: 30px; font-size: 28px; line-height: 1.2; } }

@media all and (max-width: 768px) { .story .con_wrap h4 { font-size: 23px; } }

@media all and (max-width: 500px) { .story .con_wrap h4 { font-size: 18px; } }

.story .con_wrap h4 span { font-size: 24px; margin-left: 18px; }

@media all and (max-width: 768px) { .story .con_wrap h4 span { font-size: 18px; display: block; margin-top: 4px; } }

@media all and (max-width: 500px) { .story .con_wrap h4 span { margin-left: 14px; } }

.story .bx-wrapper .bx-prev { left: -80px; background: url("../images/arrow1.png") no-repeat 0 0; }

.story .bx-wrapper .bx-next { right: -80px; background: url("../images/arrow2.png") no-repeat 0 0; }

.story .bx-wrapper .bx-pager.bx-default-pager a { background-color: #e3e3e3 !important; margin: 0 6px !important; }

.story .bx-pager { margin-top: 40px; }

@media all and (max-width: 1040px) { .story .bx-pager { margin-top: 25px; } }

.story .bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active { width: 8px !important; background-color: #000 !important; }

.con_bt { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

.con_bt .btn { display: -webkit-box; display: -ms-flexbox; display: flex; height: 108px; padding: 0 30px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border-radius: 60px; font-size: 30px; font-weight: 700; }

@media all and (max-width: 1040px) { .con_bt .btn { height: 80px; font-size: 22px; } }

@media all and (max-width: 768px) { .con_bt .btn { height: 60px; font-size: 18px; } }

@media all and (max-width: 500px) { .con_bt .btn { font-size: 15px; padding: 0; } }

.con_bt .btn.youtube { background-color: #fff; border: 1px solid #000; margin-top: 70px; }

@media all and (max-width: 768px) { .con_bt .btn.youtube { margin-bottom: 20px; } }

@media all and (max-width: 500px) { .con_bt .btn.youtube { width: 100%; } }

.con_bt .btn.youtube > img { margin-right: 10px; }

@media all and (max-width: 768px) { .con_bt .btn.youtube > img { width: 20px; } }

.con_bt .btn.bg { background-color: #3ae2d8; margin: 0 10px 100px 10px; }

@media all and (max-width: 768px) { .con_bt .btn.bg { margin-bottom: 80px; } }

@media all and (max-width: 500px) { .con_bt .btn.bg { width: calc(100% - 10px * 2); } }

.con_bt .btn.bg > img { width: 149px; margin-right: 16px; }

@media all and (max-width: 1040px) { .con_bt .btn.bg > img { width: 86px; } }

@media all and (max-width: 500px) { .con_bt .btn.bg > img { width: 60px; margin-right: 10px; } }

.contents.on [class*="fade_in"] { opacity: 0; }

.contents .fade_in_up, .contents .fade_in_left, .contents .fade_in_right { opacity: 0; }

#visual_area .fade_in_up, #visual_area2 .fade_in_up, #visual_area .fade_in_left, #visual_area .fade_in_right { opacity: 0; }

#visual_area .fade_in_up, #visual_area2 .fade_in_up { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: cubic-bezier(0.44, 0.01, 0.64, 0.99); animation-timing-function: cubic-bezier(0.44, 0.01, 0.64, 0.99); -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-delay: 0; animation-delay: 0; }

.contents.on .fade_in_up { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: cubic-bezier(0.44, 0.01, 0.64, 0.99); animation-timing-function: cubic-bezier(0.44, 0.01, 0.64, 0.99); -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-delay: 0; animation-delay: 0; }

.contents.on .fade_in_up:nth-child(1) { -webkit-animation-delay: 0; animation-delay: 0; }

.contents.on .fade_in_up:nth-child(2) { -webkit-animation-delay: 0.4s; animation-delay: 0.4s; }

.contents.on .fade_in_up:nth-child(3) { -webkit-animation-delay: 0.8s; animation-delay: 0.8s; }

.contents.on .fade_in_up:nth-child(4) { -webkit-animation-delay: 1.2s; animation-delay: 1.2s; }

.contents.on .fade_in_up:nth-child(5) { -webkit-animation-delay: 1.6s; animation-delay: 1.6s; }

.contents.on .fade_in_up:nth-child(6) { -webkit-animation-delay: 2s; animation-delay: 2s; }

.contents.on .fade_in_up:nth-child(7) { -webkit-animation-delay: 2.4s; animation-delay: 2.4s; }

.contents.on .fade_in_up:nth-child(8) { -webkit-animation-delay: 2.8s; animation-delay: 2.8s; }

.contents.on .fade_in_up:nth-child(9) { -webkit-animation-delay: 3.2s; animation-delay: 3.2s; }

.contents.on .fade_in_up:nth-child(10) { -webkit-animation-delay: 3.6s; animation-delay: 3.6s; }

.contents.on .fade_in_left { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: cubic-bezier(0.44, 0.01, 0.64, 0.99); animation-timing-function: cubic-bezier(0.44, 0.01, 0.64, 0.99); -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-delay: .5s; animation-delay: .5s; }

.contents.on .fade_in_left:nth-child(1) { -webkit-animation-delay: 0; animation-delay: 0; }

.contents.on .fade_in_left:nth-child(2) { -webkit-animation-delay: 1s; animation-delay: 1s; }

.contents.on .fade_in_left:nth-child(3) { -webkit-animation-delay: 2s; animation-delay: 2s; }

.contents.on .fade_in_left:nth-child(4) { -webkit-animation-delay: 3s; animation-delay: 3s; }

.contents.on .fade_in_right { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: cubic-bezier(0.44, 0.01, 0.64, 0.99); animation-timing-function: cubic-bezier(0.44, 0.01, 0.64, 0.99); -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-delay: .5s; animation-delay: .5s; }

.contents.on .fade_in_on { -webkit-animation-name: fadeInOn; animation-name: fadeInOn; -webkit-animation-duration: 3s; animation-duration: 3s; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-delay: 1.5s; animation-delay: 1.5s; }

@-webkit-keyframes fadeInUp { from { opacity: 0;
    -webkit-transform: translate3d(0, 30px, 0);
    transform: translate3d(0, 30px, 0); }
  to { opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@keyframes fadeInUp { from { opacity: 0;
    -webkit-transform: translate3d(0, 30px, 0);
    transform: translate3d(0, 30px, 0); }
  to { opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@-webkit-keyframes fadeInRight { from { opacity: 0;
    -webkit-transform: translate3d(100px, 0, 0);
    transform: translate3d(100px, 0, 0); }
  to { opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@keyframes fadeInRight { from { opacity: 0;
    -webkit-transform: translate3d(100px, 0, 0);
    transform: translate3d(100px, 0, 0); }
  to { opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@-webkit-keyframes fadeInLeft { from { opacity: 0;
    -webkit-transform: translate3d(-100px, 0, 0);
    transform: translate3d(-100px, 0, 0); }
  to { opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@keyframes fadeInLeft { from { opacity: 0;
    -webkit-transform: translate3d(-100px, 0, 0);
    transform: translate3d(-100px, 0, 0); }
  to { opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@-webkit-keyframes fadeInOn { from { opacity: 0; }
  to { opacity: 1; } }

@keyframes fadeInOn { from { opacity: 0; }
  to { opacity: 1; } }

@-webkit-keyframes float { 0% { opacity: 1; }
  50% { opacity: 1;
    -webkit-transform: translatey(-10px);
            transform: translatey(-10px); }
  100% { opacity: 1; } }

@keyframes float { 0% { opacity: 1; }
  50% { opacity: 1;
    -webkit-transform: translatey(-10px);
            transform: translatey(-10px); }
  100% { opacity: 1; } }