﻿@charset "utf-8";
/* title zone 22/12/08 수정  */
.title_zone {margin-top:146px; background: #e2e4e9;position:relative;}

/* 메인슬라이드 22/12/21수정 */
.post_slider_outer {display: flex;width: 90%;max-width: 1200px;margin: 0 auto;align-items: center;height: 440px}
.post_slider {width:50%;max-width:540px;max-height: 380px;padding:0;z-index:3}
.post_slider .slick-list {width:100%;border-radius: 5px;padding: 0!important;}
.post_slider .post_wrapper {box-sizing:border-box;overflow:hidden;}
.post_slider .post_wrapper img {width:100%;}
/* 메인슬라이드 -  좌우화살표버튼 */
.post_slider .slick-arrow{width:30px;height:30px;cursor:pointer;z-index:2}
.post_slider .slick-prev:before,
.post_slider .slick-next:before {font-size: 30px;opacity: .75;}
.post_slider .slick-prev {left:-15px;}
.post_slider .slick-next {right:-15px;}
/* 메인슬라이드 배경전환 */
.post_bg_wrap{width:100%;margin:auto;position: absolute;top:0;left:0}
.post_bg > li {display:block;width:100%;z-index:1;transition: background-color 350ms ease-in-out }
.post_bg > li.current {height:440px;}
.post_bg > li.bg_01 {background-color:rgb(4, 82, 233);}
.post_bg > li.bg_02 {background-color:rgb(159, 112, 251)}
.post_bg > li.bg_03 {background-color:rgb(49, 210, 231)}
.post_bg > li.bg_01.current {background-color:rgb(159, 112, 251);}
.post_bg > li.bg_02.current {background-color:rgb(49, 210, 231)}
.post_bg > li.bg_03.current {background-color:rgb(4, 82, 233);}
/* 메인슬라이드 우측박스 */
.post_right_bx {margin-left: 60px;width:100%;max-width: 600px;z-index:4}
.post_right_bx .main_tit {margin-top: 10px;color: #fff;font-size: 42px;font-weight: 600;line-height: 64px;}
/* 메인슬라이드 우측박스 - 작은배너 23/04/20 수정*/
.post_right_bx .post_slider_small {width:100%;max-width: 600px;margin-top: 60px;}
.post_right_bx .post_slider_small img {width:100%;}
.post_right_bx .post_slider_small .slick-arrow{display: none!important}
.post_slider_small .slick-list {width:100%;border-radius: 5px;padding: 0!important;}
.post_slider_small .post_wrapper {box-sizing:border-box;overflow:hidden;}

/*메인 - 견적신청 카테고리*/
.main_category_sec {margin-top: 80px}
.main_category_sec .inner {display: flex;}
.category_tit {display: flex;flex: 1 1 18%;flex-direction: column;justify-content: center;}
.category_tit  em.tit {display: block;color: #333;font-size: 30px;font-weight: 600;}
.category_tit  P.txt {display: block;margin-top:14px; font-size: 16px;line-height: 22px;color: #777;font-weight: 400;word-break:keep-all}
.category_lst {flex: 1 1 82%;display:flex;justify-content: space-between;}
.category_lst li.box {display: flex;flex:1 1 12.5%}
.category_lst li a {display:flex;flex-direction: column;justify-content: center;align-items: center;width:100%;height: 136px;transition: all 0.2s ease-out 0s;}
.category_lst li a img {width:100%;max-width: 50px;max-height: 50px;}
.category_lst li a:hover, .service_menu li a:active{box-shadow: 10px 10px 14px 8px rgba(0, 0, 0, 0.1);}
.category_lst li .txt {margin-top:22px;font-size:16px;color:#333;text-align:center}

/*메인 - ad 3컬럼*/
.main_ad_sec {margin-top: 80px}
.main_ad_sec .inner {display: flex;}
.ad_col3 {display: flex;justify-content: space-between;width:100%}
.ad_col3 li {display: flex;width:33.3%;justify-content: center;}
.ad_col3 li .left {display: flex;align-items: center;}
.ad_col3 li .right {min-width:180px;margin-left: 20px;}
.ad_col3 li .right .title {font-size: 16px;color: #333;}
.ad_col3 li .right .sub_desc {display: block;margin-top:8px;font-size: 14px;line-height: 18px;color: #777}

/*content - 추천상품     23/07/20 수정*/
.main_gallery_sec {margin-top:80px;display: flex;}
.gallery_tit {display: flex;flex: 1 1 18%;flex-direction: column;justify-content: center;}
.gallery_tit .tit {color: #333;font-size: 30px;font-weight: 600;}
.gallery_lst {display: flex;flex-wrap: wrap;justify-content: flex-start;}
.gallery_lst li.box + li.box {margin-left: 2.66666%;} 
.gallery_lst li:nth-child(5) {margin-left:0!important}
.gallery_lst li.box {flex:0 1 23%;margin-top: 30px;border-radius:6px}
.gallery_lst li a {display:flex;flex-direction:column}
.gallery_lst li a img {width: 100%;border-radius: 5px;}
.gallery_lst li a .bottom {display: flex;flex-direction:column;}
.gallery_lst li a .bottom p {color:#333;font-family:'Noto Sans KR', sans-serif;letter-spacing:-0.5px;}
.gallery_lst li a .bottom p.tit {margin-top: 12px;font-size: 16px; font-weight: 500;}
.gallery_lst li a .bottom p.txt {margin-top: 4px;font-size:14px;line-height:22px;color:#777}
.gallery_lst li a .bottom p.txt_link {margin-top: 4px;font-size:14px;color:#004299;}

/*맞춤제작 22/11/09 추가 */
.main_banner_sec {position:relative;margin-top: 80px; }
.main_banner_sec::before {content: '';position: absolute;bottom: 0;display: block;width: 100%;height:140px;background: #004299;}
.main_banner_sec .holder {position: relative;display: flex;justify-content:space-between;align-items: flex-start;}
.main_banner_sec .banner_txt_bx {flex:0 0 40%;width: 40%;}
.main_banner_sec .banner_txt_bx .banner_txt  {width:100%;max-width:464px;margin-top: 100px;}
.main_banner_sec .banner_txt_bx .bn_btn  {display:flex;align-items: center;justify-content: center;width:220px;height: 52px;margin:40px 0 0;color:#004299;font-size: 18px; font-weight:500;border-radius: 3px;background: rgba( 255, 255, 255, 0.5 );border:1px solid #004299;text-align:center;}
.main_banner_sec .banner_txt_bx a.bn_btn:hover,
.main_banner_sec .banner_txt_bx a.bn_btn:active{box-shadow: 4px 4px 3px 2px rgba(0, 0, 0, 0.2); transition: all 0.4s;}
.main_banner_sec .banner_img_bx {flex:0 0 60%;width:60%;padding-left: 20px;text-align: right;box-sizing: border-box;}
.main_banner_sec .banner_img_bx .banner_img {width:100%;max-width:608px;padding:0 0 80px 0;}

/*content - 서비스이용에 도움받기 - 22/12/21 수정*/
.main_help_sec {margin: 100px 0;}
.main_help_sec .inner {display: flex;}
.help_lst {flex: 1 1 50%; width:50%;display:flex;justify-content: space-between;}
.help_lst li.box {display: flex; flex:0 0 48%;background:rgba(0, 66, 153, 0.1)}
.help_lst li a {display:flex;flex-direction: column;justify-content: center;align-items: center;width:100%;height: 100%;padding: 40px 0;transition: all 0.2s ease-out 0s;box-sizing: border-box;}
.help_lst li a img {width:100%;max-width: 50px;max-height: 50px;}
.help_lst li a:hover, .service_menu li a:active{background:rgba(0, 66, 153, 0.15)}
.help_lst li .txt {margin-top:22px;font-size:16px;color:#333;text-align:center}
.help_lst li .txt_link {margin-top:8px;font-size: 14px;color:#004299;}

/* notice_bx -  22/12/21 추가*/
.main_help_sec .notice_bx {display: flex;flex-direction: column;flex-wrap: wrap;flex:0 0 48%;margin-left:2%;width:50%;border:1px solid #004299;box-sizing:border-box;}
.main_help_sec .notice_bx .notice_tit {display: flex;width: 100%;align-items: center;justify-content: space-between;height: 42px;background: #004299;}
.main_help_sec .notice_bx .notice_tit .n_tit {margin-left: 14px;font-size: 16px;color: #fff;}
.main_help_sec .notice_bx .notice_tit .more {position:relative;display:block;height: 42px; line-height: 42px;margin-right: 26px;font-size: 14px;color: #fff;}
.main_help_sec .notice_bx .notice_tit .more:after {content: ''; position: absolute; width: 8px; height: 8px;top: 50%; right:-12px; margin-top: -4px; border-top: #fff 2px solid; border-right: #fff 2px solid; -webkit-transform: rotate(45deg); transform: rotate(45deg) }
.main_help_sec .notice_bx ul.lst_notice {display: flex;flex-direction: column;width:100%;margin:12px 0; }
.main_help_sec .notice_bx ul.lst_notice li {padding:0 20px;color:#004299;box-sizing: border-box;}
.main_help_sec .notice_bx ul.lst_notice li a {position: relative;display: block;padding-left: 16px;height: 36px;line-height: 36px;font-size:15px;color:#777;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor: pointer;}
.main_help_sec .notice_bx ul.lst_notice li a:hover {color:#004299;}
.main_help_sec .notice_bx ul.lst_notice li a:before {content: "";position:absolute; top:calc(50% - 3px); left:0; width:6px;height:6px;background: #004299;border-radius: 50%;color:#004299;}




@media screen and (max-width:1280px){
	
	/* 메인슬라이드 우측박스 - 22/12/17 수정 */
	.post_right_bx {margin-left: 40px;}
	.post_right_bx .main_tit {font-size: 36px;line-height: 48px;}
	
	}


/* 태플릿용1 - 22/12/21추가*/
@media screen and (max-width:1024px){

	/* 메인슬라이드 22/12/21 수정 */
	.post_slider_outer {height: 390px;}	
	/* 메인슬라이드 배경전환 22/12/21 수정 */
	.post_bg > li.current {height:390px;}
	/* 메인슬라이드 우측박스 */
	.post_right_bx .main_tit {margin-top: 0px;font-size: 32px;line-height: 44px;}
	/* 메인슬라이드 우측박스 - 작은배너*/
	.post_right_bx .post_slider_small {margin-top: 20px;}
	.post_right_bx .post_slider_small img {width:100%;}

	/* 맞춤제작 22/11/21추가 */
	.main_banner_sec .banner_txt_bx .banner_txt  {margin-top: 30px;}
	.main_banner_sec .banner_txt_bx .bn_btn  {width:200px;height: 48px;margin:30px 0 0;font-size: 16px; }

	/*content - 서비스이용에 도움받기 - 22/12/21 수정*/
	.main_help_sec {margin: 60px 0;}

	}

/* 태플릿용2 */
@media screen and (max-width:768px){
	
	/* title zone 22/12/21수정  */
	.title_zone {margin-top:52px;}	
	
	/* 메인슬라이드 22/12/21 수정 */
	.post_slider_outer {flex-wrap:wrap;justify-content: center;align-content: center;height:640px;}
	.post_slider {width:70%}
	/* 메인슬라이드 배경전환 22/12/21 수정 */
	.post_bg > li.current {height:640px;}
	/* 메인슬라이드 우측박스 */
	.post_right_bx {margin-left:0px;margin-top: 20px;}

	/*content - 추천상품   230720 수정*/
    .main_gallery_sec {margin-top:60px}
    .gallery_lst li.box {flex:0 1 48%;}
    .gallery_lst li.box + li.box {margin-left: 4%;} 
    .gallery_lst li.box:nth-child(odd) {margin-left:0!important}
    .gallery_lst li.box:nth-child(n+3) {margin-top:20px}


	/* 맞춤제작 22/12/21수정 */
	.main_banner_sec {margin-top:0;}
	.main_banner_sec::before {height:120px;}
	.main_banner_sec .holder {flex-direction: column;align-items:center;}
	.main_banner_sec .banner_txt_bx {width: 100%;}
	.main_banner_sec .banner_txt_bx .banner_txt  {margin-top: 60px;}
	.main_banner_sec .banner_img_bx {margin-left: 0;width:100%}
	.main_banner_sec .banner_img_bx .banner_img  {width:80%;padding:20px 0 60px 0;}
	
	/*content - 서비스이용에 도움받기*/
	.main_help_sec {margin: 40px 0 70px;}
	.main_help_sec .inner {flex-direction: column;}
	.help_tit {flex: 1 1 100%;}
	.help_lst {flex:1 1 100%;width:100%;margin-top:20px;}

	/* notice_bx -  22/12/21 추가*/
	.main_help_sec .notice_bx {flex:0 0 100%;margin-left:0%;width:100%;margin-top: 30px;}
	
	}
	

/* 모바일용 */
@media screen and (max-width:425px){

	/* 메인슬라이드 22/12/21  */
	.post_slider_outer {height:520px;}
	.post_slider {width:100%}		
	/* 메인슬라이드 배경전환 22/12/21  */
	.post_bg > li.current {height:520px;}
	/* 메인슬라이드 우측박스 */
	.post_right_bx .main_tit {font-size: 28px;line-height: 42px;}

	/*메인 - ad 3컬럼 */
	.main_ad_sec {margin-top: 60px}
	.ad_col3 {flex-direction: column;}
	.ad_col3 li {width:100%;}
	.ad_col3 li + li {margin-top: 26px;}
	.ad_col3 li .right {margin-left: 30px;}

	/*맞춤제작 - 22/12/21추가 */
	.main_banner_sec .banner_img_bx .banner_img  {width:100%;}

	/*content - 서비스이용에 도움받기*/
	.help_lst {margin-top:0;}
	.help_lst li.box { margin-top: 12px;}
	.help_lst li a img {width:100%;max-width: 50px;max-height: 50px;}
	.help_lst li .txt {margin-top:12px}
}