@charset "utf-8";
/*----------------------------------------------------------------------------
* -------------------------------------------------------------------------*/

@import url('jquery/css/jquery.mCustomScrollbar.min.css');
#header {background:transparent;position:fixed;left:0;top:0;width:100%;z-index:100;transition:background .3s}
#header:before {position:absolute;left:0;top:0;content:'';width:100%;height:3.6rem;background:#284562; color:#fff}
#header:after {position:absolute;left:50%;top:3.6rem;transform:translateX(-50%);content:'';width:100%;height:0px;background:#fff;opacity:.2}
#header .headerWrap {width:64rem;max-width:calc(100% - 2rem);margin:auto;position:relative;}
#header .headerWrap:after {display:block;clear:both;content:''}
#header .logo {float:left;}
#header .logo a {display:block;width:248px;height:48px;background:url('../img/common/logo.png') no-repeat center/contain;margin:.5rem .525rem 0}

#gnb.active .depth2 {display:block}
.gnbWrap {float:right;margin-right:15rem}
#gnb .title {position:absolute;top:98px;height:0;opacity:0;overflow:hidden;visibility:hidden;width:37vw;text-align:right;transition:opacity .3s .3s;}
#gnb .title p {text-align:left;display:inline-block;padding:1.9rem 7rem;font-size:1.25rem;color:#000;font-weight:500}
#gnb .title span:before {display:block;width:1.3rem;height:2px;background:#000;content:'';margin:.8rem 0 .7rem}
#gnb .title span {display:block;color:#767676;font-size:.8rem;font-weight:300}
#head_menu {text-align:center;}
#head_menu > li {display:inline-block;vertical-align:top;margin:0 .1rem;position:relative}
#head_menu > li > a {position:relative;font-size:.95rem;font-weight:400;display:block;color:#fff;padding:1rem .6rem}


#head_menu > li > a:before {position:absolute;left:0;top:1.5rem;width:1px;height:12px;background:#4f677e;content:''}
#head_menu > li:first-of-type a:before {display:none}


#head_menu > li > a:after {position:absolute;left:0;bottom:0;transform:scaleX(0);width:100%;height:5px;background:#28b2a5;content:'';transition:all .3s}

#head_menu .submenu {position:absolute;left:.6rem;top:73px;width:100%;border-right:1px solid #e6e5e5}
#head_menu .lnb2 .submenu {/*left:-1rem*/}
#head_menu .lnb4 .submenu {/*width:122px;*/ }
#head_menu .submenu .title {display:none}
#head_menu .lnb3 .submenu:after {position:absolute;left:50%;top:-98px;transform:translateX(-50%);content:'';width:115vw;height:0;z-index:-1;opacity:0;transition:all .3s;border-bottom:1px solid #ddd;background:#fff;} /*menu_area_bg */
#head_menu .depth2 > li  {padding:0;line-height:.9rem}

#head_menu .depth2 > li > a {display:block;padding:0;color:#333;text-align:left;word-break:keep-all;height:0;overflow:hidden;visibility:hidden;opacity:0;transition:opacity .2s .3s}
#head_menu .depth2 > li > a:hover,#head_menu .depth2 > li > a:focus {color:#888}
#head_menu .depth3 {display:none}
#head_menu .lnb7 {display:none}
#header.fixed {background:#fff;top:0 !important}
#header.active:before,#header.wh:before {opacity:1}
#header.fixed:after,#header.active:after {background:#ddd;opacity:1}
#header.fixed .logo a,#header.active .logo a,#header.wh .logo a {background-image:url('../img/common/logo.png')}
#header.fixed .search-btn,#header.active .search-btn, #header.fixed .lang,#header.active .lang,
#header.wh .search-btn,#header.wh .lang,#header.wh #head_menu > li > a, 
#header.fixed #head_menu > li > a,#header.active #head_menu > li > a {color:#fff}
#header.active #gnb .title {min-height:400px;height:auto;overflow:visible;visibility:visible;opacity:1; }
#header.active #head_menu > li.on > a:after {transform:scaleX(1)}
#header.active #head_menu .lnb3 .submenu:after {height:calc(100% + 98px);opacity:1;}
#header.active #head_menu .submenu {padding:1.1rem 0 1.5rem;height:300px; }/*menu_area_bg */
#header.active #head_menu .depth2 > li > a {height:auto;overflow:visible;visibility:visible;padding:.4rem 0;opacity:1}
#header.fixed .AllMn .bar,#header.active .AllMn .bar,#header.wh .AllMn .bar {background:#fff}

