/*
 * @New Header Responsive CSS
 * @Date : 2017-12-07
*/

@media screen and (min-device-width:320px) {
	html {font-size:62.5%}
}
@media screen and (min-device-width:360px) {
	html {font-size:70.3125%}
}
@media screen and (min-device-width:375px) {
	html {font-size:73.2421%}
}
@media screen and (min-device-width:412px) {
	html {font-size:80.4688%}
}

/*header - middle device*/
@media (min-width: 1024px) and (max-width: 1140px) {
	.header-container {width: 100%; padding: 0 15px}
	.header-top {min-width: 100%}
	.header-top .brand-logo {margin-left: 0}
	.header-nav {min-width: 100%}
	.header-nav .gnb-title {padding: 17px 6px}
	.header-nav .user-menu {right: 15px}
	.header-nav .header-search {width: 100%}
	.header-nav .header-www {left: 30px}
	.header-nav .header-search-area {left: 125px}
	.header-nav .header-search-area input {width: 520px;}
	.header-nav a.header-domein-research {right: 170px}
	.header-nav a.header-domein-price {right: 15px}
}

/*header - tablet device*/
@media (min-width: 768px) and (max-width: 1023px) {
	body.mobile-toggle {position: absolute; left: 280px}
	.header-container {width: 100%; height: 57px; padding: 0 15px}
	.header-top {min-width: 100%}
	.header-top .brand-ad {display: none}
	.header-top .brand-logo {display: inline-block; float: none}
	.header-nav {min-width: 100%}
	.header-nav .gnb-menu {display: none; float: none; height: 100%; position: fixed; top: 0; left: 0; width: 280px; z-index: 9999; background-color: #1b1b1b; overflow-y: scroll}
	.header-nav .gnb-menu.active {display: block}
	.header-nav .gnb-title {padding: 10px 13px; border-top: 0}
	.header-nav .gnb-list {float: none; border-top: 1px solid rgba(255,255,255,0.1); border-bottom: 1px solid #242424;}
	.header-nav .gnb-list.on .gnb-title {border-top: 0; border-bottom: 1px solid #242424; background: #282828; color: #fff; text-align: left;}
	.header-nav .gnb-list.on .gnb-itembox {display: block; border: 0; padding: 0; margin-bottom: 0}
	.header-nav .gnb-itembox {position: inherit; background: #353535}
	.header-nav .gnb-items a {height: 36px; line-height: 36px; color: rgba(255,255,255,0.6); border-bottom: 1px solid #4e4e4e; text-decoration: none;}
	.header-nav .gnb-items a::before {color: rgba(255,255,255,0.6)}
	.header-nav .gnb-items a:hover,
	.header-nav .gnb-items a:active {background: none; text-decoration: none}
	.header-nav .user-menu {right: 15px}
	.header-mobile {display: block; position: absolute; top: 11px; left: 15px; line-height: 20px; background: #414141; z-index: 9999!important; cursor: pointer;}
	.header-mobile span {display: block; height: 34px; padding: 4px 6px; font-size: 27px; color: lightgray; border-radius: 3px;}
	.header-nav .header-search {width: 100%}
	.header-nav .header-www {left: 15px}
	.header-nav .header-search-area {left: 90px}
	.header-nav .header-search-area input {width: 308px}
}

/*header - mobile device*/
@media (max-width: 767px) {
	body.mobile-toggle {position: absolute; left: 240px}
	.mobile-toggle .header-top .brand-logo {display: none}
	.mobile-toggle .header-nav .user-menu {display: none}
	.header-container {width: 100%; height: 57px; padding: 0 15px}
	.header-top {min-width: 100%; height: auto; text-align: center}
	.header-top .brand-ad {display: none}
	.header-top .brand-logo {display: inline-block; float: none; margin-top: 12px; margin-left: 0}
	.header-nav {min-width: 100%}
	.header-nav .gnb-menu {display: none; float: none; height: 100%; position: fixed; top: 0; left: 0; width: 240px; z-index: 9999; background-color: #1b1b1b; overflow-y: scroll}
	.header-nav .gnb-menu.active {display: block;}
	.header-nav .gnb-title {padding: 10px 13px; border-top: 0}
	.header-nav .gnb-list {float: none; border-top: 1px solid rgba(255,255,255,0.1); border-bottom: 1px solid #242424;}
	.header-nav .gnb-list.on .gnb-title {border-top: 0; border-bottom: 1px solid #242424; background: #282828; color: #fff; text-align: left;}
	.header-nav .gnb-list.on .gnb-itembox {display: block; border: 0; padding: 0; margin-bottom: 0}
	.header-nav .gnb-itembox {position: inherit; background: #353535}
	.header-nav .gnb-items a {height: 36px; line-height: 36px; color: rgba(255,255,255,0.6); border-bottom: 1px solid #4e4e4e}
	.header-nav .gnb-items a::before {color: rgba(255,255,255,0.6)}
	.header-nav .gnb-items a:hover,
	.header-nav .gnb-items a:active {background: none; text-decoration: none}
	.header-nav .user-menu {right: 15px}
	.header-mobile {display: block; position: absolute; top: 11px; left: 15px; line-height: 20px; background: #414141; z-index: 9999!important; cursor: pointer;}
	.header-mobile span {display: block; height: 34px; padding: 4px 6px; font-size: 27px; color: lightgray; border-radius: 3px;}
	.header-nav .header-search {width: 100%}
	.header-nav .header-www {display: none}
	.header-nav .header-search-area {display: table; left: 0; width: 100%; padding: 0 15px}
	.header-nav .header-search-area li {display: table-cell;}
	.header-nav .header-search-area li:first-of-type {width: 70%}
	.header-nav .header-search-area li:last-of-type {width: 30%}
	.header-nav .header-search-area input {width: 100%;}
	.header-nav a.header-domein-research {display: inline-block; right: 36%; width: auto; padding: 0; height: auto; background-color: transparent; border: 0; color: #00adbb; font-style: italic;}
	.header-nav .header-search a:hover {background: transparent; border: 0}
	.header-nav a.header-domein-price {display: none}
}