@charset "UTF-8";
/* ### mixin.scss ### */
.companyInfo { background: #f7f5f0; }
.companyInfo * { box-sizing: border-box; }
.companyInfo a:hover { text-decoration: none; opacity: 0.8; }
.companyInfoInner { width: 960px; max-width: 100%; margin: 0 auto; padding: 10px 0; display: flex; line-height: 1.4; font-size: 13px; }
.companyInfo h3 { color: #f9423a; font-size: 15px; font-weight: bold; width: 180px; align-items: center; display: flex; }
.companyInfo h3 img { width: 24px; height: 24px; margin-right: 15px; }
.companyInfo ul { padding-left: 10px; }
.companyInfo ul li:hover { opacity: 0.8; }
.companyInfo ul li dl { padding: 3px 0 3px 8px; margin-left: 15px; display: flex; position: relative; }
.companyInfo ul li dl:before { border-right: 2px solid #ef463d; border-top: 2px solid #ef463d; box-sizing: content-box; height: 6px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg); width: 6px; position: absolute; top: 0; bottom: 0; left: -15px; margin: auto; content: ""; vertical-align: middle; }
.companyInfo ul li dl dt { width: 120px; color: #f9423a; }
.companyInfoMore { width: 960px; max-width: 100%; margin: 0 auto; }
.companyInfoMore a { color: red; margin: 0 auto 10px 180px; display: inline-block; font-size: 13px; padding: 0 10px 3px; }

@media (max-width: 657px) { .companyInfo { background: white; border-bottom: solid 1px #d2d2d2; }
  .companyInfoInner { width: 100%; flex-direction: column; padding: 10px 4%; }
  .companyInfo h3 { justify-content: center; margin-bottom: 5px; width: auto; font-size: 13px; }
  .companyInfo h3 img { width: 15px; }
  .companyInfo ul { padding-left: 0; }
  .companyInfo ul li { flex-direction: column; font-size: 12px; }
  .companyInfo ul li dt { min-width: 120px; display: none; }
  .companyInfoMore { width: 100%; text-align: center; }
  .companyInfoMore a { margin: 0 auto 10px; padding: 0; text-align: center; } }
.headerCommon { background: white; }
.headerCommon * { box-sizing: border-box; vertical-align: bottom; }
.headerCommon a:hover { text-decoration: none; opacity: 0.8; }
.headerCommon .pc { display: block; }
.headerCommon .sp { display: none; }
.headerCommon .width960 { width: 100%; max-width: 960px; margin: 0 auto; }
.headerCommon .redZone { background: #f9423a; }
.headerCommon .redZone .width960 { display: flex; align-items: center; height: 50px; justify-content: space-between; }
.headerCommon .redZone .width960 ul { display: flex; align-items: center; }
.headerCommon .redZone .width960 ul li { display: block; }
.headerCommon .redZone .width960 ul li img { vertical-align: middle; margin-right: 10px; }
.headerCommon .redZone .width960 ul .mypage a { background: white; border-radius: 4px; color: #333333; height: 30px; display: flex; align-items: center; padding: 0 15px; }
.headerCommon .redZone .width960 ul li + li { margin-left: 25px; }
.headerCommon .redZone .width960 a { color: white; display: block; width: 100%; height: auto; }
.headerCommon .whiteZone .width960 { display: flex; }
.headerCommon .whiteZone .width960 > div { display: block; border-right: solid 1px #d2d2d2; padding: 15px 20px; width: 16.7%;}
.headerCommon .whiteZone .width960 > div:nth-of-type(1) { border-left: solid 1px #d2d2d2; }
.headerCommon .whiteZone .width960 .globalMenu a { display: flex; flex-direction: column; justify-content: center; height: 100%; align-items: center; font-weight: normal; }
.headerCommon .whiteZone .width960 .globalMenu img { margin-top: auto; }
.headerCommon .whiteZone .width960 .globalMenu span { margin: 15px 0 0; }
.headerCommon .whiteZone .width960 ul { margin: auto auto auto 30px; }
.headerCommon .whiteZone .width960 ul li + li { margin-top: 5px; }
.headerCommon .whiteZone .width960 ul .goto:before { content: ""; width: 10px; height: 10px; border-radius: 100px; background: #00bfa5; display: inline-block; margin-right: 10px; }
@media screen and (max-width: 959px) { .headerCommon .width960 { padding: 0 2%; }
  .headerCommon .redZone .width960 ul { font-size: 0; }
  .headerCommon .redZone .width960 ul .mypage { font-size: 13px; }
  .headerCommon .whiteZone .width960 ul { display: none; } }
@media screen and (max-width: 657px) { .headerCommon .pc { display: none; }
  .headerCommon .sp { display: block; }
  .headerCommon .spNavi { background-color: #ffffff; height: 55px; left: 0; padding: 7px 2%; position: fixed; top: 0; width: 100%; z-index: 100; border-bottom: 1px #d2d2d2 solid; }
  .headerCommon .spNavi .left { display: inline-block; float: left; margin-left: 0; padding: 0; width: 65px; }
  .headerCommon .spNavi .logo img { height: 40px; width: auto; position: relative; margin: 0; }
  .headerCommon .spNavi .right { float: right; padding-top: 0; width: 220px; font-size: 0; }
  .headerCommon .spNavi .right .head_fav, .headerCommon .spNavi .right .head_history, .headerCommon .spNavi .spTel, .headerCommon .spNavi .menu { width: 60px; background: none; border: none; height: 40px; margin: 0; display: inline-block; float: none; position: relative; vertical-align: top; text-align: center; }
  .headerCommon .spNavi .menu { width: 40px; padding: 0; }
  .headerCommon .spNavi .head_history a img { margin-top: 0; width: auto; height: 25px; }
  .headerCommon .spNavi .head_fav a img { margin-top: 0; width: auto; height: 28px; }
  .headerCommon .spNavi .spTel img { height: 22px; width: auto; }
  .headerCommon .spNavi .head_fav .fav_cap, .headerCommon .spNavi .head_history .history_cap, .headerCommon .spNavi .spTel .tel_cap, .headerCommon .spNavi .menu .menu_cap { font-size: 10px; color: #333; position: absolute; bottom: 0; left: 0; right: 0; line-height: 1; vertical-align: bottom; } }

/* スマホヘッダー　ドロワーメニュー
-------------------------------------- */
#menuBtn, .drawer-nav { display: none; }

@media screen and (max-width: 657px) { #menuBtn, .drawer-nav { display: block; }
  .drawer-open { overflow: hidden !important; width: 100%; height: 100%; }
  .drawer-nav { position: fixed; z-index: 9999; top: 0; width: 85%; height: 100%; background: #63666a; color: #fff; font-size: 15px; overflow-y: auto; overflow-scrolling: touch; -webkit-overflow-scrolling: touch; right: -85%; -webkit-transition: right 0.6s cubic-bezier(0.19, 1, 0.22, 1); transition: right 0.6s cubic-bezier(0.19, 1, 0.22, 1); }
  .drawer-nav a { padding: 10px 15px; display: block; background: #ffffff; box-sizing: border-box; }
  .drawer-nav a:after { border-right: 2px solid #d2d2d2; border-top: 2px solid #d2d2d2; box-sizing: content-box; height: 6px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg); width: 6px; position: absolute; top: 0; bottom: 0; right: 12px; margin: auto; content: ""; vertical-align: middle; }
  .drawer-nav dl { display: flex; flex-wrap: wrap; }
  .drawer-nav ul { font-size: 0; }
  .drawer-nav dt { padding: 12px 15px; font-weight: bold; background-color: #f9423a; position: relative; min-height: 43px; width: 100%; box-sizing: border-box; }
  .drawer-nav dt a { background: none; border: none; color: white; width: 100%; height: 100%; position: absolute; display: block; top: 0; left: 0; padding: 12px 15px; }
  .drawer-nav dt a:after { border-right: 2px solid #ffffff; border-top: 2px solid #ffffff; }
  .drawer-nav .user dt, .drawer-nav .contents_menu dt { background-color: #63666a; }
  .drawer-nav dd, .drawer-nav li { width: 100%; position: relative; border-bottom: 1px #d2d2d2 solid; box-sizing: border-box; }
  .drawer-nav .contents_menu dd, .drawer-nav li { width: 50%; font-size: 12px; }
  .drawer-nav .contents_menu dd a, .drawer-nav li a { padding: 15px 10px; }
  .drawer-nav .contents_menu dd:nth-of-type(2n) { border-left: solid 1px #d2d2d2; }
  .drawer-nav li a { background: #d2d2d2; border-bottom: 1px #ffffff solid; line-height: 1.5; }
  .drawer-nav dd.mypage a { color: #f9423a; }
  .drawer-nav dd.mypage a span { font-size: 10px; }
  .drawer-nav li.sale a, .drawer-nav .contents_menu dd.sale a { color: #f9423a; }
  .drawer-brand { font-size: 1.5rem; font-weight: bold; line-height: 3.75rem; display: block; padding-right: .75rem; padding-left: .75rem; text-decoration: none; color: #222; }
  .drawer-menu { margin: 0; padding: 0; list-style: none; }
  .drawer-menu-item { font-size: 1rem; display: block; padding: .75rem; text-decoration: none; color: #222; }
  .drawer-menu-item:hover { text-decoration: underline; color: #555; background-color: transparent; }
  .drawer-overlay { position: fixed; z-index: 9998; top: 0; left: 0; display: none; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.7); }
  .drawer-open .drawer-overlay { display: block; }
  .drawer.drawer-open .drawer-nav, .drawer.drawer-open .drawer-navbar .drawer-hamburger { right: 0; }
  .drawer.drawer-open .drawer-hamburger { right: 85%; opacity: 1; }
  .drawer.drawer-open .drawer-hamburger .drawer-hamburger-icon:before, .drawer.drawer-open .drawer-hamburger .drawer-hamburger-icon:after { background-color: #ffffff; }
  body .drawer-hamburger { right: 3%; top: 7px; }
  .drawer-hamburger { position: fixed; z-index: 9999; top: 0; display: block; box-sizing: content-box; -webkit-transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1); transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); border: 0; outline: 0; background-color: transparent; width: 25px; height: 40px; padding: 0; margin: 0 7.5px; }
  .drawer-hamburger:hover { cursor: pointer; background-color: transparent; }
  .drawer-hamburger-icon { position: absolute; display: block; top: 10px; left: 0; right: 0; }
  .drawer-hamburger-icon, .drawer-hamburger-icon:before, .drawer-hamburger-icon:after { width: 25px; height: 2px; -webkit-transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1); transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1); background-color: #f9423a; margin: 0 auto; }
  .drawer-hamburger-icon:before, .drawer-hamburger-icon:after { position: absolute; top: -7px; left: 0; content: ' '; }
  .drawer-hamburger-icon:after { top: 7px; }
  .drawer-open .drawer-hamburger-icon { background-color: transparent; }
  .drawer-open .drawer-hamburger-icon:before, .drawer-open .drawer-hamburger-icon:after { top: 0; }
  .drawer-open .drawer-hamburger-icon:before { -webkit-transform: rotate(45deg); transform: rotate(45deg); }
  .drawer-open .drawer-hamburger-icon:after { -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
  .sr-only { position: absolute; overflow: hidden; clip: rect(0, 0, 0, 0); width: 1px; height: 1px; margin: -1px; padding: 0; border: 0; }
  .sr-only-focusable:active, .sr-only-focusable:focus { position: static; overflow: visible; clip: auto; width: auto; height: auto; margin: 0; } }
.bnrArea { position: sticky; top: 0; z-index: 999; }
@media screen and (min-width: 658px) { .bnrArea .pc { display: block; }
  .bnrArea .sp { display: none; } }
@media screen and (max-width: 657px) { .bnrArea { top: 55px; }
  .bnrArea .pc { display: none; }
  .bnrArea .sp { display: block; } }
.bnrArea.is-none { display: none; }

/*# sourceMappingURL=header.css.map */
