*,
*:before,
*:after {
  position:relative;
  box-sizing:border-box;
}
#fullpage {
    position:relative;
    top:0px;
    z-index:9;
    width:100%;
    height:100%;
    background-color:#293240;
}
section:not(:first-child) {
    animation:2.5s 0s 1 sectFade;
    margin:0 auto;
}
@keyframes sectFade {
    0% {
        opacity:0;
    }
    50% {
        opacity:0;
    }
    100% {
        opacity:1;
    }
}

.intro-section {
    text-align:center;
    min-height:100vh;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    color:#fff;
    animation:1s ease-in-out 0s 1 slideDownBtm;
}
.intro-section::after {
    content:'';
    width:100%;
    min-height:100vh;
    background:linear-gradient(-45deg, #014099, #099887);
	background-size:400% 400%;
	animation:gradient 5s ease infinite;
    position:absolute;
    z-index:-1;
    /*opacity:.5;*/
}
.outro-section {
    text-align:center;
    min-height:100vh;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    color:#fff;
}
.outro-section::before {
    content:'';
    position:absolute;
    background:url(../imgs/dsp_outBg.jpg) no-repeat;
    background-size:cover;
    width:100%;
    height:100%;
    opacity:.2;
    filter: blur(1px);
    -webkit-filter: blur(1px);
}
.outro-section::after {
    content:'';
    width:100%;
    min-height:100vh;
    background:radial-gradient(circle, #2674c0, #1f4f96, #1b2949);
    background-size:500% 400%;
    animation:gradient 12s ease infinite;
    position:absolute;
    z-index:-1;
}
@keyframes slideDownBtm {
    0% {
        transform:translateY(-100%);
    }
    100% {
        transform:translateY(0);
    }
}
@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

.intro-section>p,
.intro-section>h1 {
    animation:1.5s 0s 1 introFade;
    /*opacity:0;*/
}
@keyframes introFade {
    0% {
        opacity:0;
        transform:translateY(-100%);
    }
    50% {
        opacity:0;
        transform:translateY(-100%);
    }
    100% {
        opacity:1;
        transform:translateY(0);
    }
}
.intro-section>p:first-child {
    font-size:1.8em;
    font-size:2.8em;
    font-weight:700;
    margin-top:0;
}
.intro-heading {
    margin-top:20px;
    font-size:3.8em;
    font-size:6.4em;
    font-weight:500;
    word-break:keep-all;
}
.intro-section>p {
    margin-top:35px;
    font-size:1.6em;
    font-size:1.8em;
    font-weight:300;
    line-height:1.4em;
    word-break:keep-all;
}
.outro-section>p:first-child {
    font-size:4.88em;
    font-weight:600;
}
.outro-section>p:nth-child(2) {
    margin-top:35px;
    font-size:2.95em;
    font-weight:300;
    line-height:1.4em;
    word-break:keep-all;
}
.outro-section>p.-pc,
.intro-section>p.-pc {
    display:block;
}
.outro-section>p.-mo,
.intro-section>p.-mo,
.heading.-mo {
    display:none;
}
/*dsp 하단 버튼 설정*/
.buttons {
    /*margin-top:42px;*/
    margin-top:7vmin;
}
.buttons>li {
    width:280px;
    height:80px;
    background-color:#0024fd;
    text-align:center;
    /*display: inline-block;*/
    float:left;
    background:#293240;
}
.buttons>li:last-child {
    margin-left:1em;
}
.buttons>li::after {
    content:'';
    display:block;
    clear:both;
}
.buttons>li>a {
    font-size:22px;
    /*font-size:2.3vh;*/
    /*font-size:1.15vw;*/
    color:#fff;
    display:block;
    line-height:8.4vh;
    line-height:79px;
}
.buttons>li>a>span {
    font-size:12px;
    /*font-size:.63vw;*/
    color:#ffd965;
    vertical-align:middle;
    display:inline-block;
    padding-left:2px;
    padding-bottom:3px;
}


/*스크롤 아이콘*/
.icon-scroll {
    position: absolute;
    bottom:0;
    left:50%;
    width:1em;
    height:3.125em;
    transform:translate(-50%, -100%) scale(2);
    z-index:11;
}
.icon-arrows {
    display:none;
}
.icon-arrows::after,
.icon-arrows::before {
    content:'';
}
.icon-arrows span,
.icon-arrows::after,
.icon-arrows::before {
    display: lock;
    width:0.315em;
    height:0.315em;
    border-right:1px solid rgba(255,255,255,.8);
    border-bottom:1px solid rgba(255,255,255,.8);
    margin:0 0 .125em 0.315em;
    transform:rotate(45deg);
    animation:mouse-scroll 1s infinite;
    animation-direction:alternate;
}

.icon-arrows::before {
	margin-top:.315em;
	animation-delay:.1s;
}

.icon-scroll span {
	animation-delay: .2s;
}
.icon-arrows::after {
	animation-delay: .3s;
}
.icon-scroll .mouse {
	height:1.375em;
	width:.875em;
	border:1px solid rgba(255,255,255,.8);
	border-radius:2em;
}

.icon-scroll .wheel {
    position:relative;
    display:block;
    height:.1875em;
    width:.1875em;
    margin:.1875em auto 0;
    background:rgba(255,255,255,.8);
    animation:mouse-wheel 1.2s ease infinite;
    border-radius:50%;
}

@keyframes mouse-wheel {
	0% {
		opacity:1;
		transform:translateY(0);
	}

	100% {
		opacity:0;
		transform:translateY(.375em);
	}
}

@keyframes mouse-scroll {
	0%   { opacity:0; }
	50%  { opacity:.5; }
	100% { opacity:1; }
}

.content-section {
  --scroll-length: 1.5;
  height:calc( var(--scroll-length) * 100vh );
  width:100%;
  font-family:Helvetica Neue, Helvetica, Arial, sans-serif;
}
.content-section .content .interview,
.content-section .content .subheading,
.content-section .content .paragraph {
  opacity:1;
  opacity:calc( 1 + var(--viewport-y) );
}

.figure {
    width:100%;
    max-width:1200px;
    height:100vh;
    /*height:600px;*/
    margin:0;
    position:absolute;
    top:0;
    left:0;
   /* margin:0 auto;*/
}
.figure > img {
  display:block;
  width:auto;
  width:100%;
  height:100%;
  height:auto;
  /*max-width: 100%;*/
  -o-object-fit:cover;
     object-fit:cover;
  -o-object-position:center center;
     object-position:center center;
    /*transform:translateY(-50%);*/
}
.figure>ul {
    margin:0 0 0 auto;
   /* text-align:right;*/
    /*position:relative;*/
    top:50%;
    /*right:0;*/
    transform:translateY(-60%);
    display:flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items:center;
    /*flex-wrap: wrap;*/
    align-content:center;
    width:73%;
    width:67%;
}
.figure>ul>li {
    display:inline-block;  
}
.figure>ul>li:not(:first-child) {
    margin-left:2%;
}
.content-section:nth-child(3) .figure>ul>li {
    width:50%;
    height:0;
    padding-bottom:50%;
    max-width:250px;
    max-height:250px;
    transform:translateY(15%);
}
/*아이프레임*/
.frame-banner {
    position:absolute;
    left:0; 
    top:0; 
    width:100%; 
    height:100%;
    border:none;
}
.content-section:nth-child(2) .figure>ul>li:first-child {
    /*margin-left:13%;*/
    width:75%;
}
.content-section:nth-child(2) .figure>ul>li:last-child  {
   /* width:23.5%;*/
    width:23.8%;
}
.content-section:nth-child(3) .figure>ul>li:last-child img {
    margin-top:-8%;
}
.content-section:nth-child(3) .figure>ul>li:last-child {
   /* width:40%;
    height:auto;*/
    margin-left:13%;
}
.content-section:nth-child(4) .figure>ul>li {
    /*margin-left:13%;*/
    width:80%;
}
.content-section:nth-child(4) .figure>ul>li>p {
   /* margin-top:3%;*/
}

.dsp2 .content-section:nth-child(2) .figure>ul>li:last-child,
.content-section:nth-child(5) .figure>ul>li {
    /*margin-left:13%;*/
    width:75%;
    /*margin-right:5%;*/
}
.content-section:nth-child(6) .figure>ul>li {
    transform:translateY(-10%);
}
.content-section:nth-child(6) .figure>ul>li:not(:first-child) {
   /* margin-left:13%;*/
}
.dsp2 .content-section:nth-child(2) .figure>ul>li:last-child {
    /*width:80%;*/
}
.dsp2 .content-section:nth-child(3) .figure>ul>li:last-child {
    margin-left:0;
}
.dsp2 .content-section:nth-child(3) .figure>ul>li {
    width:80%;
    height:auto;
    padding-bottom:0;
    max-width:100%;
    max-height:100%;
    transform:translateY(15%);
    transform:none;
}
.dsp3 .content-section:nth-child(2) .figure>ul>li:last-child,
.dsp3 .content-section:nth-child(3) .figure>ul>li,
.dsp3 .content-section:nth-child(4) .figure>ul>li:last-child {
    width:68%;
    max-width:none;
    transform:translateY(15%);
}


.figure>ul>li>p {
    margin-top:4%;
    font-size:1.2vw;
    font-weight:300;
}
/*.figure>ul::after {
    content:'';
    display:block;
    clear:both
}*/
.figure>ul>li[data-scroll] {
    transition:opacity 1s;
    opacity:0;
}
.figure>ul>li[data-scroll="in"] {
    opacity:1;
    transform:translateX(0) scale(1);
}
.figure>ul>li:nth-child(even)[data-scroll="out"] {
    opacity:0;
    transform:translateX(-100%) scale(0.1);
}
.figure>ul>li:nth-child(odd)[data-scroll="out"] {
    opacity:0;
    transform:translateX(+100%) scale(0.1);
}
.figure>ul>li>img {
    display:block;
    width:100%;
    height:auto;
    /*max-width: 100%;*/
    -o-object-fit:cover;
     object-fit:cover;
    -o-object-position:center center;
     object-position:center center;
    /*transform:translateY(-50%);*/
}


.content {
    position:absolute;
    z-index:12345;
    top:0;
    left:50%;
    /*left:32vmin;*/
    width:100%;
    height:100%;
    max-width:35em;
    max-width:1200px;
    display:grid;
    grid-template-rows:1fr 1fr;
    color:#fff;
    /* padding: 2em;*/
    font-size:2.5vmin;
    transform:translateX(-50%);
}
.content * {
    text-shadow:.1vmin .1vmin .6vmin rgb(0 0 0);
}
.content>.header {
    grid-row:1/2;
    /*grid-row-start: 1;*/
    /* grid-row-end: 3;*/
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
    /*    flex-wrap: nowrap;*/
    padding-top:50vh;
    margin-top:50vh;
    padding-top:40vh;
    margin-top:40vh;
    /*margin-top: 150px;
    margin-top:300px;*/
}
.dsp3 .content>.header {
    padding-top:35.5vh;
    margin-top:35.5vh;
}
.content>.paragraph {
  grid-row: 2/3;
  line-height: 1.5;
    display: none;
}
.heading {
    font-size:2.75em;
    margin:0;
    font-weight:700;
}
.subheading {
    font-size:1.25em;
    font-weight:600;
    margin-bottom:0.5em;
    color:#15e4cd;
    
}
.subheading i {
    font-style:normal;
    display:inline-block;
    background:#15e4cd;
    color:#293240;
    border-radius:100%;
    width:1.2em;
    height:1.2em;
    text-align:center;
    text-shadow:none;
    font-size:.8em;
    margin-top:.15em;
    vertical-align:top;
    box-shadow:0.1vmin 0.1vmin 0.6vmin rgb(0 0 0);
}
.dsp3 .content-section:nth-child(n+1) .heading {
    font-size:2.65em;
    color:#fff;
}
.dsp3 .content-section:nth-child(n+1) .paragraph {
    font-size:.95em;
    line-height:1.6em;
    color:#15e4cd;
    font-weight:600;
    letter-spacing:-.02em;
}
.dsp3 .content-section:nth-child(n+1) .interview {
    max-width:371px;
    height:auto;
    margin:.3em 0 .5em -.2em;
}
.dsp3 .content-section:nth-child(2) .interview {
    /*max-width:407px;
    margin:.8em 0 .5em 0;*/
    /*임시값*/
}
/*.dsp3 .content-section:nth-child(1) .interview::after {*/
.dsp3 .content-section:nth-child(2) .interview::after {
    /*content:'';*/
    /*display:block;*/
    position:absolute;
    left:0;
    top:0;
    background-size:cover;
    background:url(../imgs/dsp_high.png);
   /* background-position:0 -12px;*/
    width:60px;
    height:50px;
    max-width:192px;
    max-width:100px;
    /*max-height:100%;*/
    z-index:-1;
    /*max-height:132px;*/
}
.interview>img {
    width:100%;
}
.dsp3 .content-section:nth-child(n+1) .interview::before {
    /*content:'[';*/
}
.dsp3 .content-section:nth-child(n+1) .interview::after {
    /*content:']';*/
}
.dsp3 .content-section:nth-child(n+1) .target {
    font-weight:300;
    font-size:1.25em;
    font-size:1.05em;
    line-height:1.6em;
    line-height:1.4em;
    color:#fff;
    margin-top:1.4em;
}
.dsp3 .content-section:nth-child(n+1) .plan {
    font-weight:200;
    font-size:.8em;
    margin-top:1em;
    margin-bottom:1em;
    line-height:1.55em;
    color:#fff;
}
.dsp3 .content-section:nth-child(n+1) .plan-arrow {
    color:#15e4cd;
    font-size:.6em;
    /*padding-bottom:2px;*/
    vertical-align:top;
}


/* ---------------------------------- */
.figure {
    --scale:calc( .8 + (.2 * var(--scroll-length) * var(--visible-y)) );
/*    --scale:calc( .6 + (.41 * var(--scroll-length) * var(--visible-y)) );
    --scale:calc( .6 + (.41 * var(--scroll-length) * var(--visible-y)) );*/
    position:sticky;
    top:0;
    top:111px;
    left:0;
    margin:0 auto;
    display:block;
    overflow:hidden;
    will-change:transform;
    transform:scale(var(--scale));
}
.figure:before {
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  z-index:1;
 /* background-color: black;*/
  /*opacity: calc( var(--visible-y) );*/
    opacity:.4;
}
.figure > img {
  display:block;
  will-change:transform;
  /*transform:scale(calc(1 / var(--scale)));
  transform:scale(calc(1 / var(--scale)));*/
    transform:translateY(50%);
}

/* ---------------------------------- */
.char {
  display:inline-block;
  opacity:calc( 1 + ( ( var(--viewport-y) * 1.5 ) - var(--char-percent) ) );
}

.dsp2 .content-section:nth-child(4) .content>.header,
.dsp2 .content-section:nth-child(5) .content>.header {
    padding-top:41.5vh;
    margin-top:41.5vh;
}
.dsp2 .content-section:nth-child(6) .content>.header {
    padding-top:37.5vh;
    margin-top:37.5vh;
}



/*
* 미디어쿼리 시작
*/
@media (min-width: 1280px) and (max-width:1366px) {
    /*랩탑용*/
    .dsp2 section:not(:first-child),
    .dsp3 section:nth-child(n+2):nth-child(-n+4){
        width:78%;
    }
    
    .dsp2 .content-section:nth-child(2) .figure>ul>li {
        transform:translateX(0);
    }
    
    .dsp2 .content-section:nth-child(3) .figure>ul>li {
        transform:translateX(4%);
    }
    
    .dsp2 .content-section:nth-child(4) .figure>ul>li {
        transform:translateX(3%);
    }
    .dsp2 .content-section:nth-child(5) .figure>ul>li {
        transform:translateX(1.5%);
    }
    .dsp2 .content-section:nth-child(6) .figure>ul>li {
        width:75%;
        transform:translate(0%, -2%);
    }
    .dsp2 .content-section:nth-child(6) .content>.header {
        padding-top:39.5vh;
        margin-top:39.5vh;
    }
    .dsp3 .content-section:nth-child(n+1) {
        transform:translateX(.4%);
    }
  
}


/*@media (max-width: 1024px) {*/
@media all and (min-width:1024px) and (max-width:1279px) {
    /*//브라우저 창 width가 1023px보다 커지는 순간부터 적용 
	//태블릿 가로형*/
    .intro-section>p.-mo {
        display:none;
    }
    .content-section:not(:first-child) {
        padding:0 8%;
    }
    .content-section:nth-child(3) .figure>ul>li {
        transform:translateY(0);
    }
    .dsp2 .content-section:nth-child(3) .figure>ul>li {
        width:75%;
        transform:translateX(5%);
    }
    .content>.header {
        padding-left:8%;
    }
    .dsp2 .content-section:nth-child(2) .content>.header,
    .dsp2 .content-section:nth-child(5) .content>.header {
        padding-top:42vh;
        margin-top:42vh;
    }
    .dsp2 .content-section:nth-child(6) .figure>ul>li {
        width:80%;
    }
    .dsp3 .content-section:nth-child(2) .figure>ul>li:last-child, 
    .dsp3 .content-section:nth-child(3) .figure>ul>li, 
    .dsp3 .content-section:nth-child(4) .figure>ul>li:last-child {
        transform:translateY(20%);
    }
         
}


/*@media all and (min-width: 768px){*/
/*@media all and (min-width: 821px){*/
@media all and (min-width:768px) and (max-width:1023px) {
    /*/////////////*/
    /*//브라우저 창 width가 767px보다 커지는 순간부터 적용 
	//태블릿 세로형*/
    .intro-section>p.-pc,
    .heading.-pc {
        display:none;
    }
    
    .intro-section>p.-mo,
    .heading.-mo {
        display:block;
    }
    .intro-section>p.-mo {
        width:80%;
    }
    .content-section:not(:first-child) {
        padding:0 8%;
    }
    .figure {
      /* top:90px;*/
    }
    
    .figure>ul {
        width:100%;
        transform:translateY(0);
        justify-content:space-around;
        /*flex-direction:column;
        align-items:flex-end;*/
    }
    
    .content-section:nth-child(2) .figure>ul {
        /*flex-direction:column-reverse;*/
    }
    .content-section:nth-child(3) .figure>ul>li:first-child {
        /*margin-left:-10%;*/
    }
    .content-section:nth-child(3) .figure>ul>li:last-child {
        margin-left:0;
        /*margin-right:-10%;*/
    }
    .content-section:nth-child(3) .figure>ul>li {
        /*    transform: translateY(15%);*/
    }
    .dsp2 .content-section:nth-child(5) .figure>ul>li {
        width:90%;
    }
    .content-section:nth-child(6) .figure>ul>li {
        transform:translateY(0);
    }
    .dsp2 .content-section:nth-child(6) .figure>ul>li {
        transform:translateY(-10%);
    }
    .dsp3 .content-section:nth-child(2) .figure>ul>li:last-child, 
    .dsp3 .content-section:nth-child(3) .figure>ul>li, 
    .dsp3 .content-section:nth-child(4) .figure>ul>li:last-child {
        width:76%;
        margin-bottom:0;
        transform:translateY(-25%);
    }
    .dsp3 .content-section:nth-child(n+1) .interview {
        margin:.3em auto .8em;
    }
    .dsp3 .content-section:nth-child(n+1) .heading {
        font-size:7.6vw;
    }
    .dsp3 .content-section:nth-child(n+1) .paragraph {
    }
    .dsp3 .content-section:nth-child(n+1) .target {
        font-size:3.35vw;
        line-height:1.4em;
        margin-top:1.2em;
    } 
    .recom {
        font-size:3.35vw;
        letter-spacing:-.03em;
        word-break:keep-all;
        display:inline-block;
        margin-top:.2em;
    }
    .plan,
    .res {
        display:none;
    }
    .content>.header {
        /*transform:translateX(-40%);*/
        /*padding-left:8%;*/
        text-align:center;
        padding-top:40vh;
        margin-top:40vh;
    }
    .dsp3 .content>.header {
        padding-top:25.5vh;
        margin-top:25.5vh;
    }
    .outro-section>p:first-child {
        font-size: 8vw;
        font-weight: 600;
    }
    .outro-section>p:nth-child(2) {
        font-size:5vw;
    }
}





/*@media (max-width: 820px) {*/
@media all and (max-width: 767px) {
    /*브라우저 창 width가 768px보다 작아지는 순간부터 적용*/
    
    .content-section:nth-child(3) .figure>ul>li:first-child {
        padding-bottom:100%;
    }
    .content-section:nth-child(3) .figure>ul>li:last-child {
        padding-bottom:100%;
    }
    .content-section:nth-child(3) .figure>ul>li {
        width:100%;
        height: 0;
        max-width: 250px;
        max-height: 250px;
        transform: translateY(15%);
    }
    
    .content-section {
        transform:translateY(-10%);
    }
    .outro-section::before {
        background-position:30% 0;
    }
    .intro-section>p.-pc,
    .heading.-pc {
        display:none;
    }
    .intro-section>p.-mo,
    .heading.-mo {
        display:block;
    }
    .intro-section>p:first-child {
        font-size:6.8vw;
        font-weight:700;
    } 
    .intro-heading {
        margin-top:2vh;
        font-size:10.8vw;
        font-weight:500;
        margin:0 5%;
    }
    .intro-section>p.-pc,
    .outro-section>p.-pc {
        display:none;
    }
    .intro-section>p.-mo {
        margin-top:5vh;
        font-size:4.6vw;
        display:block;
        padding:0 15%;
    }
    .outro-section>p:first-child {
        font-size:7.95vw;
        font-size:8vw;
        line-height:1.5em;
        padding:0 7%;
        margin-top:0em;
        letter-spacing:-.02em;
    }
    .outro-section>p.-mo {
        display:block;
        font-size:4.6vw;
        font-size:5.2vw;
        line-height:1.5em;
        margin-top:5vh;
        padding:0 8%;
        margin-top:1em;
        word-break:keep-all;
    }
    .buttons {
        margin:0auto;
        text-align:center;
        padding-top:6vh;
    }
    .buttons>li {
        float:none;
        width:84%;
        display:inline-block;
        /*height:67px;*/
        /*line-height:2em;*/
        margin:0 auto;
        text-align:center;
        height:67px;
    }
    .buttons>li:last-child {
        margin-left:0;
        margin-top:.7em;
    }
    .buttons>li>a {
       /* font-size:22px;*/
        width:100%;
        /* font-size: 2.3vh; */
        /* font-size: 1.15vw; */
        color: #fff;
        display: block;
        /*line-height: 8.4vh;
        line-height: 79px;*/
        font-size:1.34em;
        line-height:66px;
    }
    .content-section,
    .content {
        padding:0 6%;
    }
    .dsp3 .content {
        padding:0;
    }
    .outro-section::after {
        background-size: 200% 200%;
        animation: gradient 8s ease infinite;
    }
    /*모바일 수정*/
    .figure {
        height:calc(100vh - 71px);
        height:calc(100vh - 30vh);
        top:50vh;
        /*모바일수정*/
        top:0;
        height:100vh;
        /*height:200vh;*/
        position:relative;
        position:inherit;
        top: -30vh;
        height: 100vh;
        padding: 0 3%;
        /*transform:none;*/
        /*height:calc(100vh + 30vh);*/
    }
    .dsp2 .figure {
        padding:0;
        /*height: calc(100vh - 30vh);*/
        /*height:100%;*/
        /*top:-70vh;*/
    }
    .figure:before {
        display: none;
    }
    .figure>ul {
        margin:0 auto;
        top:50%;
        top:60%;
        transform:translateY(-60%);
        display:flex;
        flex-direction:column;
        justify-content:center;
        flex-wrap:wrap;
        align-content:center;
        align-items:center;
        width:100%;
        /*모바일수정*/
        display: block;
        margin:0 auto;
        text-align: center;
       
  
        transform:none;
    }
    .figure>ul>li {
        margin-left:0;
        text-align:right;
        width:65%;
    }
    .content-section:nth-child(2) .figure>ul>li:first-child,
    .content-section:nth-child(4) .figure>ul>li,
    .content-section:nth-child(5) .figure>ul>li {
        width:100%;
    }
    .content-section:nth-child(2) .figure>ul>li:last-child {
        /*display:none;*/
        width:100%;
        margin-left:0;
    }
    .figure>ul>li>img {
        width:100%;
    }
    
    .figure>ul {
        width:100%;
        transform:translateY(-60%);
        /*justify-content:space-around;*/
        /*flex-direction:column;
        align-items:flex-end;*/
    }
    
    
    /*////////// 320321 모바일 수정 //////////*/
    section:not(:first-child) {
        animation:none;
    }
    .content {
        position:inherit;
        height:auto;
        display:block;
        transform:none;
        left:0;
    }
    .content-section {
        /*--scroll-length: 1.5;*/
        height:auto;
        /*height:100vh;*/
        width:100%;
        transform:none;
    }
    .dsp2 .content-section {
        height:60%;
    }
    /*.dsp2 .content-section,*/
    .dsp3 .content-section {
        height:100vh;
    }
    
    .figure>ul>li[data-scroll] {
        transition:opacity 1s;
        opacity:0;
        transform:none;
        opacity:1;
    }
    .figure>ul>li[data-scroll="in"] {
        opacity:1;
        transform:translateX(0) scale(1);
        transform:none;
        opacity:1;
    }
    .figure>ul>li:nth-child(even)[data-scroll="out"] {
        opacity:0;
        transform:translateX(-100%) scale(0.1);
        transform:none;
        opacity:1;
    }
    .figure>ul>li:nth-child(odd)[data-scroll="out"] {
        opacity:0;
        transform:translateX(+100%) scale(0.1);
        transform:none;
        opacity:1;
    }
    .figure>ul>li>img {
        display:block;
        width:100%;
        height:auto;
        /*max-width: 100%;*/
        -o-object-fit:cover;
         object-fit:cover;
        -o-object-position:center center;
         object-position:center center;
        /*transform:translateY(-50%);*/
    }
    
    .dsp1 .content-section:nth-child(2) .figure {
        top:-8vh;
    }
    .dsp1 .content-section:nth-child(3) .figure {
        top:-8vh;
    }
    .dsp3 .content-section:nth-child(2) .figure {
        top:-38vh;
    }
    .dsp3 .content-section:nth-child(3) .figure {
        top:-20vh;
    }
    .dsp3 .content-section:nth-child(4) .figure {
        top:-38vh;
    }
    .dsp1 .content-section:nth-child(4) .content {
        margin-top:55vh;
    }
    .dsp1 .content-section:nth-child(5) .content {
        margin-top:-20vh;
    }
    .dsp1 .content-section:nth-child(6) .content {
        margin-top:-10vh;
    }
    .dsp1 .content-section:nth-child(6) .figure {
        margin-top:25vh;
        height: calc(100vh + 30vh);
    }
    .dsp2 .content-section:nth-child(3) .figure {
        margin-top:0vh;
        top:0;
    }
    .dsp2 .content-section:nth-child(3) .content {
        margin-top:-15vh;
    }
    /*.dsp2 .content-section:nth-child(4) .content {
        margin-top:-55vh;
    }*/
    .dsp2 .content-section:nth-child(5) .content {
        margin-top:-10vh;
    }
    .dsp2 .content-section:nth-child(6) .content {
        margin-top:20vh;
    }
    .dsp2 .content-section:nth-child(2) .figure {
        top:-40vh;
    }
    .dsp2 .content-section:nth-child(4) .figure {
        top:-40vh;
    }
    .dsp2 .content-section:nth-child(5) .figure {
        top:-25vh;
    }
    .dsp2 .content-section:nth-child(6) .figure {
        top:-25vh;
    }
    .dsp2 .content>.header {
       /*margin-top:5vh;*/
        /*     height: calc(100vh - 30vh);*/
    }
    .dsp2 .content-section:nth-child(4) .content>.header,
    .dsp2 .content-section:nth-child(5) .content>.header {
        padding-top:0vh;
        margin-top:0vh;
    }
    .dsp2 .content-section:nth-child(6) .content>.header {
        padding-top:0vh;
        margin-top:0vh;
    }
    
    /*////////////////////*/
    
    
    
    .content-section>.figure>ul>li {
        /*width:100%;*/
    }
    .content-section:nth-child(2) .figure>ul>li:first-child {
        width:100%;
    }
    .content-section:nth-child(2) .figure>ul>li:last-child {
        width:50%;
    }
    /*.content-section:nth-child(2) .figure>ul>li:last-child {
        display:none;
    }*/
    .dsp3 .content-section:nth-child(3) .figure>ul>li {
        transform:translateY(-14%)
    }
    .dsp3 .content-section:nth-child(2) .figure>ul>li:last-child, 
    .dsp3 .content-section:nth-child(4) .figure>ul>li:last-child {
        transform:translateY(18%)
    }
    .dsp2 .content-section:nth-child(2) .figure>ul>li:last-child/*,
    .dsp3 .content-section:nth-child(2) .figure>ul>li:last-child*/ {
        width:90%;
        /*display:block*/;
    }
    .content-section:nth-child(3) .figure>ul>li:last-child {
        margin-left:0;
    }
    .content-section:nth-child(2) .figure>ul>li:first-child,
    /*.content-section:nth-child(3) .figure>ul>li:first-child,*/
    .content-section:nth-child(6) .figure>ul>li:not(last-child) {
        margin-bottom:5%;
    }
    .dsp2 .content-section:nth-child(5) .figure>ul>li,
    .dsp2 .content-section:nth-child(3) .figure>ul>li {
        width:90%;
        width:100%;
    }
    .dsp2 .content-section:nth-child(6) .figure>ul>li {
        width:100%;
    }
    .dsp3 .content-section:nth-child(2) .figure>ul>li:last-child, 
    .dsp3 .content-section:nth-child(3) .figure>ul>li, 
    .dsp3 .content-section:nth-child(4) .figure>ul>li:last-child {
        width:92%;
        margin-bottom:0;
    }
    .dsp3 .content-section:nth-child(n+1) .interview {
        margin:.3em auto .8em;
        text-align:center;
        width:76%;
    }
    .dsp3 .content-section:nth-child(n+1) .heading {
        font-size:7.6vw;
    }
    .dsp3 .content-section:nth-child(n+1) .paragraph {
    }
    .dsp3 .content-section:nth-child(n+1) .target {
        font-size:4vw;
        line-height:1.4em;
        margin-top:1.2em;
    } 
    .recom {
        font-size:4vw;
        letter-spacing:-.03em;
        word-break:keep-all;
        display:inline-block;
        margin-top:.2em;
    }
    .plan,
    .res {
        display:none;
    }
    .content-section:nth-child(6) .figure>ul>li {
        transform:translateY(0);
        width:80%;
    }
    /*.content-section:nth-child(6) .figure>ul>li:nth-child(2) {
        display:none;
    }*/
    .content-section:nth-child(6) .figure>ul>li:not(:first-child) {
        margin-left:0;
    }
    .content-section:nth-child(3) .content {
        top:-4vh;
    }
    .dsp2 .content-section:nth-child(5) .content>.header {
        padding-top:38.5vh;
        margin-top:38.5vh;
        padding-top:0vh;
        margin-top:0vh;
    }
    /*.content-section:nth-child(6) .content {
        top:-7vh;
    }*/
    .content>.header {
        /*transform:translateX(-40%);*/
        /*padding-left:8%;*/
        text-align:center;
        padding-top:40vh;
        margin-top:40vh;
        /*모바일수정*/
        padding-top:0vh;
        margin-top:20vh;
    }
    .dsp3 .content>.header {
        padding-top: 35.5vh;
        margin-top: 35.5vh;
        padding-top:0;
        margin-top:20vh;
    }
    .content-section .content .interview,
    .content-section .content .paragraph {
        opacity:1;
    }
    .content-section .content .subheading {
        font-size:4.3vw;
        font-size:6vw;
        opacity:1;
        word-break:keep-all;
        line-height:1.3em;
    }
    .subheading i {
        line-height:1.3em;
    }
    .heading {
        font-size:8vw;
    }
    
 
}



