@charset "utf-8";

/*
 * main CSS Document
 * KOWEB
 */

.main:before {content: "";height: 75%;background: #f6f6f8;position: absolute;right: 0;top: 0;z-index: -1;width: -webkit-calc(50% - -160px);width: calc(50% - -310px);}

/* visual */
.area_visual{position:relative;padding-top: 55px;}
.area_visual .list li,
.area_visual .bx-viewport{height: 468px;}
.area_visual .list li{background-repeat:no-repeat;background-position:50% 50%;background-size:cover;border: 1px solid #f5f5f5;}
.area_visual .list li p{font-family:'GyeonggiTitleM';}
.area_visual .list li > *{padding-left:110px;}
.area_visual .list li > h2{line-height:1;margin-top:180px;font-size:49px;color:#272727;letter-spacing:-0.5rem;text-indent:-1px;}
.area_visual .list li > p{margin-top:11px; font-weight:600; font-size:27px; color:#222; letter-spacing:-0.25rem;}

/* bx pager common set */
.bx-controls{position:absolute;top: 48%;z-index: 50;width:100%;}
.bx-controls > .bx-pager{width:1200px; margin:0 auto;}
.bx-controls > .bx-pager a{display:block; float:left; overflow:hidden; margin:0 3px; width:12px; height:12px; border:1px solid #222; text-indent:-9999px; transition:all 0.4s ease-out 0s; border-radius:40px;}
.bx-controls > .bx-pager > div{float:left; margin-right:10px;}
.bx-controls > .bx-pager a.active{background:#222;}

/* 이전다음버튼일때 */
.area_visual .bx-controls > div{position:relative;}
.area_visual .bx-controls-direction a.bx-prev:After{transform:rotate(180deg); -webkit-transform:rotate(180deg);}
.area_visual .bx-controls-direction a:hover{opacity:1;}
.area_visual .bx-controls-direction a{display:block;position:absolute;opacity: 0.3;overflow:hidden;width: 21px;height: 33px;text-indent:-9999px;transition:all 0.2s ease-out 0s;transform:scale( 1.0 );}
.area_visual .bx-controls-direction a:after{content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:url(../images/main/arr_slider01.svg) no-repeat 50% 50%;}
.area_visual .bx-controls-direction a.bx-next{right: -49px;}
.area_visual .bx-controls-direction a.bx-prev{left: -48px;}

/* 페이지넘어가는 0103 */
.area_visual .box_total{position:absolute; top:765px; left:0; z-index:999; width:100%;}
.area_visual .box_total > div{width:1400px; margin:0 auto;}
.area_visual .box_total > div *{font-weight:bold; font-size:14px; color:#fff;}
.area_visual .box_total > div em{position:relative; margin-right:24px;}
.area_visual .box_total > div em:after{content:""; position:absolute; opacity:0.4; top:4px; right:-13px; width:2px; height:10px; background:#fff; border-radius:10px;}
.area_visual .box_total > div span{opacity:0.5;}

/* 일정 */
.container_top{display:flex; margin-top:51px;}
.main [data-tit] h2{font-weight:700; font-size:27px; color:#222; letter-spacing:-0.25rem;}

.main .container_top [data-tit],
.main .container_middle [data-tit]{margin-bottom:22px;}
.main .container_top [data-tit] p,
.main .container_middle [data-tit] p{position:relative; margin:0 6px; padding-left:11px; font-family:'GyeonggiTitleM'; font-weight:100; font-size:14px; color:#777;}
.main .container_top [data-tit] > *,
.main .container_middle [data-tit] > *{display:inline-block;}
.main .container_top [data-tit] p i,
.main .container_middle [data-tit] p i{font-weight:300; color:#222;}
.main .container_top [data-tit] p:after,
.main .container_middle [data-tit] p:after{content:""; position:absolute; top:3px; left:0; width:2px; height:12px; background:#dcdcdc;}


.area_day{margin-right:65px; min-width:504px; max-width:504px;}
.area_day .inr{padding:20px 29px 26px; background:#fff; border:1px solid #e6e6e6; min-height:279px;}
.day_date .tbas{display:flex;}
.day_date .tbas li{justify-self:center;}
.day_date .tabs{display:flex; justify-content:flex-start; flex-wrap:wrap;}
.day_date .tabs li{position:relative;text-align:center;flex:auto;cursor: pointer;}
.day_date .tabs li > i{font-size:14px; color:#a7a7a7;}
.day_date .tabs li p{position:relative; margin-top:11px; font-family:'GyeonggiTitleM'; font-size:16px;}
.day_date .tab_container .tab_content > em{display:block;line-height:1;margin-top:57px;font-family:'GyeonggiTitleM';font-weight:700;font-size:23px;color:#222;text-align: center;}
.day_date .tab_container .tab_content > ul{margin-top:11px; padding:23px 18px; background:#f6f6f8; min-height:81px;}
.day_date .tab_container .tab_content .no_data{font-size:14px;}
.day_date .tab_container .tab_content > ul > li{display:block; overflow:hidden; margin-bottom:4px; font-weight:300; font-size:15px; color:#666; white-space:nowrap; text-overflow:ellipsis;}
.day_date .tabs li.haslist p:before{content:""; display:inline-block; position:absolute; top:50%; left:50%; z-index:0; width:42px; height:42px; background:#fff; box-shadow:2px 2px 15px 0px rgba(87, 75, 151, 0.15); transform:translate(-50%, -50%); border-radius:100px;}
.day_date .tabs li p i{position:relative;}
.day_date .tabs li.haslist i{font-weight:300;}
.day_date .tab_container .tab_content > ul > li > i{display:inline-block; margin-right:9px; font-family:'GyeonggiTitleM'; font-weight:300; font-size:14px; color:#222;}
.day_date .tab_container .tab_content > ul > li:last-child{margin-bottom:0;}
.day_date .tabs li ul li{display:inline-block; float:left; width:6px; height:6px; margin:0 1.5px; background:#574b97; border-radius:10px;}
.day_date .tabs li ul{display:inline-block; position:absolute; bottom:-21px; left:50%; transform:translateX(-50%);}

.area_list .inr > ul{display:flex; justify-content:space-evenly;}
.area_list .inr > ul > li{margin-right:36px; background:#fff; box-shadow:25px 26px 27px 0px rgb(83 68 152 / 9%); transition:all 0.4s ease-out 0s; max-width:255px;}
.area_list .inr > ul > li:last-child{margin-right:0;}
.area_list .inr > ul > li:hover{box-shadow:none; /*  border-color:#574b97; :*/;}
.area_list .inr > ul > li a h6{display:-webkit-box; overflow:hidden; font-family:Noto Sans KR , '맑은 고딕', '돋움', Dotum, '굴림', Gulim, Sans-serif; font-weight:500; font-size:17px; color:#222; letter-spacing:-0.05rem; -webkit-line-clamp:2; -webkit-box-orient:vertical; text-overflow:ellipsis; max-height:47px;}
.area_list .inr > ul > li a p{display:-webkit-box;overflow:hidden;line-height:1.6;margin-top:19px;font-weight:300;color:#666;letter-spacing:-0.05rem;-webkit-line-clamp:3;-webkit-box-orient:vertical;text-overflow:ellipsis;max-height:78px;min-height: 78px;}
.area_list .inr > ul > li a time{display:block; margin-top:50px; font-family:'GyeonggiTitleM'; font-weight:200; font-size:14px; color:#666;}
.area_list .inr > ul > li a i{display:block; margin-bottom:18px; font-weight:600; font-size:14px;}

/* 공지사항 */
.area_notice .inr > ul > li a{display:block; padding:38px 23px;}

/* 갤러리 */
.container_middle{margin-top:44px;}
.area_gallery .inr > ul > li a{display:block;}
.area_gallery .inr > ul{justify-content:flex-start;}
.area_gallery .inr > ul > li{flex-grow:1;}
.area_gallery .inr > ul > li:nth-child(1),
.area_gallery .inr > ul > li:nth-child(2){border:1px solid #f9f9f9;}
.area_gallery .inr > ul > li a div.img_box{width:100%; height:150px; background-size:cover; background-position:50%; margin-bottom:18px;}
.area_gallery .inr > ul > li a div.txt_box{padding:0 23px 38px;}
.area_gallery .inr > ul > li a time{margin-top:18px;}

.container_bottom{margin-top:44px;}

/* 고객 */
.area_customer{display:flex;}
.area_customer [data-tit]{width:325px;}
.area_customer .customer_inner{flex:2;}
.customer_inner_bank{background:#fff; border:1px solid #e7e7e7;}
.area_customer .customer_inner > *{float:left; width:-webkit-calc((100%/2) - 20px); width:calc((100%/2) - 20px); background-size:cover; height:100%; box-sizing:border-box;}
.customer_inner_number{margin-right:37px;}
.area_customer .customer_inner div[class^="customer_inner_"] > *{display:block; margin-left:50px;}
.area_customer .customer_inner div[class^="customer_inner_"] > h6{margin-top:40px; font-family:Noto Sans KR; font-weight:300; font-size:16px;}
.area_customer .customer_inner div[class^="customer_inner_"] > *:last-child{margin-bottom:38px;}
.area_customer .customer_inner .customer_inner_number > *{color:#fff;}
.area_customer .customer_inner div[class^="customer_inner_"] > em{line-height:1; margin-top:5px; font-family:'GyeonggiTitleM'; font-weight:600; font-size:38px; letter-spacing:-0.025rem;}
.area_customer .customer_inner div[class^="customer_inner_"] > em span{font-weight:300; font-size:32px; position:relative; top:-3px;}
.area_customer .customer_inner div[class^="customer_inner_"] > span{font-family:'GyeonggiTitleM'; font-weight:100; font-size:15px;}
.area_customer .customer_inner div[class^="customer_inner_"] > span i{display:inline-block; margin-right:6px; font-family:'Noto Sans KR'; font-weight:300;}
.area_customer .customer_inner .customer_inner_number > span{display:inline-block; position:relative; left:-1px; margin-top:14px; padding:5px 16px; background:rgba(255,255,255,0.2); border-radius:30px;}
.area_customer .customer_inner .customer_inner_number > p{margin-top:7px; font-weight:300; font-size:15px;}
.area_customer .customer_inner .customer_inner_bank > em{position:relative; left:-2px; color:#222;}
.area_customer .customer_inner .customer_inner_bank > h6{font-weight:500 !important; color:#222;}
.area_customer .customer_inner .customer_inner_bank > img{height:23px; margin-top:9px;}
.area_customer .customer_inner .customer_inner_bank > span{margin-top:19px;}
.area_customer .customer_inner .customer_inner_bank > span{font-family:'NOTO SANS KR' !important; font-weight:500 !important; color:#222; letter-spacing:-0.03rem;}
.area_customer [data-tit] p{line-height:1.7; margin-top:10px; font-weight:300; color:#444;}
.area_customer [data-tit] h2{padding-top:50px;}


@media screen and (max-width:1680px){
	.area_notice .inr > ul > li{width:auto; margin-right:auto; margin-right:16px; flex-basis:0; flex-grow:1;}
	.area_day{margin-right:40px;}
	.area_gallery .inr > ul > li:nth-child(4){margin-right:0;}
	.area_gallery .inr > ul > li:nth-child(5){display:none;}
}

@media screen and (max-width:1365px){
	.container_top{justify-content:space-between;}
	.area_day .inr{padding:20px 20px 17px;}
	.area_notice .inr > ul > li a{padding:32px 23px;}
	.area_gallery .inr > ul > li a div.txt_box{padding:0 23px 32px;}
	.area_day{margin-right:auto; min-width:374px; max-width:374px;}
	.day_date .tabs li ul li{margin:0 0.5px;}
	.day_date .tab_container .tab_content > em{font-size:20px;}
	.container_top > *{flex-basis:0; flex-grow:1;}
	.area_notice{margin-left:30px;}
	.area_visual .bx-controls-direction a.bx-prev{left:0;}
	.area_visual .bx-controls-direction a.bx-next{right:0; background:#f6f6f8;}
	.area_visual .list li > *{padding-left:70px;}
	.area_visual .list li > h2{margin-top:310px; font-size:40px; text-indent:-2px;}
	.area_visual .list li > p{font-size:25px;}
	.area_visual .bx-controls-direction a{opacity:1; width:53px; height:53px; background:#fff;}
	.area_visual .bx-controls-direction a:after{top:18px; left:19px; width:30%; height:30%;}
	.main:before{width:71%;}
	.area_customer .customer_inner div[class^="customer_inner_"] > *{margin-left:30px;}
	.area_customer [data-tit]{width:285px;}
	.customer_inner_number{margin-right:20px;}
	.area_customer .customer_inner > *{width:-webkit-calc((100%/2) - 11px); width:calc((100%/2) - 11px);}
}

@media screen and (max-width:1200px){
	.area_notice .inr > ul > li:last-child{display:none;}
	.area_notice .inr > ul > li:nth-child(2){margin-right:0;}
	.area_notice .inr > ul > li{max-width:none;}
	.area_customer [data-tit]{display:none;}
	.container_bottom{margin-top:35px;}

	.area_gallery .inr > ul > li{max-width:33%; margin-right:16px;}
	.area_gallery .inr > ul > li:nth-child(3){margin-right:0;}
	.area_gallery .inr > ul > li:nth-child(4){display:none;}
	.area_gallery .inr > ul > li a div.img_box{height:180px;}
}

@media screen and (max-width:1023px){
	.area_visual{padding-top:0;}
	.area_visual .wrap{margin:0;}
	.area_visual .list li > h2{margin-top:330px; font-size:40px;}
	.area_visual .list li > *{padding-left:50px;}
	.area_visual .list li{background-position:39% 50%; border:none;}
	.area_day{min-width:auto; max-width:none;}
	.area_day,
	.area_notice{width:100%;}
	.container_top{flex-direction:column;}
	.day_date .tabs{margin:0 auto; max-width:410px;}
	.area_notice{margin-left:0;}
	.main:before{width:100%; height:100%;}
	.main [data-tit] h2{font-size:25px;}
	.area_notice{margin-top:40px;}
	.area_customer .customer_inner div[class^="customer_inner_"] > *{margin-left:25px;}
	.area_customer .customer_inner .customer_inner_number > p{font-size:14px;}
	.area_customer .customer_inner div[class^="customer_inner_"] > em{font-size:33px;}

	.area_gallery .inr > ul > li{max-width:50%;}
	.area_gallery .inr > ul > li:nth-child(2){margin-right:0;}
	.area_gallery .inr > ul > li:nth-child(3){display:none;}
}

@media screen and (max-width:767px){
	.area_visual .list li > h2{bottom:64px; margin-top:0; padding-top:40px; padding-bottom:8px; font-size:25px; letter-spacing:-0.3rem;}
	.area_visual .list li > p{margin-top:0; padding-bottom:40px; font-size:16px; letter-spacing:-0.1rem;}
	.area_visual .list li > *{position:absolute; bottom:0; width:96%; padding-left:4%; background:rgba(255,255,255,0.7);}
	.area_visual .list li,
	.area_visual .bx-viewport{height:55vh;}
	.bx-controls{top:auto; right:0; bottom:53px; width:auto;}
	.area_visual .bx-controls-direction a.bx-prev{left:-106px;}
	.area_visual .bx-controls-direction a:after{top:19px; left:19px; width:24%; height:24%;}
	.main [data-tit] h2{font-size:19px; letter-spacing:-0.1rem;}
	.main .container_top [data-tit] p{margin:0 5px; padding-left:10px;}
	.main .container_top [data-tit]{margin-bottom:12px;}
	.area_day .inr{padding:16px 15px 13px; min-height:259px;}
	.day_date .tabs li > i{font-size:13px;}
	.day_date .tabs li p{margin-top:9px; font-size:14px;}
	.day_date .tabs li ul li{width:5px; height:5px; margin:0 1px;}
	.day_date .tab_container .tab_content .no_data{font-size:13px;}
	.day_date .tab_container .tab_content > ul{margin-top:11px; padding:16px 15px;}
	.day_date .tab_container .tab_content > ul > li{margin-bottom:2px; font-size:14px;}
	.day_date .tab_container .tab_content > em{font-size:18px;}
	.main:before{background:#fff;}
	.container_top{margin-top:45px;}
	.area_notice{margin-top:35px;}
	.area_list .inr > ul > li{margin-right:10px;background:#f6f6f8;box-shadow:none;width: 50%;}
	.area_list .inr > ul > li a i{margin-bottom:18px; font-size:13px;}
	.area_list .inr > ul > li a h6{font-size:15px;min-height: 45px;}
	.area_list .inr > ul > li a p{display:-webkit-box;overflow:hidden;line-height:1.6;margin-top:14px;font-weight:300;color:#666;letter-spacing:-0.05rem;-webkit-line-clamp:3;-webkit-box-orient:vertical;text-overflow:ellipsis;max-height: 69px;min-height: 69px;}
	.area_list .inr > ul > li a time{font-size:14px;}
	.area_list .inr > ul > li a i{margin-bottom:10px;}
	.area_customer .customer_inner div[class^="customer_inner_"] > em{font-size:26px;}
	.customer_inner_number{margin-right:15px;}
	.area_customer .customer_inner > *{width:-webkit-calc((100%/2) - 9px); width:calc((100%/2) - 9px); height:auto;}
	.area_customer .customer_inner .customer_inner_number > p{font-size:14px;}
	.area_customer .customer_inner div[class^="customer_inner_"] > span{font-size:14px;}
	.area_customer .customer_inner > *{width:100%;}
	.area_customer .customer_inner div[class^="customer_inner_"] > *{margin-left:15px;}
	.area_customer .customer_inner div[class^="customer_inner_"] > h6{margin-top:30px; font-size:15px;}
	.area_customer .customer_inner div[class^="customer_inner_"] > *:last-child{margin-bottom:28px;}
	.area_customer .customer_inner div[class^="customer_inner_"] > em span{font-size:24px;}
	.area_customer .customer_inner .customer_inner_bank > img{height:19px;}
	.container_bottom{margin-top:25px;}
	.area_notice .inr > ul{justify-content:space-between;}
	.area_notice .inr > ul > li a{padding:17px 10px;}
	.area_gallery .inr > ul > li a div.img_box{height:150px;}
	.area_gallery .inr > ul > li a div.txt_box{padding:0 10px 17px;}
	.area_notice h2 + p{display:none !important;}
	.container_bottom{margin-top:15px;}

}
@media screen and (max-width:400px){
	.area_list .inr > ul > li a p {
		max-height: 59px;
		min-height: 59px;
	}
}

@media screen and (max-width:370px){
	.area_visual .list li > p{padding-bottom:62px;}
	.area_visual .list li > h2{bottom:86px; padding-top:25px;}
	.day_date .tabs li ul li{margin:0 0.6px;}
	.area_notice .inr > ul > li{max-width:138px;}
	.area_gallery .inr > ul > li a div.img_box{height:120px;}
}