#header .login {position:absolute;right:6rem;top:1.1rem;color:#ddd;display:inline-block;}
#header .login li  {float:left; margin-left:.7rem;position:relative;}
#header .login li span {font-size:.75rem;font-weight:400}
#header .login:after {display:block;clear:both;content:''}


#header .search-btn {position:absolute;right:2.4rem;top:0;color:#508ac4;font-size:1.3rem; padding: .65rem .75rem; background:#1c3149}
#header #searchWrap {position:absolute;left:50%;top:3.6rem;transform:translateX(-50%);width:100vw;background:#2e5189;padding:0 1rem;text-align:center;color:#fff;height:0;opacity:0;padding:0 1rem;overflow:hidden;visibility:hidden;transition:padding .4s,opacity .4s}


#header #searchWrap .search-area input[type=text], #header #searchWrap .search-area select {border: 1px solid #2e5189 !important;outline: none;}

#header #searchWrap.active {padding:3.1rem 1rem;height:auto;opacity:1;visibility:visible;overflow:visible; border:none}
#header #searchWrap .search-area {border-bottom:2px solid #fff;width:30.25rem;margin:auto;text-align:left;overflow:hidden;margin-bottom:.75rem}
#header #searchWrap .search-area input {background:transparent;border:0;width:calc(100% - 3.5rem);color:#fff;font-size:.9rem;font-weight:300;float:left;height:2.5rem;line-height:2.5rem;padding:0 10px;}
#header #searchWrap .search-area input::placeholder {color:#fff;font-weight:300}
#header #searchWrap .search-area button {font-size:1.25rem;float:right;padding:0 .75rem;height:2.5rem}
#header #searchWrap .keywords {margin-bottom:2.1rem}
#header #searchWrap .keywords > * {display:inline-block;vertical-align:middle}
#header #searchWrap .keywords span {color:#fff;font-size:.9rem;font-weight:700;background:#3aa9b9;border-radius:20px;padding:0 .77rem;margin-right:.3rem}
#header #searchWrap .keywords a {font-weight:300;opacity:.7;transition:opacity .4s;padding:0 .5rem;position:relative;color:#fff;font-size:.8rem;}
#header #searchWrap .keywords a:after {position:absolute;right:0;top:50%;transform:translateY(-50%);width:1px;height:.7rem;background:#fff;opacity:.5;content:''}
#header #searchWrap .keywords a:last-child {padding-right:0}
#header #searchWrap .keywords a:last-child:after {display:none}
#header #searchWrap .keywords a:hover,#searchWrap .keywords a:focus {opacity:1;}
#header #searchWrap .close {position:relative;display:block;width:100px;margin:auto;text-align:center;padding:.35rem 0 .4rem;font-size:.7rem;font-weight:300;border:1px solid rgba(255,255,255,.5);overflow:hidden;color:#fff}
#header #searchWrap .close span {position:relative;z-index:1}
#header #searchWrap .close:hover span,#searchWrap .close:focus span {color:#ddd}
#header #searchWrap .close:hover:after,#header #searchWrap .close:focus:after {width:150%;opacity:1;}
#header .lang:hover,#header .lang:focus,#header .search-btn:hover,#header .search-btn:focus {}
#header .AllMn {position:absolute;right:0;top:1.4rem;width:23px;height:14px;}
#header .AllMn .bar {display:block;width:100%;height:3px;background:#fff;transition:all .4s}
#header .AllMn .bar:nth-of-type(2) {margin:4px 0}
#header .AllMn:hover .bar:nth-of-type(1),#header .AllMn:focus .bar:nth-of-type(1) {}
#header .AllMn:hover .bar:nth-of-type(3),#header .AllMn:focus .bar:nth-of-type(3) {}

