.direct-popup .visible-popups > .each { max-width:700px!important; }
.fullpage-mouse { position: fixed; bottom: 7%; z-index: 50; left: 50%; display: block; transform: translate(-50%, 0); }
.fullpage-mouse img { animation: MoveUpDown 1.2s ease-in-out infinite; position: relative; z-index: 10; }
@keyframes MoveUpDown { 0%, 100% { transform: translateY(0rem); } 50% { transform: translateY(1rem);}}

/* common */
 h1.text-center { color: #fff; margin:0; font-size: 5rem; font-weight:normal; margin:30px 0 15px; text-shadow: 2px 3px 2px rgb(0 0 0 / 20%);}
 h3.text-center { color: #fff; font-size: 2.2rem; text-transform: uppercase; letter-spacing: 1.5px;}


#fp-nav { background: transparent; z-index:0!important; top:45%!important; display:inline-block; height:15%;}
/*#fp-nav ul li .fp-tooltip.right {right: 15px;}*/
.youtube { position: fixed; right: 86px; bottom: 30%; z-index: 10;}
#fp-nav ul li .fp-tooltip.right {font-family: 'Nanum Square'; letter-spacing: .3px;}
#fp-nav ul li:last-child {display: none;}
#fp-nav ul li, .fp-slidesNav ul li { margin:25px 7px; }
#fp-nav ul li:last-child { display:none; }
#fp-nav ul li .fp-tooltip { color:#fff!important; opacity:1!important; width:115px!important; text-align:left; font-size:16px; top:-5px;transform: skew(-0.05deg); }
#fp-nav ul li .fp-tooltip { color:#fff!important; }
#fp-nav ul li.black a.active {border-color: #121212;}
#fp-nav ul li.black .fp-tooltip {color: #121212!important;}
#fp-nav ul li a span.black {background: #121212; }
#fp-nav ul li a.active { border: 1px solid #fff; text-decoration: none; padding: 12px; border-radius: 100%; top: -10px; left: -9px; position:relative; transition:.3s all ease-in-out; }
#fp-nav ul li a.active span, .fp-slidesNav ul li a.active span, #fp-nav ul li:hover a.active span, .fp-slidesNav ul li:hover a.active span { width:4px; height:4px; margin: -2px 0 0 -2px; }

.fp-controlArrow.fp-prev {
    display: none;
}
.fp-controlArrow.fp-next {
    display: none;
}
.slider .move-btn {
    background: none !important;
}
#section-1 { position:relative; }
    #section-1 > div > div:first-child, #section-1 div.s1-bg {
        width: 100%;
        height: 100%;
    }
    #section-1 .swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after {
        display: none;
    }
    #section-1 .swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after {
        display: none;
    }
    #section-1 .text-center {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
#slideText { -webkit-animation: zoomin 9s 1; animation: zoomin 9S 1; }
@-webkit-keyframes zoomin { 0% { -webkit-transform: scale(1.2); } 100% { -webkit-transform: scale(1.1); }}


#section-2 { position:relative; background:url(../../../Layouts/jungyoonhp_reLayout/Images/main/bg_wor.png) no-repeat; background-position:center; background-size:100% 100%; }
#section-2 a { text-decoration:none; }
#section-2 div.container {padding-top: 5em;}
#section-2 .section2-box-cont {margin: 3em auto 1em; /* background-color: #fff; */}
.sec1_b{padding-right: 0; padding-left: 0;}
#section-2 .section2-box-cont div {/*  height: 51vh; */}
#section-2 .section2-box-cont div:nth-of-type(1) > img { aspect-ratio:16/9;}
#section-2 .section2-box-cont div:nth-of-type(2) {padding: 0;}
#section-2 .section2-box-cont div:nth-of-type(2) > div {background-color: #fff; padding:0.6em 2em; box-sizing: border-box;}
#section-2 .section2-box-cont div:nth-of-type(2) ul {flex-direction: column; position: relative; top: 50%;}
#section-2 .section2-box-cont div:nth-of-type(2) ul li { border-bottom: 1px solid #eee; padding: 1.1em 0;}
/*#section-2 .section2-box-cont div:nth-of-type(2) ul li:first-child {padding-top: 0;}*/
#section-2 .section2-box-cont div:nth-of-type(2) ul li:last-child {border-bottom: none;} 
#section-2 .section2-box-cont div:nth-of-type(2) ul li a {display: flex; align-items: center;}
#section-2 .section2-box-cont div:nth-of-type(2) ul li a p {color: #888; font-size: 1.7rem; padding-left: 5px;}
#section-2 .section2-box-cont div:nth-of-type(2) ul li a p strong {color: #121212; font-weight: bold; font-size: 2rem;}

