/* headroom */
header{ position: fixed; top:0; height: 73px; z-index: 9999999; background-color: #fff; margin: 0px; padding: 0px; width: 100%; transition: all .5s;  }
.header{ background-color: #fff; margin: 0px; padding: 0px; height: 73px; overflow: hidden; /*margin-top: 0px;*/ transition: all .5s; }
.headroom{ z-index: 9999999; position: fixed; height: 73px; top: 0; left: 0; right: 0; /*margin-top: 0px;*/ box-shadow: 0px 0px 5px rgba(0,0,0,0); /*-webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out;*/ }
.headroom--pinned { top: 0px; box-shadow: 0px 0px 5px rgba(0,0,0,0.2); -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out;}
.headroom--unpinned { top: -80px; box-shadow: 0px 0px 5px rgba(0,0,0,0);  -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out;}
.headroom--pinned #switchBtnArea #switchBtn{ position: fixed; -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out;}
.headroom--unpinned #switchBtnArea #switchBtn{ position: absolute; -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out; }
/*.headroom--top { margin-top: 0px; }
.headroom--not-top { margin-top: 0px; }*/
.headroom--top .TopMenuBox{ margin-top: 20px!important; height: 53px; overflow: hidden; }
.headroom--pinned .TopMenuBox{ margin-top: 20px; }
.headroom--not-top .TopMenuBox{ margin-top: 10px!important; transition: all .5s; }

/* TopMenu */
.TopMenu{ width: 100%; height: 73px; overflow: hidden; margin: auto; background-color: #fff;}
.TopMenuBox{ max-width: 1440px; height: 53px; overflow: hidden; margin: auto; margin-top: 20px; display: block; padding: 5px 0px;}
.LogoTop{ width: 115px; display: inline-block; position: relative; text-align: left; color: #fff; float: left;}
.LogoTop a{ display: block;}
.LogoTop img{ width:100%; height: auto; margin-top: 5px; }
.MenuTop{ width: 55%; margin-left:50px; float: left; /*margin-top: 0px;*/ position: relative; z-index: 9999999; font-family: 'db_adman_xregular';}
.MenuTop #rwdMenuWrap ul{ width: auto; margin: 0px; padding: 0px; background-color: transparent; }
.MenuTop #rwdMenuWrap ul li{ width: auto; margin: 0px; padding: 0px; }
.RightMenuTop{ height: 32px; display: inline-block; text-align: right; float: right; margin-top: 8px; }
.RightSearchBox{ display: inline-block; text-align: right; vertical-align: top; margin-top: 2px; }
.RightSearchBox input[type=text]{ width: 150px; padding: 8px 20px 8px 5px; border-radius: 8px; -webkit-appearance: none; border: 1px solid #666666; font-size: 14px;}
.RightSearchBox button{ position:absolute; margin-top: 10px; border: 0px; vertical-align: middle; margin-left: -30px; background-color: transparent; }
.RightSearchBox img{ width: 12px; height: auto; }
.RightCouponBox{ height: 32px; overflow: hidden; display: inline; text-align: right; margin-left: 15px; vertical-align: middle; margin-top: 2px; }
.RightCouponBox a{ height: 27px; overflow: hidden; background-image: linear-gradient(150deg, #FA8F01 0%, #FA4707 100%); padding: 5px 10px 5px 10px; border-radius: 8px; color: #fff; letter-spacing: 2px; font-family: 'db_adman_xbold'; font-size: 18px;}
.RightCouponBox img{ width: 25px; height: auto; vertical-align: middle; border-right: 1px dashed #eee; padding: 5px 10px 5px 0px; margin-right: 10px; }

/* HambergerRight */
.HambergerRight{ display: none; position: fixed; right: 10px; margin-top: -52px; width: auto; height: 50px; line-height: 50px; text-align: center; color: #fff; }
.MobileOthers{ display: none; }

/* HanBarber Menu */
#switchBtnArea { display: none; position: relative;  z-index: 2; width: 26px; }
#switchBtnArea #switchBtn { position: fixed; top: 18px; left: 20px; z-index: 999999;  display: block; width: 20px; height: 20px; cursor: pointer; }
#switchBtnArea #switchBtn.btnClose  [class*="humberger-border"] { background: #fff;	 }
#switchBtnArea #switchBtn div { display: inline-block; box-sizing: border-box;  transition: all .4s; }
#switchBtnArea #switchBtn [class*="humberger-border"] { position: absolute; left: 0;  display: block; width: 20px; height: 2px; background: #000; }
#switchBtnArea #switchBtn div:nth-of-type(1){ margin-top: 7px; }
#switchBtnArea #switchBtn div:nth-of-type(3){ bottom: 4px; }
#switchBtnArea #switchBtn.btnClose div:nth-of-type(1){ top: 8px;  -webkit-transform: translateX(2px) translateY(-7px) rotate(225deg); transform: translateX(2px) translateY(-7px) rotate(225deg); }
#switchBtnArea #switchBtn.btnClose div:nth-of-type(2){ top: 28px; display: none;  background: transparent; opacity: 0; }
#switchBtnArea #switchBtn.btnClose div:nth-of-type(3){ top: 1px;  -webkit-transform: translateX(2px) translateY(7px) rotate(135deg); transform: translateX(2px) translateY(7px) rotate(135deg); }
#rwdMenuWrap { position: relative; display: inline; top:auto; right:0; z-index: 9999999; width: 100%; height: 100%; margin: 0 auto; background: #262b42; }
#rwdMenuWrap ul { margin-top: 45px; width: 100%; box-sizing: border-box;  padding: 3px 12px 0; }
#rwdMenuWrap ul li { display: inline-block; position: relative; width: auto; border-bottom: 0px solid #575b6e; }
#rwdMenuWrap ul li:last-child { border: none; }
#rwdMenuWrap ul li:last-child:after {}
#rwdMenuWrap ul li:hover a{ color: #112233;}
#rwdMenuWrap ul li a { cursor: default; width: 100%; display: inline-block; padding: 7px 10px 3px 10px; font-weight: 500; color: #112233; text-align: center; margin: 0px 10px 0px 10px; font-size: 21px; letter-spacing: 2px; font-family: 'db_adman_xbold'; border: 0px; background: #fff; transition: all .3s; }
#rwdMenuWrap ul li img{ width: 22px; vertical-align:middle; margin-right: 0px; margin-left: -10px; margin-top: -5px; filter: brightness(0) invert(0); }
#rwdMenuWrap ul li a:hover { opacity: .7; }
#rwdMenuWrap .SubmenuDisplay { display: none; position: fixed; width: auto; margin: 0px; margin-left: 0px; padding: 15px; border-radius: 10px; background-color: #ea1313; box-shadow: 5px 5px 5px rgba(0,0,0,0.2); }
#rwdMenuWrap .SubmenuDisplay ul{ width: auto; }
#rwdMenuWrap .SubmenuDisplay ul li{ background-color: transparent; width: auto; display: block; border-bottom: 1px dotted #FA8F01; }
#rwdMenuWrap .SubmenuDisplay ul li a{ cursor: pointer; clear: both; background-color: transparent; color: #fff; border-radius: 5px; margin: 5px 0px 5px 0px; font-size: 18px; width: auto; display: block; text-align: left; }
#rwdMenuWrap .SubmenuDisplay ul li:nth-last-child(1){ border-bottom: 0px dotted #eee; }
#rwdMenuWrap .SubmenuDisplay ul li a:hover{ opacity: 1; background-color: #e74c3c; color: #fff; }
/*#rwdMenuWrap .SubmenuDisplay ul li a:hover{ opacity: 1; color: #112233; }*/
#rwdMenuWrap .SubmenuDisplay ul li:after { display: none; }
.OpenSubMenuHover:hover:after { content:' '!important; position: absolute!important; top:35px!important; left:20px; width: 20px!important; height: 2px!important; border: 0px!important; background-color: #ea1313!important; transform:translateX(0%)!important; }
.OpenSubMenuHover img{ width: 22px; height: auto;}

@media(max-width:1500px)
{
	/* TopMenu */
	.TopMenuBox{ /*width: 98%;height: auto;  margin: 0px 30px 0px;*/ margin-right: 30px; margin-left: 30px; display: block; }
	.LogoTop{ width: 110px; }
	.LogoTop img{ margin-top: 6px; }
	.MenuTop{ width: 55%; margin-left:30px;}
	.RightSearchBox input[type=text]{ width: 110px;}
	#rwdMenuWrap ul li a { margin: 0px 10px 0px 10px; font-size: 20px; }
	.OpenSubMenuHover:hover:after { /*left:10px;*/ }
}

@media(max-width:1280px)
{
	#rwdMenuWrap ul li a { margin: 0px 5px 0px 5px; font-size: 19px; }
	.OpenSubMenuHover:hover:after { top:33px!important; left:11px; }
}

@media(max-width:1200px)
{
	.MenuTop{ width: 55%; margin-left:20px; margin-top: 5px;}
	.LogoTop{ width: 90px; }
	.LogoTop img{ margin-top: 8px; /*margin-bottom: 5px;*/ }
	.RightMenuTop{ margin-top: 7px; }
	#rwdMenuWrap ul li a { padding: 5px 3px 5px 3px; font-size: 17px; }
	.OpenSubMenuHover:hover:after { top:30px!important; left:4px; }
	.RightSearchBox input[type=text]{ width: 100px;}
	#rwdMenuWrap .SubmenuDisplay { margin-left: -5px!important;}
}

@media(max-width:1023px)
{
	header{ overflow: hidden; height: 50px; }
	.header{ overflow: hidden; height: 50px; margin-top: 0px; }
	.headroom{ padding-top: 0px; top: 0; left: 0; right: 0;height: 50px; box-shadow: 0px 0px 5px rgba(0,0,0,0.2); }
	.headroom--pinned { position: fixed; top: 0px;}
	.headroom--unpinned { top: -90px;}
	.headroom--pinned #switchBtnArea #switchBtn{ position: absolute!important;}
	.headroom--unpinned #switchBtnArea #switchBtn{ position: absolute!important; }
	.headroom--unpinned #switchBtnArea #switchBtn.btnClose { position: absolute!important; }
	.headroom--top { width: 100%!important; height: 50px; overflow: hidden; margin-top: 0px; }

	/* TopMenu */
	.TopMenu{ width: 100%; height: 50px; margin: auto;}
	.TopMenuBox{ width: auto; margin: auto; display: inline;}
	.LogoTop{ width: 100%; display: inline-block; position: relative; margin-top: -25px; text-align: center; color: #fff;}
	.LogoTop img{ width:90px; margin-top: 12px; }
	.MenuTop{}
	.RightMenuTop{ display: none;}
	.RightCouponBox{ vertical-align: top; height: 40px; display: inline-block; text-align: right; margin-left: 15px; }
	.RightCouponBox a{ background-image: linear-gradient(150deg, #FA8F01 0%, #FA4707 100%); height: 28px; overflow: hidden; padding: 3px 5px 3px 5px; border-radius: 6px; color: #fff; letter-spacing: 0.5px; font-family: 'db_adman_xbold'; font-size: 17px;}
	.RightCouponBox img{ width: 18px; height: auto; vertical-align: middle; border-right: 1px dashed #eee; padding: 0px 5px 3px 0px; margin-right: 5px; }

	/* HambergerRight */
	.HambergerRight{ display: inline-block; position: fixed; right: 10px; margin-top: -2px; width: auto; height: 50px; line-height: 50px; text-align: center; color: #fff; }
	.MobileOthers{ display: inline-block; text-align: center; width: 100%; }
	.MobileOthers .RightSearchBox{ text-align: center; margin-top: 20px; }
	.MobileOthers .RightSearchBox input[type=text]{ width: 160px; padding: 10px 40px 12px 10px; font-size: 15px;}
	.MobileOthers .RightSearchBox button{ margin-left: -40px; padding: 0px 5px 10px 5px; vertical-align: middle;}
	.MobileOthers .RightSearchBox img{ width: 20px; vertical-align: middle; }
	.MobileOthers .RightCouponBox{ margin-top: 20px; }

	/* HanBarber Menu */
	#switchBtnArea { display: inline-block; position: relative; z-index: 99999999999; width: 26px; vertical-align: top; }
	#rwdMenuWrap { position: fixed!important; display: inline-block; top: 0!important; right: -100%; z-index: 99999999999; width: 100%; height: 100%; background: #262b42; }
	#rwdMenuWrap ul { margin-top: 50px!important; width: 100%!important; box-sizing: border-box!important; padding: 3px 12px 0!important; clear: both!important;  vertical-align: top!important; }
	#rwdMenuWrap ul li { position: relative!important; width: 100%!important; margin: 0px!important; padding: 0px!important; height: auto!important; border-bottom: 1px solid #575b6e; vertical-align: top!important; clear: both!important;}
	#rwdMenuWrap ul li a:after { position: absolute; top: 0; margin-top: 25px!important; right: 6px; width: 0; height: 0; margin: -3px 0 0 0; content: ""; border: 3px solid transparent; border-left: 4px solid #fff; vertical-align: top!important; }
	#rwdMenuWrap ul li a { padding: 10px 6px 10px 8px!important; display: block!important; margin: 0px!important; color: #fff!important; text-align: left; font-size: 20px; letter-spacing: .06rem; background: #262b42;  }
	#rwdMenuWrap ul li img{ width: 25px; vertical-align: text-bottom; margin-right: 0px; margin-left: -10px; filter: brightness(0) invert(1); }
	#rwdMenuWrap ul li a:hover { opacity: .7; }

	/* SubmenuDisplay */
	#rwdMenuWrap .SubmenuDisplay { position: relative!important; padding: 0px!important;}
	#rwdMenuWrap .SubmenuDisplay ul{ height: auto!important; margin: 0px!important; margin-top: 0px!important; padding: 0px!important; padding-left: 20px!important;  vertical-align: top; clear: both!important;}
	#rwdMenuWrap .SubmenuDisplay ul li { position: relative!important; width: 100%!important; height: auto!important; border-bottom: 1px solid #575b6e!important; vertical-align: top; clear: both!important; }
	#rwdMenuWrap .SubmenuDisplay ul li a { display: block!important; padding: 10px 6px 10px 8px!important; margin: 0px!important; color: #fff!important; text-align: left; font-size: 20px; letter-spacing: .06rem; background: #262b42!important; }
	#rwdMenuWrap .SubmenuDisplay ul li:nth-last-child(1) { border: none!important; display: block;}
	#rwdMenuWrap .SubmenuDisplay ul li::after { position: absolute!important; top: 50%!important; margin-top: 0px!important; right: 6px!important; width: 0!important; height: 0!important; margin: -3px 0 0 0!important; content: ""!important; border: 3px solid transparent!important; border-left: 4px solid #fff!important; }
	.OpenSubMenuHover:hover:after { display: none; }
	.OpenSubMenuHover img{ width: 25px; height: 25px;}
	.SubmenuDisplay { background-color: transparent!important; box-shadow: 5px 5px 5px rgba(0,0,0,0)!important; }
	.BreadcrumbTop ul li:last-child{ display: none; }
}

@media(min-width:1024px)
{
	.OpenSubMenuHover:hover .SubmenuDisplay { display: block!important; }
}

