@charset "UTF-8";
/* hanbom.com _ DA _ KimJuyeon _ 20240823 */

/* reset */
@import url(lib/reset.css);
/* library */
@import url(lib/swiper-bundle.min.css);
@import url(lib/aos.css);
/* common css */
@import url(_font.css);
@import url(_colors.css);
@import url(_vars.css?t=20241204);
@import url(_button.css?t=20241128);
@import url(_form.css?t=20241204);
@import url(_layout.css?t=20241209);
@import url(_global.css?t=20241204);

/* mainSwiper */
#mainSwiper								{width: 100%;}
#mainSwiper .swiper-slide					{display: flex; justify-content: center; align-items: center;}
#mainSwiper .swiper-slide > a.img-wrap		{position: relative; display: block; width: 100%; aspect-ratio: 1520/650; max-height: 650px;}
#mainSwiper .swiper-slide .text-wrap		{position: absolute; bottom: 52px; left: 0; width: 100%; padding: 0 var(--gutter); color: #fff; text-align: center; font-size: 52px; font-weight: 500; line-height: 1.3; letter-spacing: -0.52px;}
#mainSwiper .swiper-slide .text-wrap.pack-down-center	{gap: 16px;}
#mainSwiper .pagination-container	{bottom: 20px;}
@media all and (min-width: 1921px){
	#mainSwiper .swiper-slide > a.img-wrap		{max-width: 2560px; max-height: 1094px;}
}
@media all and (min-width: 769px) and (max-width: 1520px){
	#mainSwiper .swiper-slide > a.img-wrap		{min-height: 500px; max-height: 600px;}

}
@media all and (min-width: 769px) and (max-width: 1920px){
	#mainSwiper .fs-52-32{font-size: clamp(32px, 2.708vw, 52px); letter-spacing: clamp(-.32px, -.027vw, -.52px);}
	#mainSwiper .fs-40-24{font-size: clamp(24px, 2.083vw, 40px); letter-spacing: clamp(-.24px, -.020vw, -.4px);}
}
@media all and (max-width: 768px){
	#mainSwiper .swiper-slide > a.img-wrap		{aspect-ratio: 375/300; min-height: revert;}
	#mainSwiper .fs-52-32			{font-size: clamp(24px, 3.267vw, 52px); letter-spacing: clamp(-.24px, -.032vw, -.52px);}
	#mainSwiper .fs-40-24			{font-size: clamp(20px, 2.8vw, 40px); letter-spacing: clamp(-.20px, -.028vw, -.4px);}
}
@media all and (max-width: 440px){
	#mainSwiper .swiper-slide > a.img-wrap		{height: auto;}
}

/*
	#content .mem
*/
#content.mem .max-375 .fs-32					{margin: 88px 0 40px; width: 100%;}
#content.mem .max-1200 .fs-32				{margin: 40px 0 0; width: 100%;}
@media all and (min-height: 868px){
	#content.mem .min-h-868						{min-height: calc(868px - var(--header) - 64px);}
}
@media all and (max-height: 867px){
	#content.mem .min-h-868						{min-height: calc(var(--vh100) - var(--header));}
}
@media all and (max-width: 768px){
	#content.mem .max-375 .fs-32					{margin: 24px 0; width: 100%;}
}
#content.mem .da-footer-msg{padding: 32px 0;}

/*
	.mem.join
*/
#content.join .join-step ol		{width: fit-content; counter-reset: ordered;}
#content.join .join-step ol.pack-center	{gap: 44px;
	background: repeating-linear-gradient(90deg, var(--light-gray-2) 0, var(--light-gray-2) 4px, transparent 4px, transparent 6px) repeat-x 0 calc(50% - 1px);
	background-size: 100% 1px;
}
#content.join .join-step ol li	{position : relative; padding: 0 8px; background: white; font-size: 18px;}
#content.join .join-step ol li::before	{min-width: 24px; height: 24px; border-radius: 50%; content: counter(ordered); counter-increment: ordered; background: var(--light-gray-4); font-size: 14px; line-height: 100%; letter-spacing: -0.28px;
	display: flex;
	justify-content: center;
	align-items: center;
}
#content.join .join-step ol li.current	{color: #000;}
#content.join .join-step ol li.current::before	{background: #000; color: #fff;}
#content.join .fs-32 + .join-step			{margin: 56px 0 34px;}
#content.join .folding-box					{font-size: 14px;}
#content.join .join-agree.pack-down			{gap: 16px;}
#content.join .join-agree label.pack-left .checkbox + .label	{width: calc(100% - 24px - 8px);}

/*
	.main
	.landing
*/
.swiper-tab		{overflow: hidden;}
#content #rankingSwiper .swiper-slide						{width: clamp(277px, 36.933vw, 384px);}
#caseTabSwiper						{}
#caseTabSwiper .swiper-slide			{width: clamp(64px, 17.067vw, 80px);}
#caseTabSwiper a.pack-down-center		{width: 100%; gap: 10px;}
#caseTabSwiper .img-wrap.ratio-1-1		{width: 100%; border: 4px solid transparent;}
#caseTabSwiper .swiper-slide.current a .img-wrap.circle,
#caseTabSwiper a:hover .img-wrap.circle	{border-color: var(--light-pink);}
#caseTabSwiper a .img-wrap.circle::after	{content:''; position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%;}
#caseTabSwiper .swiper-slide.current a .img-wrap.circle::after,
#caseTabSwiper a:hover .img-wrap.circle::after	{background: rgba(0, 0, 0, 0.25) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 49 48' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M42.3809 11.5702C44.2703 13.1847 44.4932 16.0252 42.8786 17.9146L24.9211 38.93C24.1048 39.8853 22.9263 40.4558 21.6707 40.5034C20.4151 40.5511 19.1967 40.0716 18.3104 39.181L6.35283 27.1656C4.59972 25.404 4.60659 22.5548 6.36819 20.8016C8.12978 19.0485 10.979 19.0554 12.7321 20.817L21.2482 29.3743L36.0364 12.068C37.6509 10.1785 40.4914 9.95565 42.3809 11.5702Z' fill='%23FEFFB5'/%3E%3C/svg%3E") no-repeat center center;
	background-size: clamp(39px, 10.4vw, 48px) clamp(39px, 10.4vw, 48px);
}
@media all and (max-width: 768px){
	#caseTabSwiper a.pack-down-center	{gap: 8px;}
}