.section-image >img { min-width:420px;}

#section-3 { position:relative; overflow: hidden; }
#section-3 .section-3-box {position:relative; top: 0; left: 0;}
#section-3 .section-3-box .swiper-slide {display: block; width: 100%; height: 100vh; position: relative;}
#section-3 .section-3-box .s3-bg1 { position: relative; background: url(../../../Layouts/jungyoonhp_reLayout/Images/main/bg_dis2.png)no-repeat center;  background-size:cover; }
#section-3 .section-3-box .s3-bg2 { position: relative; background: url(../../../Layouts/jungyoonhp_reLayout/Images/main/s3_img02_bg.jpg)no-repeat center;  background-size:cover; }
#section-3 .section-3-box .s3-bg3 { position: relative; background: url(../../../Layouts/jungyoonhp_reLayout/Images/main/s3_img03_bg.jpg)no-repeat center;  background-size:cover; }

#section-3 .section-3-box .swiper-slide .slideText {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
#section-3 .section-3-box .swiper-slide > a {
    display: block;
    width: 100%;
    margin: 0 auto;
    position: absolute;
    text-align: center;
    bottom: 5em;
    animation: MoveUpDown 4s ease-in-out 1s infinite;
}
#section-3 .section-3-box .swiper-slide > a > #slideBtn {}
@keyframes steam1 {
    0% {
        transform: translateY(0) scale(0.25);
        opacity: 0.2;
    }

    100% {
        transform: translateY(50px) scale(1);
        opacity: 0;
    }
}
#section-3 .section-3-box .swiper-slide:nth-child(2) .swiper-img a, #section-3 .section-3-box .swiper-slide:nth-child(3) .swiper-img a {display: none;}
#section-3 .section-3-box .swiper-img a click_btn {position: absolute;}
#section-3 .section-3-box .swiper-button-next, #section-3 .section-3-box .swiper-button-prev {color: rgba(255, 255, 255, .8);}
#section-3 .section-3-box .swiper-button-next:after, #section-3 .section-3-box .swiper-button-prev:after {font-size: 5em;}
#section-3 .section-3-box .swiper-button-next {right: 12%;}
#section-3 .section-3-box .swiper-button-prev {left: 12%;}


#section-5 { position:relative; background:url(../../../Layouts/jungyoonhp_reLayout/Images/main/bg_gen.png) no-repeat; background-position:center; background-size:cover; width: 100%; }
#section-5 div.container {padding-top: 5em;}
#section-5 .section-5-box {padding-top: 3em;}
#section-5 .section-5-box .section-5-wrap > .swiper-slide > ul {
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
    padding: 0 30px 30px;
    position: relative;
    background: url(../../../Layouts/jungyoonhp_reLayout/Images/main/s4_box_bg.png) no-repeat;
}
#section-5 .section-5-box .section-5-wrap > .swiper-slide > ul > li:nth-of-type(2) {align-self: center;}
#section-5 .section-5-box .section-5-wrap > .swiper-slide > ul > li > img {
    max-width: 90%;
    width: 100%;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
}
#section-5 .section-5-box .section-5-wrap div .section5-txt { position: relative;  top: 50px;}
#section-5 .section-5-box .section-5-wrap div .section5-txt p.txt-sub,
#section-5 .section-5-box .section-5-wrap div .section5-txt h2.txt-title > span {font-size: 2.2rem; font-weight: bold; }
#section-5 .section-5-box .section-5-wrap div .section5-txt h2.txt-title{font-size: 3.5rem; font-weight: bold;  padding: 10px 0;}
#section-5 .section-5-box .section-5-wrap div .section5-txt p.txt-desc {font-size: 1.7rem; font-weight: bold; padding: 1em 0 2em;}
#section-5 .section-5-box .section-5-wrap div .section5-txt ul li {margin-right: 10px;}
#section-5 .swiper-button-next {right: 3em; color: #ddd;}
#section-5 .swiper-button-prev {left: 3em; color: #ddd;}
#section-5 .swiper-button-next, #section-5 .swiper-button-prev {z-index: 99!important;}
#section-5 .swiper-button-next:after, .swiper-container-rtl, 
#section-5 .swiper-button-prev:after {font-size: 4em;}