#allgnb {position:fixed;left:0;top:0;width:100vw;height:0;opacity:1;background:#fff;content:'';transition:all .4s;z-index:1}
#allgnb.active{height:100vh;opacity:1}
#allgnb .container{position:absolute;left:50%;top:5rem;transform:translateX(-50%);width:64rem;max-width:calc(100% - 2rem);overflow:hidden;visibility:hidden;opacity:0;height:0;transition:all .4s .6s}
#allgnb.active .container {overflow:visible;visibility:visible;opacity:1;height:auto}
#allgnb .all_close {position:absolute;right:0;top:0;font-size:2rem;color:#000;transition:transform .4s;line-height:1}
#allgnb .all_close:hover,#allgnb .all_close:focus {transform:rotateY(180deg)}
#head_menu_all {margin:0 0 0 -1.5rem;overflow:hidden}
#head_menu_all > li {float:left;width:calc(20% - 1.5rem);margin:2.5rem 0 0 1.5rem}
#head_menu_all > li > a { text-align: center;font-size:1.2rem;font-weight:600;color:#fff;display:block;padding:1.1rem 0 1.1rem .5rem;position:relative;background: #28b2a5;}
#head_menu_all .submenu {border-top: 3px solid #009174;}
#head_menu_all .submenu > ul > li > a {position:relative;font-size:.8rem;color:#000;font-weight:500;display:block;border-bottom:1px solid #ddd;padding:.8rem 0 .8rem .5rem;}
#head_menu_all .submenu > ul > li.plus > a:after {position:absolute;right:.85rem;top:.75rem;font-family:'xeicon';content:'\e914';font-size:1rem;color:#000;transition:transform .4s}
#head_menu_all .submenu > ul > li > a:hover,#head_menu_all .submenu > ul > li > a:focus {color:#28b2a5}
#head_menu_all .submenu > ul > li.plus > a:hover:after,#head_menu_all .submenu > ul > li.plus > a:focus:after {transform:rotateY(180deg);color:#28b2a5}
#head_menu_all .submenu > ul > li.plus.active > a,#head_menu_all .submenu > ul > li.plus.active > a:after {color:#28b2a5}
#head_menu_all .lnb-detail {height:0;opacity:0;overflow:hidden;visibility:hidden;transition:all .3s}
#head_menu_all .lnb-detail a {position:relative;display:block;font-weight:400;color:#767676;padding-left:10px}
#head_menu_all .lnb-detail li + li {margin-top:.3rem}
#head_menu_all .lnb-detail a:before {position:absolute;left:0;top:.6rem;width:4px;height:1px;background:#767676;content:''}
#head_menu_all .lnb-detail a:hover,#head_menu_all .lnb-detail a:focus {color:#28b2a5}
#head_menu_all .lnb-detail a:hover:before,#head_menu_all .lnb-detail a:focus:before {background:#28b2a5}
#head_menu_all .lnb-detail a:hover span,#head_menu_all .lnb-detail a:focus span {border-bottom:1px solid #28b2a5}
#head_menu_all .submenu > ul .active .lnb-detail {border-bottom:1px solid #ddd;padding:1rem 0 .9rem;opacity:1;overflow:visible;visibility:visible;height:auto}

 	 