/*
	=======================
	main
	=======================
		.top-visual
		.marquee
		.swiper-tab
		.main-container
			.section.selfies
			.section.shorts
			.section.event
			.section.group
				.section.vlog
				.section.da-tv
			.section.safety
		.bg-000 : footer line
*/

#content.main.female .top-visual		{background: linear-gradient(90deg, #FFD8EC 38.94%, #F1D2FF 61.06%);}
#content.main.male .top-visual			{background: linear-gradient(90deg, #C6DFFF 38.94%, #A5BEFF 61.06%);}

#content.main #caseTabSwiper .swiper-slide					{padding: 24px 0 ;}
#content.main #caseTabSwiper .swiper-slide.current::after	{content:''; position: absolute; bottom: 0; left: calc(50% - 24px); display: block; width: 48px; height: 24px;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 30'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M30.2333 0.000335658C27.6586 15.3128 15.417 27.3448 0 29.6048V29.9873H59.1111V29.3795C44.3361 26.6322 32.7321 14.8612 30.2333 0.000335658Z' /%3E%3C/svg%3E") no-repeat 50% 50%;
	background-color: var(--light-pink);
}
#content.main .main-container		{overflow: hidden;}
#content.main .main-container .parent-slider				{margin: 0 auto;}
#content.main .section.pack-down-center					{gap: 40px;
	justify-content: center;
}
#content.main .main-container > .section.pack-down-center		{padding: clamp(50px, 10.333vw, 130px) 0;}
@media all and (min-width: 769px){
	#content.main .main-container .section .title-wrap .btn-wrap	{padding-right: 128px;}
	#content.main .main-container .section .swiper-btns				{position: absolute; top: calc(-40px - 48px); right: 0; z-index: 2;}
}
@media all and (max-width: 768px){
	#content.main .main-container > .section.pack-down-center		{padding: clamp(50px, 11.333vw, 160px) 0;}
	#content.main .main-container .section .swiper-btns				{margin-top: 16px;}
}
#content.main .section.bg-000 .section-title .fs-40-32,
#content.main .section.bg-1c .section-title .fs-40-32		{color: #fff;}
#content.main .section.group.pack-down		{padding: clamp(80px, 21.333vw, 160px) 0; gap: 80px;}
@media all and (max-width: 768px){
	#content.main #vlogSwiper .swiper-btns,
	#content.main #tvSwiper .swiper-btns,
	#content.main #safetySwiper .swiper-btns		{display: none;}
}

/*
	.main : male
*/
#content.male #caseTabSwiper .swiper-slide.current a .img-wrap.circle,
#content.male #caseTabSwiper a:hover .img-wrap.circle	{border-color: var(--sky);}
#content.male #caseTabSwiper .swiper-slide.current::after	{background-color: var(--sky);}






/*
	=======================
	landing
	=======================
		#editor
			.bg-XXX
				.section1
				.section2
					.section
					.section
		.tabs
		.tab-contnet.section
			.section
			.section
		.tab-contnet.section
			.section
		.folding-box							//page 전체 공통
			.folding-content
				.section1
				.section2
					.section
					.section
				.section3
				.section4
					.has-side
						.side
						.flow-wrap
		.bg-000 : footer line
*/
#content.landing .top-visual .img-wrap				{position: relative; display: block; width: 100%; height: clamp(592px, 100vw, 800px);}
#content.landing .top-visual .img-wrap img.centered.v-top		{object-position: top center;}

/* #editor && folding=dontent */
#editor > [class*="bg-"],
#content.landing .tab-content.section,
#content > .folding-box > .folding-content > .section			{padding-top: clamp(60px, 16vw, 160px); padding-bottom: clamp(60px, 16vw, 160px);}
#editor > [class*="bg-"].pd-0:has(.img-wrap.full)						{padding-top: 0;}
#editor > [class*="bg-"][class*="pack-down"],
#content.landing > .tab-content.section[class*="pack-down"]		{gap: clamp(60px, 16vw, 160px);}
#editor [class*="bg-"] > [class*="pack-down"]					{gap: 80px;}
#editor															{overflow: hidden;}
#editor .title-wrap.pack-down,
#editor .section.pack-down > .pack-down,
#editor .mo-xscroll-box,
#content > .folding-box > .folding-content > .section[class*="pack-down"],
#content > .folding-box .title-wrap.pack-down,
#content > .folding-box .section.pack-down > .pack-down			{gap: 40px;}

