/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,button{margin:0;padding:0}
fieldset,img{border:0 none}
dl,ul,ol,menu,li{list-style:none}
blockquote, q{quotes: none}
blockquote:before, blockquote:after,q:before, q:after{content:'';content:none}
input,select,textarea,button{border-radius:0;vertical-align:middle}
input::-ms-clear{display:none}
button{border:0 none;background-color:transparent;cursor:pointer}
body{background:#fff;direction:ltr;-webkit-text-size-adjust:none}
caption, legend{ overflow:hidden;position:absolute;width:0;height:0;line-height:0;text-indent:-9999px}
body,th,td,input,select,textarea,button{font-size:100%;line-height:1.2; font-family:"Spoqa Han Sans Neo", "Apple SD Gothic Neo", Helvetica, sans-serif, Arial; font-weight:400; color:#333; letter-spacing:-1px}


.rel{position: relative;}
.z-1{z-index: 1; position: relative;}
.fc-white{color: #fff;}
.sr-only{
  position: absolute;
  display: inline-block;
  overflow: hidden;
  clip: rect(0 0 0 0);
  width: 0px;
  height: 0px;
  margin: -1px;
  padding: 0;
  word-break: keep-all;
  white-space: nowrap;
  color: transparent;
  border: 0;
  text-indent: -9999px;}
html, body {  display: block; width: 100%;  height: 100%;   margin: 0;  }
html, body {
    height: auto;
    min-height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
}
body { font-family: sans-serif;  -ms-overflow-style: none;}
::-webkit-scrollbar {  display: none;}

.wrap{position:relative; width: 100%; max-width: 640px; margin:0 auto;font-family: 'SpoqaHanSansNeo'; font-weight: 400; letter-spacing: -0.03em;}
.wrap img{width: 100%;}
.wrap *{  box-sizing: border-box;}

/************섹션 공통*/
.sections-wrapper { position: relative; width: 100%;}
.section {width:100%;height:100vh;display:flex;flex-direction: column;justify-content:center; align-items:center; transition: transform 0.8s ease;}
.section-inner{ width: 100%; height: 100vh;}

.sections-wrapper {overflow: auto; scroll-snap-type: y mandatory; height: 100svh; -webkit-overflow-scrolling: touch}
.section-inner {scroll-snap-align: start; scroll-snap-stop: always; overflow-y: auto;overflow-x: hidden;}

/*섹션-타이틀*/
.section-tit {position: relative; display: flex; align-items: center;  height: 36px; margin:35px 15px 25px; overflow: hidden; }
.section-tit span{font-size: 14px;display: inline-flex; justify-content: center;align-items: center;height: 36px;  }
.section-tit .tit{ padding: 0 20px 0 16px; flex-shrink: 0; background-color: #009ca5;color: #fff;border-radius:  0 18px 18px 0; transform: scaleX(0); transform-origin: left center; transition: transform 0.6s ease-in-out; }
.section-tit .num{ width:30px;background-color: #fff ;color: #009ca5; border:1px solid #009ca5; border-radius: 18px 0 0 18px;flex-shrink: 0;  transform: scaleY(0); transform-origin: top center;transition: transform 0.5s ease-in-out 0.1s;}

.section-tit::after {
  content: '';
  left: 30px;
  width: 0%;
  height: 1px;
  background-color: #009ca5;
  transition: width 0.8s ease-in-out 0.6s;
}

.section-inner.animate-done .section-tit .tit {
  transform: scaleX(1);
}
.section-inner.animate-done .section-tit .num {
  transform: scaleY(1);
}
.section-inner.animate-done .section-tit::after {
  width: 100%;
}

.title-area {padding: 0 20px}
.title-area .t-nation{font-size: 28px;  color: #000;  font-family: 'GmarketSansBold';}
.title-area .title{font-size: 28px;  color: #000;  font-family: 'GmarketSansBold';}
.title-area .desc{ display: block; padding-top: 10px;font-size: 15px;  color: #222;line-height: 1.5; }
.section-inner-v2 .title-area{padding-top: 100px;}
.desc02{ font-size: 13px; color: #222;line-height: 1.5; }

.t-point-bar {
  width: calc(100% + 2px);
  display: block;
  position: absolute;
  left: -1px;
  bottom: 0;
  height:100%;
  background-color: #DA291C;
}
.t-point-bar.yellow{background-color: #fffa7e;}
.t-point-bar.yellow02{background-color: #fffa7e;}

.animate-done .t-point-bar {
  animation: tPointBarAnim 1s forwards;
}
.animate-done .yellow {
  animation-delay:3s;
}
.animate-done .yellow02{
  animation-delay:3.6s;
}
@keyframes tPointBarAnim {
  0% { width: 0; }
  100% { width: calc(100% + 2px); }
}


/************** section1*/
.section_intro{width: 100%; /*height:100%;*/ background: url('/webPub/sc_2025_mobile/2025_report_intl/images/bg_intro.jpg') no-repeat center bottom; background-size: cover;text-align: center;}
.section_intro h1 { padding: 10px 0; width: 100%;  font-weight: 700;  font-size:37px;  color: #000;  font-family: 'GmarketSansBold';}
.section_intro .sub-txt{display: block; padding-top: 10%; font-family: 'GmarketSansMedium'; font-size: 25px}
.section_intro .txt{font-size:15px;font-weight: 500; line-height: 1.6; color: #000;}

#section1  .t-point-bar {  width:0;opacity:0}
#section1 .animate-done .t-point-bar { opacity:1; animation-delay:0.5s;}

/************** section2*/
#section2 {background-color: #fff;position: relative; height: 200vh;}
#section2 .swiper{position: relative;margin-right:-25px; margin-left:-25px; padding: 0 25px 50px;}
#section2 .swiper-slide {width: 68%;}
#section2 .swiper .tit{display: flex; flex-direction: column; align-items: flex-start; margin-bottom:20px; font-size: 30px; color: #000;  font-family: 'GmarketSansBold';}
#section2 .swiper .tit span{font-size: 20px; color: #000;  font-family: 'GmarketSansMedium';}
#section2 .swiper-button-prev01,
#section2 .swiper-button-prev02,
#section2 .swiper-button-next01,
#section2 .swiper-button-next02{ top:24%; width: 48px; height:48px; background: url(/webPub/sc_2025_mobile/2025_report_intl/images/btn_prev.png) no-repeat; background-size: cover;}
#section2 .swiper-button-prev01,
#section2 .swiper-button-prev02{left: 15%;}
#section2 .swiper-button-next01,
#section2 .swiper-button-next02{right: 15%; transform: scale(-1);}
#section2 .swiper-button-prev01:after,
#section2 .swiper-button-prev02:after,
#section2 .swiper-button-next01:after,
#section2 .swiper-button-next02:after{display: none;}
#section2 .pagination {   position: absolute; top:48px; right: 0; bottom: auto; left: auto; text-align: right; color: #333; font-size: 14px;}
#section2 .swiper-button-disabled{  pointer-events: none; opacity: 0;}
#section2 .section-inner-v2{padding-top: 95px;}
#section2 .section-inner-v2 .pagination {top:80px;}

/************** section3*/
#section3,#section4 {height: 200vh;}
#section3 .title-area .t-nation{color: #7b2a5e;}
#section3 .section-inner-v2 .title-area .t-nation{color: #7b3b2a;}
.story-area{ position: relative; padding: 30px 20px;text-align: center;}
.story-area img{width:520px; margin-left: 5px;}


.story-area01{ background: url(/webPub/sc_2025_mobile/2025_report_intl/images/bg_story01.jpg) repeat-x 0 bottom; background-size: 500px; margin-bottom: 50px;}
.story-area02{ background: url(/webPub/sc_2025_mobile/2025_report_intl/images/bg_story02.jpg) repeat-x 0 bottom; background-size: 500px; margin-bottom: 50px;}
.btn-story02{ position: absolute; bottom: 0;left: 50%;  width: 66%; height: 100%; display: block; margin: 0 auto; transform: translateX(-50%);}

/************** section4*/
#section4 .inner-img{margin: 0 20px 50px; background-color:#f8f4f1 ;border-radius: 20px;text-align: center;}
#section4 .inner-img img{max-width:426px}
.btn-section4-1{position:absolute;position: absolute;top: 31.5%;left: 19%; width: 34%;height: 5%; display: block; margin: 0 auto; }
.btn-section4-2{position:absolute;position: absolute; bottom: 5%;left: 50%; width: 30%; height: 5%; display: block; margin: 0 auto; transform: translateX(-50%); }

#section4 .desc02{margin:10px 20px 0;display: block;text-align:left}
#section4 .finance-graph {
  position: relative;
  display: block;
  flex-direction: column;
  margin: 5% 20px 0;
  text-align:center;
      width: calc(100% - 40px);
      height: fit-content;
}
#section4 .finance-graph svg{ max-width:550px;}
#section4 .finance-graph img{ max-width:550px}
.finance-graph {position:relative}
.finance-graph .txt{position: absolute;left:0%; top:0; width: 100%;  opacity: 0; transform: translateY(20px);  display: inline-block;}
.finance-graph .circle-reveal-wrapper{margin-top:15px ;}
/*.finance-graph svg image{width: 100%; height: 100%;}
.finance-graph #maskCircle { display: none; }*/
/*
.section-inner.animate-done .line{
	position: absolute;
	left: 50%;
	top: 10.5%;
	width: 1px;
	height:7.5%;
	background: #da291c;
	display: block;
	transform: translate(-1px, 0);
	animation: fade 0.8s ease forwards;
  animation-delay: 0.3s;
}*/
.section-inner .circle-reveal-img{  opacity: 0; transform: translateY(20px); }
.section-inner.animate-done .circle-reveal-img {
  animation: fadeUp 0.5s ease forwards;
}
.section-inner.animate-done .txt01 {
  animation: fadeUp 0.8s ease forwards;
  animation-delay: 0.6s;
}
.section-inner.animate-done .txt02 {
  animation: fadeUp 0.6s ease forwards;
  animation-delay: 0.8s;
}
.section-inner.animate-done .txt03 {
  animation: fadeUp 0.6s ease forwards;
  animation-delay: 1.2s;
}
@keyframes drawMask {

  from { stroke-dashoffset: 571; } /* dasharray + 6px 정도 */
  to   { stroke-dashoffset: 0; }
}

@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes fade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.grayBox-area{margin-top:25px; padding: 25px; background-color:#ececec; margin-bottom: 50px;}
.grayBox-area a{ display: flex; align-items: center; justify-content: center; text-decoration: none;margin:0 auto; max-width: 450px; width: 100%; height: 37px; font-size: 14px; color: #fff;font-weight: 700; background-color: #da291c; border-radius: 10px;}
.grayBox-area p{margin-top:15px !important; text-align: center !important;}


#section5 .banner-img{margin-bottom: 50px; padding: 0 20px;}
#section5 .banner-img a{margin:20px  auto 0; display: block; max-width: 550px; line-height:0;}
#section5 .section-inner.animate-done .yellow { animation-delay:1.7s;}

#section6{ background: url(/webPub/sc_2025_mobile/2025_report_intl/images/bg_section05.jpg) no-repeat center -150px; text-align:center; background-size:cover 100% !important; color: #fff; /*height:auto;*/}
#section6 .section-inner{ /*height: auto;*/ overflow: scroll;}
#section6 .section-tit .num{  background-color:transparent;  border: 1px solid #fff;  color: #fff;}
#section6 .section-tit .tit{  background-color:#fff;  border: 1px solid #fff;  color: #38629d;}
#section6 .section-tit::after{background-color:#fff}

/* AOS 적용 시 애니메이션 */
#section6.animate-done .section-tit .tit {
  transform: scaleX(1);
}

#section6.animate-done .section-tit .num {
  transform: scaleY(1);
}

#section6.animate-done .section-tit::after {
  width: 100%;
}


#section6 .title-area{color: #fff;}
#section6 .title-area .title{font-size: 28px; color: #fff;text-align:left}
#section6 .title-area .title span{font-size: 20px; display: block; margin-bottom: 5px;font-family: 'GmarketSansMedium';}
#section6 .desc{color: #fff;}
#section6 .inner-txtImg{ margin: 20px 25px 50px; position: relative;}
#section6 .inner-txtImg01{margin: 400px 25px 0px}
#section6 .inner-txtImg  img{max-width: 550px;}
#section6 .btn_survey{position: absolute; bottom: 10%; left: 50%; width: 80%; height: 22.5%; display: block; margin: 0 auto;transform: translateX(-50%);}
#section6 .footer_area{line-height:0;position:relative;bottom:0;}
/* 섹션6: 100vh 강제 해제 + flex 제약 해제 (iOS 내부 스크롤 잘림 방지) */
#section6 {
    height: auto !important;              /* .section {height:100vh} 덮어쓰기 */
    min-height: 100dvh;                   /* iOS 동적 주소창 대응 */
    align-items: stretch !important;      /* 부모 flex 세로 중앙정렬 해제 */
    background-size: 100%;               /* 원본 오타 교정(background-size;cover;) */
}
#section6 .section-inner {
    height: auto;                         /* 컨텐츠 높이만큼 */
    max-height: none;
    min-height: 0;                        /* ★ iOS flex overflow 핵심 */
    flex: 1 1 auto;                       /* 필요 시 공간 확장 */
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    /*padding-bottom: calc(120px + env(safe-area-inset-bottom)); !* 푸터 가림 방지 *!*/
}

.section-indices{
    position: fixed;
    bottom: 20px;
    display: flex;
    justify-content: center;
    z-index: 99;
    font-size: 1rem;
}
.indices-menu{position: relative; }
.current-menu-wrap{  transition: top 0.3s ease-in-out; position: fixed; right: calc((100% - 640px)/2 + 10px);  top: 110px; height:49px;width: 250px; display:flex; align-items: center; font-size: 17px;z-index: 999; justify-content: center;background: #DA291C;  color: #fff;display: inline-flex; align-items: center;  border-radius: 3em; padding: 0.375em 0.375em 0.375em 0.375em; box-sizing: border-box; cursor:pointer;}
.current-menu-wrap:before{content:''; display:block; width:33.5px; height:33.5px; position:absolute; left:10px;background: url(/webPub/sc_2025_mobile/2025_report_intl/images/ico_menu.png) no-repeat center bottom; background-size: cover;}
.current-menu-wrap .ico-current-menu{ position:absolute; left: 6px;}
.current-menu-wrap .current-menu{ position: relative; flex-shrink: 0; display:inline-flex; margin-left: 28px; font-weight:700; white-space: nowrap; justify-content: center;}
.current-menu-wrap .current-menu.finance-menu{ margin-left: 15px;}

.indices-menu ul {display: none;top:174px;position: fixed;right: calc((100% - 640px)/2 + 10px);width:250px; opacity: 0; height: 0; overflow: hidden;}
.indices-menu ul li{ margin-bottom: 8px;}
.indices-menu ul li a {
	height: 50px;
	width: 100%;
	background: #fff;
	border-radius: 2em;
	display: inline-flex;
	align-items: center;
	color: #262626;
	font-weight: 500;
	line-height: 1.6;
	padding: 0.75em 1.75em;
	box-shadow: 0px 0.25em 0.625em 0px rgba(0, 0, 0, 0.05);
	transition: color 200ms, background-color 200ms;
	text-decoration:none;
	white-space: nowrap;
	justify-content: center;
	 font-size: 17px;
}
.indices-menu ul.show {
	display:block; z-index:999;
	animation: menuHeight 0.7s ease forwards;
	animation-delay: 0s;
}
.indices-menu ul.show li {
 opacity: 0;
  transform: translateY(20px);
  animation: menuItemFade 0.5s ease forwards;
}

/* li 순서별 딜레이 */
.indices-menu ul.show li:nth-child(1) { animation-delay: 0.05s; }
.indices-menu ul.show li:nth-child(2) { animation-delay: 0.1s; }
.indices-menu ul.show li:nth-child(3) { animation-delay: 0.15s; }
.indices-menu ul.show li:nth-child(4) { animation-delay: 0.2s; }
.indices-menu ul.show li:nth-child(5) { animation-delay: 0.25s; }
.indices-menu ul.show li:nth-child(6) { animation-delay: 0.3s; }

/* 현재 섹션의 메뉴 항목 숨기기 */
.indices-menu ul li.current-hidden {
    display: none;
}

/*섹션 2이후의 탑값*/
.section-indices.top-small .current-menu-wrap {  top: 28px;  transition: top 0.3s ease-in-out;}
.section-indices.top-small .indices-menu ul {top:92px;}

@keyframes menuItemFade {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes menuHeight {
 from {
   opacity: 0;
   height: 0;
 }
 to {
   opacity: 1;
   height: auto;
 }
}
/* 메뉴 뒤 딤 */
.menu-backdrop {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.35);
  z-index: 10;
}
.menu-backdrop.show {
  display: block;
}


/*250828 수정 추가*/
/*
.section_intro h1 { padding: 10px 0 15px;  font-size:70px; }
.section_intro .sub-txt{padding-top: 80px; font-family: 'GmarketSansMedium'; font-size: 50px}
.section_intro .txt{font-size:30px;}
.section-tit{margin-top:50px}
.section-tit .tit{height:45px; border-radius: 0 45px 45px 0; font-weight:500}
.section-tit span{ font-size: 22px;}
#section2 .swiper .tit{ height: 124px; margin-bottom: 20px; font-size: 50px; letter-spacing:-0.05em}
#section2 .pagination { top: 84px; font-size: 28px;  }
.title-area .title { font-size: 56px;}
.title-area .desc{font-size:30px}
.desc02{font-size:26px}
.grayBox-area{    margin-top: 25px; padding: 50px 25px;}
.grayBox-area a{ height: 74px; font-size: 28px;}
#section6 .title-area .title{font-size: 56px;}
#section6 .title-area .title span{font-size: 40px;}
.current-menu-wrap{height:98px; width: 500px;font-size:34px; }*/
/*//250828 수정 추가*/

/*높이 790이하 사이즈 대응 */
@media  (max-height: 790px) {
    /*.section {height: auto; min-height: 100svh;}*/
	.section-tit{margin:25px 15px 20px;}
	.story-area{padding:20px 10px;}
}


/*너비 790이하 사이즈 대응 */
@media  (max-width: 790px) {

	/*250828 수정 추가*/
	.section-tit {margin: 30px 15px 20px;}
  .section-inner-v2 .title-area {padding-top: 90px;}
	.section_intro .sub-txt{padding-top: 16.5vw; font-size: 25px;}
	.section_intro h1 { font-size: 37px;}
	.section_intro .txt { font-size: 15px;}
  .title-area .t-nation{font-size: 28px;}
	.title-area .title { font-size: 28px;}
	.title-area .desc {font-size: 15px;}
	.desc02 { font-size: 13px;}
	.grayBox-area{    margin-top: 25px;padding:25px;}
	.grayBox-area a{     height: 37px; font-size: 14px;}

	#section2 .swiper .tit{ margin-bottom: 20px; font-size: 29px; letter-spacing: -0.05em;}
	#section2 .pagination { top: 74px; font-size: 14px;  }

	#section6 .title-area .title{font-size: 28px;}
	#section6 .title-area .title span{font-size: 20px; }
	/*//250828 수정 추가*/


	#section2 .swiper-slide {width:266px;}
	/*{transform: translateY(-50%);}*/
	#section2 .swiper-button-prev01,
  #section2 .swiper-button-prev02,
  #section2 .swiper-button-next01,
  #section2 .swiper-button-next02{width: 24px; height: 24px; }
	#section2 .swiper-button-prev01,
  #section2 .swiper-button-prev02{top:29%; left: 50%; margin-left: -144px;}
	#section2 .swiper-button-next01,
  #section2 .swiper-button-next02{top:29%;right: 50%; margin-right: -144px; transform: scale(-1);}
  #section2 .section-inner-v2{padding-top: 90px;}

	#section3 .story-area img{width: 300px; margin-left: 0px;}
  #section3 .story-area01{background-size: 320px;}
  #section3 .story-area02{background-size: 320px;}
	.btn-story02{ width: 230px; }
  
	#section4 .inner-img img {  max-width: 320px;}
	/*#section4 .section-inner.animate-done .line{ top: 11.5%;height:7.1%}*/
	#section4 .btn-section4-1{ left: 50%; width:155px; transform:translateX(-140px); }
	#section4 .btn-section4-2{ width: 130px;}

	#section6{background-position:center 0}
	#section6 .inner-txtImg01{margin: 270px 25px 0px}
	#section6 ~ .section-indices .current-menu-wrap { bottom: 28px; transition:.2s;}
	.current-menu-wrap{top:16.7vw; right:15px; width: 160px; height: 36px; font-size: 14px;}
  .section-indices.top-small .current-menu-wrap{top:30px;}
	.current-menu-wrap:before{content:''; display:block; width:19.5px; height:19.5px; position:absolute; left:10px;background: url(/webPub/sc_2025_mobile/2025_report_intl/images/ico_menu.png) no-repeat center bottom; background-size: 100%;}

	.ico-current-menu{ position:absolute; left: 6px;}
	.current-menu{ position: relative; flex-shrink: 0; display:inline-flex; white-space: nowrap;  white-space: nowrap; justify-content: center; font-weight:bold}
  .current-menu-wrap .current-menu{margin-left: 22px;}
	/*.section-indices.top-large .indices-menu ul {top:185px;}
	.section-indices.top-small .indices-menu ul {top:115px;}*/

  .indices-menu ul {top:calc(18vw + 36px);right:15px; width:160px; opacity: 0; height: 0; overflow: hidden;}
  .indices-menu ul li{ margin-bottom: 1.5vw;}
  .indices-menu ul li a {
    height: 32px;
    line-height: 1;
    font-size: 14px;
  }

	.indices-menu ul.show {position: fixed; right: 15px;}

  /* 메뉴가 열릴 때 위로 올라감 */
  .section-indices .current-menu-wrap.open {
    animation: menuUp 0.5s ease forwards;
  }

  .section-indices.top-small .indices-menu ul {
    top: calc(30px + 36px + 1.5vw);
  }

  /* 메뉴가 펼쳐질 때 딜레이 후 자연스럽게 펼쳐짐 */
  .section-indices .indices-menu ul.show {
    animation: menuHeight 0.7s ease forwards;
    animation-delay: 0.1s;
  }
  .section-indices .indices-menu ul.show li {
    opacity: 0;
    transform: translateX(-10px);
    animation: menuItemFade 0.5s ease forwards;
  }

  /* li 순서별 딜레이 */
  .section-indices .indices-menu ul.show li:nth-child(1) { animation-delay: 0.05s; }
  .section-indices .indices-menu ul.show li:nth-child(2) { animation-delay: 0.1s; }
  .section-indices .indices-menu ul.show li:nth-child(3) { animation-delay: 0.15s; }
  .section-indices .indices-menu ul.show li:nth-child(4) { animation-delay: 0.2s; }
  .section-indices .indices-menu ul.show li:nth-child(5) { animation-delay: 0.25s; }
  .section-indices .indices-menu ul.show li:nth-child(6) { animation-delay: 0.3s; }


}


/*너비 790이하 사이즈 대응 */
@media  (max-width: 375px) {
  /*섹션-타이틀*/
  .section-tit .tit{ padding: 0 10px 0 6px;}
}