@charset "utf-8"; 
/* 
	copyright(c) WEBsiting.co.kr 
	모바일화면 관련 css파일입니다.
	각 넓이에 따른 스타일 설정이 가능합니다.
*/

/* 디바이스 981px 이상에서 적용*/
@media all and (min-width:981px)
{
	html,body{overflow:auto; }
	html.ovfH,body.ovfH{overflow:auto; }
	#snbOpen,
	#sideBarCover,
	#snbMvAr,
	#snbMvArBottom,
	.leftMenuUseFlase #sideBar,
	.bNBarMwWrap{display:none; }
	.leftMenuUseFlase #ctWrap {background:none !important;}
	.leftMenuUseFlase #container {width:100%; max-width:1100px; margin:0 auto; float:none;}

	
	.leftMenuUseFlase .contentTitle{text-align:center;}
	.leftMenuUseFlase .contentTitle strong{float:none;}
	.leftMenuUseFlase .contentTitle .locationBar{float:none;  }

	#hd{ background:RGBA(255,255,255,1); -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }
	#hd.scDown{background:#fff; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }
	#topSpacer{height:115px; }
	.pc_br{display:block !important; }
	.pc_block{display:block !important; }
	.mobile_block{display:none !important; }
	.pc_inline-block{display:inline-block !important; }
	.mobile_inline-block{display:none !important; }

}
/* 디바이스 1100px 이하에서 적용*/
@media all and (max-width:1100px)
{
	#gnb .gnb_1dli .gnb_1da{padding:0 8px; }
}
/* 디바이스 980px 이하에서 적용*/
@media all and (max-width:980px)
{
	
	html.ovfH,body.ovfH{overflow:hidden; }
	.mobileNone{display:none; }

	#tnb,
	.gnb_1dli{display:none; }

	.pc_block{display:none !important; }
	.mobile_block{display:block !important; }
	.pc_inline-block{display:none !important; }
	.mobile_inline-block{display:inline-block !important; }

	#topSpacer{height:50px; }

	#gnb{border:0;position:fixed; left:0px; top:0px; width:100%; z-index:999; background:RGBA(255,255,255,0.8); -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }
	.scDown #gnb{background:#fff; }

	.allSchBoxWr{display:block !important; }
	#btnSchbox{display:block !important; visibility:visible !important; position:fixed; right:50px; top:0px; width:50px; height:50px; line-height:50px; padding:0px; font-size:18px; text-align:center; z-index:9999; }
	#allSchBox{position:fixed; top:50px; right:0px; left:0px; margin-top:0px; padding:10px; background:#333; z-index:99999; }
	#allSchBox fieldset{border-radius:25px; width:100%; margin-right:50px; border-radius:0; }
	.allSchBoxWr #btnSchbox{margin-top:0px; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }
	.allSchBoxWr.on #btnSchbox{margin-top:50px; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }


	#logo a{padding:10px; }
	#logo a img{height:30px; }

	/* 좌측메뉴를 모바일전용메뉴로 */	
	#snbOpen,
	#snbOpen:focus{display:block !important; visibility:visible !important; width:52px; height:50px; line-height:50px; text-align:center; color:#fff; font-size:24px; background:#000; position:fixed; right:0px; top:0px; z-index:99999999; cursor:pointer; border:0px;outline:0;}
	#snbOpen b{display:block; width:24px; height:22px; margin:13px 15px; position:relative; overflow:hidden; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease;}
	#snbOpen b i{display:block; width:100%; height:2px; position:absolute; right:50%; margin-right:-50%; width:100%; background:#fff; border-radius:5px; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease-out; transition-duration: 0.2s; transition-timing-function: ease-out; }
	#snbOpen b i:nth-child(1){top:0px;}
	#snbOpen b i:nth-child(2){top:50%;margin-top:-1px; width:70%; right:0px; margin-right:0px; -webkit-transition-duration: 0.9s; -webkit-transition-timing-function: ease; transition-duration: 0.9s; transition-timing-function: ease;}
	#snbOpen b i:nth-child(3){bottom:0px;}
	.ovfH #snbOpen {margin-top:-1px;}
	.ovfH #snbOpen b i:nth-child(1){top:50%; transform: rotate(135deg);}
	.ovfH #snbOpen b i:nth-child(2){width:1px; filter:Alpha(opacity=0); opacity:0; -moz-opacity:0; -webkit-transition-duration: 0.1s; -webkit-transition-timing-function: ease; transition-duration: 0.1s; transition-timing-function: ease;}
	.ovfH #snbOpen b i:nth-child(3){top:50%; bottom:auto; transform: rotate(-135deg);}

	#snbMvAr{display:block; position:absolute; left:0px; top:0px; right:0px;  }
	#snbMvAr a#btnHome{background:#fff; padding:0 15px; font-weight:bold; font-size:14px; height:50px; line-height:50px; margin-left:10px;}
	#snbMvAr a#snbClose{background:#000; border-left:1px solid #f2f2f2; width:50px; height:50px; line-height:50px; text-align:center; color:#fff; font-size:18px; position:absolute; top:0px; right:0px; }

	#sideBarCover{display:none; background:rgba(0,0,0,0.6); position:fixed; left:0px; top:0px; bottom:0px; right:0px; z-index:999999; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }
	#sideBarCover.on{display:block; }

	#sideBar{display:block; position:fixed; right:-281px; top:0px; bottom:0px; z-index:9999999; width:280px; overflow:auto; background:#fff; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }
	#sideBar.on{right:0px; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }
	#sideBar #snb {margin-top:50px;  padding:0 10px;}
	#sideBar #snb .snb{display:block !important; border-bottom:1px solid #f2f2f2; position:relative; }
	#sideBar #snb .snb > h2{position:relative; margin-bottom:0px; border-radius:0px;}
	#sideBar #snb .snb > h2 a{padding:0 15px; height:50px; line-height:50px; text-align:left; color:#000; background:#fff; }
	#sideBar #snb .snb > h2 a b{font-size:14px; padding-right:50px; }
	#sideBar #snb .snb > h2 a sub{display:none; }
	#sideBar #snb .snb.active > h2{border-left:3px solid #000; }


	#sideBar #snb .snb .snb2dDown{display:block; position:absolute; right:0px; top:0px; height:50px; width:50px; overflow:hidden; }
	#sideBar #snb .snb .snb2dDown i,
	#sideBar #snb .snb .snb2dDown u{text-decoration:none; text-align:center; width:30px; height:30px; line-height:30px; font-size:20px; margin:10px; border-radius:50%; }
	#sideBar #snb .snb .snb2dDown i{display:block; background:#efefef; color:#999; }
	#sideBar #snb .snb .snb2dDown u{display:none; background:#efefef; color:#000; }
	#sideBar #snb .snb.show .snb2dDown i{display:none; }
	#sideBar #snb .snb.show .snb2dDown u{display:block; }


	#sideBar #snb .snb > ul{display:none; margin-bottom:0px;} 
	#sideBar #snb .snb > ul > li{border-top:1px dashed #ddd; border-bottom:0px; }
	#sideBar #snb .snb > ul > li a{padding:10px 10px 10px 15px; }
	#sideBar #snb .snb > ul > li a b{font-size:12px; color:#999; }
	#sideBar #snb .snb > ul > li a b i{display:none; }

	#sideBar #snb .snb > ul.snb2dul > li.active a{background:#e8e8e8; }
	#sideBar #snb .snb.active > ul.snb2dul{display:block; }

	#sideBar #snb li.noInfoPageTit,
	#sideBar #snb li.noInfoPageTit.active{display:none !important; }
	.snbCS{border:0px; }

	.snbMvArBtn{height:50px; overflow:hidden; position:absolute; right:50px; top:0px; padding:10px; }
	.snbMvArBtn a{display:inline-block; padding:5px 7px; border:1px solid #ddd; border-radius:3px; font-size:11px; }
	#snbMvArBottom{border-top:1px dashed #efefef; padding:10px; text-align:center; }
	#snbMvArBottom a{display:inline-block; padding:5px 10px; border:1px solid #ddd; border-radius:3px; }

	
	/* 서브페이지 상단 모바일 네비 */
	.subTopLocNav{display:block;margin-top:-20px; width:100%;}
	.subTopLocNav .loc1DA,
	.subTopLocNav .loc2DA{height:44px; line-height:44px;font-size:14px;}
	.subTopLocNav .loc1DA b,
	.subTopLocNav .loc2DA b{display:block; text-align:left; height:40px; line-height:40px; margin:0 36px 0 16px;}
	.bNBar1D, 
	.bNBar2D{top:40px; }
	.bNBar1D .snb h2 a b,
	.bNBar2D .snb2d a b{font-size:12px;}

	
	.bNBar1D .snb h2 a b,
	.bNBar2D .snb2d a b{padding:12px; font-size:13px;}

	/* 중간 레이아웃 */
	#ctWrap{ margin:15px auto; }
	#container{width:auto; float:none; padding:15px; }

	
	.contentTitle{border-bottom:0px !important;}
	.contentTitle{padding:10px 0 30px;margin-bottom:30px; text-align:center;}
	.contentTitle strong{float:none; color:#333; font-size:30px;}
	.contentTitle .locationBar{float:none;  }
	.contentTitle .locationBar i{padding:0 5px;}

	
	.leftMenuUseFlase .contentTitle{margin-bottom:5px;}
	.leftMenuUseFlase .contentTitle:after{width:45px;margin:15px auto;}
}

/* 디바이스 850px 이하에서 적용*/
@media all and (max-width:850px)
{
	/* contents */
	#page_title .page_title_in {padding:60px 10px; text-align:center; }
	#page_title .page_title_in h2 strong{font-size:30px; }
	#page_title .page_title_in h2{text-align:center; }

}
/* 디바이스 650px 이하에서 적용*/
@media all and (max-width:650px)
{

	.bx-wrapper, .bx-viewport, .bx-wrapper img, .mainVisualImage{
        height: 50vh;
    }
	/* contents */
	#page_title .page_title_in{padding:80px 10px 60px 10px; }
	#page_title .page_title_in h2 strong{font-size:18px; height:30px; line-height:60px; padding:20px 0 10px 0; }
	#page_title .page_title_in h2 .locationBar span{font-size:10px; }
	#page_title.on .page_title_in h2 > strong{height:30px; line-height:30px; padding:0 0 10px 0; }

	.contentTitle strong{font-size:20px;}
	.contentTitle .locationBar{font-size:12px;}

	/* footer */
	#footer > div > dl {text-align:center;}
	#footer > div > dl > dt{position:static; padding-bottom:20px;}
	#footer > div > dl > dt img{max-width:200px;}
	#footer > div > dl > dd a,
	#footer address {text-align:center;font-size:11px; letter-spacing:-0.05em; }
	#footer address em{display:none; }
	#footer p {text-align:center;}
	#footer p span{display:none; }
}

/* 디바이스 420px 이하에서 적용*/
@media all and (max-width:420px)
{
	/* contents */
	#page_title {background-size:auto 100%; }

}

.mainImg15{margin-top:-250px}
/* 회사소개 */
.fc_pointer {color:#21b8ce; }
	.daon_content_wrap{width:100%; min-width:320px; max-width:1200px; margin:70px auto 0;}
	.daon_page_title{width:100%; margin-bottom:20px;}
	.daon_page_title h1{width:100%; margin:0 auto; text-align:center; font-size:2.5em; font-weight:600;}
	.daon_page_title h2{width:100%; margin:0 auto; text-align:center; font-size:1.2em; color:#666; margin-top:20px; }
	
	.company_type2 {width:100%; min-width:320px; max-width:1200px; margin:0 auto; }
	.company_type2:after{content:""; clear:both; display:block;}
	.company_type2 .ceo_img {width:100%; }
	.company_type2 .ceo_img img {width:100%; height:auto; }
	.company_type2 .ceo_area{ position:relative; left:0; bottom:0; width:100%;  padding-top:50px; z-index:1; margin:0 auto; display: ;} 
	.company_type2 .ceo_area .ceo_tit {position: absolute;		float: left;		width: 32%;		font-size: 2em;		text-align: center;		line-height: 1.4em;		letter-spacing: -0.05em;		padding-bottom: 142px; }
	.company_type2 .ceo_area .ceo_txt { position:relative; float:right; width:65%; height:auto;background: #aeaeae2e;		padding: 40px;}
	.company_type2 .ceo_area .ceo_txt h4 {font-size:20px;  line-height:1.5;  color: #000; }
	.company_type2 .ceo_area .ceo_txt p {margin-top:20px; line-height:1.5; color: #333; word-break: keep-all; font-size: 16px;}
	.company_type2 .ceo_area .ceo_txt span.ceo_sign{ display:block; font-size:14px; color:#000;     margin-bottom: 20px; font-family: 'Satisfy', 'Noto Sans KR', sans-serif;}
	.company_type2 .ceo_area .ceo_txt span.ceo_sign span{    font-size: 18px;		font-weight: 700;}
	.company_type2 .ceo_area .ceo_foot {display: flex;		justify-content: space-evenly;		align-items: flex-end;		margin-top: 30px;}
	.company_type2 .ceo_area .ceo_foot  img {max-width: 130px!important;}


	.daon_s_tit {width:100%; height:30px; line-height:30px; text-align:left; border-left:5px solid #000; margin:50px auto;  margin-bottom:10px;  font-size:1.5em;  text-indent:10px;}
	.tbla{width:100%; border-collapse: collapse; margin:0 auto; border:1px solid #ddd; border-bottom:0px;}
	.tbla tr th{width:20%; height:45px; padding:15px 0; text-align:center; border-bottom:1px solid #666; font-size:1em;}
	.tbla tr td{width:80%; border-bottom:1px solid #ddd; padding-left:15px; height:45px; text-align:left;}
		
	@media screen and (max-width: 992px){
		#ctt{padding:0}
		.daon_content_wrap{width:96%;}
		.daon_page_title{margin-bottom:50px;}
		.daon_page_title h1{font-size:2em;}
		.daon_page_title h2{font-size:1em;}
		.daon_s_tit{font-size:1.2em;}

		.company_type2 .ceo_area .ceo_tit { width:100%; font-size:1.8em; padding-bottom:50px;position: relative;margin-bottom: 30px; }
		.company_type2 .ceo_area .ceo_tit img{width: 100%;}
		.company_type2 .ceo_area .ceo_txt { width:100%; padding:20px }
		.company_type2 .ceo_area .ceo_txt h4 {margin-top:40px; font-size:18px; letter-spacing: -0.02em;}
		.company_type2 .ceo_area .ceo_sign {margin-top: 20px; }
		
		.tbla tr th{width:30%; font-size:0.9em;}
		.tbla tr td{width:70%; font-size:0.9em;}
	}
/* 회사소개 */
.company_txt {
    font-size: 18px;
    max-width: 60%;
    background: #2d4b88d4;
    color: #fff;
    position: relative;
    right: 0;
    top: -100px;
    float: right;
    line-height: 1.7;
    padding: 20px;
}
@media all and (max-width:980px)
{
	.company_txt {
		font-size: 14px;
		max-width: 100%;
		line-height: 1.7;
		padding: 20px;
		top:-30px
	}

}

/*오시는 길*/
.contact_area { display: flex; flex-flow: wrap;    flex-direction: column;}
.map_area{position:relative;}
.map_area .txt{position:absolute;bottom:-90px;left:50%;transform:translateX(-50%);width:1400px;z-index:100;}
.map_area .txt .txt_wrap {background-color:#006fce;box-shadow:3px 3px 3px rgba(0,0,0,0.2);padding:45px 0;}
.map_area .txt .logo{position:absolute; top:34px; left:0; border-right:1px solid #1a7dd3; text-align:center; width:315px; line-height:90px; height:90px;}
.map_area .txt .contact{display:block; color:#fff; font-weight:500; font-size:20px; letter-spacing:-1px; line-height:1.6; padding:0 0 0 405px;}
.map_area .txt .tx .tel{font-weight:300;}
.map_area .txt .bt{position:absolute;top:50%;right:40px;margin-top:-35px;display:block;border-radius:65px;border:3px solid #fff;color:#fff;font-size:20px;text-align:center;min-width:220px;line-height:60px;height:65px;}

.contact_address {width:40%;height:auto; line-height:1.7;}
.contact_address ul {clear: both;padding:0 20px 20px 0px;border-bottom:1px solid #ddd;margin-bottom: 20px;}
.contact_address ul li {color: #555;margin-top: 5px;margin-bottom: 5px; font-size:16px}
.contact_address { width:100%; clear:both;}
.contact_address:after {content: " ";visibility: hidden;display: block;height: 0;padding-bottom:50px;clear: both;}
.contact_address ul {border-bottom:1px solid #ddd; padding-bottom:25px}
.contact_address .bus {width:100%; padding:50px 0;}
.contact_address .subway {width:100%; padding:50px 0}
.contact_address ul li {color: #555; line-height:33px; font-size:16px}
.contact_address h3 { font-size:20px; font-weight:400; letter-spacing:-1px; color:#1a1a1a; padding-bottom:10px; text-align:left}

.contact_map {width:100%;height:auto; line-height:1.7; padding-right: 30px;}

.rollingC .rollingCTit a{font-size:26px}
h2.rollingCTit{margin-bottom:20px}
.customBan a img {height:20vw;object-fit: cover;}

@media (max-width: 1400px){
	.customBan a img {height:30vw}
	.map_area .txt {margin-top: -30px;width: 1024px;}
	.map_area .txt .txt_wrap{border-radius:0px 0px 20px 0px;margin:0 15px;padding:0 0 30px;}
	.map_area .txt .logo{display:block;position:relative;top:auto;left:auto;border-right:0; margin-left:0;width:100%;}
	.map_area .txt .logo:before{content:"";position:absolute;bottom:0;left:50%;margin-left:-88px;background-color:#1a7dd3;width:177px;height:1px;}
	.map_area .txt .contact {line-height:180%;padding:20px 0 0;text-align:center;}
	.map_area .txt .contact .tel{font-weight:300;}
	.map_area .txt .bt{position:static;border-radius:65px;margin:35px auto 0;width:150px;}
	.contact_address {width:100%;}
	.contact_map {width:100%;; padding: 30px 0px;}
}

@media screen and (max-width: 640px) {
	.company_type2 .ceo_area .ceo_txt span.ceo_sign span{   display: block;}
	.customBan a img {height:40vw}
	.map_area .txt { position: relative; bottom: auto; left: auto; transform: translateX(0); margin-top: -30px; width: auto;}
	.map_area .txt .logo img { height:20px}
	.map_area .txt .contact { font-size: 13px; letter-spacing: 0; line-height: 180%; padding: 20px 0 0;text-align: center; clear:both}
	.map_area .txt .txt_wrap{border-radius: 0px 0px 20px 0px; margin: 0 15px; padding: 0 0 30px;}
	.map_area .txt .bt { position: static; border-radius: 65px;  border-width: 2px; font-size: 15px; margin: 25px auto 0; width: 150px; line-height: 40px; height: 40px;}
	.map_area .txt .logo { position: relative; display: block;  top: auto; left: auto; border-right: 0;  width: 100%; line-height: 70px;  height: 70px;}
	.contact_address {width:100%;}	
	.contact_map {width:100%;; padding: 30px 0px;}
}
/*오시는 길*/

.kakaochat {
    position: fixed;
    z-index: 99999;
    bottom: 4vw;
    right: 2vw;
	width:80px
}

.kakaochat img{border-radius: 20px;}
@media screen and (max-width: 640px) {
	.kakaochat {
	bottom: 15vw;
	width:60px
}
}

.tab {     border-left: none;
    background: #5858586e;
    overflow: hidden;
    position: absolute;
    display: flex;
    justify-content: space-between;
    width: 100%;
    top: 0;
    height: 100%;
    align-items: center;}
.tab li { float:left; width:20%; border-left:1px solid #fff; text-align:center; box-sizing:border-box;font-size: 26px;    font-weight: 500; height: 100%; color:#fff }
.tab li div{ margin: 50px 0; font-size: 18px;padding: 0 20px; }
.tab li {display: flex;    padding: 20px;    cursor: pointer;    justify-content: center;    flex-direction: column;    align-items: center;}
.tab li.on {     color: #fff;    background-color: #2f4f8fa1;  }
.tab li a{ display: none; font-size:18px  ;border: 1px solid; color:#fff;      width: max-content;    padding: 15px;    border-radius: 30px;}
.tab li.on a{display: block;}
.tab_con { clear:both; margin-top:5px; border:1px solid #ddd;width: 100% ;max-height: 950px;}
.tab_con img{width: 100%;}
.tab_con div { display:none; background:#fff; line-height:100px; text-align:center; }

@media all and (min-width:981px)
{
	.pcba{display: none;}

}
@media all and (max-width:980px)
{
	.moba{display: none!important;}

}