@charset "utf-8"; /* */
/**
* @author CodeClicker
*/

.main_section06_container  { background: #1F272D; overflow-x: hidden;}
.main_section06_container p { color: #fff; }
.main_section06_container .main-title-wrapper { text-align: center; }
.main_section6_contents_container { margin-top: 210px; }
.main_section6_contents_wrapper { display: flex; flex-direction: row; justify-content: center; align-items: center;  max-width: 90%; margin: 0 auto;} 
.main_section6_contents_wrapper .section_process_container {  margin-left: 57px; margin-right: 40px; }
.main_section6_contents_wrapper .section_process_container .process_bar_wrapper { width: 3px; height:  479px; background: #505050; overflow: hidden; }
.main_section6_contents_wrapper .section_process_container .process_bar_wrapper .bar {height:0%; width: 100%; background: #BFBFBF;  transition: height 3s;}


.main_section6_contents_wrapper .section_contents_wrapper { display: flex; flex-direction: column; gap: 93px; }
.main_section6_contents_wrapper .section_contents_box { display: flex;  align-items: flex-start; cursor: pointer; }
.main_section6_contents_wrapper .section_contents_box .icon_wrapper { margin-right: 26px; }
.main_section6_contents_wrapper .section_contents_box .icon_wrapper img { width: 26px; height: 26px; }
.main_section6_contents_wrapper .section_contents_box .tp-title {font-size: 24px; margin-bottom: 25px; color: #8B8B8B; transition: color 0.5s;}
.main_section6_contents_wrapper .section_contents_box .ct-title {font-size: 16px; font-weight: 600; line-height: 20px;
letter-spacing: 0.8px; color: #8B8B8B; transition: color 0.5s;}

.main_section6_contents_wrapper .section_contents_box.active .tp-title { color: #fff; transition: color 0.3s;}

.main_section6_contents_wrapper .section_contents_box.active .ct-title { color: #fff; transition: color 0.3s;}

.main_section6_contents_wrapper.swiper_container { display: none; }

.main_section6_contents_wrapper .section_img_container {max-width: 653px; height: 653px; width: 100%; position: relative;}
.main_section6_contents_wrapper .section_img_container img { opacity: 0; visibility: hidden; position: absolute;  width: 100%; height: auto; top: 50%; transform: translateY(-50%); transition: opacity 1s ease-in-out;}
.main_section6_contents_wrapper .section_img_container img.img-step1 {visibility: visible; opacity: 1;}


@media screen and (max-width: 768px) {
	
	.main_section6_contents_wrapper.default { display: none; }
	.main_section6_contents_wrapper.swiper_container {  display: block; padding: 0; }
	
	.main_section6_contents_container {margin-top: 60px;}
	.main_section6_contents_wrapper { padding: 0 15px; flex-direction: column; }
	.main_section6_contents_wrapper .section_process_container { position: relative; margin: 30px 0 96px;}
	.section6_swiper_container { position: relative; padding: 0 15px; }

	.main_section6_contents_wrapper .section_process_container .process_bar_wrapper { display: none; }
	
	.main_section6_contents_wrapper .section_contents_box { margin-top: 130px; }
	.main_section6_contents_wrapper .section_contents_box .tp-title { font-size: 20px; line-height: 26.051px; letter-spacing: 1px; margin-bottom: 14px;}
	
	.main_section6_contents_wrapper .section_contents_box .ct-title { font-size: 14px; font-weight: 400; line-height: 15.324px; letter-spacing: 0.7px;}
	
	.section6_swiper_container .swiper-pagination.custorm_bar { top: 53%; width: 92%; margin: 0 15px; background: #505050;}
	.section6_swiper_container .swiper-pagination.custorm_bar .swiper-pagination-progressbar-fill {background: #BFBFBF;}
	
	.main_section6_contents_wrapper .section_img_container {max-width: 100%; height: 100%; width: 100%; position: relative;}
	.main_section6_contents_wrapper .section_img_container img {visibility: visible; position: relative; top: 0; transform: unset; opacity: 1;}
}