section{overflow: hidden;}
.s_visual{position: relative; max-width: 1920px; margin: 0 auto; overflow: hidden; background-color: #fff;}
.s_visual .bar{
	width: 15px; height: 335px;
	position: absolute;
}
.s_visual .bar.n1{left: 0; top: 0;}
.s_visual .bar.n2{right: 0; bottom: 0;}

.s_visual .bar div{background-color: #000; width: 100%; height: 100%;}
.s_visual .bar.n1 div{transform-origin: center top;}
.s_visual .bar.n2 div{transform-origin: center bottom;}

.s_visual .wrap{
	padding-top: 60px; position: relative;
}
.s_visual .top{
	display: flex; align-items: flex-start; justify-content: space-between; gap: 60px; flex-wrap: wrap;
	margin-bottom: 120px;
}
.s_visual .top .left{}
.s_visual .top .left .small{
	font-size: 13px; letter-spacing: -0.04em; line-height: calc(16/13); font-weight: 300;
	margin-bottom: 70px;
}
.s_visual .top .left .small p{}
.s_visual .top .left h1{
	font-size: 230px; letter-spacing: -0.04em; line-height: 0.8;
	max-width: calc(730/230*1em); font-weight: 500;
}
.s_visual .top .left h1 .hidden{
	overflow: hidden; padding-top: 0.1em; padding-bottom: 0.2em; box-sizing: border-box;
}
.s_visual .top .left h1 .hidden:nth-child(2){margin-top: -0.25em;}
.s_visual .top .left h1 .hidden > .txt{
	display: inline-block;
	position: relative;
}
.s_visual .top .left h1 .hidden .dot{
	display: block; position: absolute; top: 10%; left: 110%;
}
.s_visual .top .left h1 .hidden .dot::before {
	content:''; display: block;
	width: calc(50/230*1em); height: calc(50/230*1em);
	min-width: 20px; min-height: 20px; border-radius: 50%;
	background: radial-gradient(circle,rgba(0, 0, 0, 1) 20%, rgba(255, 255, 255, 0) 60%);
	animation: floating30_per forwards infinite 3s;
}
.s_visual .top .left h1 .marquee{
	white-space: nowrap; display: flex; align-items: center; justify-content: flex-start;
	transform: translateY(-8%);
}
.s_visual .top .left h1 .marquee .txt{
	padding: 0 0.2em; box-sizing: border-box;
}
.s_visual .top .left h1 .marquee.on .txt{
	animation: marquee forwards infinite 14s linear;
}
.s_visual .top .left .build{
	font-size: 44px; font-weight: 600; letter-spacing: -0.04em;
	text-align: right; display: flex; align-items: center; justify-content: flex-end; gap: 50px;
}
.s_visual .top .right{
	text-align: right; padding-top: 110px; box-sizing: border-box;
	min-width: 330px;
}
.s_visual .top .right h2{
	font-size: 22px; line-height: calc(34/22);
}
.s_visual .top .right h2 div{
	display: flex; align-items: center; justify-content: flex-end;
	overflow: hidden;
}
.s_visual .top .right h2 div p{
	font-size: calc(25/22*1em); letter-spacing: -0.02em; text-align: left; min-width: calc(220/25*1em);
}
.message .s_visual .top .right h2 div p{min-width: calc(100/25*1em);}
.s_visual .top .right h2 div span{
	font-family: 'GmarketSans', sans-serif;
	font-weight: 300; letter-spacing: -0.025em;
}
.s_visual .top .right .tab{
	margin-top: 100px; margin-bottom: 120px;
	display: flex; align-items: center; justify-content: flex-end;
	font-size: 25px; color: #bcbcbc;
}
.s_visual .top .right .tab a{padding: 0 0.3em;}
html.pc .s_visual .top .right .tab a:hover{color: var(--blue);}
.s_visual .top .right .tab a.on{color: #000 !important; text-decoration: line-through;}
.s_visual .top .right .tab a p{}
.s_visual .top .right .rotate{
	font-family: 'GmarketSans', sans-serif; font-weight: 300; font-size: 22px; letter-spacing: -0.06em;
	text-align: left;
	transform-origin: left top; transform: rotate(90deg);
}
.s_visual .top .right .rotate p{margin-bottom: 12px;}
.s_visual .top .right .rotate .dotBx{
	display: flex; gap: 1em;
}
.s_visual .top .right .rotate .dotBx::before,
.s_visual .top .right .rotate .dotBx::after {
	content:''; display: block; width: calc(15/22*1em); height: calc(15/22*1em); border-radius: 50%;
	background-color: #000;
}
.s_visual .top .right .big{
	font-family: 'GmarketSans', sans-serif;
	font-size: 48px; font-weight: 500; line-height: calc(59/48);
	position: absolute; right: 0; bottom: 0;
}
.s_visual .top .right .big p{min-height: 1.229em;}
.s_visual .bottom{}
.s_visual .bottom h3{
	font-size: 25px;  line-height: 1.3; margin-bottom: 80px;
}
.s_visual .bottom h3 div{
	display: flex; align-items: center; justify-content: flex-start;
}
.s_visual .bottom h3 div p{}
.s_visual .bottom h3 div i{margin-bottom: -10px; display: block; animation: floating10 forwards infinite 3s;}
.s_visual .bottom small{
	display: flex; align-items: flex-start; font-size: 22px;  font-family: 'GmarketSans', sans-serif; font-weight: 300;
	letter-spacing: -0.02em; line-height: 1.4; gap: 0.25em;
}
.s_visual .bottom small::before {
	content:''; display: block; min-width: calc(15/22*1em); min-height: calc(15/22*1em);
	border-radius: 50%; background-color: #000; margin-top: 0.25em;
}


/* 모션 셋팅 */
.s_visual .bar div{transform: scaleY(0);}
.s_visual .top .left h1 .hidden > *{transform: translateY(120%);}
.s_visual .top .left h1 .hidden .dot{transform: scale(0.2); opacity: 0;}
.s_visual .top .right h2 div > *{transform: translateY(110%);}
.s_visual .top .left .build{opacity: 0; transform: translateY(60px);}
.s_visual .top .right .tab > *{opacity: 0; transform: translateY(60px);}
.s_visual .top .right .rotate > *{opacity: 0; transform: translateY(60px);}

.s_visual .bottom h3 div{opacity: 0; transform: translateY(60px);}
.s_visual .bottom small{opacity: 0; transform: translateY(60px);}

@media screen and (max-width:1600px) {
	.s_visual .bar{width: 10px; height: 30%; }
	.s_visual .top .left h1{font-size: calc(200/1600*100vw); }
}
@media screen and (max-width:1440px) {}
@media screen and (max-width:1280px) {
	.s_visual .top .right{min-width: unset;}
	.s_visual .top .right h2{font-size: 20px; }
	.s_visual .top .right .rotate{display: none;}

	.s_visual .bottom h3{font-size: 20px; }
	.s_visual .bottom small{font-size: 20px; }
}
@media screen and (max-width:1024px) {
	.s_visual .top .right h2{font-size: 14px; }
	.s_visual .top .left .build{font-size: 20px; gap: 1em; }
}
@media screen and (max-width:820px) {
	.s_visual .bar{display: none;}

	.s_visual .top{flex-direction: column; position: relative; gap: 40px;}
	.s_visual .top .left h1{font-size: calc(130/820*100vw); }
	.s_visual .top .right{padding-top: 0;}
	.s_visual .top .right h2 div{justify-self: flex-start;}
	.s_visual .top .right .tab{margin-top: 30px; margin-bottom: 0; justify-content: flex-start; gap: 6px; font-size: 22px; }
	.s_visual .top .right .tab a{padding: 0.3em 0.4em; border-radius: 2px; border: 1px solid #ddd; box-sizing: border-box;}
	.s_visual .top .right .tab a.on{text-decoration: unset; background-color: var(--blue); color: #fff !important; border-color: var(--blue);}
	.s_visual .top .right .big{font-size: max(calc(40/820*100vw),30px); }

	.s_visual .bottom h3{margin-bottom: 30px; font-size: 18px; }
	.s_visual .bottom small{font-size: 16px; }
}
@media screen and (max-width:500px) {
	.s_visual .top{gap: 10px;}
	.s_visual .top .left{width: 100%;}
	.s_visual .top{margin-bottom: 60px; position: unset; gap: 30px;}
	.s_visual .top .left .small{font-size: 12px; margin-bottom: 30px;}
	.s_visual .top .left h1{font-size: min(calc(140/500*100vw),100px); max-width: 100%;}
	.s_visual .top .right .tab{font-size: 18px; margin-top: 20px;}

	.s_visual .bottom h3{font-size: 14px; margin-bottom: 20px;}
	.s_visual .bottom small{font-size: 12px; }
}
@media screen and (max-width:320px) {}




.s_list{background-color: #fff;}
.s_list .marquee{
	font-size: 322px; font-weight: 600; color: #efeff4;
	display: flex; align-items: flex-start; justify-content: flex-start;
	white-space: nowrap; margin-bottom: -0.45em;
}
.s_list .marquee p{padding: 0 0.2em; box-sizing: border-box; animation: marquee forwards infinite 18s linear;}
.s_list .wrap{}
.s_list .wrap ul{
	display: flex; gap: 60px 30px; flex-wrap: wrap; margin-bottom: 80px;
}
.s_list .wrap ul li{
	width: calc(100% / 3 - (30px * 2 / 3));
}
.s_list .wrap ul li a{}
.s_list .wrap ul li a .imgBx{position: relative; background-color: #000; margin-bottom: 20px; overflow: hidden;}
.s_list .wrap ul li a .imgBx::before {content:''; display: block; padding-bottom: 100%;}
.s_list .wrap ul li a .imgBx img{
	position: absolute; left: 0; top: 0; width: 100%; height: 100%;
	object-fit: cover; transition: transform 0.8s;
}
html.pc .s_list .wrap ul li a:hover .imgBx img{transform: scale(1.1);}
.s_list .wrap ul li a .txtBx{
	display: flex; align-items: flex-start; gap: 22px;
}
.s_list .wrap ul li a .txtBx .date{
	font-size: 46px; line-height: 0.8; letter-spacing: -0.02em;
}
.s_list .wrap ul li a .txtBx .date p{transform: translateY(-8%);}
.s_list .wrap ul li a .txtBx h3{
	font-family: 'GmarketSans', sans-serif; font-size: 14px; font-weight: 500; line-height: 1.4;
	letter-spacing: -0.025em;
}
.s_list .wrap ul li a .txtBx h3 p{
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.s_list .wrap ul li a .tagBx{
	display: flex; flex-wrap: wrap; gap: 5px; margin-top: 20px;
}
.s_list .wrap ul li a .tagBx .tag{
	font-family: 'GmarketSans', sans-serif; font-size: 14px; font-weight: 500; letter-spacing: -0.025em;
	color: #fff; background-color: #b5b5b5; border-radius: 3px; padding: calc(8/14*1em) calc(12/14*1em); padding-bottom: calc(5/14*1em);
}
.s_list .wrap ul li a .tagBx .tag p{}

.s_list .wrap .bottom{text-align: center; margin-bottom: 120px;}
.s_list .wrap .bottom h4{
	font-family: 'GmarketSans', sans-serif; font-weight: 18; font-weight: 300; line-height: calc(28/18);
	margin-bottom: 20px;
}
.s_list .wrap .bottom h4 b{font-weight: 500;}
.s_list .wrap .bottom ._moreBtn{}
.s_list .wrap .bottom ._moreBtn a{
	background-color: #000; color: #fff;
	display: inline-block; border-radius: 3px; letter-spacing: -0.04em;
	padding: calc(13/16*1em) calc(23/16*1em); box-sizing: border-box;
}
html.pc .s_list .wrap .bottom ._moreBtn a:hover{background-color: var(--blue);}
.s_list .wrap .bottom ._moreBtn p{}

@media screen and (max-width:1600px) {}
@media screen and (max-width:1440px) {}
@media screen and (max-width:1280px) {}
@media screen and (max-width:1024px) {
	.s_list .marquee{font-size: max(calc(322/1024*100vw),140px); }

	.s_list .wrap ul{gap: 40px 20px;}
	.s_list .wrap ul li{width: calc(50% - (20px / 2));}
	.s_list .wrap ul li a .txtBx .date{font-size: 40px; }
}
@media screen and (max-width:820px) {
	.s_list .wrap ul li a .txtBx{gap: 14px;}
	.s_list .wrap ul li a .txtBx .date{font-size: 30px; }
}
@media screen and (max-width:500px) {
	.s_list .wrap ul{gap: 40px 8px;}
	.s_list .wrap ul li{width: calc(50% - (8px / 2));}
	.s_list .wrap ul li a .imgBx{margin-bottom: 12px;}
	.s_list .wrap ul li a .txtBx{flex-direction: column; gap: 10px; padding-right: 4px; box-sizing: border-box;}
	.s_list .wrap ul li a .txtBx .date{font-size: 20px; }
	.s_list .wrap ul li a .txtBx h3{font-size: 12px; }

	.s_list .wrap ul li a .tagBx{gap: 4px;}
	.s_list .wrap ul li a .tagBx .tag{font-size: 10px; border-radius: 2px;}

	.s_list .wrap .bottom{margin-bottom: 90px;}
	.s_list .wrap .bottom ._moreBtn a{font-size: 14px; }
}
@media screen and (max-width:320px) {
	.s_list .wrap ul li{width: 100%;}
}



/* 뷰페이지 */
._view{ padding-top: 250px; box-sizing: border-box; padding-bottom: 65px; }
._view .tops{ text-align: center;  }
._view .tops span{ font-size: 20px; letter-spacing: -0.02em; font-weight: 500; color: #0314ff; }
._view .tops h1{ font-size: 40px; letter-spacing: -0.03em; line-height: 1.5; font-weight: 500; font-family: 'GmarketSans'; margin-top: 15px; }
._view .tops em{ font-size: 16px; letter-spacing: -0.02em; color: rgba(0,0,0,0.5); margin-top: 12px; display: block; }

._view .tags{ margin-top: 15px; padding-bottom: 15px; border-bottom: 1px solid rgba(0,0,0,0.2); }
._view .tags .square{ display: flex; gap: 10px; flex-wrap: wrap; }
._view .tags li{ border: 1px solid #000; box-sizing: border-box; font-size: 16px; letter-spacing: -0.02em; padding: 5px 10px; }
._view .tags p{ font-family: 'GmarketSans'; font-size: 14px; font-weight: 500; letter-spacing: -0.02em; color: rgba(0,0,0,0.5); margin-top: 15px; line-height: 1.3; }

._view .editor{ padding-top: 30px; padding-bottom: 90px; box-sizing: border-box; font-size: 18px; letter-spacing: -0.03em; font-family: 'Pretendard'; line-height: calc(28 / 18); line-height: 1; min-height: 200px; }

.backto{ padding-top: 40px; display: flex; align-items: center; justify-content: center; border-top: 1px solid rgba(0,0,0,0.2); }
._homepage .backto{ border: none; justify-content: flex-start; }
.backto > a{ display: flex; align-items: flex-end; justify-content: center; gap: 13px; font-size: 37px; letter-spacing: -0.02em; }
.backto > a img{ transition-duration: 0.3s; }
._view .tags .square.white{ color: #fff; }
._view .tags .square.white li{ border-color: #fff; }

@media screen and (min-width: 821px){
    .backto > a:hover img{ transform: rotateY(180deg); }
}

@media screen and (max-width: 1280px){
    ._view{ padding-top: 150px; padding-bottom: 50px; }
    ._view .tops span{ font-size: 16px; }
    ._view .tops h1{ font-size: 35px; }
    ._view .tops em{ font-size: 14px; }

    ._view .editor{ padding-bottom: 30px; font-size: 16px; }
    .backto > a{ font-size: 32px; }
}

@media screen and (max-width: 820px){
    ._view{ padding-top: 120px; }
    ._view .tops span{ font-size: 14px; }
    ._view .tops h1{ font-size: 26px; }
    ._view .tops em{ font-size: 12px; }

    ._view .editor{  font-size: 14px; }
    .backto > a{ font-size: 28px; }
}

@media screen and (max-width: 500px){
    ._view{ padding-top: 100px; }
    ._view .tops span{ font-size: 13px; }
    ._view .tops h1{ font-size: 24px; }

    .backto > a{ font-size: 24px; }
    .backto > a img{ width: 18px; }
}


.insight._view{ padding: 0; }
.insight._view .viewVis{ width: 100%; position: relative; overflow: hidden; color: #fff; display: flex; align-items: center; justify-content: center;}
.insight._view .viewVis::after{ content: ''; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 1; background-color: rgba(0,0,0,0.5); }
.insight._view .viewVis .bg{ height: calc(var(--vh) * 100); width: 100%; left: 0; top: 0; z-index: 0; }
.insight._view .viewVis .bg img{ width: 100%; height: 100%; object-fit: cover;  }
.insight._view .viewVis .wrap{
	position: absolute; z-index: 2; display: flex; flex-direction: column; justify-content: center; height: 100%; box-sizing: border-box;
}
.insight._view .viewVis .wrap .topleft{ position: absolute; top: 40px; left: 0; font-size: 16px; letter-spacing: -0.02em; }

.insight._view .viewVis .wrap .realcon .square{ display: flex; gap: 10px; flex-wrap: wrap; }
.insight._view .viewVis .wrap .realcon .square li{ padding: 5px 10px; box-sizing: border-box; font-size: 16px; letter-spacing: -0.02em; border: 1px solid #fff; }

.insight._view .viewVis .wrap .realcon > strong{ font-size: 50px; font-weight: 700; letter-spacing: -0.04em; font-family: 'GmarketSans'; margin-top: 26px; display: block; line-height: 1.4; }
.insight._view .viewVis .wrap .realcon > p{ font-size: 14px; font-weight: 500; letter-spacing: -0.02em; margin-top: 13px; line-height: 1.3; font-family: 'GmarketSans'; }
.insight._view .viewVis .wrap .realcon > span{ display: block; font-size: 14px; letter-spacing: -0.02em; margin-top: 12px; color: rgba(255,255,255,0.8); }

.insight._view .viewVis .wrap .scrolldown{ position: absolute; left: 0; bottom: 70px; font-size: 25px; letter-spacing: -0.02em; display: flex; align-items: baseline; gap: 3px; }

.insight._view .scrollarea{ position: relative; background-color: #fff; }
.insight._view .scrollarea .pin-spacer{ width: 0 !important; }
.insight._view .scrollarea .pin{ position: absolute; top: 0; left: 0; padding-top: 175px; width: 100%; }
.insight._view .scrollarea .pin .wrap{ display: flex; flex-direction: column; align-items: flex-start; }

.insight._view .scrollarea .pin .wrap .lists{ position: relative; }
.insight._view .scrollarea .pin .wrap .lists::before{ content: ''; display: block; width: 8px; height: 8px; background-color: #000; position: absolute; bottom: calc(100% + 10px); left: 0; }
.insight._view .scrollarea .pin .wrap .lists p{ font-size: 18px; letter-spacing: -0.02em; }
.insight._view .scrollarea .pin .wrap > ul{ padding: 10px; box-sizing: border-box; max-width: 250px; }
.insight._view .scrollarea .pin .wrap > ul li{ padding: 7px 0; font-size: 14px; letter-spacing: -0.02em; font-family: 'GmarketSans'; color: #71717a; cursor: pointer; }

.insight._view .scrollarea .pin .wrap > ul li.on{ color: #0314ff; }

.insight._view .scrollarea .conts{ padding-top: 175px; padding-bottom: 65px; }
.insight._view .scrollarea .conts .cont{ margin-top: -25px; }
.insight._view .scrollarea .conts .cont .editorbx > h2{ font-size: 30px; font-weight: 600; letter-spacing: -0.02em; margin-bottom: 15px; }
.insight._view .scrollarea .conts .cont .editorbx{ padding: 25px 0; }


.insight._view .editor{ padding: 120px 0; min-height: unset; }
._blog.insight._view .editor{ line-height: 1.8; }
._view .editor img{height: auto !important;}

@media screen and (min-width: 821px){
    .insight._view .scrollarea .pin .wrap > ul li:hover{ color: #000; }
}

@media screen and (max-width: 1440px){
    .insight._view .scrollarea .pin{ display: none; }
}

@media screen and (max-width: 1280px){
    .insight._view .viewVis .wrap .realcon > strong{ font-size: 44px; }
    .insight._view .viewVis .wrap .scrolldown{ font-size: 20px; }
    .insight._view .viewVis .wrap .topleft{ font-size: 14px; top: 30px; }
    .insight._view .scrollarea .conts{ padding: 120px 0; }
    .insight._view .scrollarea .conts .cont .editorbx > h2{ font-size: 22px; }
}

@media screen and (max-width: 820px){
    .insight._view .viewVis .wrap .realcon > strong{ font-size: 35px; }
    .insight._view .viewVis .wrap .scrolldown{ font-size: 16px; }
    .insight._view .viewVis .wrap .topleft{ top: 25px; }
    .insight._view .viewVis .wrap .realcon .square li{ font-size: 14px; }

    .insight._view .scrollarea .conts{ padding: 100px 0; }
    .insight._view .scrollarea .conts .cont .editorbx > h2{ font-size: 18px; }
}

@media screen and (max-width: 500px){
    .insight._view .viewVis .wrap .realcon > strong{ font-size: 26px; }
    .insight._view .viewVis .wrap .scrolldown{ font-size: 14px; }
    .insight._view .viewVis .wrap .topleft{ top: 75px; }
    .insight._view .viewVis .wrap .realcon .square li{ font-size: 12px; }
    .insight._view .scrollarea .conts{ padding: 70px 0; }
}