/* #editor */
#editor > [class*="bg-"]						{line-height: 1.2;}
#editor .bg-fff,
#editor .bg-e4									{color: #000;}
#editor .title-wrap .pack-down.fs-32-24			{gap: 0; line-height: 1.4}
#editor .half-layout				{gap: 24px;}
#editor .half-layout > div,
#editor .half-layout > p			{flex: 1;}
#editor .section-title.pack-down	{gap: 4px;}
#editor .section-title.pack-down .num	{margin-bottom: 4px;}
#editor .figure-wrap.pack-down			{gap: clamp(20px, 5.333vw, 30px);}
#editor .center-layout.pack-down-center	{gap: 16px;}
#editor .auto-height-layout				{gap: clamp(40px, 7vw, 84px);}
@media all and (min-width: 769px){
	#editor .auto-height-layout > .img-wrap,
	#editor .auto-height-layout > .img-wrap img	{height: 100%; width: auto;}
}
@media all and (max-width: 768px){
	#editor .half-layout.pack-both-bottom	{
		align-items: flex-start;
	}
	#editor .half-layout.mo-reverse[class*="pack-"]:not(.mo-xscroll-con)			{
		flex-direction: column-reverse;
		align-items: stretch;
	}
	#editor .half-layout[class*="pack-"]:not(.mo-reverse):not(.mo-xscroll-con),
	#editor .auto-height-layout	{
		flex-direction: column;
		align-items: stretch;
	}

	#editor .half-layout[class*="max-"] > div:not(.img-wrap),
	#editor .half-layout[class*="max-"] > p,
	#editor .auto-height-layout > div						{margin-left: calc( var(--gutter) * -1); margin-right: calc( var(--gutter) * -1);}
	#editor .half-layout .img-wrap		{width: 100%;}
	.mo-xscoll-change										{width: 100%;}
	.mo-xscoll-change .half-layout.pack-both				{width: fit-content; gap: 16px;
		justify-content: flex-start;
	}
	.mo-xscoll-change .mo-xscroll							{overflow-x: auto; padding: 0 var(--gutter); }
	.mo-xscoll-change .mo-xscroll .mo-xscroll-con			{width: fit-content;}
	.mo-xscoll-change .only-mo								{margin-bottom: 40px;}
	.mo-xscoll-change .only-mo.mo-tab a.fs-64-40:not(.on)	{color: var(--light-gray-2);}
	.mo-xscoll-change .mo-xscroll-box						{width: 84vw; min-width: 315px;}
	.mo-xscoll-change .mo-xscroll-box h3.section-title		{display: none;}
}
@media all and (max-width: 768px){
	#editor .mo-xscroll-box h3.fs-64-40		{display: none;}
}
#content.landing > .tabs									{padding-bottom: 70px;}
#content.landing .section.review .data-list.col-4			{--gapY: 24px;}
#content.landing .section.review .data-list.col-4 .item.normal.review		{max-width: revert;}
@media all and (min-width: 641px) and (max-width: 1024px){
	#content.landing .section.review .data-list.col-4 li:nth-child(n+4)		{display: none;}
}
@media all and (max-width: 640px){
	#content.landing .section.review .data-list.col-4 li:nth-child(n+3)		{display: none;}
}
/* .folding=dontent */
#content.landing .section.review .button-area						{margin-top: 40px;}
#content.landing .section.review-bfaf.pack-down-center				{gap: 80px;}
#content.landing .section.review-bfaf > .pack-both					{gap: 24px;}
#content.landing .section.review-bfaf > .pack-both > div			{width: calc((100% - 24px)/2);}
#content.landing .section.review-bfaf .bfaf-box						{gap: 32px;}
@media all and (max-width: 768px){
	#content.landing .section.review-bfaf > .pack-both > div			{width: 100%;}
	#content.landing .section.review-bfaf > .pack-both > div.bfaf-box:nth-child(n+2)		{display: none;}
}

#content > .folding-box .folding-content > .section .section	{gap: 40px;}
#content > .folding-box .folding-content .swiper-tab + .section 	{margin-top: 120px;}
#content.landing .swiper-pagination-bar .swiper-pagination-bullet	{width: 24px;}

#content.landing #bfafSwiper .swiper-btns,
#content.landing #selfieSwiper .swiper-btns							{margin-top: 40px;}

#content.landing #selfieSwiper,
#content.landing #rankingSwiper										{width: 100% ;overflow: visible;}
#content.landing #selfieSwiper .swiper-slide						{width: clamp(160px, 42.667vw, 282px);}
#content.landing #bfafSwiper .swiper-pagination-bar .swiper-pagination-bullet	{background: #000;}
#content > .folding-box								{position: relative; border: 0 none;}
#content > .folding-box .btn.js-folding-switche		{position: absolute; top: -24px; left: calc(50% - (104px / 2)); width: 104px; height: 48px; padding: 14px 20px 10px; background: #fff; box-shadow: 0 0 0 1px var(--light-gray-4) inset; color: #000;}
#content > .folding-box .folding-content				{padding: 0; overflow: hidden;}
#content > .folding-box .btn.js-folding-switche .ico.folding-arr{margin-bottom: 4px;}
#content > .folding-box.folded .folding-content		{height: 24px;}

/*#content.landing .swiper-container.card-swiper						{width: 100%;}*/
#content.landing .swiper-container.card-swiper .swiper-slide		{width: fit-content; height: fit-content;}