#footer {background:#333;padding:0 0 1.7rem}
#footer:before {position:absolute;content:'';height:1px; width:100%; background:#5d616a;margin-top:2.1rem;}
#footer a:hover,#footer a:focus,#footer a:active {text-decoration:underline;}
#footer .float-left {width:calc(100% - 11rem)}
#footer .util:after {display:block;clear:both;content:''}
#footer .util {margin:.4rem 0 1rem;font-size:.75rem}
#footer .util li {float:left;position:relative;}
#footer .util li:before {position:absolute;left:0;top:.275rem;width:1px;height:.75rem;background:#5d616a;content:''}
#footer .util li a {color:#fff;}
#footer .util li:first-of-type:before {display:none}
#footer .util li:nth-of-type(2) a {color:#f5e168}
#footer .util li + li {margin-left:.6rem;padding-left:.7rem}
#footer .logo { position:absolute;margin-top: 55px;}
#footer .logo img{margin-right:10px}
#footer .info,#footer .copy {color:#fff;font-size:.7rem;padding-left:12rem}
#footer .copy {margin-top:.15rem;}
#footer .info {margin-left:-.75rem; }
#footer .info:after {display:block;clear:both;content:''}
#footer .info li {float:left;margin-left:.75rem}
#footer .info li span{float:left;color:#ffd200; font-size:0.9rem;font-weight: 600;}
#footer .related {float:right;width:10.5rem;margin-right:.3rem;position:relative;}
#footer .related button {background:#92959e;padding:.5rem .75rem .5rem .95rem;display:block;width:100%;text-align:left;font-size:.75rem;color:#fff;font-weight:200;position:relative;}
#footer .related .scroll {position:absolute;left:0;bottom:2rem;background:#fff;border:1px solid #212836;width:100%;overflow-y:scroll;height:0;opacity:0;overflow:hidden;visibility:hidden;transition:all .4s}
#footer .related .scroll a {display:block;padding:.25rem .75rem}
#footer .related button:before {position:absolute;right:.75rem;font-family:'xeicon';content:'\e942'}
#footer .related.on button:before {content:'\e945'}
#footer .related.on .scroll {height:200px;overflow:visible;visibility:visible;opacity:1;overflow-y:scroll;}

/* 모바일 전체메뉴(회원가입)*/
#allgnb .Mlogin {position: absolute;top: 1.8rem;right:-9999px;transform: translateY(-50%);}
#allgnb .Mlogin a:first-of-type {margin-right: 5px;}
#allgnb .Mlogin a {color: #fff;width: auto;padding: .25rem .5rem;display: block;border: 1px solid #fff;float: left;text-align: center;}


/*@media(max-width:1500px){
	#allmenu .scroll > div {width:80%}
}
@media(max-width:1260px){
	#allmenu .scroll > div {width:95%}
}*/




@media(max-width:1260px){
	.gnbWrap {margin-right:12rem}
	#allgnb .container {top:2rem}
	#head_menu_all > li {width:calc(31% - 1.2rem)}
	#head_menu > li {margin:0 .2rem; }
	#head_menu .lnb3 .submenu:after {width:100000%}
}
@media(max-width:1240px){	
	.gnbWrap {margin-right:15rem}
	#head_menu > li {margin:0 .2rem}

#head_menu > li > a{font-size:.85rem; padding:1rem .3rem}
	
}

@media(max-width:1150px){
	.gnbWrap {margin-right:12rem}
	#header .logo a {width:210px;}

}

@media(max-width:1080px){
		.gnbWrap {margin-right:12rem}
	 
	 #footer .logo {display:none}
	 #footer .info,#footer .copy {padding-left: inherit}
    #footer:before {height:0; background: inherit;}
	
}
@media(max-width:1025px){
	#gnb {display:none}
	#allgnb h2 {padding:.7rem 1rem;background: #284562; color: #fff;}
	#allgnb {top:0;background:#28b2a5}
	#allgnb .all_close {top:.8rem;right:.8rem; color:#ddd}
	
	#allgnb .container {top:0;transform:translate(-50%,0);transition-delay:0s;;max-width:100%}
	#allgnb.active {height:calc(100% - 4.95rem)}
	#allgnb.active .container {width:calc(100% + 2rem)}
	/* 모바일 전체메뉴(회원가입)*/
	#allgnb .Mlogin {right: 4rem}
	#header .login {display:none}
	
	#head_menu_all {margin:0;padding-top:1.5rem}
	#head_menu_all > li {float:none;width:100%;margin:0}
	#head_menu_all > li + li {margin-top:.7rem}
	#head_menu_all > li > a {color:#fff;width:45vw;text-align:center;font-size:1rem;padding:.8rem 0}
	#head_menu_all > li > a span {position:relative}
	#head_menu_all > li > a span:before {position:absolute;right:-15px;top:-5px;width:7px;height:7px;border-radius:3px;background:#fa4d09;content:'';opacity:0;transition:opacity .2s}
	#head_menu_all > li.active > a span:before {opacity:1}
	#head_menu_all .submenu {position:absolute;right:0;top:0;width:55vw;height:calc(100vh - 4.95rem);background:#fff;border-top:0;padding:1.5rem 1.35rem 1.5rem;display:none; margin-top:3.45rem}
	#head_menu_all .submenu > ul > li > a {font-size:1rem}
	#head_menu_all .active .submenu {display:block}
}

