@charset "utf-8";

body {background:#fff;}


.slt_contents { position:relative; display:inline-block; width:100%; height:500px;  margin:0 auto; padding:30px 0 0 0;}
	

.slt_detail { display:inline-block; width:100%; background:#fff; border-radius:150px 0 0 0;}

.slt_inbox { margin:0 auto; width:1200px; display:flex; flex-wrap:wrap; text-align:left; color:#000; padding:100px 0;}
.slt_inbox span.slt_info_s1 { display:inline-block; width:35%; float:left; padding-right:50px;}
.slt_inbox span.slt_info_s2 { display:inline-block; width:65%; float:left; padding-left:50px;}
.slt_inbox span.slt_name { display:block; font-size:55px; font-weight:bold; padding-bottom:20px; font-family:'PolySans Bulky';}
.slt_inbox span.slt_summary { display:block; font-size:13px; line-height:1.7; color:#000;}

.slt_inbox span.section_title { display:block; border-top:1px solid #ddd; border-bottom:1px solid #ddd; margin:30px 0; padding:10px 0; font-size:19px; font-weight:bold;} 
.slt_inbox span.slt_dt_box { display:block; color:#555; line-height:1.7; font-size:13px;}


/* 서비스 대표 이미지 */
.slt_intro_img { position:relative; display:block; margin:91px 0 0 0;}
.slt_intro_img img.roll {width:100%; border-radius:15px; box-shadow:0 0 13px rgba(0, 0, 0, 0);}

/* 서비스 소개 홈페이지 바로가기 */
.slt_intro_img a.sv_quick_outlink { position:absolute; top:0%; right:0%; margin:-78px 0 0 0; display:inline-block; width:25px; height:25px;}
.slt_intro_img a.sv_quick_outlink img {width:100%; border-radius:0px; opacity:0.3; transition:all 0.2s;}
.slt_intro_img a.sv_quick_outlink img:hover { opacity:1;}


/* 지원 플랫폼 */
.slt_platform_box { display:inline-block; width:100%; padding:30px 25px 35px 25px; border-bottom:2px solid #ddd; border-radius:0 0 15px 15px;}
.slt_platform_box .plt_title { display:inline-block; width:100%; font-size:27px; padding-bottom:10px; font-family:'PolySans Bulky';}
.slt_platform_box .plt_info { display:inline-block; width:100%; font-size:13px; color:#555;}

.slt_platform { display:inline-block; width:100%; float:right; margin:22px 0px 0 0; padding:20px 0 0 0; border-top:1px dashed #eee;}
.slt_platform a.plt { color:#000; padding-left:22px; font-size:13px; margin-right:20px;}
.slt_platform a.btn_web {
	background:url('/img/solution/icon/icon_web.svg');
	background-size:17px;
	background-position:top 1px left;
	background-repeat:no-repeat;
}
.slt_platform a.btn_android {
	background:url('/img/solution/icon/icon_android.svg');
	background-size:17px;
	background-position:top 1px left;
	background-repeat:no-repeat;
}
.slt_platform a.btn_apple {
	background:url('/img/solution/icon/icon_apple.svg');
	background-size:17px;
	background-position:top 1px left;
	background-repeat:no-repeat;
}

.plt_purpose_list { list-style:none; padding:0; margin:30px 0 15px 0; font-size:13px; }
.plt_purpose_list li { margin:0px 0 15px 0; line-height:1.6; }
.plt_purpose_list strong { display:block; font-weight:bold; color:#000; margin-bottom:3px; }
.plt_purpose_list span { display:block; padding:0 0 0 15px; color:#555;}
			
			
			
			
/* 서비스 플랫폼 바로가기 */
.plt_quick { display:flex; width:100%; margin:30px 0 30px 0; gap:0 3px; background:#fff; }
.plt_quick .plt_section { position:relative; flex:0 0 33.33%; max-width:33.33%; background:#f5f6f7; aspect-ratio:1.3/1; box-sizing:border-box; padding:25px; border-radius:15px; transition:background-color 0.5s ease; overflow:hidden; }

.plt_quick .plt_title { position:absolute; top:25px; left:25px; font-weight:normal; color:#000; font-size:19px; font-family:'PolySans Bulky'; }
.plt_quick .plt_title span.small { display:block; font-size:11px; font-family:'PolySans Slim Italic'; color:#555; }

.plt_quick .plt_link { position:absolute; bottom:23px; left:25px; color:#333; font-size:15px; }
.plt_quick .plt_link img { width:70px; border-radius:10px; filter:grayscale(100%); opacity:0.5; transition:filter 0.5s ease, opacity 0.5s ease; }

.plt_quick .plt_section:hover .plt_link img { filter:none; opacity:1; }
.plt_quick .plt_section::after { content:""; position:absolute; top:23px; right:23px; width:20px; height:20px; background:url('/img/solution/icon/external-link.svg') no-repeat center center; background-size:20px; opacity:0; transition:opacity 0.5s ease; }
.plt_quick .plt_section:hover::after { opacity:1; }



@media (max-width: 767px) {

.slt_contents { position:relative; display:inline-block; width:100%; height:300px;  margin:0 auto; padding:30px 0 0 0;}
	
.slt_detail { display:inline-block; width:100%; background:#fff; border-radius:150px 0 0 0;}

.slt_inbox { margin:0 auto; width:100%; display:flex; flex-wrap:wrap; text-align:left; color:#000; padding:50px 20px;}
.slt_inbox span.slt_info_s1 { display:inline-block; width:100%; float:left; padding-right:0px;}
.slt_inbox span.slt_info_s2 { display:inline-block; width:100%; float:left; padding-left:0px;}
.slt_inbox span.slt_name { display:block; font-size:3rem; font-weight:bold; padding-bottom:20px; font-family:'PolySans Bulky';}
.slt_inbox span.slt_summary { display:block; font-size:0.9rem; line-height:2; color:#000;}

.slt_inbox span.section_title { display:block; border-top:1px solid #ddd; border-bottom:1px solid #ddd; margin:30px 0; padding:10px 0; font-size:1.3rem; font-weight:bold; line-height:1.7;} 
.slt_inbox span.slt_dt_box { display:block; color:#555; line-height:2; font-size:0.9rem;}


/* 서비스 대표 이미지 */
.slt_intro_img { position:relative; display:block; margin:70px 0 0 0;}
.slt_intro_img img.roll {width:100%; border-radius:15px; box-shadow:0 0 13px rgba(0, 0, 0, 0);}

/* 서비스 소개 홈페이지 바로가기 */
.slt_intro_img a.sv_quick_outlink { position:absolute; top:0%; right:0%; margin:-40px 10px 0 0; display:inline-block; width:25px; height:25px;}
.slt_intro_img a.sv_quick_outlink img {width:100%; border-radius:0px; opacity:0.3; transition:all 0.2s;}
.slt_intro_img a.sv_quick_outlink img:hover { opacity:1;}


/* 지원 플랫폼 */
.slt_platform_box { display:inline-block; width:100%; padding:30px 25px 35px 25px; border-bottom:2px solid #ddd; border-radius:0 0 15px 15px;}
.slt_platform_box .plt_title { display:inline-block; width:100%; font-size:27px; padding-bottom:10px; font-family:'PolySans Bulky';}
.slt_platform_box .plt_info { display:inline-block; width:100%; font-size:13px; color:#555;}

.slt_platform { display:inline-block; width:100%; float:right; margin:22px 0px 0 0; padding:20px 0 0 0; border-top:1px dashed #eee;}
.slt_platform a.plt { color:#000; padding-left:22px; font-size:13px; margin-right:20px;}
.slt_platform a.btn_web {
	background:url('/img/solution/icon/icon_web.svg');
	background-size:17px;
	background-position:top 1px left;
	background-repeat:no-repeat;
}
.slt_platform a.btn_android {
	background:url('/img/solution/icon/icon_android.svg');
	background-size:17px;
	background-position:top 1px left;
	background-repeat:no-repeat;
}
.slt_platform a.btn_apple {
	background:url('/img/solution/icon/icon_apple.svg');
	background-size:17px;
	background-position:top 1px left;
	background-repeat:no-repeat;
}

.plt_purpose_list { list-style:none; padding:0; margin:30px 0 15px 0; font-size:13px; }
.plt_purpose_list li { margin:0px 0 15px 0; line-height:1.6; }
.plt_purpose_list strong { display:block; font-weight:bold; color:#000; margin-bottom:3px; }
.plt_purpose_list span { display:block; padding:0 0 0 15px; color:#555;}
			
			
			
			
/* 서비스 플랫폼 바로가기 */
.plt_quick { display:flex; width:100%; margin:30px 0 30px 0; gap:0 3px; background:#fff; }
.plt_quick .plt_section { position:relative; flex:0 0 33.33%; max-width:33.33%; min-height:120px; background:#f5f6f7; aspect-ratio:1.3/1; box-sizing:border-box; padding:15px; border-radius:15px; transition:background-color 0.5s ease; overflow:hidden; }

.plt_quick .plt_title { position:absolute; top:15px; left:15px; font-weight:normal; color:#000; font-size:0.9rem; font-family:'PolySans Bulky'; }
.plt_quick .plt_title span.small { display:block; font-size:0.55rem; font-family:'PolySans Slim Italic'; color:#555; }

.plt_quick .plt_link { position:absolute; bottom:10px; left:15px; color:#333; font-size:15px; }
.plt_quick .plt_link img { width:30%; border-radius:5px; filter:grayscale(100%); opacity:0.5; transition:filter 0.5s ease, opacity 0.5s ease; }

.plt_quick .plt_section:hover .plt_link img { filter:none; opacity:1; }
.plt_quick .plt_section::after { content:""; position:absolute; top:17px; right:13px; width:15px; height:15px; background:url('/img/solution/icon/external-link.svg') no-repeat center center; background-size:15px; opacity:0; transition:opacity 0.5s ease; }
.plt_quick .plt_section:hover::after { opacity:1; }


}