#content.landing #event .item.ranking 								{max-width: revert;}
#content > .folding-box .folding-content > .section.bfaf 		{gap: 80px;}
#content.landing .has-side.case-list .side ul.pack-down				{gap: 12px;}
#content.landing .has-side.case-list .data-list.col-3				{--myGap: 24px; gap: var(--myGap);}
@media all and (min-width: 961px){
	#content.landing .has-side.case-list .side,
	#content.landing .has-side.case-list .data-list.col-3 li			{width: 282px;}
	#content.landing .has-side.case-list .flow-wrap						{width: calc(100% - 282px - 24px);}
	#content.landing .has-side.case-list .side.fixed + .flow-wrap		{margin-left: calc(282px + 24px);}
}
@media all and (max-width: 960px){
	#content.landing .has-side.case-list .side,
	#content.landing .has-side.case-list .data-list.col-3				{--myGap: 15px;}
	#content.landing .has-side.case-list .side ul.pack-down				{flex-direction: revert;flex-wrap: wrap;}
	#content.landing .has-side.case-list								{gap: 24px;}
	#content.landing .has-side.case-list .side							{width: 100%;}
	#content.landing .has-side.case-list .side li,
	#content.landing .has-side.case-list .data-list.col-3 li			{width: calc((100% - var(--myGap)* 2)/3);}
	#content.landing .has-side.case-list .data-list.col-3 li .item.photo-card.selfie			{max-width: revert;}
	#content.landing .has-side.case-list .data-list.col-3 .item.photo-card.selfie .img-wrap 	{}
}
@media all and (max-width: 768px){
	#content.landing .has-side.case-list .side li,
	#content.landing .has-side.case-list .data-list.col-3 li			{width: calc((100% - var(--myGap))/2);}
}
#content.landing .side .hastag,
#content.landing .side .hastag .img-wrap	{width: 100%; height: clamp(48px, 12.8vw, 90px);}
#content.landing .side .hastag 				{position: relative; overflow: hidden; border-radius: 24px;}
#content.landing .side .hastag .img-wrap	{position: absolute;}
#content.landing .side .hastag .img-wrap .mask	{background-color: rgba(0,0,0,.6);}
#content.landing .side .hastag .fs-24-16	{position: relative; padding: 4px 30px 0; color: #fff;}
#content.landing .side .hastag.current .img-wrap .mask,
#content.landing .side .hastag:hover .img-wrap .mask	{background-color: rgba(255, 216, 236,.8);}
#content.landing .side .hastag.current .fs-24-16,
#content.landing .side .hastag:hover .fs-24-16	{color: #000;}

#content.landing .section.tube .data-list.col-4,
#content.landing .section.da-tv .data-list.col-4				{--gapY: 24px;}
#content.landing .section.tube .data-list.col-4 .item.normal.vod,
#content.landing .section.da-tv .data-list.col-4 .item.normal.vod	{max-width: revert;}
@media all and (min-width: 431px) and (max-width: 640px){
	#content.landing .section.tube .data-list.col-4 li						{width: calc((100% - var(--gapX))/2);}
}
@media all and (max-width: 430px){
	#content.landing .section.tube .data-list.col-4 li						{width: 100%;}
}
@media all and (max-width: 768px){
	#content.landing .section.tube .data-list.col-4 li:nth-child(n+4)		{display: none;}
	#content.landing .section.tube .data-list.col-4,
	#content.landing .section.da-tv .data-list.col-4				{--gapY: 15px;}
}



#content .section.facilities .has-side						{gap: 10%;}
@media all and (min-width: 961px) and (max-width: 1279px){
	#content .section.facilities .has-side .side					{width: 40.5vw;}
	#content .section.facilities .has-side .flow-wrap				{width: calc(100% - 40.5vw - 10%);}
	#content .section.facilities .has-side .side.fixed + .flow-wrap	{margin-left: calc(40.5vw + 10%);}
}
@media all and (min-width: 1280px){
	#content .section.facilities .has-side						{gap: 129px;}
	#content .section.facilities .has-side .side					{width: 486px;}
	#content .section.facilities .has-side .flow-wrap				{width: calc(100% - 486px - 129px);}
	#content .section.facilities .has-side .side.fixed + .flow-wrap	{margin-left: calc(486px + 129px);}
}
@media all and (max-width: 960px){
	#content .section.facilities .has-side						{gap: 80px;}
}
#content .section.facilities .title-wrap.pack-down			{line-height: 1.2;}
#content .section.facilities .title-wrap.pack-down .pack-down	{gap: 4px;}
#content .section.facilities .title-wrap.pack-down .fs-18-16	{line-height: 1.6;}
#content .section.facilities .pack-list							{gap: 24px}
#content .section.facilities .pack-list .img-wrap				{width: 100%;}
#content .section.facilities .pack-list .img-wrap.ratio-1-1		{width: calc(50% - 12px);}
#content .section.facilities .pack-list .img-wrap.ratio-1-1 p 	{position: absolute; left: 20px; bottom: 20px;}
@media all and (max-width: 768px){
	#content .section.facilities .pack-list							{gap: 16px}
	#content .section.facilities .pack-list .img-wrap.ratio-1-1		{width: calc(50% - 8px);}
}



@media all and (max-width: 768px){
	#content.landing #selfieSwiper	{overflow: visible;}
	#content.landing #selfieSwiper .swiper-btns		{margin-top: 20px;}
}

#content > .folding-box > .folding-content > .section.best4		{}
#content.landing .section.best4	ol.pack-list			{gap: 40px 24px; width: 100%; margin-top: 40px;}
#content.landing .section.best4	ol.pack-list li			{width: calc((100% - 24px)/2);}
@media all and (max-width: 768px){
	#content.landing .section.best4	ol.pack-list			{gap: 24px;
		flex-direction: column;
	}
	#content.landing .section.best4	ol.pack-list li			{width: 100%;}
}

#content.landing .img-wrap.ratio-588-404	{min-width: clamp(300px, 40vw, 588px);}
#content > .folding-box .section.pack-down > .selfies-marquee.pack-down	{gap: clamp(40px, 10.667vw, 80px);}
#content.landing .selfies-marquee .img-wrap .blur-10.round {top: 20px; left: 20px; right: auto; bottom: auto;}
#content.landing .section.promo .btns.pack-down	{width: 296px;}
#content.landing .section.promo .btns.pack-down .btn	{width: 100%;}
@media all and (max-width: 768px){
	#content.landing .section.promo.pack-both-top	{gap: 80px;
		flex-direction: column;
	}
}

