/* ========================================================
Global Navigation Style Sheet
First Update 2018-02-08
Last  Update 2018-02-08
========================================================= */
/*=========================================================
#  Global Navigation for PC
==========================================================*/
.slicknav_menu { display: none; }
#gnav { display: block; }
.c-gnav { display: block; background: #463d1d; width: 480px; height: 50px; position: absolute; top: 17px; right: 290px; z-index: 100; }
.c-gnav > .c-gnav-level > ul { width: 480px; }
.c-gnav li.c-gnav-mn { padding-bottom: 15px; display: inline-block; }
.c-gnav li.c-gnav-mn > a { display: block; padding: 0 .8em; color: #fff!important; font-size: 10px; line-height: 1.2; letter-spacing: 0; text-align: center; box-shadow: 1px 0 rgba(255,255,255,.8); }
.c-gnav li.c-gnav-mn > a:hover, .c-gnav li.c-gnav-mn > a:active, .c-gnav li.c-gnav-mn > a:focus, .c-gnav li.c-gnav-mn > a.active { color: #ffe600!important; }
.c-gnav li.c-gnav-mn.r > a { box-shadow: 0 0 rgba(255,255,255,0); }
.c-gnav li.c-gnav-mn > a span { font-size: 160%; line-height: 1.2; letter-spacing: 0; }
.c-gnav li.c-gnav-mn > a span::after { content: "\A"; white-space: pre; }
.c-gnav li:not(.c-gnav-mn) { display: none; }
.c-gnav li.c-gnav-mn > .c-gnav-level { transition: all .2s ease-in; max-height: 0; opacity: 0; overflow: hidden; width: 100%; height: 0; left: 0; top: 68px; padding: 0 0 0 50%; position: fixed; background: rgba(255,230,0,.9); z-index: -1; }
.c-gnav li.c-gnav-mn:hover .c-gnav-level { height: 70px; max-height: 9999px; opacity: 1; z-index: 3; }
/* .c-gnav-sub */
.c-gnav-sub { display: flex; flex-flow: row nowrap; justify-content: center; width: 100%; margin-left: -50%; }
.c-gnav-sub li { width: 9em; height: 60px; padding: 1em 0; background: url(../images/common/icon-arrow-bottom-brown.svg) no-repeat center 67%/12px 8px; transition: background .3s; position: relative; }
.c-gnav-sub li:hover { background-position: center 80%; }
.c-gnav-sub li a { position: absolute; width: 100%; height: 100%; font-size: 90%; font-weight: 700; text-align: center; }
.c-gnav li.c-gnav-mn:hover .c-gnav-level .c-gnav-sub li { display: block; }
.c-gnav-sub li a:hover, .c-gnav-sub li a:active, .c-gnav-sub li a:focus, .c-gnav-sub li a.active { color: #463d1d!important; }

@media screen and (min-width:1200px) {
.c-gnav { width: 430px; right: 400px; }
.c-gnav > .c-gnav-level > ul { width: 530px; }
.c-gnav li.c-gnav-mn > a { line-height: 1; }
.c-gnav li.c-gnav-mn > a span { font-size: 190%; }
}

/*=========================================================
#  Global Navigation for SP
==========================================================*/
@media screen and (max-width:1023px) {
#gnav { display: none; }
.slicknav_menu { display: block; width: 100%; height: 0; padding: 20px; position: fixed; top: 0; z-index: 100; transition: all .3s linear; }
.slicknav_menu.open { height: 100vh; background: #463d1d; }
.slicknav_menu > .slicknav_nav > .c-gnav-level { position: relative; top: 50px; left: 0; border-top: 1px solid #fff; display: flex; flex-flow: column nowrap; height: 100vh; opacity: 0; }
.slicknav_menu.open > .slicknav_nav > .c-gnav-level { opacity: 1; }
.slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li { position: absolute; width: 47%; }
.slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(1), .slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(2), .slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(3), .slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(4), .slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(5) { left: 0; }
.slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(6), .slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(7), .slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(8), .slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(9), .slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(10), .slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(11), .slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(12), .slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(13) { right: 0; }
.slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(1) { top: 0!important; }
.slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(2) { top: 50px!important; }
.slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(3) { top: 225px!important; }
.slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(4) { top: 428px!important; }
.slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(5) { top: 475px!important; }
.slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(6) { top: 0!important; }
.slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(7) { top: 50px!important; }
.slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(8) { top: 100px!important; padding-bottom: 0; }
.slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(9) { top: 150px!important; }
.slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(10) { top: 200px!important; }
.slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(11) { top: 250px!important; }
.slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(12) { top: 395px!important; }
.slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li:nth-child(13) { top: 445px!important; }
.slicknav_menu > .slicknav_nav > .c-gnav-level > ul > li a { padding-bottom: .7em!important; }
.slicknav_menu.open * { display: block; }
.slicknav_menu li a { color: #fff; text-align: left; padding: 1.5em 0 .7em; border-bottom: 1px solid #fff; }
.slicknav_menu li a:hover, .slicknav_menu li a:active, .slicknav_menu li a:focus, .slicknav_menu li a.active, .slicknav_menu .c-gnav-sub li a:hover { color: #ffe000!important; }
.slicknav_menu .c-gnav-mn a span { display: none; }
.slicknav_menu .c-gnav-sub { margin: -1em 0 1.5em 0; }
.slicknav_menu .c-gnav-sub li { width: 95%; height: 30px; background: url(../images/common/icon-arrow-right-white.svg) no-repeat 6px 20px/11px 11px; padding: 0 0 .5em 2em; }
.slicknav_menu .c-gnav-mn, .slicknav_menu .c-gnav-level > ul > li:nth-child(11) { border-bottom: 1px solid #fff; }
.slicknav_menu .c-gnav-mn a, .slicknav_menu .c-gnav-level > ul > li:nth-child(11) a { border: none; }
.slicknav_item { display: none; }
/* Toggle Button */
.slicknav_btn { background: #463d1d; cursor: pointer; display: block; width: 50px; height: 50px; padding: 0; position: fixed; left: 10px; top: 10px; }
.slicknav_menu .slicknav_icon { float: left; margin: 0.188em 0 0 0.438em; }
.slicknav_menu .slicknav_icon-bar { background: #fff; display: block; height: 4px; border-radius: 2px; position: absolute; width: 40px; transition: all .35s ease-in-out; }
.slicknav_btn .slicknav_icon-bar + .slicknav_icon-bar { margin-top: .33em }
.slicknav_menu .slicknav_icon-bar:nth-child(1) { top: 12px; }
.slicknav_menu .slicknav_icon-bar:nth-child(2) { top: 19px; }
.slicknav_menu .slicknav_icon-bar:nth-child(3) { top: 30px; }
.slicknav_open .slicknav_icon-bar:nth-child(1) { top: 23px; -webkit-transform: rotate(315deg); transform: rotate(315deg); }
.slicknav_open .slicknav_icon-bar:nth-child(2) { width: 0; display: none; }
.slicknav_open .slicknav_icon-bar:nth-child(3) { top: 19px; -webkit-transform: rotate(-315deg); transform: rotate(-315deg); }
}