@charset "utf-8";
a.btn_more{display:inline-block; padding:18rem 70rem 18rem 35rem; background:#c5a56e url(../img/layout/icon_btn.svg) no-repeat right 35rem center; background-size:14rem; border-radius:30rem; color:#fff; font-size:15rem}
a.btn_more:hover{background-color:#654423;}

/* pop layer */
#popLayerBg { position:fixed; z-index:99; width:100%; height:100%; background:#000; opacity:0.8; filter:alpha(opacity=80); display:none }
.pop_layer { z-index:100; display:none; position:fixed; left:50%; top:50%; transform:translate(-50%, -50%); background:#fff; border-radius:0; box-shadow:0 0 5px rgba(0,0,0,0.6); }
.pop_layer > header { background:#576f8d; height:46px; border-radius:0; }
.pop_layer > header h2 { text-align:center; font-family:nanumsquare; font-size:18px; font-weight:500; color:#fff; line-height:42px; }
.pop_layer .btn_close { position:absolute; top:12px; right:12px; display:block; font-size:20rem; text-align:center; width:20rem; height:20rem; line-height:20px; text-indent:-9000px; background:url(../img/btn_close.png) no-repeat; background-size:100% }
.pop_layer > header + .con { padding:30rem; padding-bottom:40rem }
.pop_layer .btn_add i { font-size:19rem }
.pop_layer .btn_area { text-align:center; margin:30rem 0 0 0 }
.pop_layer .btn_area .btn { min-width:150rem }

.wrap {width:1400rem; margin:0 auto; position:relative }

.pc_ver { display:block !important }
.m_ver { display:none !important }
.pc_v { display:block !important }
.m_v { display:none !important }

@media all and (max-width:1200px){
	.pc_v { display:none !important }
	.m_v { display:block !important }
}

@media all and (max-width:800px){
	.pc_ver { display:none !important }
	.m_ver { display:block !important }
}

#header {width:100%; height:145rem; z-index:100;color:#fff;transition:all .3s; }
#header h1 {font-size:0; z-index:51; margin:30rem auto; text-align:center;}
#header h1 a {width: 313rem;height: 52rem; margin:0 auto; background-size:100%;background-image: url(../img/logo.png);display: block;}

#header .top_call { float:left; margin:-80rem 0 0 0rem;}
#header .top_call li {background:#f36f2a; color:#fff; border-radius:50px; padding:7rem 15rem 5rem; display:block; }
#header .top_call li dl dt {float:left; font-size:25px; font-weight:800; vertical-align:top;}
#header .top_call li dl dd {display:inline-block; font-size:30rem; font-weight:800; padding-top:0px; padding-left:10px; }

#header .btn_user { float:right; margin:-90rem 0rem 0 0; display:block;} 
#header .btn_user li {border-radius:50px; padding:7rem 15rem 15rem; display:block; }
#header .btn_user li dl dt {float:left; font-size:17rem; font-weight:500; vertical-align:top; color:#000; padding-top:10rem; }
#header .btn_user li dl dd {display:inline-block; font-size:30rem; font-weight:300; padding-left:10px; color:#122649; letter-spacing:-1px;}
#header .btn_user li dl dd b {font-weight:800;}

#header .gnb { text-align:center; padding:0rem 20rem; background:#235093; }

#header .gnb .depth1 { text-align:center;display:inline-block; height:65rem;vertical-align:top; padding:0rem 80rem;  position:relative;letter-spacing:-.5px; }
#header .gnb .depth1 > a {color:#fff; display:inline-block; height:65rem; line-height:65px; font-size:20rem; font-weight:600; letter-spacing:-.5px;}
#header .gnb .depth1:before {content: ""; position:absolute; width:37rem; height:37rem; text-align:left; margin-left:-40px; margin-top:13px;}
#header .gnb .depth1:nth-child(1):before {background:url("../img/menu_icon01.png") center top no-repeat; }
#header .gnb .depth1:nth-child(2):before {background:url("../img/menu_icon02.png") center top no-repeat; }
#header .gnb .depth1:nth-child(3):before {background:url("../img/menu_icon03.png") center top no-repeat; }
#header .gnb .depth1:nth-child(4):before {background:url("../img/menu_icon04.png") center top no-repeat; }
#header .gnb .depth1:nth-child(5):before {background:url("../img/menu_icon05.png") center top no-repeat; }
#header .gnb .depth1 ul { padding-top:0; transition:all .3s; height:0; overflow:hidden }
#header .gnb .depth2 > a {transform: rotate(-0.03deg); display:inline-block; font-weight:400; font-size:1.05em; line-height:1.4; padding:7px 0;letter-spacing:-1px; }

#header .user { position:absolute; right:-35rem; top:80rem; width:80rem; opacity:0; transition:all .3s }
#header .user a { border:1px solid #ddd; display:block; height:0; line-height:37px; font-size:14rem; padding:0 12rem; text-transform:uppercase; letter-spacing:.5px; margin-left:-1rem; text-align:center; margin-top:-1px; color:rgba(0,0,0,0.5); background:#fff }
#header .user a:hover { color:#222 }
#header .user.on { opacity:1 }
#header .user.on a { height:40rem }
#header .gnb .depth1 > a:before {background:#fff;margin-top: 63rem;content:"";height:3px;left:0px; position: absolute;width:0%;transition:0.3s;}
#header .gnb .depth1:hover > a:before { width:100%; }

.gnb.fixed{
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  background:#235093;
  z-index:10;
  
}

.gnb_m.fixed{
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  background:#235093;
  z-index:10;
  
}

.gnb_m {background:#235093; margin-top:0px; text-align:center; letter-spacing:-4px; font-size:0;  }
.gnb_m ul li {color:#fff; display:inline-block; width: calc(100% /5 - 20px);  font-size:11rem; font-weight:500; letter-spacing:-1px; padding:10rem 0; margin-left:18px; } 

.gnb_m ul li:before {content: ""; position:absolute; width:18rem; height:18rem; text-align:left; margin-left:-18px; margin-top:-4px;  }
.gnb_m ul li:nth-child(1):before {background:url("../img/menu_icon01.png") center top no-repeat; background-size:100%;}
.gnb_m ul li:nth-child(2):before {background:url("../img/menu_icon02.png") center top no-repeat; background-size:100%;}
.gnb_m ul li:nth-child(3):before {background:url("../img/menu_icon03.png") center top no-repeat; background-size:100%;}
.gnb_m ul li:nth-child(4):before {background:url("../img/menu_icon04.png") center top no-repeat; background-size:100%;}
.gnb_m ul li:nth-child(5):before {background:url("../img/menu_icon05.png") center top no-repeat; background-size:100%;}
.gnb_m ul li a {color:#fff; }

.gnb_m.fixed{
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  background:#235093;
  z-index:10;
  
}


@media (min-width:800px){
.gnb_m ul li { font-size:16rem; margin-left:35px; width: calc(100% /5 - 50px);}
.gnb_m ul li:before {content: ""; position:absolute; width:35rem; height:35rem; text-align:left; margin-left:-35px; margin-top:-4px;  }

}


#header.down {}
#header.down a {}
#header.down .gnb .depth1 > a { margin-bottom:8rem }
#header.down .gnb .depth1 ul { height:100%; overflow:visible  }
#header.down .gnb .depth2 > a:hover { color:#c5a56e  }

#header.on { background:#fff; }
#header.on a {}
#header.down .gnb .depth2 > a{color:#222;}
.header-login{position:absolute; right:0; top:-6rem; display:flex; align-items:center;}
.header-login a{color:#fff; white-space:nowrap;}
.header-inner.wrap{}
.header-login li:nth-child(1) a{color:#248689;}
.header-login  a{display:block; padding:8rem 14rem; background:#fff; font-weight:500; font-size:15rem; text-align:center; min-width:82rem;}
.header-login li:nth-child(2) a{background:#15686c;}

/* footer */
#footer { text-align:center; padding:70rem 0; margin:0rem 0 0 0; background:#000; font-size:16rem; color:#9c9c9c}
#footer b{display:block; margin-bottom:8rem; color:#fff;}
#footer h1 { margin:0 auto 30rem; }
#footer nav { position:absolute; right:0; top:0 }
#footer nav li { float:left; margin:0 0 0 17px; }
#footer .list_info li{line-height:2; display:inline-block; margin-right:30rem;}
#footer dl{line-height:2;}
#footer dt, #footer dd { display:inline-block }
#footer dd { margin:0 15rem 0 0rem }
#footer .copyright {font-weight:300; margin:30rem 0 0 0; color:#a8a8a8; }
#footer #top_btn { border:0; background:rgba(0,0,0,0.5); font-size:30rem; color:#fff; right:30px; bottom:30px }
#footer #top_btn:hover { background:rgba(0,0,0,1) }
#footer #top_btn i { vertical-align:2rem }



@media (min-width:2000px){

}


@media (max-width:1480px){
	.wrap{width:100%; padding:0 30rem;}
	
	#header h1{left:30rem}
}

@media (max-width:1230px){
	#header .gnb .depth1 { padding:0rem 40rem;  margin-left:35px;}
	#header .gnb .depth1:before {content: ""; position:absolute; width:35rem; height:35rem; text-align:left; margin-left:-35px; margin-top:18px;}
	#header .gnb .depth1:nth-child(1):before {background-size:100%;}
	#header .gnb .depth1:nth-child(2):before {background-size:100%;}
	#header .gnb .depth1:nth-child(3):before {background-size:100%;}
	#header .gnb .depth1:nth-child(4):before {background-size:100%;}
	#header .gnb .depth1:nth-child(5):before {background-size:100%;}
}

@media (max-width:1023px) {
	#header { height:60rem }
	#header::before{height:80rem}
	#header.down { height:0 }
	#header h1 {left:15rem;top: 0;}
	#header h1 a{width:173rem; height:30rem; margin:10rem 0;}
	.header-login{right:65rem; top:20rem}
	#header .btn_user { position:absolute; right:0rem; top:18rem; font-size:22rem; z-index:8; float:none; margin:0 }
	#header .btn_user li dl dt { font-size:13rem; letter-spacing:-.5px; }
	#header .btn_user li dl dd {cursor:pointer; font-size:15rem; letter-spacing:-.5px; }
	#header .btn_gnb { position:absolute; right:20rem; top:25rem; font-size:22rem; z-index:15; color:#111;}
	#header .btn_gnb.on { color:#111; transform:rotate(-90deg) }
	#header .btn_gnb.on .fa-bars:before{content: "\f00d";}
	#header .gnb { position:fixed; width:100%; background:#fff; height:100%; top:0; right:-100%; margin:0; float:none; z-index:9; transition:all .3s }
	#header .gnb.on {z-index:11; right:0;}
	#header .gnb > ul{display:block; margin-top:80rem; padding-top:40rem; border-top:1rem solid #ddd;}
	#header .gnb:before{display:none;}
	
	#header.down .gnb a { color: #fff }
	#header.down .gnb .depth1 > a { margin-bottom:0 }
	#header.down .gnb .depth1:hover > a { color:#fff }
	#header .gnb.on .depth1 ul {display:none;height: auto;position: static; padding:20rem; background:#f8f8f8; border-top:1rem solid #c5a56e; transition: none;}
	#header .gnb.on .depth1 ul li a{display:block; padding:0 0 14rem 0; color:#222; text-align:left;}
	#header .gnb.on .depth1 ul li:last-child a{padding-bottom:0}

	
	#header .gnb .depth1 > a:before { display:none }
	#header .gnb .depth1 {float:none;margin-bottom:20rem;text-align: left;display: block;}
	#header .gnb .depth1 > a {display:block; height:auto; padding-bottom:12rem; line-height:1; color:#222; }

	#header .user { right:38rem; top:70rem }
	#header .user.on a { color:rgba(0,0,0,0.7) }

	#header.on { background:#fff }
	#header.on .gnb a { color:#222; font-size:20rem; }
	#header.on .gnb .depth1 ul li a{font-size:17rem;}

	#footer { padding:30rem 0; padding-bottom:130rem; }
	#footer h1 { display:none }
	#footer .f_left { float:none !important; margin:0; }
	#footer nav { position:static; margin:0 0 10rem }
	#footer nav li { margin:0 17px 0 0 }
}


@media (max-width:860px){	
	#header .gnb .depth1 {margin-bottom:10rem}
}



@media (max-width:540px) {

	#header .gnb{width:100%}
	#header .btn_gnb{top:24rem}
	
	.header-login{top:25rem; right:49rem}
	.header-login a{min-width:55rem;padding: 6rem 10rem;font-size:13rem;}
	
	a.btn_more{padding: 10rem 55rem 10rem 25rem; background: #c5a56e url(../img/layout/icon_btn.svg) no-repeat right 25rem center; background-size:12rem; font-size:12rem}

	#footer{font-size:14rem; padding-bottom:100rem; }
	#footer .list_info li{clear:both;}
}



#quickmenu {margin-top:250rem; position: fixed; right: 0px; z-index: 100000;}
#quickmenu .tabs {margin-bottom: 0px;border:1px solid #ddd;}
#quickmenu .tabs-vertical .nav-tabs {z-index: 101;width: 100%;}
#quickmenu .tabs .nav-tabs li {cursor:pointer; background-color:#fff; text-align: center; border-bottom:1px solid #ddd; padding:10rem 20rem; }
#quickmenu .tabs .nav-tabs li:last-child {border-bottom:0;}
#quickmenu .tabs .nav-tabs li a p{font-size: 13rem; line-height: 1.2em; color: #333; letter-spacing: -.5px;	font-weight:500;}
#quickmenu .tabs .nav-tabs li a img {width:30rem; padding-bottom:5rem;}


@media (max-width:1400px){
    #quickmenu {width:100%; right:0%; bottom:0;  transform:translateX(0%); font-size:0;}
    #quickmenu .tabs .nav-tabs li { display:inline-block; }
	#quickmenu .tabs .nav-tabs li { width: calc(100% /4 - 0px); margin-right: 0px; }
    #quickmenu .tabs .nav-tabs li a p { font-size: 15rem; }
	#quickmenu .tabs .nav-tabs li a img { width: 35rem; }
}

@media (max-width:800px){
	#quickmenu .tabs .nav-tabs li a p { font-size: 10rem; }
	#quickmenu .tabs .nav-tabs li a img { width: 25rem; }
}