#section-4 {
    position: relative;
    background: url(../../../Layouts/jungyoonhp_reLayout/Images/main/bg_sto.png) no-repeat;    background-position: center;    background-size:cover;    width: 100%;
}
#section-4 ul {  padding-top: 5em; position: relative; top: 0; left: 0; }
#section-4 ul a { color:#fff; display: flex; align-items: center; /*justify-content: space-between;*/}
#section-4 li { overflow:hidden; border: 1px solid rgba(255,255,255, .4); padding: 15px; background: rgba(0,0,0, .5); margin-bottom: 10px;}
#section-4 li div {}
#section-4 li div.section4-box-date {height: 110px; background: rgba(255,255,255, .4); padding: 0 60px; display: flex; align-items: center; justify-content: center;}
#section-4 li div.section4-box-date p { color: #fff; font-size:17px; margin:0; }
#section-4 li div.section4-box-cont {padding-right: 0; padding-left: 30px;}
#section-4 li div.section4-box-cont p { color: #fff; margin:0;  text-overflow: ellipsis; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;}
#section-4 li div.section4-box-cont p.cont-title { font-size:2.4rem; line-height: 1.8;}
#section-4 li div.section4-box-cont p.cont-date { font-size:14px; }
#section-4 li div.section4-box-cont img {margin-left: 10px;}
#section-4 li img.arrowBtn { position: absolute; right: 0; align-self: flex-end; display: inline-block; padding: 0 15px; transition: all .3s ease-in-out;}
#section-4 li img.arrowBtn:hover {transform: translateX(10px);} 