@media(max-width:990px){
	#footer .logo {display:none}
}

@media(max-width:800px){
	#footer {padding:.5rem 0 1.5rem 0}
	#footer .util {float:none;text-align:center}
	#footer .util p {word-break:keep-all}
	#footer .util li {display:inline-block;float:none;vertical-align:middle}
	#footer .util li:last-child {padding-right:0;margin-right:0}
	#footer .related {float:none;width:100%;margin-top:0rem}
	#footer .related button {display:block;width:100%;text-align:left;padding:0 1rem}
	#footer .related button:after {right:1rem}
	#footer .related .scroll {bottom: 1.2rem;}
	
}


@media(max-width:768px){
  #footer {padding:.5rem 0 1.5rem 0}
  #footer .float-left {float:none !important;width:100%}
  #footer .related {float:none;margin:1rem auto 0;width:100%}

  
}

@media(max-width:640px){
	#header #searchWrap .search-area {width:100%}
	#header #searchWrap .search-area input {width:calc(100% - 5rem)}
}


@media(max-width:580px){	
	#header .search-btn {padding: .64rem .75rem;background: #1c3149;}
}

@media(max-width:540px){
	#header:before {height:3.5rem}
	#header:after,#header #searchWrap {top:3.5rem}
	#header #searchWrap.active {padding:1rem}
	#header #searchWrap .keywords {margin-bottom:1rem}
	#header .logo a {width:180px;margin:.5rem 0}
	#allgnb {}
	#allgnb .all_close {top:.7rem; right:.8rem}
	#allgnb.active,#head_menu_all .submenu {height:calc(100vh - 3.55rem)}
	
}
@media(max-width:400px){
	#header .headerWrap {max-width:calc(100% - 1rem)}

	#footer .util li {padding-right:.2rem;margin-right:0}
	#footer .util li + li:before {display:none}
	#footer .related {width:calc(100% + 2rem);margin-left:50%;transform:translateX(-50%)}
}



@charset "utf-8";





/* main 마이페이지&소통공간 */
#con_section{}


#con_section .rangelist>ul{}
#con_section .rangelist>ul:after{content:""; display:block; clear:both;}
#con_section .rangelist>ul>li{float:left; position:relative; width:25%; padding:5px 0 0 10px;margin-bottom:5px }
#con_section .rangelist>ul>li>div{
    display:block; position:relative; cursor:pointer; height:260px; background-color:#fff;
    transition:background 0.1s linear;
    -webkit-transition:background 0.1s linear;
}



#con_section .rangelist>ul>li>div>.photos{
    overflow:hidden; display:block; position:absolute; left:0; top:0; width:100%; height:100%; padding:20px 10px; /*box-shadow: 0 1px 2px 0 rgba(222, 222, 224, 0.4);*/
    transition:all 0.3s linear;
    -webkit-transition:all 0.3s linear;
}
#con_section .rangelist>ul>li>div>.photos img{display:block; position:relative; z-index:0; max-width:100%; margin:0 auto; padding-top:.5rem}

#con_section .rangelist>ul>li>div>.photos.ty01 div{
    opacity:0; display:block; position:absolute; left:0; top:0; z-index:3; width:100%; height:100%; background-color:#1caceb; 
    transition:opacity 0.1s linear;
    -webkit-transition:opacity 0.1s linear;
}


#con_section .rangelist>ul>li>div>.photos.ty02 div{
    opacity:0; display:block; position:absolute; left:0; top:0; z-index:3; width:100%; height:100%; background-color:#e76565; 
    transition:opacity 0.1s linear;
    -webkit-transition:opacity 0.1s linear;
}

#con_section .rangelist>ul>li>div>.photos.ty03 div{
    opacity:0; display:block; position:absolute; left:0; top:0; z-index:3; width:100%; height:100%; background-color:#28b2a5; 
    transition:opacity 0.1s linear;
    -webkit-transition:opacity 0.1s linear;
}


