@charset "UTF-8";

.btn_wrapper { z-index: 9999999; position: fixed; top:0; left:0; }
.btn_wrapper .menu_btn { position:relative; width: 6rem; height: 3rem; background-color: #fff; overflow: visible; line-height: 1em; font-size: 1px; cursor: pointer; }
.btn_wrapper .menu_btn .line { position: absolute; background-color: #333; overflow: hidden; z-index: 9999999; width: 4rem; height: 1px; top: 0; left: 1rem; }
.btn_wrapper .menu_btn { -webkit-transition: all 400ms ease-out 0ms; -moz-transition: all 400ms ease-out 0ms; -o-transition: all 400ms ease-out 0ms; transition: all 400ms ease-out 0ms; }
.btn_wrapper .menu_btn .line { -webkit-transition: all 400ms ease-out 0ms; -moz-transition: all 400ms ease-out 0ms; -o-transition: all 400ms ease-out 0ms; transition: all 400ms ease-out 0ms; }
.btn_wrapper .menu_btn .line:nth-child(1) { top: 1rem; z-index: 2; }
.btn_wrapper .menu_btn .line:nth-child(2) { top: 1.45rem; z-index: 2; }
.btn_wrapper .menu_btn .line:nth-child(3) { top: 1.9rem; z-index: 2; }
.btn_wrapper.clicked .menu_btn .line:nth-child(1) { -webkit-transform: translateY(0.45rem) rotate(0.45rem); transform: translateY(0.45rem) rotate(20deg); }
.btn_wrapper.clicked .menu_btn .line:nth-child(2) { opacity: 0; }
.btn_wrapper.clicked .menu_btn .line:nth-child(3) { -webkit-transform: translateY(-0.45rem) rotate(-0.45rem); transform: translateY(-0.45rem) rotate(-20deg);  }

.menu_overlay { position: fixed; width: 100%; height: 100vh; top: 0; z-index: -1; background-color: #ffffff; opacity: 0; }

.cMenu { display:none; color: #333; background-color: #dddddd; opacity: 0.5; position: fixed; width: 100%; height: 100vh; top: 0; z-index: 9999; left: 0; text-align: left; }
.cMenu .cMenu__inner { width: 100%; display:flex; flex-direction: row; justify-content: space-between; align-items: flex-end; margin:auto auto 6rem auto; padding: 0 6rem; }
.cMenu .cMenu__inner .cMenu--gnav:nth-child(1) { width: 35%; }
.cMenu .cMenu__inner .cMenu--gnav:nth-child(2) { width: 35%; }
.cMenu .cMenu__inner .cMenu--gnav li { font-size: 1.1rem; line-height: 2.5em; width: 100%; margin:0.75em 0; }
.cMenu .cMenu__inner .cMenu--gnav li a { display:block; width: 100%; display:flex; justify-content: flex-start; justify-content: space-between; }
.cMenu .cMenu__inner .cMenu--gnav li a span:nth-child(1) { font-size: 1.6em; }
.cMenu .cMenu__inner .cMenu--gnav li a span:nth-child(2) { font-size: 1.1em; letter-spacing: 0.05em; }
.cMenu .cMenu__inner .cMenu--gnav li.cMenu--contactus {  }
.cMenu .cMenu__inner .cMenu--gnav li.cMenu--terms { margin-top:2rem; }
.cMenu .cMenu__inner .cMenu--gnav li.cMenu--terms,
.cMenu .cMenu__inner .cMenu--gnav li.cMenu--privacy { font-size: 0.9rem;line-height: 2.4em; }
.cMenu .cMenu__inner .cMenu--sns { margin:1em 0 0 0; display:flex; flex-direction: column; justify-content: flex-start; justify-content: flex-start; align-items: center; text-align: left; }
.cMenu .cMenu__inner .cMenu--sns li { width:2.4rem; margin: 1rem 0; }

@media screen and (min-width: 1681px) {
  .btn_wrapper { left: calc((100vw - 1680px) / 2); }
  .cMenu { padding-left: calc((100vw - 1680px) / 2); padding-right: calc((100vw - 1680px) / 2); }
}

/* tb */
@media screen and (max-width: 1024px) and (orientation: portrait) {
.cMenu { width: 100%; }
.cMenu .cMenu__inner { flex-direction: column; padding: 0 6rem 6rem 6rem; }
.cMenu .cMenu__inner .cMenu--gnav:nth-child(1),
.cMenu .cMenu__inner .cMenu--gnav:nth-child(2) { width:100%; margin:0 0 2rem 0; }
.cMenu .cMenu__inner .cMenu--gnav li { font-size: 1.6rem; line-height: 2.2em; }
.cMenu .cMenu__inner .cMenu--gnav li.cMenu--terms,
.cMenu .cMenu__inner .cMenu--gnav li.cMenu--privacy { font-size:1rem; }
.cMenu .cMenu__inner .cMenu--sns { flex-direction: row; margin: 3rem 0 0 0; }
.cMenu .cMenu__inner .cMenu--sns li { width:3rem; margin: 0 0 0 2rem; }
}

/* sp */
@media screen and (max-width: 600px) {

.btn_wrapper { z-index: 9999999; position: fixed; top:0; left:0; }
.btn_wrapper .menu_btn { position:relative; width: 6rem; height: 3.75rem; background-color: #fff; overflow: visible; line-height: 1em; font-size: 1px; cursor: pointer; }
.btn_wrapper .menu_btn .line { position: absolute; background-color: #333; overflow: hidden; z-index: 9999999; width: 4rem; height: 1px; top: 0; left: 1rem; }
.btn_wrapper .menu_btn { -webkit-transition: all 400ms ease-out 0ms; -moz-transition: all 400ms ease-out 0ms; -o-transition: all 400ms ease-out 0ms; transition: all 400ms ease-out 0ms; }
.btn_wrapper .menu_btn .line { -webkit-transition: all 400ms ease-out 0ms; -moz-transition: all 400ms ease-out 0ms; -o-transition: all 400ms ease-out 0ms; transition: all 400ms ease-out 0ms; }
.btn_wrapper .menu_btn .line:nth-child(1) { top: 1.35rem; z-index: 2; }
.btn_wrapper .menu_btn .line:nth-child(2) { top: 1.8rem; z-index: 2; }
.btn_wrapper .menu_btn .line:nth-child(3) { top: 2.25rem; z-index: 2; }
.btn_wrapper.clicked .menu_btn .line:nth-child(1) { -webkit-transform: translateY(0.45rem) rotate(0.45rem); transform: translateY(0.45rem) rotate(20deg); }
.btn_wrapper.clicked .menu_btn .line:nth-child(2) { opacity: 0; }
.btn_wrapper.clicked .menu_btn .line:nth-child(3) { -webkit-transform: translateY(-0.45rem) rotate(-0.45rem); transform: translateY(-0.45rem) rotate(-20deg);  }

.cMenu { display:none; color: #333;  position: fixed; width: 100%; height: 100vh; top: 0; z-index: 9999; left: 0; text-align: left; }
.cMenu .cMenu__inner { width: 100%;  display:flex; flex-direction: column; align-items: center; margin:auto; padding: 2rem 2rem 0 2rem; }
.cMenu .cMenu__inner .cMenu--gnav:nth-child(1),
.cMenu .cMenu__inner .cMenu--gnav:nth-child(2) { width: 100%; margin: 0 0 1rem 0; }
.cMenu .cMenu__inner .cMenu--gnav li { font-size: 1rem; line-height: 2.2em; width: 100%; margin:0 0 0.75em 0; }
.cMenu .cMenu__inner .cMenu--gnav li a { display:block; width: 100%; display:flex; justify-content: flex-start; justify-content: space-between; }
.cMenu .cMenu__inner .cMenu--gnav li a span:nth-child(1) { font-size: 1.7em; }
.cMenu .cMenu__inner .cMenu--gnav li a span:nth-child(2) { font-size: 1em; letter-spacing: 0.03em; }
.cMenu .cMenu__inner .cMenu--gnav li.cMenu--contactus { margin-bottom:1rem; }
.cMenu .cMenu__inner .cMenu--gnav li.cMenu--terms { margin-top:2rem; }
.cMenu .cMenu__inner .cMenu--gnav li.cMenu--terms,
.cMenu .cMenu__inner .cMenu--gnav li.cMenu--privacy { font-size: 0.75rem; }
.cMenu .cMenu__inner .cMenu--sns { width:100%; margin:1rem 0 0 0; display:flex; justify-content: flex-end; align-items: center; text-align: left; }
.cMenu .cMenu__inner .cMenu--sns li { width:2.2rem; margin: 0 0 0 2rem; }

}