#content.landing .section.jonjal{padding-top: clamp(40px, 8vw, 80px); padding-bottom: clamp(40px, 8vw, 80px);}
#content.landing .section.jonjal .make-minam.pack-down-center{gap: 80px;}
#content.landing .section.jonjal .make-minam .bg-marquee {position: relative; padding-bottom: clamp(112px, 29.867vw, 125px);}
#content.landing .section.jonjal .make-minam .bg-marquee .landing-marquee{position: absolute; bottom: 0; left: 0; right: 0;}
#content.landing .section.jonjal .make-minam .text-wrap				{line-height: 1.2;}
#content.landing .section.jonjal .make-minam .pack-list.max-1200	{gap: 24px;}
#content.landing .section.jonjal .pack-down-center.logo-wrap		{gap: 80px;}
#content.landing .section.jonjal .pack-down-center.logo-wrap img	{display: block; width: clamp(116px, 30.933vw, 231px);  aspect-ratio: 231 / 120; margin: 0 auto;}

.landing-marquee		{--gap: 24px; --duration: 60s; overflow: hidden; user-select: none; gap: var(--gap);
	display: flex;
}
.landing-marquee .landing-marquee-group	{gap: var(--gap); min-width: 100%;
	display: flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: space-around;
	animation: imgMarquee var(--duration) linear infinite;
}
@media (prefers-reduced-motion: reduce) {
	.landing-marquee-group {animation-play-state: paused;}
}
.landing-marquee-group .img-wrap {max-width: clamp(10rem, 1rem + 28vmin, 20rem);}
.landing-marquee.reverse .landing-marquee-group{animation-direction: reverse; animation-delay: calc(var(--duration) / -2);}

@keyframes imgMarquee {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(calc(-100% - var(--gap)));
	}
}
@media all and (max-width: 1240px){
	#content.landing .section.jonjal .make-minam .pack-list.max-1200	{max-width: 628px;
		justify-content: center;
	}
}
@media all and (max-width: 768px){
	.landing-marquee		{--gap: 15px;}
	#content.landing .section.jonjal .make-minam .pack-list.max-1200	{gap: 15px;}
	#content.landing .section.jonjal .make-minam .pack-list.max-1200 .img-wrap {width: 100%;}
}


#content.landing .section.hanamja{padding-top: clamp(40px, 8vw, 80px); padding-bottom: clamp(40px, 8vw, 80px);}
#content.landing .section.hanamja .cards-wrap {position: relative;}
#content.landing .section.hanamja .cards-wrap .section-title	{position: absolute; top: 140px; left: 50%;
transform: translateX(-50%);}
#content.landing .ico.deco01{width: clamp(60px, 16vw, 120px); height: auto; aspect-ratio : 1 / 1; background-image: url('../images/common/deco_togo.svg');}
#content.landing .ico.deco02{width: clamp(60px, 14.933vw, 112px); height: auto; aspect-ratio : 4 / 5; background-image: url('../images/common/deco_v.svg');}
#content.landing .section.hanamja .cards-wrap .section-title .deco01	{position: absolute; top: 40px; right: 142px;}
#content.landing .section.hanamja .cards-wrap .section-title .deco02	{position: absolute; bottom: -67px; left: 61px;}
#content.landing .section.hanamja .cards-wrap > .photo-card:nth-of-type(1) {margin-top: 276px;}
#content.landing .section.hanamja .logo-wrap.pack-down-center	{gap: clamp(80px, 21.333vw, 120px);}
#content.landing .section.hanamja .logo-wrap .btn.black {background-color: var(--red);}
@media all and (min-width: 769px){
	#content > .folding-box > .folding-content > .section.hanamja{gap: 0;}
	#content.landing .section.hanamja .logo-wrap.pack-down-center	{margin-top: -30px;}
}
@media all and (max-width: 768px){
	#content.landing .section.hanamja .cards-wrap .section-title	{top: 43%;}
	#content.landing .section.hanamja .cards-wrap > .photo-card:nth-of-type(1) {margin-top: 104vw;}
	#content.landing .section.hanamja .cards-wrap .section-title .deco01	{right: 18.933vw;}
	#content.landing .section.hanamja .cards-wrap .section-title .deco02	{opacity: 0;}
}

#content.landing .section.best4 .figure-wrap.swiper .item.bfaf .swiper-txt{line-height: 1.6;}


/* ..mans-nose-bfaf */
#content.landing .mans-nose-bfaf{}
#content.landing .mans-nose-bfaf > [class*="pack-down"]				{gap: 40px;}
#content.landing .mans-nose-bfaf .figure-wrap,
#content.landing .mans-nose-bfaf .img-wrap{width: 100%;}
#content.landing .mans-nose-bfaf .figure-wrap.swiper .btns			{padding-top: 8px;}
#content.landing .mans-nose-bfaf .figure-wrap.swiper .btn.transparent{width: 32px; height: 32px;}
@media all and (min-width: 769px){
	#content.landing .mans-nose-bfaf .half-layout > div{max-width: calc((100% - 24px)/2);}
}

/* .breast-swiper */
.breast-swiper	{overflow: visible; position: relative;}
.breast-swiper .swiper-slide	{max-width: 282px;}
.breast-swiper .swiper-button-next:not(.swiper-button-disabled),
.breast-swiper .swiper-button-prev:not(.swiper-button-disabled){background: rgba(0, 0, 0, .3);}
.breast-swiper .swiper-button-next.swiper-button-disabled,
.breast-swiper .swiper-button-prev.swiper-button-disabled{opacity: 0;}
@media all and (max-width: 768px){
	.breast-swiper .swiper-slide	{max-width: 200px;}
}


