@charset "UTF-8";

/*
======== table of content. ===============
summary:ヘッダー・フッター
====================================
*/

/* ***** PC ***** */

/* ヘッダー */
header { position: relative; display: flex; justify-content: space-between; padding: 1% 3.2%; background: #939D25; align-items: center; z-index: 100; }
header.sec_anim_nopos { opacity: 1; transform: translatey(0); }

.header_logo { width:15.78%; }

/*ハンバーガー*/
.el_humburger { display: none; }

#gnavi { display: flex; justify-content: space-between; padding-right: 3rem; }

.pc .uq_spNavi,
.ipad .uq_spNavi { opacity: 1!important; }

.uq_spNavi li { font-size: 1.2rem; font-weight: 600; text-align: center; }
.uq_spNavi li a { position: relative; display: block; padding: 0 2em; color:#fff; }
.uq_spNavi li:last-child a { padding-right: 0; }

.uq_spNavi li a:hover { opacity: .6; transform: scale(1.05); }

.navi_jp,.navi_en { display: block; }
.navi_jp { font-size: .8vw; }
.navi_en { font-size: 1.6vw; font-family: 'Open Sans Condensed', sans-serif; }

/* フッター */
footer { padding:3.2% 7% 5.7%; background: #252d33; }
.footer_inner { display: flex; margin-left: 6.2%; margin-right: 6.2%; }

.footer_inner,
.footer_inner a,
.txt_copyright { color:#fff; }

.footer_identity a { text-decoration: underline; }
.footer_inner a:hover { opacity: .7; text-decoration: none; }

.footer_identity,
.footer_links { width:33%; }

.footer_links { margin-top: 7vw; }

.footer_identity h2,
.footer_identity p,
.footer_links li { margin-bottom: .3em; }

.logo_footer { width:34%; }

.pagetop { width:34%; margin-top: 7vw; text-align: right; }
.pagetop_icon { position: relative; display: inline-block; top:4px; width: 20px; height: 20px; margin: 0 0 0 1em; background: #fff; border-radius: 30px; }
.pagetop_icon::before { position: absolute; left: 0; top: 0; bottom: 0; right: 0; margin: 8px auto 0; content: ""; vertical-align: middle; width: 6px; height: 6px; border-top: 1px solid #252d33; border-right: 1px solid #252d33; transform: rotate(-45deg); }
.txt_copyright { margin-top: 2em; padding-top: 1em; border-top:1px solid #fff; font-size: 1rem; font-weight: 700; text-align: center; }

/* このページのトップへ */
.topagetop { position: fixed; display: none; opacity: 0; bottom:1.2vw; right: 2vw; }
.topagetop.fade { display: block; opacity: 1; animation-duration: 0.5s; animation-name: fade-in; }
@keyframes fade-in { 0% {display: none;opacity: 0;} 50% {display: block;opacity: 0;} 100% {display: block;opacity: 1;} }
.topagetop a { position: relative; display: block; width: 40px; height: 40px; background: #939D25; border-radius: 30px; }
.topagetop a::before { position: absolute; left: 0; top: 0; bottom: 0; right: 0; margin: 16px auto 0; content: ""; vertical-align: middle; width: 8px; height: 8px; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: rotate(-45deg); }
.topagetop a:hover { opacity: .7; }

/* ***** SP ***** */
@media screen and (max-width: 767px) {

/* ヘッダー */
header { position: fixed; width:100%; top:0; left: 0; height: 12vmin; padding: 1% 2%; }
.header_logo { width:30%; }

/*ハンバーガーボタン*/
.el_humburger { display: block; position: fixed; top: 2.6vw; right: 2vw; width: 40px; height: auto; box-sizing: border-box; z-index: 10000; transition: all 0.2s ease-in-out; cursor: pointer; pointer-events: auto; }
.el_humburger_inner { padding: 0 5px 2px; }
.el_humburger_inner > span { display: block; width: 100%; margin: 0 auto 5px; height: 1px; background: #fff; transition: all 0.2s ease-in-out; }
.el_humburger_inner > span:last-child { margin-bottom: 0; }

.js_humburgerOpen .el_humburger_inner > span { background:#939D25; }
.js_humburgerOpen .el_humburger_inner > span.top { transform: translateY(9px) rotate(-45deg); }
.js_humburgerOpen .el_humburger_inner > span.middle { opacity: 0; }
.js_humburgerOpen .el_humburger_inner > span.bottom { transform: translateY(-3px) rotate(45deg); }

.el_humburgerButton__close > span { display: block; width: 35px; margin: 0 auto; height: 4px; background: #fff; }
.el_humburgerButton__close > span.el_humburgerLineTop { transform: translateY(5px) rotate(-45deg); }
.el_humburgerButton__close > span.el_humburgerLineBottom { transform: translateY(-6px) rotate(45deg); }
.el_humburger p { margin-top: .1em; color:#fff; font-size: 0.7rem; text-align: center; }
.js_humburgerOpen .el_humburger p  { margin-top: .7em; color:#939D25; }


.uq_spNavi { display: none; background-color: rgba(255,255,255,.9); }

.uq_spNavi.js_appear { position: fixed; top: 0; left: 0; bottom: 0; right: 0; display: block; z-index: 9999; height: 100vh; }

.uq_spNavi_screen { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background-color: rgba(255, 255, 255, 0.98); z-index: 0; margin-top: 0px; padding-top: 0px; overflow: auto; -webkit-overflow-scrolling: touch; }

#gnavi { padding-top: 6em; flex-direction: column; justify-content: center; align-items: center; width:auto; margin: auto; }
#gnavi li { width:auto; margin: 0 5%; }
#gnavi li:last-child { }
#gnavi a { display: flex; justify-content: center; align-content: center; padding: 1em .5em; color:#939D25; }
#gnavi a:hover { opacity: .7; }

.navi_jp,.navi_en {  }
.navi_jp { margin: 0.3em 1em 0 0; font-size: 1.4rem; font-weight: 400; }
.navi_en { font-size: 2.2rem; }


/* フッター */
footer { padding:1em; }

.footer_inner { margin-left: 5%; margin-right: 5%; }

.footer_inner,
.footer_inner a,
.txt_copyright {  }

.footer_identity a {  }
.footer_inner a:hover {  }

.footer_identity { width:70%; }
.footer_links { width:30%; }


.footer_links { margin-top: 14vmin; }

.footer_identity h2,
.footer_identity p,
.footer_links li { margin-bottom: .3em; }

.logo_footer { width:34%; }

.pagetop { width: 100%; margin-top: 7vmin; text-align: right; }
.pagetop_icon {  }
.pagetop_icon::before {  }
.txt_copyright { }


/* このページのトップへ */
.topagetop { right: 2.66vw; transform: scale(0.825); }


@media screen and (orientation: landscape) {
/* ヘッダー */
.header_logo { width:20%; }
/*ハンバーガーボタン*/
.el_humburger { top: 1.5vw; }
#gnavi { padding-top:3em; }
#gnavi a {  padding: .5em; }
}
	
}


/* iPhone SE */
@media screen and (max-width: 320px) {
}