#con_section .rangelist>ul>li>div>.photos.ty01 strong{color:#555}
#con_section .rangelist>ul>li>div>.photos strong{color:#fff}
#con_section .rangelist>ul>li>div>.photos.ty01{background:url(../img/main/icon01_bg.png) no-repeat 90% 80%;box-shadow:2px 2px 12px rgba(0,0,0,.15);}
#con_section .rangelist>ul>li>div>.photos.ty02{ background:#e76565;box-shadow:3px 3px 15px rgba(0,0,0,.25);}
#con_section .rangelist>ul>li>div>.photos.ty03{ background:#28b2a5 /*url(../img/main/icon03_bg.png) no-repeat right bottom*/;box-shadow:3px 3px 15px rgba(0,0,0,.25);}
#con_section .rangelist>ul>li>div>.photos.ty04{ background:#27a0b1;box-shadow:3px 3px 15px rgba(0,0,0,.25);}
#con_section .rangelist>ul>li>div>.photos.ty05{ background:#475e70 url(../img/main/icon05_bg.png) no-repeat right bottom;box-shadow:2px 2px 12px rgba(0,0,0,.15);}





#con_section .rangelist>ul>li> div .photos p:before {font-family:'xeicon';content:'\e90b';color:#fff;font-size:1rem;opacity:.6; }
#con_section .rangelist>ul>li> div .photos p{font-size:.9rem;color:#555;font-weight:normal; text-align:center;margin-top:1rem}



#con_section .rangelist>ul>li>div>.photos div h2{ color:#fff; font-size:1.1rem; font-weight:400; text-align:center; position:absolute; top:1.5rem; left:50%;transform:translateX(-50%);}



#con_section .rangelist>ul>li>div>.photos div ul{display:block; position:relative;  top:50%; width:85%; height:110px; margin-top:-55px; text-align:center; vertical-align:middle; left:50%;transform:translateX(-50%)}
#con_section .rangelist>ul>li>div>.photos div ul li{margin:7px auto; padding:0 10px;}
#con_section .rangelist>ul>li>div>.photos div ul li a,
#con_section .rangelist>ul>li>div>.photos div ul li span{  font-size:.75rem;}
#con_section .rangelist>ul>li>div>.photos div ul li a{
    display:block; width:100%; height:36px; line-height:35px; margin:0 auto; border:1px solid rgba(255,255,255,0.5); color:#fff;
  
    transition:all 0.1s linear;
    -webkit-transition:all 0.1s linear;
}
#con_section .rangelist>ul>li>div>.photos div ul li a:hover,
#con_section .rangelist>ul>li>div>.photos div ul li a:focus{border-color:#fff;}
#con_section .rangelist>ul>li>div strong{display:block; position:relative; z-index:0; padding:10px 0; text-align:center;   font-size:1.1rem; color:#596068; font-weight:400}
#con_section .rangelist>ul>li>div.on>.photos div{opacity:1;}

#con_section .rangelist>ul>li>div:hover,
#con_section .rangelist>ul>li>div.on{opacity:.9;}
#con_section .rangelist>ul>li>div:hover>.photos,
#con_section .rangelist>ul>li>div.on>.photos{
    left:0px; top:0px; border-color:#fff;
    box-shadow:3px 3px 3px rgba(0,0,0,0.2);
    -webkit-box-shadow:3px 3px 3px rgba(0,0,0,0.2);

}


@media all and (max-width: 1023px){
    #con_section .rangelist>ul>li>div>.photos div ul li a span{display:none;}
}
@media all and (max-width: 992px){
    #con_section .rangelist>ul>li{width:50%; padding:10px;}
}
@media all and (max-width: 700px){
    #con_section .rangebox{margin:40px 15px 20px 0;}
    #con_section .rangebox>ul>li:not(:nth-child(1)){margin-left:10px;}
    #con_section .rangelist>ul>li{width:50%; padding:5px;}
}

