/* common */
#wrap {position: relative; width: 100%; overflow: hidden;}

.container {width: 100%; max-width: 1200px; margin-left: auto; margin-right: auto; position: relative;}
.container:after {content: ''; display: table; clear: both;}
.hidden {position: absolute; left: -10000px; top: auto; height: 1px; overflow: hidden;}


/* Footer */
#footer { clear: both;padding: 40px 0 70px;background: #F3D3D5; }
.ftArrow .slick-arrow {display: block; width: 28px; height: 27px; text-indent: -9999px; cursor: pointer; position: absolute; top: 0;}
#ftBt {padding: 0px 0;}
#ftBt p { color: #fff; font-weight: 200;}
#ftBt .ftCpy { color: #fff;padding-top: 30px;}
#ftBt span.tel, #ftBt span.fax, #ftBt span.mail { position: relative; height: 30px; line-height: 30px;color: #fff; margin-left: 30px;padding-left: 20px;}
.footer-ci { font-size: 30px; color: #fff; font-weight: 600 !important;margin: 10px 0 0px;border-bottom: 1px solid #fff;font-family: 'SchoolSafetyFoundation';font-weight: 400;height: 50px;}
.footer-ci i {font-family: 'SchoolSafetyFoundation';}
.footer-copy { display: flex;justify-content: space-between;align-items: flex-end;padding-top: 30px;}
.footer-add { padding: 0;font-weight: 200;width: 100%;}
.footer-add p { line-height: 150%;padding: 5px 0;}
.footer-add span { font-weight: 400;margin-right: 10px;}
.footer-socal { text-align: right;margin-bottom: 5px;width: 100%;}
.ft-sns { right: 10px;bottom: 20px;}
.ft-sns span { display: inline-block;padding: 0 5px;}


.dib {display: inline-block;}
.db {display: block;}


.imgPc {display: block !important; max-width:100%; margin: 0 auto;}
.imgMo {display: none !important;}


.mt0 {margin-top: 0px !important;}
.mt10 {margin-top: 10px !important;}
.mt20 {margin-top: 20px !important;}
.mt30 {margin-top: 30px !important;}
.mt40 {margin-top: 40px !important;}
.mt50 {margin-top: 50px !important;}
.mt60 {margin-top: 60px !important;}
.mb60 {margin-bottom: 60px !important;}
.pb0 {padding-bottom: 0 !important;}
.tal {text-align: left !important;}
.tar {text-align: right !important;}
.tac {text-align: center !important;}
.fl { float: left !important;}
.fr { float: right !important;}
.cr { clear: both;}


#skip {position: relative; z-index: 3000;}
#skip a {position: absolute; top: -30px; left: 0; width: 138px; border: 1px solid #4ec53d; background: #333; text-align: center; }
#skip a:active,
#skip a:focus{top:0;text-decoration:none;z-index:1000}
#skip a span {display: inline-block; padding: 2px 6px 0 0; font-size: 13px; line-height: 26px; color: #fff; letter-spacing: -1px; white-space: nowrap;}





/****************************************************************************************/
/****************************************************************************************/
/*Media Query*/
/****************************************************************************************/
/****************************************************************************************/


@media (max-width:360px) {

	.footer-add span { margin-right: 5px;} 
	#ftBt p { font-size: 14px;}

}


@media (max-width:768px) {

	.imgPc {display: none !important;}
	.imgMo {display: block !important; max-width:100%; margin: 0 auto;}
	.container {padding-left: 15px; padding-right: 15px;}

	.footer-add p { padding: 0;line-height: 130%;}
	.footer-copy { display: block;text-align: center;}
	.footer-socal {text-align: center;}
	#ftBt .ftCpy { padding-top: 10px;}
	.ft-sns { margin-top: 15px;}
	.footer-ci {text-align: center;} 

	.gbtLogo a span { font-size: 25px;}

}

/* GNB */
@media (min-width:1401px) {	


	#gb {position:relative; z-index:100; background: #F3D3D5;border-bottom: 1px solid rgba(255,255,255,0.7);}
	#gbTop {height:80px;}
	.gbtLogo {float: left; margin-top: 25px;}
	.gbtLogo a {display:block; height: 45px; line-height: 36px;color: #fff;font-size: 32px;}
	.gbtLogo a:after {content: ''; display: table; clear: both;}
	.gbtLogo a span {display: block; width: 250px; height: 50px;float: left; margin-right: 15px;font-weight: 400;font-family: 'SchoolSafetyFoundation';}
	.gbtLogo a i { font-weight: 800;font-family: 'SchoolSafetyFoundation';}
	.gbtMenu {float:left; margin-right: 30px;}
	.gbtMenu:after {content:""; display:table; clear:both;}
	.gbtMenu li {float:left; padding:0 10px; position:relative;}
	.gbtMenu li:first-child {padding-left:0;}
	.gbtMenu li:last-child {padding-right:0;}
	.gbtMenu li:after {content:""; display:block; width:1px; height:12px; background: rgba(0,0,0,0.12); position:absolute; right:-1px; top:50%; margin-top:-6px;}
	.gbtMenu li:last-child:after {display:none;}
	.gbtMenu li a {}
	.gbtSns {float: left;}
	.gbtSns:after {content: ''; display: table; clear: both;}
	.gbtSns li {float:left; margin-right: 10px; position:relative;}
	.gbtSns li:last-child {margin-right: 0;}
	.gbtSns li a {padding-left: 23px;}
	.gbtSns li a.gbtIs {background:url('../img/common/gnb_sns_instagram.png')no-repeat left center;}
	.gbtSns li a.gbtFb {background:url('../img/common/gnb_sns_facebook.png')no-repeat left center;}
	.gbtMo {display:none;}
	.gbbSns {display: none;}
	#gbBot {height:100%; position:relative;padding-top: 0;float: right;}
	.gbbMenu {position:relative; padding: 0 0;}
	.gbbMenu:after {content:""; display:table; clear:both;}
	.gbbMenu > li {float:left; position: relative;}
	.gbbMenu > li.gbbMo {display: none;}
	.gbbMenu > li > a {display: block; text-align: center; height: 80px; line-height: 80px; font-size: 18px; font-weight: 400; color: rgba(255,255,255,0.85); position: relative;
		padding: 0 35px;}
	.gbbMenu > li > a:after {content: ''; display: block; height: 3px; background: #181818; position: absolute; left: 50%; right: 50%; bottom: 0; -webkit-transition: all 0.3s; transition: all 0.3s;}
	.gbbMenu > li > a:hover:after,
	.gbbMenu > li > a.current:after {left: 0; right: 0;}
	.gbbMenu > li > a > span {display:none;}
	.gbbMenu > li > ul { position: absolute; left: 0; right: 0; top: 100%; height: 0px; overflow: hidden; z-index: 1; -webkit-transition: all 0.3s; transition: all 0.3s;padding-top: 30px;/* display: block !important;*/ display: none;}
	.gbbMenu > li:hover > a:after { position: absolute; left: 0; right: 0; width: 100%; background: #181818; color: #181818; }/* hover 시 색상변화 */
	.gbbMenu > li:hover > a {color: #000;} /* hover 시 색상변화 li a */
	.gbbMenu > li > ul > li {padding:0 0;}
	.gbbMenu > li > ul > li > a {display:block; text-align:left; font-size: 15px; font-weight: 400; letter-spacing: -0.075em; color: rgba(0,0,0,0.95);padding: 7px 10px 10px 15px;position: relative;}
	/*.gbbMenu > li > ul > li > a::before { content: '';position: absolute;left: 20px;top: 50%;margin-top: -3px; width: 5px;height: 5px;background: #207FFF;border-radius: 100%;} */
	.gbbMenu > li > ul > li > a:hover { color: #F3D3D5;}
	/*.gbbMenu > li > ul > li > a:hover::before { content: '';position: absolute;left: 20px;top: 50%;width: 5px;height: 5px;background: #fff;border-radius: 100%;}*/
	.gbbMenu.on > li > ul,
	.gbbMenu.on > .gbbBg,
	.gbbMenu:hover > li > ul,
	.gbbMenu:hover > .gbbBg {height:350px; display: none;}
	.gbbBg {position: absolute; top: 100%; left: -1000px; right: -1000px; height: 0px; background: rgba(255,255,255,0.95); overflow:hidden; -webkit-transition: all 0.3s; transition: all 0.3s;}
	.gbbBg:before,
	.gbbBg:after {content:""; position:absolute; display:block; height:0px; left:0; right:0; background:#dadada;}
	.gbbBg:before {top:0;}
	.gbbBg:after {bottom:0;}
	#gb.sub {background: #fff;}
	#gb.sub .gbtLogo a {color: #000;}
	#gb.sub .gbtLogo a span {background:url('../img/common/gnb_logo.png')no-repeat center center;}
	#gb.sub .gbbMenu > li > a {color: #000;}
	#gb.sub .gbbMenu > li > a:hover,
	#gb.sub .gbbMenu > li > a.current {color: #3e82e7;}
	#gb.sub .gbbMenu > li > a:after {background: #3e82e7;}

}


@media (max-width:1400px) {

	#gb {position:relative; z-index:100;background: #F3D3D5;border-bottom: 1px solid rgba(255,255,255,0.5);}
	#gbTop {border-bottom:solid 0px #dadada; position: relative; z-index: 101; height: 57px;}
	.gbtLogo {width:160px; height: 56px; float: left;}
	.gbtLogo a {display:block;height: 45px; line-height: 36px; color: #fff;font-size: 30px;margin-top: 10px;font-weight: 400;font-family: 'SchoolSafetyFoundation';}
	.gbtLogo a span {display: block; width: 200px; height: 50px;float: left; margin-right: 15px;font-weight: 400;font-family: 'SchoolSafetyFoundation';}
	.gbtLogo a i {font-weight: 800; font-family: 'SchoolSafetyFoundation'; }
	.gbtMo {display:block; width:57px; height:56px; padding:18px; float: right; margin-right: -15px; cursor:pointer; background: none;}
	.gbtMo span {text-indent: -9999px; overflow: hidden; height: 0; width: 0; display: block;}
	.gbtMo em {display: block; height: 2px; background: #fff; margin-bottom: 2px; position: relative; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out;}
	.gbtMo em:last-child {margin-bottom: 0;}
	.gbtMo.on {background: none;}
	.gbtMo.on em:nth-child(2) {opacity:0;}
	.gbtMo.on em:nth-child(3) {margin-bottom:6px; margin-left:0px; transform:rotate(45deg);-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);}
	.gbtMo.on em:nth-child(4) {margin-top:-8px; margin-left:0px; transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);}
	.gbtMenu {display: none;}
	#gbBot {position: fixed; top: 57px; bottom: 0; left: 0; right: 0; z-index:100; background: #fff; visibility: hidden; transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
	#gbBot.on {visibility: visible;}
	#gbBot .container {padding-left: 0; padding-right: 0; height: 100%;}
	.gbbMenu {overflow:hidden; height: 0; overflow-y:scroll; -webkit-overflow-scrolling: touch; transition:all .3s ease-in-out; -webkit-transition:all .3s ease-in-out; position: relative;}
	.gbbMenu > li {position:relative; text-align:left; z-index:1; border-bottom:solid 1px #ddd;}
	.gbbMenu > li > a {display:block; height:50px; line-height:50px; font-size:13pt; padding:0 15px; font-weight:700;text-transform: uppercase;}
	.gbbMenu > li > span { /*display:block;*/ display: none;/*웬페이지일때 숨기기*/ position:absolute; left:0; right:0; top:0; height:50px; cursor:pointer;}
	.gbbMenu > li > span:after {content:""; display:block; width:15px; height:8px; position:absolute; right:15px; top:50%; margin-top:-4px; background:url('../img/common/gnb_mobile_arrow.png')no-repeat center bottom; background-size:100% auto;}
	.gbbMenu > li > span.on:after {background-position:center top !important;}
	.gbbMenu > li > ul {display:none; background:#f5f5f5;}
	.gbbMenu > li > ul > li {border-top:solid 1px #ddd;}
	.gbbMenu > li > ul > li > a {display:block; padding:0 25px; height:40px; line-height:40px; font-size:11pt;}
	.gbbMenu > li > ul > li > a br {display:none;}
	.gbbMenu.on {height:100%;}
	html.on,
	body.on {display:block; height:100%; overflow:hidden;}
	.gbbBg {display:none;}
	.gbbMenu > li.gbbMo {background: #f5f5f5; padding: 8px 10px;}
	.gbbMenu > li.gbbMo dl {display: block; text-align: right;}
	.gbbMenu > li.gbbMo dl:after {content: ''; display: table; clear: both;}
	.gbbMenu > li.gbbMo a {display: block; height: 36px; line-height: 36px;  position: relative; padding: 0 15px; font-weight: 500; font-size: 11pt; border-radius: 25px 25px 25px 25px; -moz-border-radius: 25px 25px 25px 25px; -webkit-border-radius: 25px 25px 25px 25px; letter-spacing: -0.075em;}
	.gbbMenu > li.gbbMo dl dt {float: left;}
	.gbbMenu > li.gbbMo dl dt a {background: #fff; border: solid 1px #ddd; line-height: 34px;}
	.gbbMenu > li.gbbMo dl dd {display: inline-block;}
	.gbbMenu > li.gbbMo dl dd a {background: #454c52; color: #fff;}
	.gbbMenu > li.gbbSns {text-align: center; border-bottom: none; padding: 15px 0;}
	.gbbMenu > li.gbbSns span {display: none;}
	.gbbMenu > li.gbbSns > a {display: inline-block; margin: 0 10px; padding-left: 23px; height: 20px; line-height: 20px; padding-right: 0; font-size: 10pt; font-weight: 400; white-space: nowrap;}
	.gbbMenu > li.gbbSns > a.gbtIs {background:url('../img/common/gnb_sns_instagram.png')no-repeat left center;}
	.gbbMenu > li.gbbSns > a.gbtFb {background:url('../img/common/gnb_sns_facebook.png')no-repeat left center;}
	
	.container { width: 100%;}

}


@media (max-width:1350px) {	
	.container {padding-left: 15px; padding-right: 15px;}
}








