@charset "UTF-8";
/* ---------------------------------------------------------------------
Stylesheet for pitarage.jp
FileName: layout.scss
--------------------------------------------------------------------- */
/* import */
/* ---------------------------------------------------------------------
Stylesheet for pitarage.jp
FileName: _config.scss
--------------------------------------------------------------------- */
/* 画像パス */
/* メディアクエリ */
/* 色設定 */
body { font-family: -apple-system,BlinkMacSystemFont,"游ゴシック Medium","Yu Gothic Medium","游ゴシック体",YuGothic,"Hiragino Kaku Gothic ProN","Helvetica Neue",Meiryo,sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; word-break: break-all; }

iframe { border: none; }

#wrapper { /* レイアウト設定 - LOGINTOP */ }
#wrapper .common_logo a { margin-top: 10px; margin-left: 10px; width: 150px; height: 24px; background: url(/image/common/logo_sp.png) no-repeat center center; -moz-background-size: 150px auto; -o-background-size: 150px auto; -webkit-background-size: 150px auto; background-size: 150px auto; position: relative; text-align: left; padding: 32px 0 0 0; }
@media screen and (min-width: 768px) { #wrapper .common_logo a { margin-top: 0; margin-left: 0; margin-bottom: 0; width: 220px; height: auto; padding-top: 140px; text-align: center; background: url(/image/common/logo_pc.png) no-repeat center 20px; -moz-background-size: 96px auto; -o-background-size: 96px auto; -webkit-background-size: 96px auto; background-size: 96px auto; } }
#wrapper .common_logo a .small { font-size: 12px; display: block; line-height: 1.2; word-wrap: break-word; }
@media screen and (min-width: 768px) { #wrapper .common_logo a .small { padding-right: 12px; margin: auto; width: 180px; } }
#wrapper .common_logo a.pc { display: none; }
@media screen and (min-width: 768px) { #wrapper .common_logo a.pc { display: block; } }
#wrapper .common_logo a.sp { display: block; }
@media screen and (min-width: 768px) { #wrapper .common_logo a.sp { display: none; } }
#wrapper .navbar-toggle { margin: 0; border: none; background: #1e2855; border-radius: 0; width: 64px; height: 64px; padding-left: 0; padding-right: 0; text-align: center; padding: 12px 10px 6px; position: relative; }
#wrapper .navbar-toggle:after { content: 'MENU'; color: #fff; display: block; font-weight: bold; text-align: center; margin-top: 4px; font-size: 10px; }
#wrapper .navbar-toggle .icon-bar { width: 22px; background: #fff; margin: auto; }
#wrapper .navbar-toggle .icon-bar + .icon-bar { margin-top: 6px; }
#wrapper .navbar-toggle.active { overflow: hidden; }
#wrapper .navbar-toggle.active .icon-bar { position: absolute; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); margin: auto; top: 0; bottom: 15px; left: 0; right: 0; }
#wrapper .navbar-toggle.active .icon-bar + .icon-bar { display: none; }
#wrapper .navbar-toggle.active .icon-bar + .icon-bar + .icon-bar { display: block; -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
#wrapper .navbar-toggle.active:after { content: 'CLOSE'; margin-top: 19px; }
#wrapper .navbar { min-height: 64px; }
#wrapper .navbar-default { background: #fff; border: none; }
@media screen and (min-width: 768px) { #wrapper .navbar-default { width: 220px; float: left; } }
#wrapper .navbar-default .sidebar { width: 100%; position: absolute; }
#wrapper .navbar-default .sidebar .sidebar-nav { border: none; }
@media screen and (min-width: 768px) { #wrapper .navbar-default .sidebar .sidebar-nav { height: auto !important; } }
#wrapper .navbar-default .sidebar .sidebar-nav .user-name { padding: 15px 20px; margin: 0; background: #384374; color: #fff; }
#wrapper .navbar-default .sidebar .sidebar-nav .user-name span { font-size: 12px; }
@media screen and (min-width: 768px) { #wrapper .navbar-default .sidebar .sidebar-nav .user-name { padding: 20px 20px 10px; background: none; color: #1a1a1a; } }
#wrapper .navbar-default .sidebar .sidebar-nav .sp-menu-close { width: 100%; border: none; display: block; background: #1e2855; color: #fff; text-align: center; padding: 15px; border-radius: 0; }
#wrapper .navbar-default .sidebar .sidebar-nav .sp-menu-close span { padding-left: 20px; position: relative; }
#wrapper .navbar-default .sidebar .sidebar-nav .sp-menu-close span:before { content: ''; position: absolute; width: 13px; height: 1px; background: #fff; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); top: 0; bottom: 0; left: 0; margin: auto; }
#wrapper .navbar-default .sidebar .sidebar-nav .sp-menu-close span:after { content: ''; position: absolute; width: 13px; height: 1px; background: #fff; -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); top: 0; bottom: 0; left: 0; margin: auto; }
@media screen and (min-width: 768px) { #wrapper .navbar-default .sidebar .sidebar-nav .sp-menu-close { display: none; } }
#wrapper .navbar-default .sidebar ul li { border: none; }
#wrapper .navbar-default .sidebar ul li a { color: #fff; padding: 20px 15px; position: relative; background: #1e2855; }
#wrapper .navbar-default .sidebar ul li a:hover, #wrapper .navbar-default .sidebar ul li a:focus, #wrapper .navbar-default .sidebar ul li a.active { background: #1e2855; }
#wrapper .navbar-default .sidebar ul li a:after { margin: auto; border-top: 1px solid #fff; border-right: 1px solid #fff; width: 8px; height: 8px; content: ""; position: absolute; top: 0; right: 15px; bottom: 0; left: auto; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); }
#wrapper .navbar-default .sidebar ul li a.opened:after { bottom: 2px; -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); }
#wrapper .navbar-default .sidebar ul li a .lnr { font-size: 18px; padding-right: 10px; display: inline-block; vertical-align: middle; }
#wrapper .navbar-default .sidebar ul li a .ic-jpy { width: 28px; padding-right: 10px; display: inline-block; vertical-align: middle; position: relative; text-align: center; }
#wrapper .navbar-default .sidebar ul li a .ic-jpy:before { content: '¥'; font-style: initial; font-size: 18px; font-weight: 100; line-height: 0; }
#wrapper .navbar-default .sidebar ul li a span { display: inline-block; vertical-align: middle; }
#wrapper .navbar-default .sidebar ul li ul { padding: 0; }
#wrapper .navbar-default .sidebar ul li ul li { list-style: none; }
#wrapper .navbar-default .sidebar ul li ul li a { padding: 20px 15px 20px 43px; background: #384374; display: block; }
#wrapper .navbar-default .sidebar ul li ul li a:hover, #wrapper .navbar-default .sidebar ul li ul li a:focus, #wrapper .navbar-default .sidebar ul li ul li a.active { background: #384374; }
@media screen and (min-width: 768px) { #wrapper .navbar-default .sidebar { width: 220px; margin-top: 0; position: static; padding-bottom: 50px; }
  #wrapper .navbar-default .sidebar ul li { border: none; }
  #wrapper .navbar-default .sidebar ul li a { color: #1a1a1a; background: none; }
  #wrapper .navbar-default .sidebar ul li a:hover, #wrapper .navbar-default .sidebar ul li a:focus, #wrapper .navbar-default .sidebar ul li a.active { background: #d6d6d6; }
  #wrapper .navbar-default .sidebar ul li a:after, #wrapper .navbar-default .sidebar ul li a[aria-expanded="false"]:after { border-top: 1px solid #222222; border-right: 1px solid #222222; }
  #wrapper .navbar-default .sidebar ul li ul li a { background: none; }
  #wrapper .navbar-default .sidebar ul li ul li a:hover, #wrapper .navbar-default .sidebar ul li ul li a:focus, #wrapper .navbar-default .sidebar ul li ul li a.active { background: #d6d6d6; } }
@media screen and (min-width: 768px) { #wrapper .navbar-brand { display: none; } }
#wrapper #page-wrapper { padding-bottom: 30px; }
@media screen and (min-width: 768px) { #wrapper #page-wrapper { margin: 0; border-left: none; overflow: hidden; padding: 0 60px 30px; } }
#wrapper #page-wrapper .breadcrumb { background: none; padding: 0 15px; }
@media screen and (min-width: 768px) { #wrapper #page-wrapper .breadcrumb { padding: 0; } }
#wrapper #page-wrapper .breadcrumb li a { color: #1a1a1a; text-decoration: underline; }
#wrapper #page-wrapper .breadcrumb li + li:before { content: ">"; }
#wrapper #page-wrapper .page-header { margin: 20px 0; padding: 0 15px; font-size: 20px; border-bottom: none; padding-bottom: 0; color: #1e2855; }
@media screen and (min-width: 768px) { #wrapper #page-wrapper .page-header { margin: 40px 0 20px; padding: 0; font-size: 34px; } }
#wrapper .login-top { overflow: hidden; }
#wrapper .login-top .inner { height: 100%; overflow: hidden; }
#wrapper .login-top .logo { margin: 24px 0; padding: 0 20px; min-height: 30px; }
#wrapper .login-top .logo a { display: block; text-indent: 100%; white-space: nowrap; overflow: hidden; }
#wrapper .login-top .logo a.pc { display: none; }
@media screen and (min-width: 768px) { #wrapper .login-top .logo a.pc { display: block; } }
@media screen and (min-width: 768px) { #wrapper .login-top .logo a.sp { display: none; } }
#wrapper .login-top .logo p { margin-top: 8px; }
#wrapper .login-top .headline { padding: 0 20px; }
#wrapper .login-top .headline span { display: block; }
#wrapper .login-top .headline p { line-height: 1.6; font-size: 20px; }
#wrapper .login-top .site-description { padding-top: 0; margin-bottom: 0; }
@media screen and (min-width: 768px) { #wrapper .login-top .site-description { padding-top: 60px; margin-bottom: -30px; } }
#wrapper .login-top .login-panel { margin: 20px 0; }
#wrapper .login-top .panel { border-radius: 10px; border: none; }
#wrapper .login-top .panel .text-body { padding: 0 25px; text-align: center; }
#wrapper .login-top .panel .text-body .login-title { padding-top: 32px; font-size: 15px; }
#wrapper .login-top .panel .text-body .login-detail { font-size: 12px; line-height: 1.5; }
#wrapper .login-top .panel .panel-body { text-align: center; padding: 12px 25px 36px; }
#wrapper .login-top .panel .panel-body .form-control { border-radius: 0px; height: 50px; }
#wrapper .login-top .panel .panel-body label { font-size: 12px; }
#wrapper .login-top .panel .panel-body .form-group { text-align: left; margin-bottom: 24px; }
#wrapper .login-top .panel .panel-body .form-group label { margin: 0 0 16px; }
#wrapper .login-top .panel .panel-body .checkbox { text-align: center; margin-bottom: 24px; }
#wrapper .login-top .panel .panel-body .checkbox .checkbox-input { display: none; }
#wrapper .login-top .panel .panel-body .checkbox .checkbox-parts { display: inline-block; position: relative; line-height: 18px; padding-left: 24px; margin-right: 20px; }
#wrapper .login-top .panel .panel-body .checkbox .checkbox-parts::before { content: ""; display: block; position: absolute; top: 0; left: 0; width: 18px; height: 18px; border: 1px solid #999; }
#wrapper .login-top .panel .panel-body .checkbox .checkbox-input:checked + .checkbox-parts::after { content: ""; display: block; position: absolute; top: 1px; left: 6px; width: 6px; height: 11px; transform: rotate(40deg); border-bottom: 1px solid #222222; border-right: 1px solid #222222; }
#wrapper .login-top .panel .panel-body .checkbox label { margin: 0; }
#wrapper .login-top .panel .panel-body .btn-success { width: auto; display: inline-block; border-radius: 60px; border: none; font-size: 14px; padding: 11px 20px; }
#wrapper .login-top .panel .panel-body .btn-success::after { content: ""; display: inline-block; position: relative; top: 0; left: 0; width: 9px; height: 9px; transform: rotate(45deg); border-top: 1px solid #fff; border-right: 1px solid #fff; }
@media screen and (min-width: 768px) { #wrapper .login-top .inner .col-md-offset-3 { float: none; }
  #wrapper .login-top .logo { margin: 0; padding: 0; position: absolute; }
  #wrapper .login-top .logo a { display: block; width: 96px; height: 111px; text-indent: 100%; white-space: nowrap; overflow: hidden; margin: 0 auto; }
  #wrapper .login-top .logo p { width: 120px; padding: 0px 20px 0 10px; word-wrap: break-word; }
  #wrapper .login-top .headline { padding: 0; margin-top: 48px; width: 66.66666667%; margin-left: 16.66666667%; text-align: center; }
  #wrapper .login-top .headline span { font-size: 18px; }
  #wrapper .login-top .headline p { font-size: 40px; }
  #wrapper .login-top .login-panel { margin: 60px 0; }
  #wrapper .login-top .panel .text-body { padding: 0 25px; text-align: center; }
  #wrapper .login-top .panel .text-body .login-title { font-size: 18px; font-weight: bold; }
  #wrapper .login-top .panel .text-body .login-detail { font-size: 14px; }
  #wrapper .login-top .panel .panel-body { padding: 12px 100px 36px; }
  #wrapper .login-top .panel .panel-body label { font-size: 14px; } }
@media screen and (min-width: 992px) { #wrapper .login-top .headline { margin-left: 25%; width: 50%; }
  #wrapper .login-top .panel .panel-body { padding: 12px 110px 36px; } }

footer { width: 100%; padding: 28px 0; background: #d6d6d6; text-align: center; clear: both; }
footer ul { margin: 0 0 20px; padding: 0; }
footer ul li { line-height: 1; font-size: 12px; }
footer ul li + li { margin-top: 20px; }
footer ul li a { color: #1a1a1a; text-decoration: underline; }
footer ul li a:hover { text-decoration: none; color: #1a1a1a; }
footer .copy { font-size: 10px; line-height: 1.45; }
@media screen and (min-width: 768px) { footer ul { margin: 0; }
  footer ul li { display: inline-block; margin-left: 10px; padding: 0 0 0 10px; border-left: 1px solid #b4b4b4; }
  footer ul li + li { margin-top: 0; }
  footer ul li:first-child { border: none; margin: 0; padding: 0; }
  footer .copy { margin-top: 15px; } }

.login-top { background: url(/image/bg_sp.png) no-repeat; background-size: cover; }
.login-top .logo a { width: 150px; height: 25px; background: url(/image/common/logo_sp.png) 0 0 no-repeat; background-size: 100%; margin-right: 8px; }
.login-top .logo p { width: auto; font-size: 12px; }
.login-top .headline p { color: #1e2855; }
.login-top .panel .text-body .login-title { color: #1e2855; }
.login-top .panel .panel-body .btn-success { background: #384374; color: #fff; }
.login-top .panel .panel-body .btn-success::after { border-color: #fff; }
@media screen and (min-width: 768px) { .login-top { background-image: url(/image/bg.png); }
  .login-top .logo { top: 30px; left: 20px; }
  .login-top .logo a { width: 96px; height: 111px; background: url(/image/common/logo_pc.png) 0 0 no-repeat; background-size: 100%; } }
@media screen and (min-width: 992px) { .login-top .logo { left: 56px; } }