/*
	#content.sub
					.doctors
					.intro
*/
#content.sub .page-header + .section.pack-down	{padding-bottom: clamp(40px, 10.667vw, 80px);}
#content.sub .sub-section	{overflow: hidden; padding-top: clamp(60px, 16vw, 160px); padding-bottom: clamp(60px, 16vw, 160px);}
#content.sub .sub-section > [class*="pack-both"] > section,
#content.sub .sub-section > [class*="pack-both"] > div	{flex: 1;}
@media all and (max-width: 768px){
	#content.sub .sub-section > [class*="pack-both"]	{
		flex-direction: column;
	}
	#content.sub .sub-section > [class*="pack-both"].gap-24 	{gap: 80px;}
	#content.sub .sub-section > [class*="pack-both"] > .img-wrap			{width: 100%;}
	#content.sub .sub-section .directions.pack-both-top {
		flex-direction: column;
	}
}
@media all and (min-width: 431px) and (max-width: 768px){

	#content.sub .sub-section .directions .fs-40-24.fc-000 br		{display: none;}
	#content.sub .sub-section .direction > .pack-left-top{
	 align-items: center;
	}

}

/*
	.doctors
*/
#content.doctors .tabs-wrap + .list-wrap	{margin-top: 60px;}
#content.doctors > .folding-box				{margin-top: 80px;}
@media all and (max-width: 640px){
	#content.doctors .data-list.col-3 li						{width: calc((100% - var(--gapX))/2);}
	#content.doctors .item.photo-card.doctor .text-wrap			{position: static; color: #000; padding: 16px 8px 0;}
	#content.doctors .item.photo-card.doctor .text-wrap ul.pack-down.career li{width: 100%;}
	#content.doctors .item.photo-card.doctor .img-wrap .blur-10.round	{padding: 6px 8px;}
}

/*
	.about
*/
#content.about .img-wrap + .list-wrap	{margin-top: 60px;}
#content.about .page-header + .section.pack-down .fs-32-20	{max-width: 676px;}
#content.about .sub-section.pack-down .fs-32-20	{max-width: 1040px;}
#content.about .swiper-slide .img-wrap	{overflow: hidden; min-width: clamp(160px, 42.667vw, 282px);}
#content.about .da-world{position: relative;}
#content.about .da-world ul li{font-size: clamp(10px, 1.167vw, 14px); color: #000;}
@media all and (min-width: 769px){
	#content.about .da-world ul li{position: absolute;}
	#content.about .da-world ul li.berlin{top: 27.53%; left: 56.667%;}
	#content.about .da-world ul li.moscow{top: 32.292%; left: 61.086%;}
	#content.about .da-world ul li.london{top: 34.077%; left: 48.917%;}
	#content.about .da-world ul li.newyork{top: 39.137%; left: 30.917%;}
	#content.about .da-world ul li.paris{top: 39.732%; left: 49.667%;}
	#content.about .da-world ul li.seoul{top: 41.22%; left: 84.583%;}
	#content.about .da-world ul li.sfo{top: 43.75%; left: 13.75%;}
	#content.about .da-world ul li.beijing{top: 45.387%; right: 22.25%;}
	#content.about .da-world ul li.tokyo{top: 45.685%; left: 87.917%;}
	#content.about .da-world ul li.hkg{top: 52.679%; left: 80.917%;}
	#content.about .da-world ul li.lax{top: 53.72%; left: 17.833%;}
	#content.about .da-world ul li.dxb{top: 54.018%; left: 65.167%;}
	#content.about .da-world ul li.bangkok{top: 56.548%; left: 77.833%;}
	#content.about .da-world ul li.sin{top: 64.583%; left: 79.667%;}
	#content.about .da-world ul li.jkt{top: 70.685%; left: 82.083%;}
	#content.about .da-world ul li.syd{top: 85.565%; right: 12.25%;}
}
@media all and (max-width: 768px){
	#content.about .da-world ul{margin-top: 40px; gap: 16px;
		display: flex;
		flex-direction: column;
	}
	#content.about .da-world ul li{font-size: 14px; list-style-type: disc; list-style-position: inside;}
	#content.about .da-world ul li{position: relative;}
}


/*
	.safety
*/
#content.safety .sub-section.bg-safe					{background: rgba(0,0,0,.7) url('../images/intro/bg_safety.png') no-repeat 50% 0; background-size: cover;}
#content.safety .item.photo-card.safety .text-wrap			{top: 0;}
#content.safety .item.photo-card.safety.on .op-40,
#content.safety .item.photo-card.safety .text-wrap .fs-14,
#content.safety .sub-section.bg-safe .btn.transparent		{
	transition: all 150ms ease-in-out;
}
#content.safety .item.photo-card.safety .text-wrap .fs-14	{margin-top: 100%;}
#content.safety .sub-section.bg-safe .btn.transparent		{position: absolute; top: 40px; right: 40px;}
#content.safety .item.photo-card.safety.on .op-40				{opacity: .7;}
#content.safety .item.photo-card.safety.on .text-wrap .fs-14	{margin-top: 0;}
#content.safety .item.photo-card.safety.on .btn.transparent		{transform: rotate(90deg);}
@media all and (min-width: 769px){
	#content.safety #safetySwiper .swiper-btns				{position: absolute; top: calc(-80px - 48px); right: 0; z-index: 2;}
}
@media all and (max-width: 768px){
	#content.safety #safetySwiper .swiper-btns				{margin-top: 12px;
		justify-content: flex-end;
	}
}


