@charset "utf-8";
/************************************************************************
 * filename : sub_style5.css
 * description :JUNO ACADEMY >CONTACT > 서브 페이지
 * date : 2017.09.25
************************************************************************/

#contact .section_tit .bar{display: block;width: 1px;background: #b2b2b2;height: 60px;margin: 38px auto 60px auto}
#contact .sec1_topRow{overflow: hidden}
#contact .sec1_topRow .sec1_topLeft,
#contact .sec1_topRow .sec1_topRight{width: 50%;box-sizing: border-box}
#contact .sec1_topRow:first-child{margin-bottom: 104px;}
#contact .sec1_topRow:first-child .sec1_topLeft{float: left;}
#contact .sec1_topRow:first-child .sec1_topRight{float: right;}
#contact .sec1_topRow:first-child+div .sec1_topLeft{float: right;}
#contact .sec1_topRow:first-child+div .sec1_topRight{float: left;text-align: right}

#contact .sec1_topRow .sec1_topRight>.academy_nm{color:#231f20;font-size:30px;line-height: 30px;display: block;font-weight: 600;}
#contact .sec1_topRow .sec1_topRight>.bar{width: 100px;height: 1px;background: #231f20;margin-top: 14px;margin-bottom: 30px;}
#contact .sec1_topRow .sec1_topRight>div{overflow: hidden;position: relative;margin-top: 12px;}
#contact .sec1_topRow .sec1_topRight>.bar+div{margin-top: 0;}
#contact .sec1_topRow .sec1_topRight>div span{position:absolute;left:0;top:0;width: 64px;line-height: 27px;text-align: center;color:#fff;font-size:16px;font-weight: 600;background: #998778;}
#contact .sec1_topRow .sec1_topRight>div p{padding-left: 79px;line-height: 27px;color:#231f20}
#contact .sec1_topRow:first-child+div .sec1_topRight>div span{left:initial;right:0;}
#contact .sec1_topRow:first-child+div .sec1_topRight>div p{padding-left: 0;padding-right: 79px;}
#contact .sec1_topRow .sec1_topRight>.add p{line-height: 23px;}

#contact #map1,
#contact #map2{width: 100%;height: 400px;border:1px solid #e1e1e1}


#contact .sec1_topRow .sec1_topRight{padding:0 29px}
#contact .sec1_btm{margin-top: 109px;background: #f7f7f7;padding:50px 0 87px 0}
#contact .sec1_btm .inquiry_list{overflow: hidden;}
#contact .sec1_btm .inquiry_list li{float: left;box-sizing: border-box;width: 470px;text-align: center}
#contact .sec1_btm .inquiry_list li .row1,
#contact .sec1_btm .inquiry_list li .row2{text-align: left;padding-left: 70px;}
#contact .sec1_btm .inquiry_list li:first-child+li{width: 480px;border-left: 1px dotted #acacac;border-right: 1px dotted #acacac;}
#contact .sec1_btm .inquiry_list li:first-child+li .row1{text-align: center;padding-left: 0;}
#contact .sec1_btm .inquiry_list li:first-child+li .row2{display: inline-block;padding-left: 0;}
#contact .sec1_btm .inquiry_list li>img{width: 126px;margin-bottom: 33px;}
#contact .sec1_btm .inquiry_list li .row1{margin-bottom: 43px;}
#contact .sec1_btm .inquiry_list li .row1>*{vertical-align: middle;display: inline-block;color:#231f20;}
#contact .sec1_btm .inquiry_list li .row1 strong{font-size:24px;font-weight: 600;line-height: 24px;}
#contact .sec1_btm .inquiry_list li .row1 span{font-size:16px;}
#contact .sec1_btm .inquiry_list li .row1 span.bar{background: #231f20;width: 1px;height: 16px;margin:0 12px}

#contact .sec1_btm .inquiry_list li .row2 div{position: relative;margin-top: 12px;}
#contact .sec1_btm .inquiry_list li .row2 div:first-child {margin-top:0}
#contact .sec1_btm .inquiry_list li .row2 div>span{position:absolute;left:0;top:0;width: 64px;line-height: 27px;text-align: center;color:#fff;font-size:16px;font-weight: 600;background: #998778;}
#contact .sec1_btm .inquiry_list li .row2 div>p{padding-left: 79px;line-height: 27px;color:#231f20;overflow: hidden}
#contact .sec1_btm .inquiry_list li .row2 div>p>span.space{display: none;width: 100%;margin:0;padding:0}
#contact .sec1_btm .inquiry_list li .row2 div>p>span{width: 50%;display: block;float: left;box-sizing: border-box}
#contact .sec1_btm .inquiry_list li .row2 div>p>span:first-child{padding-right: 10px;}
#contact .sec1_btm .inquiry_list li .row2 div>p>span.space+span{border-left: 1px dotted #acacac;padding-left: 10px;}