@media all and (max-width: 690px){

    #con_section .rangelist>ul>li{width:100%;}
	 #con_section .rangelist>ul>li>div{height:160px;}
	 #con_section .rangelist>ul>li>div strong {text-align: left;margin-left: 1rem;font-size: 1.1rem;}
	 #con_section .rangelist>ul>li> div .photos p {top: 3rem;position: absolute;right: 1rem;}
	 #con_section .rangelist>ul>li>div>.photos img {top: -45%; width:85px}
    #con_section .rangelist>ul>li>div>.photos.ty05 { background-size: 70px auto; }
    #con_section .rangelist>ul>li>div>.photos.ty01{background:url(../img/main/icon01_bg.png) no-repeat 70% 80%;background-size: 70px auto;}
	 #con_section .rangelist>ul>li>div>.photos div ul li a{height:27px; line-height:27px; }
	 #con_section .rangelist>ul>li>div>.photos div ul li{margin:6px auto;}
    #con_section .rangelist>ul>li>div>.photos div h2{ display:none;}
    /*알림판 */
    #con_section .rangelist>ul>li>div.popzone{
     height:auto;
	  width:100%}
    #section1 .controls_bg {display:none;}

    /******/


}

@media all and (max-width: 600px){
    #con_section .searchbox .bx{height:auto; padding-left:0;}
    #con_section .searchbox .bx strong{position:relative;}
    #con_section .searchbox .bx input[type="submit"]{top:auto; bottom:0;}
	 #con_section .rangelist>ul>li>div{height:130px;}
	 #con_section .rangelist>ul>li>div>.photos img {top: -60%; }
	 #con_section .rangelist>ul>li>div strong {margin-left: .5rem;font-size: .9rem;}


}
@media all and (max-width: 400px){
    #con_section .searchbox{padding:20px;}
    #con_section .searchbox .bx{padding-right:0;}
    #con_section .searchbox .bx input[type="submit"]{position:relative; width:100%; margin-top:2px;}
}




/********* 인기검색어 2021.02.09 **************/
/* 인기검색어 */
.search_hot{position:relative;overflow:hidden;/*background:#3f3f3f;*/height:34px;padding-left:8px;padding-right:8px;}
.search_hot ul li{ float:left; display:inline-block; line-height:34px; padding-left:12px; padding-right:10px; cursor:pointer}
.search_hot ul li:first-child{text-indent:20px; cursor:default}
.search_hot ul li a:hover{text-decoration:underline;}
.search_hot ul li span{padding:0 .5rem 0 0;font-weight:500; }
.search_hot ul li span:before{ display:inline-block;content: '\ea37'; color: #3291f8/*#37456b*/;font-family: "xeicon";font-size: .85rem; position: absolute; left:0rem;margin-right:.2rem; }
.search_hot ul li span:after{content: '';background:#4a66bd;width:1px;height:12px;position:absolute;top:12px; left:6.3rem;display:inline-block;}

.search_hot_area{margin: .7rem 10rem 0 10rem;}


.search_hot2{position:relative;overflow:hidden;/*background:#3f3f3f;*/height:34px;padding-left:8px;padding-right:8px;margin:.7rem 0;}
.search_hot2 ul li{ float:left; display:inline-block; line-height:34px; padding-left:12px; padding-right:10px; cursor:pointer}
.search_hot2 ul li:first-child{text-indent:0px; cursor:default}
.search_hot2 ul li a:hover{text-decoration:underline;}
.search_hot2 ul li span{padding:0 .5rem .1rem .5rem  ;font-weight:500;font-size:.75rem; border:1px solid #3291f8;border-radius:15px;color:#3291f8;}
.search_hot2 ul li span:after{content: '';background:#4a66bd;width:1px;height:12px;position:absolute;top:12px; left:6.1rem;display:inline-block;}


@media(max-width:1200px){
.search_hot_area{margin: .7rem 8rem 0 8rem;}
}
@media(max-width:1027px){
.search_hot_area{margin: .7rem 3rem 0 3rem;}
}

@media(max-width:768px){
.search_hot_area{margin: .7rem 1rem 0 1rem;}
}

@media(max-width:500px){
.search_hot_area{margin: .7rem .5rem 0 .5rem;}
}

/***********************************/








