@charset "utf-8"; 

h4							{position:relative; font-family:'Paperlogy'; font-weight:600; font-size:1.5em; color:#222; letter-spacing:0; line-height:1.2; margin-bottom:20px; padding-left:30px;}
h4:before					{position:absolute; top:6px; left:0; content:''; width:19px; height:19px; border:6px solid transparent; background-image:linear-gradient(#fff, #fff), linear-gradient(135deg, #48a67d 10%, #1998ac 100%); background-origin:border-box; background-clip:content-box, border-box;}
h4 span						{font-size:18px; letter-spacing:-0.75px; color:#797979; margin-left:10px;}
h5							{position:relative; font-family:'Paperlogy'; font-weight:500; font-size:1.2em; line-height:1.3; margin-bottom:12px; padding-left:16px; letter-spacing:0; color:#333;} 
h5:before					{position:absolute; top:5px; left:0; content:''; width:5px; height:18px; border-radius:5px; background:var(--color2);}
h5 span						{font-size:16px; letter-spacing:-0.75px; color:#797979; margin-left:5px;}
.sub_wrap h6				{display:block; font-weight:500; color:#333; font-size:0.95em; margin-bottom:10px; letter-spacing:-.75px;}
.sub_wrap h6 i				{color:var(--color1); margin-right:7px;}
.sub_txtline				{font-weight:500; box-shadow: inset 0 -10px 0 #ddecff; padding:0 3px; color:#000;}

.sub_cont01					{padding-left:5px; text-align:justify;}  
.sub_cont02					{padding-left:10px; text-align:justify;}  
.sub_list01					{position:relative; list-style:none; padding:3px 0 3px 12px; line-height:150%;}
.sub_list01:after			{position:absolute; content:''; display:block; left:0; top:14px; width:4px; height:4px; background:var(--color2); border-radius:100%;}
.sub_list02					{position:relative; list-style:none; padding:1px 0 1px 12px;}
.sub_list02:after			{position:absolute; content:''; display:block; left:0; top:14px; width:5px; height:1px; background:#222;}
.sub_cont01>li:first-child	{padding-top:0;}

.sub_table					{border-top:1px solid #333; border-collapse:collapse; width:100%; table-layout:fixed; font-size:0.95em;} 
.sub_table thead th			{font-weight:700; color:#111; padding:13px 8px; border-bottom:1px solid #dddee0; border-right:1px solid #dddee0; border-left:1px solid #dddee0; text-align:center; background-color:#F3F3F3; }
.sub_table thead th:first-child	{border-left-color:#F3F3F3;}
.sub_table thead th:last-child	{border-right:1px solid #F3F3F3;}
.sub_table tbody th			{font-weight:600; color:#333; line-height:150%; padding:13px 10px; border-bottom:1px solid #ddd; border-right:1px solid #ddd; background-color:#fafafa; text-align:center;}
.sub_table thead th[colspan]	{padding:5px;}
.sub_table tbody td			{line-height:150%; padding:13px 10px; border-left:1px solid #ddd; border-bottom:1px solid #ddd; border-right:1px solid #ddd; background-color:#fff; }
.sub_table tbody td:first-child{border-left:1px solid #fff;}
.sub_table tbody th:last-child, .sub_table tbody td:last-child	{border-right:1px solid #fff;}
.sub_table tbody .stxt		{font-size:0.95em; letter-spacing:0;}


@media screen and (max-width:1024px) { 
	h4						{font-size:1.2em; margin-bottom:12px; padding-left:21px;}
	h4:before				{top:5px; width:15px; height:15px; border-width:5px;}
	h5						{font-size:1.05em; margin-bottom:10px;}

	.sub_list01				{padding:2px 0 2px 10px;}
	.sub_list01:after		{top:12px;}

	.sub_table thead th, .sub_table tbody th, .sub_table tbody td	{padding:10px 5px; font-size:0.95em;}
}	


/* 서브 디자인  ================================================================================== */
.introTop						{position:relative; padding-top:280px; margin-top:-20px;}
.introTop figure				{position:absolute; right:0; top:0; }
.introTop figure img			{border-radius:80px 20px 20px 20px; box-shadow:0 0 20px 1px rgba(0,0,0,.1);}
.introTop .tit					{font-family:'Paperlogy'; color:#111; font-weight:300; background:url('../img/sub/aa01.png') no-repeat 95% 220% #f2f3f5; padding:100px 40px 50px 60px; font-size:1.9em; line-height:1.4;}
.introTop .tit strong			{display:block; font-weight:700; color:var(--color2);}
.introTop .cont					{padding:40px 20px; font-size:1.1em; line-height:1.6; letter-spacing:-1px;}

.introMap #map_canvas			{position:relative; width:100%; aspect-ratio:6 / 2.5; border:1px solid #dfdfdf; border-radius:20px;}
.introMap ul					{padding:25px 0; display:flex; justify-content:space-evenly; gap:0 20px; align-items:center; border-bottom:1px solid #ddd;}
.introMap>ul>ul					{padding:0; border:0;}
.introMap ul li					{position:relative;  position:Relative; color:#777;}
.introMap>ul>li:first-child		{font-family:'Paperlogy'; font-weight:500; font-size:1.15em; color:#333; letter-spacing:0;}
.introMap>ul>ul>li				{padding-left:65px;}
.introMap strong				{display:block; font-size:17px; letter-spacing:0; color:#111;}
.introMap i						{cursor:auto;}
.introMap>ul>ul>li i			{position:absolute; top:5px; left:0; background:#f0f0f0; color:#000; width:50px; line-height:50px; border-radius:100%; text-align:center;}
.introMap>ul>li:first-child i	{font-size:28px; margin-right:10px; color:var(--color2);}
.introMap .mapoverlay			{position:relative;margin-left:5px;bottom:45px;padding:5px 12px; background:#fff; box-shadow:0 0 10px 1px rgba(0,0,0,0.1);  border-radius:5px;}
.introMap .mapoverlay::after	{position:absolute;content:'';left:50%;bottom:-16px;width:16px;height:16px; background:url('../img/sub/map_localimg.png') no-repeat;}
.introMap .mapoverlay .title	{font-size:15px;}
.introMap .mapoverlay .title span	{font-weight:500;}
.introMap .mapoverlay .add		{display:none;}

.sub_step					{display:grid; gap:12px; text-align:center;}
.sub_step.step4				{grid-template-columns:repeat(4, 1fr);}
.sub_step.step5				{grid-template-columns:repeat(5, 1fr);}
.sub_step dl				{position:relative; background:#ededed; border-radius:15px; padding:12px 10px; letter-spacing:-1px;}
.sub_step dl:before			{content:''; position:absolute; top:29px; right:-15px; width:15px; height:3px; background:var(--color2);}
.sub_step dl:after			{content:''; position:absolute; top:21px; right:-20px; width:0; height:0; border-left:12px solid var(--color2); border-top:9px solid transparent; border-bottom:9px solid transparent; z-index:1; border-radius:3px;}
.sub_step dl:last-child:before, .sub_step dl:last-child:after	{display:none;}
.sub_step dl dt				{color:#000; font-family:'Paperlogy'; font-weight:500; font-size:1.05em; margin:5px 0 10px 0;}
.sub_step dl dd				{background:#fff; padding:15px 0; border-radius:10px; font-size:0.95em; line-height:1.4;}
.sub_step.step4 dl			{display:grid; align-items:center;}
.sub_step.step4 dl dt		{margin:0;}
.sub_step.step4 dl:before	{top:45%;}
.sub_step.step4 dl:after	{top:35%;}


@media screen and (max-width:1024px) { 
	.introTop					{margin:0; padding-top:28%;}
	.introTop figure			{text-align:right; width:95%;}
	.introTop .tit				{font-size:1.4em; padding:12% 20px 20px 20px;}
	.introTop .cont				{padding:20px; font-size:0.95em;}

	.sub_step					{gap:10px;}
	.sub_step dl				{padding:7px;}
	.sub_step dl dt				{font-size:1em; margin:0 0 5px 0;}
	.sub_step dl dd				{padding:10px 5px;}
	.sub_step dl dd br			{display:none;}
	.sub_step dl:before			{display:none;}
	.sub_step dl:after			{top:auto; bottom:-10px; right:0; left:0; margin:auto; border-left-width:9px; border-top-width:7px; border-bottom-width:7px; transform:rotate(90deg);}
	.sub_step.step4, .sub_step.step5	{grid-template-columns:1fr;}
	.sub_step.step4 dl:after	{top:auto;}

	.introMap ul						{padding:15px 5px; display:grid; justify-content:unset; gap:3px 0;}
	.introMap ul li, .introMap>ul>li:first-child		{font-size:1.05em;}
	.introMap>ul>ul>li					{padding:0;}
	.introMap>ul>ul>li i				{position:relative; top:0; width:32px; line-height:32px; margin-right:7px; font-size:13px;}
	.introMap strong					{display:inline-block; font-size:15px; margin:0; margin-right:10px;}
	.introMap>ul>li:first-child i		{width:32px; line-height:32px; margin-right:7px; font-size:13px; text-align:Center; background:#f0f0f0; color:#000; border-radius:100%;}
}	

