@charset "utf-8";

/* ===================================================================
css information

File Name  : footer.css
Author     :
Style Info : フッター
=================================================================== */

/*********************************************************************

#footer-menu

*********************************************************************/

#g-footer #footer-menu { background:#f7a2ba; color:#fff; font-size:13px; line-height:1.3; }
#g-footer #footer-menu a { display:block; color:inherit !important; text-decoration:none; }
#g-footer #footer-menu .footer-menu--inner { width:100%; max-width:1200px; margin:0 auto; padding:40px 15px 10px 15px; }
#g-footer #footer-menu .footer-menu--pickup { text-align:center; margin-bottom:40px; }
#g-footer #footer-menu .footer-menu--pickup > * { max-width:260px; }
#g-footer #footer-menu .footer-menu--pickup a { padding:12px 0; border:1px solid #fff; }
#g-footer #footer-menu .footer-menu--hl { border-bottom:1px solid #fff; font-size:13px; margin-bottom:10px; padding-bottom:6px; }
#g-footer #footer-menu .footer-menu--category { margin-left:-10px; margin-right:-10px; }
#g-footer #footer-menu .footer-menu--category--item { margin-bottom:30px; padding-left:10px; padding-right:10px; }
#g-footer #footer-menu .footer-menu--category li { font-size:11px; }
#g-footer #footer-menu .footer-menu--hl-sub,
#g-footer #footer-menu .footer-menu--category li a { padding:5px 0; position:relative; }
#g-footer #footer-menu .footer-menu--category li ul li a { padding-left:1em; }
#g-footer #footer-menu .footer-menu--hl-sub { padding-right:22px; cursor:pointer; }
#g-footer #footer-menu .footer-menu--hl-sub:before { content: ''; position:absolute; width:14px; height:8px; top:50%; right:0; margin-top: -4px; background:url(/jp/ja/template/default/img/arrow_w@2x.png) no-repeat center center; background-size:100% 100%;
-webkit-transition: -webkit-transform 0.3s ease;
transition: transform 0.3s ease;
}
#g-footer #footer-menu .footer-menu--hl-sub.collapse-active:before { -webkit-transform: rotate(180deg); transform: rotate(180deg); }

@media (min-width:769px) {
#g-footer #footer-menu .footer-menu--hl { cursor:default; }
#g-footer #footer-menu .footer-menu--hl + ul { display:block !important; height:auto !important; }
}

/* SP --------------------------------*/
@media (max-width:768px) {
#g-footer #footer-menu .footer-menu--inner { padding:20px 15px 15px 15px; }
#g-footer #footer-menu .footer-menu--pickup { margin-bottom:15px; }
#g-footer #footer-menu .footer-menu--pickup > * { max-width:100%; margin-bottom:10px; }
#g-footer #footer-menu .footer-menu--pickup > *:last-child { margin-bottom:0 !important; }
#g-footer #footer-menu .footer-menu--pickup a { width:100%; padding:10px 0; }
#g-footer #footer-menu .footer-menu--hl { border-bottom:0; font-size:13px; margin-bottom:0; padding-top:10px; padding-bottom:10px; cursor:pointer; position:relative; }
#g-footer #footer-menu .footer-menu--hl:before { content: ''; position:absolute; width:14px; height:8px; top:50%; right:0; margin-top: -4px; background:url(/jp/ja/template/default/img/arrow_w@2x.png) no-repeat center center; background-size:100% 100%;
-webkit-transition: -webkit-transform 0.3s ease;
transition: transform 0.3s ease; }
#g-footer #footer-menu .footer-menu--hl.collapse-active:before { -webkit-transform: rotate(180deg); transform: rotate(180deg); }
#g-footer #footer-menu .footer-menu--category--item { margin-bottom:0; }
#g-footer #footer-menu .footer-menu--category li { font-size:12px; }
#g-footer #footer-menu .footer-menu--hl-sub,
#g-footer #footer-menu .footer-menu--category li a { padding:6px 0 6px 1em; }
}

/*********************************************************************

#footer-bottom

*********************************************************************/

#g-footer .footer-bottom--inner { padding:0 15px; }
#g-footer #footer-bottom { text-align:center; font-size:12px; line-height:1.3; }
#g-footer #footer-bottom a { color:inherit !important; text-decoration:none; }
#g-footer #footer-bottom img { width:100%; }
#g-footer #footer-bottom--logo { width:240px; margin:0 auto 20px; }
#g-footer #footer-bottom .about { display:inline-block; font-size:11px; text-decoration:underline; }
#g-footer #footer-bottom--social { margin:20px -5px; }
#g-footer #footer-bottom--social > * { padding-left:5px; padding-right:5px; }
#g-footer #footer-bottom--social a { display:block; width:44px; }
#g-footer #footer-bottom--menu { padding-bottom:5px; letter-spacing:-.4em; }
#g-footer #footer-bottom--menu ul > * { display:inline-block; letter-spacing:normal; padding:0 10px; margin-bottom:10px; }
#g-footer #footer-bottom--menu ul .br-block { height:0; padding:0; margin:0; display:block; }
#g-footer #footer-bottom--top { padding-top:40px; padding-bottom:30px; }
#g-footer #footer-bottom--bottom { height:50px; background:#99d3d2; font-size:12px; color:#fff; }
#g-footer #footer-bottom--bottom .copyright { padding:0 15px; }
#g-footer #page-top { position:fixed; bottom:10px; right:10px; width:50px; opacity:0; visibility:hidden; z-index:99;
-webkit-transition: opacity .5s ease, visibility .5s ease;
transition: opacity .5s ease, visibility .5s ease;
}
#g-footer #page-top.visible { opacity:1; visibility:visible; }
#g-footer #page-top a { display:block; }
#g-footer #page-top .evcp-btn { margin-top:6px; display:none; }

/* SP --------------------------------*/
@media (max-width:768px) {
#g-footer #footer-bottom a { display:block; }
#g-footer #footer-bottom--logo { width:180px; margin-bottom:15px; }
#g-footer #footer-bottom .about { font-size:12px; }
#g-footer #footer-bottom--social { margin-top:20px; margin-bottom:15px; }
#g-footer #footer-bottom--social a { width:40px; }
#g-footer #footer-bottom--menu { padding-bottom:15px; letter-spacing:normal; }
#g-footer #footer-bottom--menu a { padding:8px 0; }
#g-footer #footer-bottom--menu ul > * { display:block; padding:0; margin-bottom:0; }
#g-footer #footer-bottom--menu ul .br-block { display:none; }
#g-footer #footer-bottom--top { padding-top:30px; padding-bottom:20px; }
#g-footer #footer-bottom--bottom { height:32px; font-size:10px; }
#g-footer #page-top { width:46px; height:; bottom:32px; }
}