/* footer */
.footer { }
.footer .footer-top { padding:20px 0; background: #202020;}
.footer .footer-top div, .footer .footer-bottom div { position:relative; top: 0; left: 0;  display: flex; align-items: center; }
.footer .footer-top p {float: left; color:inherit; font-size: 1.7rem; }
.footer .footer-top ul {position: absolute; right: 15px;}
.footer .footer-top li { display:inline-block;}
.footer .footer-bottom { background:#7F7F7F; padding:40px 0; transform: skew(-0.05deg);}
.footer .footer-bottom p { font-size:16px; color:#fff!important; line-height: 1.7;}
.footer .footer-bottom .footer-bottom-left {float: left;}
.footer .footer-bottom .footer-bottom-right {float: right;}
.footer .footer-bottom .footer-bottom-right ul li {list-style: disc; color: #fff;  font-size: 20px; }
.footer .footer-bottom .footer-bottom-right ul li:first-child {margin-bottom: 10px;} 

/* btn */

.view-more {
  display: inline-block;
  padding: 17px 50px;
  color: #00A9E0;
  font-size: 17px;
  border: 5px solid #fff;
  text-decoration: none;
  overflow: hidden;
  vertical-align: middle;
  background: transparent;
  overflow: hidden;
  -webkit-transition: 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  position: relative;
  z-index: 10;
 border: 1px solid #00A9E0; 
 font-weight:100;
}

.view-more:hover {
  color: #fff;
}

.view-more:hover:before {
  -webkit-transform: translateX(0) skewX(-17.62deg);
  -ms-transform: translateX(0) skewX(-17.62deg);
  transform: translateX(0) skewX(-17.62deg);
  -webkit-transform-origin: left top;
  -ms-transform-origin: left top;
  transform-origin: left top;
}

.view-more:before {
  z-index: -1;
  content: "";
  display: block;
  width: 120%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  -webkit-transform-origin: right top;
  -ms-transform-origin: right top;
  transform-origin: right top;
  -webkit-transform: translateX(-101%) skewX(-17.62deg);
  -ms-transform: translateX(-101%) skewX(-17.62deg);
  transform: translateX(-101%) skewX(-17.62deg);
  -webkit-transition: -webkit-transform 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: -webkit-transform 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: transform 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: transform 1s cubic-bezier(0.165, 0.84, 0.44, 1),
    -webkit-transform 1s cubic-bezier(0.165, 0.84, 0.44, 1);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.view-more1:before {
	background: #C7B1E6;
}

.view-more2:before {
	background: #737069;
}


/* responsive */
@media (min-width:1499px) {#section-5 div.container {max-width: 1480px; width: 100%;} .footer .footer-bottom div { max-width: 1450px; width: 100%;} }
@media (max-width:1499px) {
    .youtube { position: fixed; right: 75px; bottom: 15%; z-index: 10;}
    #fp-nav ul li, .fp-slidesNav ul li {width: 0!important;}
    #fp-nav ul li .fp-tooltip {/* font-size: 1.4rem; */ width: 7em!important; }

    h1.text-center {font-size:2em;}

    #section-5 .section-5-box .section-5-wrap > .swiper-slide > ul {/*max-width: 80%;*/ height: 50vh; padding: 0 15px 2em}
    #section-5 .section-5-box .section-5-wrap > .swiper-slide > ul li:nth-of-type(1) {align-self: flex-end;}
    #section-5 .section-5-box .section-5-wrap > .swiper-slide > ul > li > img {max-width: 100%;}
    #section-5 .section-5-box .section-5-wrap div .section5-txt h2.txt-title {font-size: 2.4rem; line-height: 1.4;}
    #section-5 .section-5-box .section-5-wrap div .section5-txt p.txt-sub {font-size: 1.7rem; white-space: nowrap;}
}

@media (max-width:1199px) {
    #section-1, #section-2, #section-3, #section-4, #section-5 {background-size: auto 100%!important;}

    #section-2 div.container {}

    #section-2 .section2-box-cont div { width: 100%;}
    #section-2 .section2-box-cont {justify-content: center; flex-direction: column;}
    #section-2 .section2-box-cont div:nth-of-type(1) > img {width: 100%; }
    #section-2 .section2-box-cont div:nth-of-type(2) > div {padding: 1em; height: auto; margin-top: 1em;}
    #section-2 .section2-box-cont div:nth-of-type(2) ul {flex-direction: unset; justify-content: space-around; transform: unset; top: 0;}
    #section-2 .section2-box-cont div:nth-of-type(2) ul li {padding: 0 10px; border-bottom: unset;         width: 20%;}
    #section-2 .section2-box-cont div:nth-of-type(2) ul li a p {font-size: 1.2rem;}
    #section-2 .section2-box-cont div:nth-of-type(2) ul li a p strong {font-size: 16px;}

    #section-4 li div.section4-box-date { width: 5em; height: 65px;}
    #section-4 li div.section4-box-cont p.cont-title {font-size: 1.2em;}

    #section-5 > div.container {width: 100%;}
    #section-5 .section-5-box .section-5-wrap > .swiper-slide > ul {width: 75%; height: auto; background: #fff;  padding: 2em 1em;}
    #section-5 .section-5-box .section-5-wrap > .swiper-slide > ul > li.section5-txt {
        position: relative;
        right: 0;
        top: 10px;
    }
    #section-5 .swiper-button-next:after, .swiper-container-rtl, #section-5 .swiper-button-prev:after {font-size: 3em;}
    #section-5 .swiper-button-next {right: 3em;}
    #section-5 .swiper-button-prev {left: 3em;}


    /* 6 */
    .footer .footer-bottom div {flex-direction: column-reverse; align-items: flex-start;}
    .footer .footer-bottom .footer-bottom-left {padding-top: 2em;}
    .footer .footer-bottom .footer-bottom-right ul li:first-child {margin-bottom: 0;}
}

@media (max-width:992px) {
    .youtube { display: none;}
    #fp-nav { display:none!important; }
    .fp-slidesContainer {transform: translate3d(0px, 0px, 0px) !important;}
    #section-2 .section2-box-cont div { /* height: 47vh; */ }

    #section-2 .section2-box-cont  ul li a img {/* max-width: 50%; */ }
     
	#section-3 .section-3-box .swiper-slide .slideText {max-width: 75%;}
    #section-3 .section-3-box .swiper-button-prev {left: 3em;}
    #section-3 .section-3-box .swiper-button-next {right: 3em;}
    #section-3 .section-3-box .swiper-button-next:after, #section-3 .section-3-box .swiper-button-prev:after {font-size: 2em; color: #333;}

    #section-5 .section-5-box .section-5-wrap > .swiper-slide > ul {max-width: 100%; flex-direction: column; text-align: center;}
    #section-5 .section-5-box .section-5-wrap > .swiper-slide > ul li:nth-of-type(1) {align-self: unset;}
    #section-5 .section-5-box .section-5-wrap > .swiper-slide > ul > li  {width: 100%;}
    #section-5 .section-5-box .section-5-wrap > .swiper-slide > ul > li > ul {justify-content: center;}
	#section-5 .section-5-box .section-5-wrap div .section5-txt p.txt-desc {font-size: 1.1rem; font-weight: bold; padding: 0.5em 0 1em;}
	#section-5 .section-5-box .section-5-wrap div .section5-txt p.txt-sub {white-space: unset; font-size: 1.1rem; padding-top: 10px;}
	#section-5 .section-5-box .section-5-wrap div .section5-txt ul li {margin-right: 10px;}

}

@media (max-width: 767px) {
    .direct-popup .visible-popups > .each {
        max-width: 300px !important;
    }

    h1.text-center {font-size: 1.4em;}
    h3.text-center {font-size: 1.2em;}

    #section-2 .section2-box-cont div {/* height: 40vh; */}
    #section-2 .section2-box-cont div:nth-of-type(2) ul { align-items: flex-end;}
    #section-2 .section2-box-cont div:nth-of-type(2) ul li a {flex-direction: column;}
    #section-2 .section2-box-cont div:nth-of-type(2) ul li a p {padding-left: 0; padding-top: 1em;}
    #section-2 .section2-box-cont div:nth-of-type(2) ul li a p strong {font-size: .9rem;}

    #section-3 .section-3-box .swiper-slide > a {bottom: 3em;}
    #section-3 .section-3-box .swiper-slide > a > img {width: 10em;}
    #section-3 .section-3-box .swiper-button-next {right:0;}
    #section-3 .section-3-box .swiper-button-prev {left: 0;} 

    #section-4 li div.section4-box-cont {padding-left: 1em; overflow: hidden;}
    #section-4 li div.section4-box-date {padding: 0 35px;}
    #section-4 li div.section4-box-cont p.cont-title,
    #section-4 li div.section4-box-cont p.cont-date {font-size: 16px;}


    #section-5 .section-5-box {padding-top: 2em;}
    #section-5 .section-5-box .section-5-wrap > .swiper-slide > ul {width: 80%; padding:2em 0; flex-direction: column;}
    #section-5 .swiper-button-next {right: 0;}
    #section-5 .swiper-button-prev:after,
    #section-5 .swiper-button-next:after {font-size: 2em;} 
    #section-5 .swiper-button-prev {left: 0;}

    #section-5 .section-5-box .section-5-wrap div .section5-txt h2.txt-title {font-size: 1.8rem; line-height: 1.6;}
    #section-5 .section-5-box .section-5-wrap div .section5-txt h2.txt-title > span {font-size: 1.4rem;}

    .footer .footer-bottom .footer-bottom-right {display: none;}
    .footer .footer-bottom .footer-bottom-left {padding-top: 0;}
}


@media (max-width: 500px) {
    #section-3 .section-3-box .swiper-slide .slideText {max-width: 100%;}
	 #section-2 .section2-box-cont div { /* height: 25vh; */}

    h1.text-center {font-size: 1.8em;}
    .footer .footer-bottom p {font-size: 14px;}
    .footer .footer-top p {font-size: 1em;}
    
    .footer .footer-bottom #topBtn {transform: unset;}
    .footer .footer-top div {flex-direction: column; align-items: baseline;}
    .footer .footer-top ul {position: relative!important; padding-top: 10px; left: 10px;}
}