/*
	.care
*/
#content.care .zip-content > .title-wrap			{padding-bottom: clamp(40px, 10.667vw, 80px);}
#content.care #before .data-list[class*="col-"]				{--gapY: 24px;}
#content.care .zip-content.pack-down-center	{color: #000;}
#content.care #editor + .tabs							{margin-top: clamp(60px, 16vw, 160px);}
#content .after-center .contact[class*="pack-"]			{gap: 32px;}
#content .after-center .contact > [class*="pack-"]			{gap: 12px;}
#content .after-center .contact .tag.round				{padding: 12px 20px 8px;}
#content.care #after .data-list[class*="col-"]			{--gapY: 24px;}
#content.care #after .item.normal.pack-down				{gap: 16px;}
@media all and (max-width: 960px){
	#content .after-center .contact[class*="pack-"],
	#content .after-center .contact > [class*="pack-"]			{
		flex-direction: column;
		align-items: flex-start;
	}
	#content .after-center .contact[class*="pack-"]			{gap: 24px;
	}
}
@media all and (max-width: 768px){
	#content.care .after-care-box				{width: 100%; padding: 40px 20px;}
	#content.care .after-care-box.gap-16		{gap: 32px;}
	#content.care .after-care-box > .pack-left-top.gap-16			{
		flex-direction: column;
	}
	#content.care .after-care-box .tag + .pack-list.fs-16			{width: 100%;}
	#content.care .zip-content .fs-64-40			{font-size: clamp(32px, 8.533vw, 64px); letter-spacing: clamp(-.4px, -0.853vw, -.64px);}
}


/*
	.tour
*/
#content.tour .buliding									{position: relative; overflow: hidden; height: calc(var(--vh100) - var(--header) - var(--page-header)); min-height: 620px;}
#content.tour .buliding	.swiper-container				{width: 100%; height: 100%;}
#content.tour #bldgSwiper .floor-txt					{position: absolute; right: 0; bottom: 0; width: calc(10vw + 80px); height: 100%; z-index: 3;}
#content.tour #bldgSwiper .swiper-pagination-txt		{position: absolute; right: 10vw; top: 0; height: 100%;}
#content.tour #bldgSwiper .swiper-pagination-txt.pack-down	{justify-content: center; align-items: flex-end;}
#content.tour #bldgSwiper .floor-txt .swiper-pagination-bullet		{width: fit-content; height: fit-content; opacity: 1; background: transparent;}
#content.tour #bldgSwiper .swiper-pagination-txt .swiper-pagination-bullet span	{display: inline-block; width: fit-content; height: auto; padding-bottom: 2px; white-space: nowrap;
	background-image: linear-gradient(#fff, #fff);
	background-repeat: no-repeat;
	background-position: left 0 bottom 1px;
	background-size: 0 1.2px;
	transition: all 100ms ease-in-out;
}
#content.tour #bldgSwiper .swiper-pagination-txt .swiper-pagination-bullet.swiper-pagination-bullet-active span	{background-size: 100% 1.2px;}
#content.tour .floor									{position: relative; overflow: hidden; height: 100%;}
#content.tour .floor .title-wrap						{position: absolute; top: 9%; left: 0; right: 0; z-index: 2;}
#content.tour .child-swiper								{position: static; }
#content.tour .child-swiper .swiper-slide .img-wrap		{width: 100%; height: 100%; margin: 0 auto;}
#content.tour .child-swiper .swiper-btns				{position: absolute; bottom: 6.4%; left: 0; right: 0; z-index: 2}
#content.tour .child-swiper .swiper-button-next,
#content.tour .child-swiper .swiper-button-prev			{background-color: #fff;}
#content.tour .child-swiper .swiper-button-next::after,
#content.tour .child-swiper .swiper-button-prev::after 	{background-color: #000;}
#content.tour .child-swiper .swiper-button-next.swiper-button-disabled,
#content.tour .child-swiper .swiper-button-prev.swiper-button-disabled			{background-color: rgba(255,255,255,.4);}
#content.tour .child-swiper .swiper-button-next.swiper-button-disabled::after,
#content.tour .child-swiper .swiper-button-prev.swiper-button-disabled::after 	{background-color: #fff;}
#content.tour .child-swiper .swiper-pagination				{bottom: 23px; width: 100%; max-width: 1200px; padding: 0 124px; gap: 4px;}
@media all and (max-width: 1240px){
	#content.tour #bldgSwiper .floor-txt					{width: calc(var(--gutter) + 80px);}
	#content.tour #bldgSwiper .swiper-pagination-txt		{right: var(--gutter);}
}

@media all and (max-width: 768px){
	#content.tour .floor .title-wrap						{padding-right: 100px;}
}

@media all and (max-width: 430px){
	#content.tour .buliding									{min-height: 592px;}
}

/*
	.information
*/
#content.information .tag.bg-e3	{padding: 7px 12px 5px; border-radius: 40px;}
#content.information .directions .direction		{flex: 1;}

/*
	.insurance
*/
#content.insurance .bg-wrap		{width: 100%; min-height: 400px; max-width: 1520px; margin: 80px auto 0; aspect-ratio : 3.8 / 1; background: url('../images/page/bg_insurance.png') no-repeat center 73%; background-size: cover;}
#content.insurance #insuranceSwiper,
#content.insurance #stepSwiper						{overflow: visible;}
#content.insurance #insuranceSwiper,
#content.insurance #stepSwiper						{width: 100%;}
#content.insurance #insuranceSwiper .swiper-slide,
#content.insurance #stepSwiper .swiper-slide		{width: fit-content;}
#content.insurance #insuranceSwiper .img-wrap	{aspect-ratio : 1 / 1.43; width: 282px;}
#content.insurance #insuranceSwiper .img-wrap .bg-gr	{position: absolute; top: 0; bottom: 0; left: 0; right: 0; padding: clamp(20px, 3.333vw, 40px); background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 46.78%, rgba(0, 0, 0, 0.8) 100%);
	display: flex;
	flex-direction: column-reverse;
}
#content.insurance #insuranceSwiper .img-wrap .bg-gr p	{line-height: 1.2;}

