@charset "UTF-8";

body { -webkit-text-size-adjust: none; -webkit-font-smoothing: antialiased; }

nav.sp_menu { display: none; position: fixed; width: 100%; height: 100vh; height: 100dvh; color:#000; background-color: #ffffff; z-index: 100; top: 0; left: 0; margin: 0; padding: 0 0 0 0; }
nav.sp_menu .sp_gnav { height: 100vh; height: 100dvh; display: flex; flex-direction: column; flex-wrap: wrap; justify-content: center; align-items:center; }
nav.sp_menu .sp_gnav>ul>li { font-size: 1.7em; line-height: 1em; margin:1em 0; }
nav.sp_menu .sp_gnav>ul>li>a { font-weight: bold; color:#000000; border-left: solid 0.3em #C79E7E; padding:0 0 0 0.75em; }
nav.sp_menu .sp_gnav>ul>li>ul { margin:1em 0 1.5em 0; }
nav.sp_menu .sp_gnav>ul>li>ul>li { font-size: 0.75em; line-height: 1.2em; margin:0.55em 0; display: flex; }
nav.sp_menu .sp_gnav>ul>li>ul>li>a { font-weight: bold; color:#000000; margin:0 0.75em 0 0; }
nav.sp_menu .sp_gnav>ul>li>ul>li>a:nth-child(2) { border-left:solid 1px #000; padding:0 0 0 0.75em; }
nav.sp_menu .sp_gnav>ul>li>ul>li>a:nth-child(3) { border-left:solid 1px #000; padding:0 0 0 0.75em; }
nav.sp_menu .sp_gnav>ul>li>ul>li>a span.sat { font-size: 0.8em; padding:0.1em; line-height: 1em; margin:0 0.25em; color:#ffffff; background-color:#C79E7E; }
nav.sp_menu .sp_gnav>ul>li>ul>li>a span.sun { font-size: 0.8em; padding:0.1em; line-height: 1em; margin:0 0.25em; color:#ffffff; background-color:#d43c17; }

nav.sp_menu .sp_gnav>ul>li.sns { margin:1.5em 0 0 0; display:flex; }
nav.sp_menu .sp_gnav>ul>li.sns a { border:none; margin:0; padding: 0; font-size: 2em; line-height: 1em; }
nav.sp_menu .sp_gnav>ul>li.sns a i { margin:0 0.5em 0 0; }

.menu_overlay { position: fixed; width: 100%; height: 100vh; height: 100dvh; top: 0; right: 0; border: solid 1.5em #FFEA00; background-color: #ffffff; opacity: 0.95; z-index: -1; }
.menu_btn { background-color: #C79E7E; width: 4.7em; height: 4.7em; position: fixed; overflow: visible; line-height: 1em; font-size: 1em; cursor: pointer; top: 0; right: 0; z-index: 100;  }
.menu_btn .line { position: fixed; background-color: #ffffff; overflow: hidden; z-index: 100; width: 2.5em; height: 0.15rem; right: 1em; }
.menu_btn .line:nth-child(1) { top: 1.5em; z-index: 2; }
.menu_btn .line:nth-child(2) { top: 2.25em; z-index: 2; }
.menu_btn .line:nth-child(3) { top: 3em; z-index: 2; }

.btn_wrapper { z-index: 99999; position: fixed; }
.btn_wrapper.clicked .menu_btn .line:nth-child(1) { -webkit-transform: translateY(0.75em) rotate(45deg); transform: translateY(0.75em) rotate(45deg); -webkit-transition: all 300ms ease-out 0ms; -moz-transition: all 300ms ease-out 0ms; -o-transition: all 300ms ease-out 0ms; transition: all 300ms ease-out 0ms; }
.btn_wrapper.clicked .menu_btn .line:nth-child(2) { opacity: 0; -webkit-transition: all 300ms ease-out 0ms; -moz-transition: all 300ms ease-out 0ms; -o-transition: all 300ms ease-out 0ms; transition: all 300ms ease-out 0ms; }
.btn_wrapper.clicked .menu_btn .line:nth-child(3) { -webkit-transform: translateY(-0.75em) rotate(-45deg); transform: translateY(-0.75em) rotate(-45deg); -webkit-transition: all 300ms ease-out 0ms; -moz-transition: all 300ms ease-out 0ms; -o-transition: all 300ms ease-out 0ms; transition: all 300ms ease-out 0ms; }