@charset "utf-8";


/* layout */
html, body { height:100%;}
body { color:#686868; letter-spacing:-.05em; -webkit-text-size-adjust:none; -webkit-font-smoothing:antialiased;}
#wrap {	position:relative; width:100%; min-width:320px;height:100%; font-size:1.6rem; }
.f-inner{width: 100%; max-width: 1920px; position: relative; margin-left: auto; margin-right: auto;}
.inner {	width:100%; max-width:1600px;	position:relative;	margin-left:auto;	margin-right:auto;}
.s-inner {	width:100%; max-width:1460px;	position:relative;	margin-left:auto;	margin-right:auto;}
.ss-inner {	width:100%; max-width:1280px;	position:relative;	margin-left:auto;	margin-right:auto;}
#content{padding-top: 100px; overflow-x: hidden;}


/* 타블렛 가로 */
@media all and (max-width:1600px) {	
	.inner {width:94%;}
	.s-inner {width:94%;}
	.ss-inner {width:94%;}
	#content{padding-top: 70px;}
}
@media all and (max-width:768px){
	#content{padding-top: 60px;}
}


/* header */
#header{position: fixed; width: 100%; top: 0; left: 0; height: 100px; background-color: #fff ; z-index: 99; border-bottom: 1px solid #eee;}
#header #logo{position: absolute; left: 70px; top: 50%; transform: translateY(-50%);}
#header #logo a{width: 267px; height: 46px; background: url(/images/common/logo.png) no-repeat center center / 100%; display: block;}
#header .menu{}
#header .menu > ul{display: flex; justify-content: center;}
#header .menu > ul > li{position: relative;}
#header .menu > ul > li > div{margin: 0 31px;}
#header .menu > ul > li > div > span{}
#header .menu > ul > li > div > span > a{font-size: 1.8rem; color: #3d3d3d; font-weight: 500; display: block; line-height: 100px;}
#header .menu > ul > li:hover > div > span > a{color: #0d6fb8;}
#header .menu > ul > li > ul{position: absolute; left: 50%; transform: translateX(-50%); width: 190px; text-align: center; background-color: #0d6fb8; display: none;}
#header .menu > ul > li > ul > li{border-bottom: 1px solid rgba(255,255,255,0.1);}
#header .menu > ul > li > ul > li:last-child{border-bottom: 0;}
#header .menu > ul > li > ul > li > a{color: #fff; display: block; line-height: 48px; font-size: 1.6rem;}
#header .menu > ul > li > ul > li:hover > a{background-color: #095f9f;}
#header .right_menu{display: flex; align-items: center; position: absolute; right: 70px; top: 50%; transform: translateY(-50%);}
#header .right_menu .tel{}
#header .right_menu .tel .txt{}
#header .right_menu .tel .txt span{font-size: 1.3rem; color: #686868; margin-bottom: 5px; display: block;}
#header .right_menu .tel .txt > div{font-size: 2.2rem; color: #222222;}
#header .right_menu .tel .txt > div > b{color: #0d6fb8;}
#header .right_menu .blog{margin-left: 17px;}
#header .right_menu .blog img{max-width: 100%;}
#gnb_mo{display: none;}
#menuToggle{display: none;}

@media all and (max-width:1800px){
	#header #logo{left: 2%;}
	#header .right_menu{right: 2%;}
	#header .menu > ul > li > div{margin: 0 24px;}
}
@media all and (max-width:1600px){
	#header{height: 70px;}
	#header .menu{display: none;}
	#header #logo a{width: 200px;}
	#header .right_menu{right: calc(2% + 40px);}
	#header .right_menu .tel .txt span{margin-bottom: 2px;}
	#header .right_menu .tel .txt > div{font-size: 2rem;}
	#header .right_menu .blog img{max-width: 44px;}
	#menuToggle{display: block; position: absolute; right: 2%; top: 50%; transform: translateY(-50%); cursor: pointer;}
	#menuToggle span{color: #000;}
	#gnb_mo{display:block; position: fixed; width: 100%; top: -100%; z-index: 98;background-color: #fff; border-bottom: 1px solid #eee; transition: .2s ease-in-out;}
	#gnb_mo.on{top: 70px;}
	#gnb_mo > ul{}
	#gnb_mo > ul > li{}
	#gnb_mo > ul > li > div{background-color: #fff; border-bottom: 1px solid #eee;}
	#gnb_mo > ul > li > div > span{cursor: pointer;}
	#gnb_mo > ul > li > div > span > a{display: block; font-size: 1.6rem; padding: 10px 15px; font-weight: 500; pointer-events: none;}
	#gnb_mo > ul > li.on > div > span > a{color: #0d6fb8}
	#gnb_mo > ul > li > ul{display: none;background-color: #f5f5f5;}
	#gnb_mo > ul > li > ul > li{border-bottom: 1px solid #e5e5e5;}
	#gnb_mo > ul > li > ul > li:last-child{border-bottom: 0;}
	#gnb_mo > ul > li > ul > li > a{padding: 8px 20px; font-size: 1.5rem; display: block;}
	#gnb_mo .right_menu{display: none;}
}
@media all and (max-width:768px){
	#header{height: 60px;}
	#header #logo a{width: 164px;}
	#header .right_menu{display: none;}
	#gnb_mo.on{top: 60px;}
	#gnb_mo .right_menu{display: flex; justify-content: flex-end; align-items: center; padding: 15px; border-top: 10px solid #eee;}
	#gnb_mo .right_menu .tel{}
	#gnb_mo .right_menu .tel .txt{}
	#gnb_mo .right_menu .tel .txt span{font-size: 1.3rem; color: #686868; margin-bottom: 5px; display: block;}
	#gnb_mo .right_menu .tel .txt > div{font-size: 2rem; color: #222222;}
	#gnb_mo .right_menu .tel .txt > div > b{color: #0d6fb8;}
	#gnb_mo .right_menu .blog{margin-left: 17px;}
	#gnb_mo .right_menu .blog img{max-width: 40px;}
}


/* footer */
#footer {position: relative; background-color: #f9f9f9; padding: 60px 0 70px;}
#footer .inner{display: flex; gap:0 60px;}
#footer .inner .f_logo{}
#footer .inner .f_logo img{max-width: 100%;}
#footer .inner .info{}
#footer .inner .info span{font-size: 1.5rem; color: #686868; display: inline-block; margin-right: 20px;}
#footer .inner .info .copy{font-size: 1.4rem; color: #686868; margin-top: 12px;}

@media all and (max-width:976px){
	#footer .inner{flex-direction: column; justify-content: center; align-items: center;}
	#footer .inner .info{text-align: center; margin-top: 20px;}
	#footer .inner .info span{margin-right: 0; margin: 2px 10px;}
}
@media all and (max-width:768px){
	#footer{padding: 45px 0 60px;}
	#footer .inner .f_logo img{max-width: 180px;}
}
@media all and (max-width:500px){
	#footer{padding: 40px 0 55px;}
	#footer .inner .f_logo img{max-width: 160px;}
	#footer .inner .info span{font-size: 1.4rem;}
}