@media all and (max-width:1440px){
	#contact .sec1_btm{padding:60px 0}
	#contact .sec1_btm .inquiry_list li{width: 300px;}
	#contact .sec1_btm .inquiry_list li:first-child+li{width: 424px;}
	#contact .sec1_btm .inquiry_list li .row1, #contact .sec1_btm .inquiry_list li .row2{text-align: center;padding-left: 0;}
	#contact .sec1_btm .inquiry_list li .row1{margin-bottom: 20px;}
	#contact .sec1_btm .inquiry_list li .row1 strong{font-size:18px;line-height: 18px;}
	#contact .sec1_btm .inquiry_list li .row1 span{font-size:14px}
	#contact .sec1_btm .inquiry_list li .row2 div{margin-top: 8px;}
	#contact .sec1_btm .inquiry_list li .row2 div>span,
	#contact .sec1_topRow .sec1_topRight>div span{font-size:14px;width: 56px;font-weight: 400}
	#contact .sec1_btm .inquiry_list li .row2 div>p{text-align: left;padding-left: 65px;}
	#contact .sec1_topRow .sec1_topRight>div p{padding-left: 65px;}
	#contact .sec1_topRow:first-child+div .sec1_topRight>div p{padding-left: 0;padding-right: 65px;}
	#contact .sec1_btm .inquiry_list li .row2 {display: inline-block;}
}

@media all and (max-width:1024px){
	#contact #map1,
	#contact #map2{height: 300px;}
	#contact .sec1_topRow .sec1_topRight{padding:0 15px}
	#contact .sec1_topRow:first-child{margin-bottom: 60px;}
	#contact .sec1_btm{padding:20px 0}
	#contact .sec1_btm .inquiry_list{width: 380px;;margin: 0 auto}
	#contact .sec1_btm .inquiry_list li{width: 100% !important;border-left:0 !important;border-right: 0 !important;padding:40px 0;border-top: 1px dotted #acacac;}
	#contact .sec1_btm .inquiry_list li:first-child{border-top:0}
	
}
@media all and (max-width:768px){
	.section_content{width:100%}
	#contact .section_tit .bar{display: none;}
	#contact #map1,
	#contact #map2{height: 240px;}
	
	#contact .sec1_topRow .sec1_topRight,
	#contact .sec1_topRow .sec1_topLeft{float: none !important;width: 100%;}
	#contact .sec1_topRow .sec1_topRight{margin-top: 15px;}
	#contact .sec1_topRow .sec1_topRight>.academy_nm{font-size:19px}
	#contact .sec1_topRow .sec1_topRight>.bar{margin:4px 0 16px 0;width: 70px;}
	#contact .sec1_topRow:first-child{margin-bottom: 40px;}
	#contact .sec1_topRow:first-child+div .sec1_topRight{text-align: left}
	#contact .sec1_topRow:first-child+div .sec1_topRight>div span{right:initial;left:0}
	#contact .sec1_topRow:first-child+div .sec1_topRight>div p{padding-left: 65px;padding-right: 0;}
	
	#contact .sec1_btm .inquiry_list li .row2 div>span, 
	#contact .sec1_topRow .sec1_topRight>div span{line-height:22px;font-size:13px}
	#contact .sec1_topRow .sec1_topRight>div p{line-height: 22px;font-size:13px}
	#contact .sec1_topRow .sec1_topRight>.add p{line-height: 19px}
	
	#contact .sec1_btm{margin-top: 45px;}
	#contact .sec1_btm .inquiry_list{width: 90%}
	#contact .sec1_btm .inquiry_list li{padding:20px 0}
	#contact .sec1_btm .inquiry_list li>img{width: 63px;}
	#contact .sec1_btm .inquiry_list li .row2 div>p>span.space{display:block}
	#contact .sec1_btm .inquiry_list li .row2 div>p>span{display: block;width: 160px;}
	#contact .sec1_btm .inquiry_list li .row2 div>p>span:first-child{padding-right: 0;}
	#contact .sec1_btm .inquiry_list li .row2 div>p>span.space+span{	padding-left: 0;padding-top: 5px;margin-top: 5px;border-top: 1px dotted #acacac;border-left: 0;}
	#contact .sec1_btm .inquiry_list li:first-child+li .row2{width: 220px;}
	#contact .sec1_btm .inquiry_list li:first-child+li .row2 div>p>span{line-height: 19px}
	#contact .sec1_btm .inquiry_list li .row2 div>p{font-size:13px;line-height: 22px}
	#contact .sec1_btm .inquiry_list li .row1{margin-bottom: 12px;}
	#contact .sec1_btm .inquiry_list li>img{margin-bottom: 15px;}
	
}