#content.insurance #stepSwiper .swiper-slide	{width: 232px;}
#content.insurance #stepSwiper .step	{width: 100%; height: 251px; padding: 39px 20px; border: 1px solid #000; text-align: center;}
#content.insurance #stepSwiper ol li .step.round .num {margin: 0 auto 12px; width: fit-content; min-width: 40px; height: 40px; line-height: 40px; background: #000; color: #fff;}
@media all and (max-width: 960px){
	#content.insurance .btns.pack-center{
		flex-direction: column;
	}
}
@media all and (max-width: 430px){
	#content.insurance #insuranceSwiper .img-wrap	{width: 160px;}
}
#content.insurance .guaranteed {position: relative;}
#content.insurance .guaranteed .img-wrap			{flex: 1; padding: 42px 0; aspect-ratio: 588 / 219; }
#content.insurance .guaranteed .circle				{position: absolute; top: 50%; left: 50%; }
#content.insurance .guaranteed .img-wrap .pack-down-center	{position: relative;}
#content.insurance .guaranteed .img-wrap .blur-10.round		{position: static;}
#content.insurance .guaranteed .circle				{width: 144px; height: 144px; border-radius: 144px;
	transform: translate(-50%, -50%);
}
@media all and (max-width: 960px){
	#content.insurance .guaranteed .img-wrap			{aspect-ratio: revert;}
	#content.insurance .guaranteed .circle				{display: none;}
}
@media all and (max-width: 768px){
	#content.insurance .guaranteed {
		flex-direction: column;
	}
	#content.insurance .guaranteed .img-wrap			{width: 100%;}
}
#content.insurance .sub-section.bg-000					{position: relative; background: url('../images/page/bg_doctor.png') no-repeat center; background-size: cover;}
#content.insurance .sub-section.bg-000 .mask			{position: absolute; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,.75)}
#content.insurance .sub-section.bg-000 .max-1200		{position: relative;}
#content.insurance .sub-section.bg-000 .pack-down-center.gap-40{max-width: 572px;}
#content.insurance .sub-section.bg-000 .specialist	{padding: 22px 25px 18px; border-radius: 80px;}
#content.insurance .sub-section.bg-000 .plus		{width: 56px; height: 56px;}
@media all and (max-width: 768px){
	#content.insurance .sub-section.bg-000					{background-position: 82% center;}
}
#content.insurance .promotion .pack-left-top	{
	align-items: stretch;
}
#content.insurance .promotion .bg-000.pack-down	{width: calc( 50% - 12px); padding: clamp(50px, 6.667vw, 72px) clamp(32px, 4.267vw, 50px) clamp(32px, 4.267vw, 50px);
	justify-content: space-between;
}
#content.insurance .promotion .bg-000.pack-down .round {display: inline-block; padding: 16px 30px 12px; border: 1px solid #fff;}
#content.insurance .promotion .bg-000.pack-down .round.fc-pink-light{ border-color: var(--light-pink);}
#content.insurance .promotion .bg-000.pack-down .round.fc-green{border-color: var(--pastel-green);}
#content.insurance .promotion .bg-000.pack-down .fs-64-36{margin-top: 12px;
	background-image: linear-gradient(#fff, #fff);
	background-repeat: no-repeat;
	background-position: left 0 bottom 1px;
	background-size: 100% 2px;
}
#content.insurance .promotion .bg-000.pack-down .fs-64-36.fc-pink-light{
	background-image: linear-gradient(var(--light-pink), var(--light-pink));
}
#content.insurance .promotion .bg-000.pack-down .fs-64-36.fc-green{
	background-image: linear-gradient(var(--pastel-green), var(--pastel-green));
}
#content.insurance .promotion .bg-000.pack-down .btn.medium	{width: 100%;}
@media all and (min-width: 769px){
	#content.insurance .promotion .bg-000.pack-down .fs-24-16{font-size: clamp(16px, 2.133vw, 24px); letter-spacing: clamp(-.16px, -.021vw, -.24px);}
	#content.insurance .promotion .bg-000.pack-down .fs-40-24{height: clamp(86px, 11.467vw, 144px);
		font-size: clamp(24px, 3.2vw, 40px); letter-spacing: clamp(-.24px, -.032vw, -.4px);
	}
	#content.insurance .promotion .bg-000.pack-down .fs-64-36{font-size: clamp(36px, 4.8vw, 64px); letter-spacing: clamp(-.36px, -.048vw, -.64px);}
}
@media all and (max-width: 768px){
	#content.insurance .bg-wrap		{max-height: 750px; margin-top: 40px; aspect-ratio : 1 / 2;}
	#content.insurance .promotion .pack-left-top	{
		flex-direction: column;
	}
	#content.insurance .promotion .bg-000.pack-down	{width: 100%;}
}

/*
	.nonbenefit
*/
#content.nonbenefit .tag.bg-e3	{padding: 7px 12px 5px; border-radius: 40px;}
#content.nonbenefit .directions .direction		{flex: 1;}
@media all and (max-width: 1240px){
	#content.nonbenefit .tab-content		{overflow-x: auto; margin-right: calc( var(--gutter) * -1); padding-right: var(--gutter);}
}

@media all and (max-width: 768px){
	#content.nonbenefit .tab-content		{border-left: 1px solid var(--sky);}
}