@charset "utf-8";

@font-face {font-family:'Gmarket'; font-weight:normal;  src: url('font/GmarketSans_Medium.woff') format('woff')}
@font-face {font-family:'GmarketL'; font-weight:normal;  src: url('font/GmarketSans_Light.woff') format('woff')}
@font-face {font-family:'Gmarket'; font-weight:200;  src: url('font/GmarketSans_Light.woff') format('woff')}
@font-face {font-family:'Gmarket'; font-weight: bold;  src: url('font/GmarketSans_Bold.woff') format('woff');}
@font-face {font-family:'lottemart'; font-weight:normal;  font-style: normal;  src: url('font/12lottemartLight.woff') format('woff');}
.ff_lot{font-family:'lottemart'}



#wrap{margin:auto; padding:0px 20px; max-width:1740px; min-width:1260px}
header{position:relative; z-index:900}
header h1{position:absolute; top:35px}
header nav{position:relative; margin-right:260px; margin-left:31%; /* max-width:920px;  */ z-index:1}
header nav ul.menu{font-size:0px; padding-top:43px}
header nav ul.menu>li{display:inline-block; vertical-align:top; width:18.25%; /* max-width:175px;  */height:81px}
header nav ul.menu>li:last-child{width:27%; /* max-width:220px */}
header nav ul.menu>li>a{display:block; font-size:1.58em; color:#222}
header nav ul.menu>li>a span{display:inline-block; position:relative; padding-bottom:40px}
header nav ul.menu ul{display:none; padding-top:40px; padding-right:10%; word-break:keep-all}
header nav ul.menu ul li{text-align:left; margin:10px 0px; line-height:1.4; transform:rotate(0.03deg)}
header nav ul.menu ul li a{color:#fff; font-size:0.95em; letter-spacing:0.5px}
header nav ul.menu>li:last-child ul li a[href*=support],
header nav ul.menu>li:last-child ul li a[href*=myabode]{letter-spacing:-.5px}
header .submenu{display:none; position:absolute; left:0px; top:124px; width:100%; height:317px; background:#0e49b6; border-radius:7px; box-shadow:0px 10px 20px rgba(0,0,0,.3)} /* li크기 23px*/
header .submenu .submenu_qna{opacity:0; position:absolute; padding:0% 3% 0% 4%; width:25%; height:100%; background:#009fdc; border-radius:7px 0px 0px 7px; transition:all ease .4s}
header .submenu.on .submenu_qna{opacity:1; padding-top:2%}
header .submenu .submenu_qna *{color:#fff; text-shadow:0px 0px 2px rgba(0,0,0,.2)}
header .submenu .submenu_qna>p{font-weight:bold; font-size:1.4em}
header .submenu .submenu_qna>p:after{display:inline-block; content:''; vertical-align:middle; margin-top:-10px; margin-left:-20px; width:100px; height:100px; background:url(/img/main/ic_qna.png) -200px center}
header .submenu .submenu_qna>dl dt{font-size:1.12em; margin:0px 0px 5px}
header .submenu .submenu_qna>dl dd+dt{margin-top:15px; padding-top:20px; border-top:1px dashed rgba(0,0,0,.2)}
header .submenu .submenu_link{overflow:hidden}
header .submenu .submenu_link ul{opacity:0; float:right; margin:0px 35px; width:260px; font-size:0px; transition:all ease .4s}
header .submenu.on .submenu_link ul{opacity:1; margin-top:42px}
header .submenu .submenu_link ul li{display:inline-block; vertical-align:top; padding:4px 0px; width:100%}
header .submenu .submenu_link ul li:nth-child(1){width:100%}
header .submenu .submenu_link ul li a{display:block; text-align:center; background:#fff; border-radius:5px} 
header .submenu .submenu_link ul li a>p{display:inline-block; margin:auto; padding:25px 0px 20px; max-width:210px; background-repeat:no-repeat; background-position:left center }
header .submenu .submenu_link ul li:nth-child(1)>a>p{padding-left:75px;  background-image:url(/img/inc/ic_ic.gif)}
header .submenu .submenu_link ul li:nth-child(2)>a>p{padding-left:75px; background-image:url(/img/inc/ic_ih.gif)}
header .submenu .submenu_link ul li:nth-child(3)>a>p{padding-left:75px; background-image:url(/img/inc/ic_lh.gif)}
header .submenu .submenu_link ul li a span{display:none; margin-top:6px; color:#8a8a8a; font-size:.85em}
header nav ul.menu>li.on>a{color:#0e49b6}
header nav ul.menu>li>a span:before{opacity:0; display:block; content:''; position:absolute; left:50%; bottom:0px; width:2px; height:0px; background:#fff; transition:all ease .5s}
header nav ul.menu>li:hover>a  span:before{opacity:1; bottom:-20px; height:20px}
header nav ul.menu>li ul li.on a{color:#ffac0b}
header ul.gnb_sns{position:absolute; right:160px; top:47px}
header ul.gnb_sns>li{display:inline-block; margin:0px 3px}
header ul.gnb_sns>li>a{display:block; width:40px; height:35px; background-repeat:no-repeat; background-position:center; text-indent:-5000px}
header ul.gnb_sns>li.sns01>a{background-image:url(/img/inc/gnb_sns01.gif)}
header ul.gnb_sns>li.sns02>a{background-image:url(/img/inc/gnb_sns02.gif)}
header h2{position:absolute; right:0px; top:41px}
header h2 a{display:block; position:relative; padding:10px 20px 5px 46px; font-weight:normal; border:1px solid #757575; border-radius:3px; overflow:hidden}
header h2 a:before{display:block; content:''; position:absolute; top:14px; left:19px; width:18px; height:2px; background:#4e4e4e; border-radius:2px; box-shadow:0px 6px 0px #4e4e4e, 0px 12px 0px #4e4e4e}
header	.allmenu{display:none; position:fixed; left:0px; top:0px; right:0px; height:100%; background:rgba(0,0,0,.6); overflow-y:auto; z-index:999}
header	.allmenu>div{position:relative; background:#fff; margin:40px auto 10px; padding:4% 0px; width:90%; max-width:1600px;  border-radius:20px; box-shadow:0px 1px 5px rgba(0,0,0,.3)}
header	.allmenu>div>p.allmenu_logo{text-align:center}
header	.allmenu>div ul.menu{margin:50px auto 0px; width:90%; overflow:hidden}
header	.allmenu>div ul.menu>li{float:left; margin:0px 1%; width:18%}
header	.allmenu>div ul.menu>li>a{display:block; text-align:center; padding:15px 0px 10px; color:#fff; font-size:1.1em; background:#133cba url(/img/sub/sub_bg.jpg) center bottom/100%; border-radius:5px}
header	.allmenu>div ul.menu>li+li>a{border-left:1px solid #444}
header	.allmenu>div ul.menu>li ul{padding:10px 10px 0px; overflow:hidden}
header	.allmenu>div ul.menu>li ul li{margin-top:-1px; border-bottom:1px dashed #ddd}
header	.allmenu>div ul.menu>li ul li a{display:block; text-align:center; padding:12px 0px 8px; font-size:.95em; transform:rotate(0.03deg)}
header	.allmenu .allmenu_close{position:absolute; right:30px; top:30px}
header	.btn_close{display:block; position:relative; width:50px; height:50px; text-indent:-500000px}
header	.btn_close:after,
header	.btn_close:before{display:block; content:''; position:absolute; left:0px; top:50%; width:100%; height:2px; background:#333; -webkit-transform:rotate(45deg); transform:rotate(45deg)}
header	.btn_close:before{-webkit-transform:rotate(-45deg); transform:rotate(-45deg)}

footer{position:relative; padding:50px 5%; margin-bottom:80px; background:#f2f2f2; border-radius:7px; overflow:hidden}
footer:After{display:block; content:''; clear:both}
footer:before{display:block; content:''; position:absolute; top:0px; left:58%; width:100%; height:100%; background:RGBA(0,0,0,.02);  -webkit-transform:skew(-30deg, 0deg);;  transform:skew(-30deg, 0deg); z-index:0}
footer *{font-size:15px}
footer .btmR{position:relative; float:right; width:40%; max-width:490px; overflow:hidden; z-index:1}
footer .btmR>p{float:left; width:35%; font-size:1.6em}
footer .btmR>p:after{display:inline-block; content:''; vertical-align:middle; margin-left:8px; width:27%; height:2px; background:#333;}
footer .btmR>ul{float:left; width:65%; transform:rotate(0.03deg)}
footer .btmR>ul>li{font-size:1.1em}
footer .btmR>ul>li:first-child{margin-bottom:20px; font-size:1.25em; color:#333}
footer .btmR>ul>li:last-child a{display:inline-block; margin-top:20px; padding:3px 18px 1px; border:1px solid #ccc}
footer .btmL{float:left; padding-top:10px; width:60%}
footer .btmL address{margin:35px 0px 5px}
footer .btmL>:not(.bttm_logo){color:#666; transform:rotate(0.03deg)}


/*******************************************************************************************************************/


@media screen and (min-width:801px){	
	.dp_mb{display:none}
	.pc_block{display:block}
}

@media screen and (max-width:1600px){
	header nav ul.menu>li:nth-child(4) ul{width:150%}
	header .submenu .submenu_link{display:none;}
}


@media screen and (max-width:800px){
	body{overflow-x:hidden}
	.dp_pc{display:none}
	.mb_block{display:block}	
	*{max-height:50000px}
	#wrap{max-width:100%; min-width:100%}
	header h1{position:relative; top:0px; margin:25px 0px 20px; width:75%; max-width:500px}
	header h2{top:7px}
	header h2 a{text-indent:-500px; border:0px}
	header h2 a:before{top:4px; left:auto; right:7px; width:32px; height:2px; border-radius:1px; background:#333; box-shadow: 0px 11px 0px #333, 0px 22px 0px #333}
	header	.allmenu{height:100%}
	header	.allmenu>div{margin:0px; padding:30px; width:100%; min-height:100%; border-radius:0px}
	header .allmenu>div>p.allmenu_logo{padding-right:70px}
	header .allmenu>div ul.gnb_sns{position:static; text-align:center; margin:25px 0px 0px}
	header	.allmenu>div ul.menu{margin-top:10px; padding-bottom:60px; width:100%; overflow:hidden}
	header	.allmenu>div ul.menu>li{float:none; margin:20px 0% 0px; width:100%}
	header	.allmenu>div ul.menu>li>a{padding:10px 0px 8px; background-repeat:no-repeat}
	header	.allmenu>div ul.menu>li+li>a{border-left:1px solid #444}
	header	.allmenu>div ul.menu>li ul{text-align:center; padding:10px 10px 0px;overflow:hidden}
	header	.allmenu>div ul.menu>li ul li{display:inline-block; border:0px}
	header	.allmenu>div ul.menu>li ul li:after{display:inline-block; content:''; vertical-align:middle; width:3px; height:3px; border-radius:10px; background:#888;}
	header	.allmenu>div ul.menu>li ul li:last-child:after{display:none}
	header	.allmenu>div ul.menu>li ul li a{display:inline-block; padding:6px 10px 6px 8px; font-size:1em}
	header	.btn_close{width:40px; height:40px}
	footer{padding:10%; margin-bottom:100px}
	footer .btmR, footer .btmL{float:none; width:100%}
	footer .btmR>p{float:none; width:100%; font-size:1.4em}
	footer .btmR>p:after{display:none}
	footer .btmR>ul{float:none; width:100%; margin-top:10px}
	footer .btmR>ul>li{font-size:1em}
	footer .btmR>ul>li:first-child{margin-bottom:10px; font-size:1.1em}
	footer .btmR>ul>li:last-child a{margin-top:10px}
	footer .btmL{margin-top:30px; padding:0px 5px; border-top:1px dotted #aaa}
	footer .btmL>.btm_logo{display:none;}
	footer .btmL address{margin-top:30px}
	.btn_goTop{position:fixed; left:0px; right:0px; bottom:-60px; margin:auto; width:50px; transition:all ease .7s; z-index:999}
	.btn_goTop.up{bottom:30px}
	.btn_goTop a{display:block; text-align:center; height:50px; font-size:11px; background:rgba(0,0,0,.8); color:#fff; border-radius:200px; text-decoration:none}
	.btn_goTop a:before{display: block; content:''; position:relative; top:13px; margin:0px auto 12px; width:9px; height:9px; border-top:2px solid #aaa; border-left:2px solid #aaa; -webkit-transform:rotate(45deg); transform:rotate(45deg)}
}