@charset "UTF-8";
/* CSS Document */

/*-----------------------------------------------------
Reset
----------------------------------------------------- */
html, body, div, span,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;
}

article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}

body { line-height: 1; }
ol, ul { list-style: none; }
table { border-collapse: collapse; border-spacing: 0; }

* { margin: 0; padding: 0; }
img { max-width: 100%; width: auto; height: auto; vertical-align: top; image-rendering: -webkit-optimize-contrast; }

body { color: #231815; font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-style: normal; font-weight: 500; -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; text-align: justify; text-justify: inter-ideograph; }

#Container { position: relative; }
#Contents { }

.sp-show { display: none; }
/*-----------------------------------------------------
Header
----------------------------------------------------- */
header > .inner { display: flex; justify-content: flex-start; align-items: center; max-width: 1280px; width: 98%; height: 81px; margin: 0 auto; }
header .logo { max-width: 414px; width: 31%; }
header .logo img { width: 100%; height: auto; }
header p { font-size: 0.938em; font-weight: 700; margin-left: 1.5%; }
header .contact { display: flex; align-items: center; justify-content:flex-end; margin-left: auto; }
header .contact > img { max-width: 142px; width: 34%; }
header .contact a { max-width: 278px; width: 65%; }
header .contact a:first-of-type{ width:38.5%; margin-right:1%; }
header .contact a:last-of-type{ width:60.5%; }
header .contact a img { width: 100%; height: auto; }
header #Menu { display: none; }

nav { background: #e40a1f; }
nav ul { display: flex; justify-content: flex-end; align-items: center; max-width: 1280px; width: 98%; height: 68px; margin: 0 auto; }
nav ul li { width: calc(100% / 6); height: 38px; border-left: 1px solid #FFF; padding: 0 0.5em; white-space: nowrap; }
nav ul li:first-child { border: none; }
nav ul li a { display: flex; justify-content: center; align-items: center; height: 100%; color: #FFF; font-weight: bold; text-decoration: none; }
nav ul li span { display: block; }
nav ul li ul,.open nav ul li ul { display: none; visibility: hidden; }


/*-----------------------------------------------------
Footer
----------------------------------------------------- */
footer { background: #e40a1f; }
footer .contact { display: none; }
#Footnav { background: #f5f4f5; padding: 45px 0; }
#Footnav a { color: #231815; text-decoration: none; }
#Footnav .inner { max-width: 720px; width: 95%; margin: 0 auto; display: flex; justify-content: space-between; }
#Footnav .column { max-width: 205px; width: 31%; }
#Footnav .ttl { font-weight: 700; border-bottom: 1px solid #000; padding: 0 10px 10px 10px; }
#Footnav .ttl + .ttl { margin-top: 15px; }
#Footnav ul { font-size: 0.875em; line-height: 1.5em; padding: 0 10px; margin-top: 15px; }
#Footnav ul li { margin-top: 5px; }
#Footnav .other { margin-top: 35px; }

footer > .inner { display: flex; justify-content: space-between; align-items: center; max-width: 1280px; width: 98%; height: 68px; margin: 0 auto; }
footer > .inner ul { display: flex; justify-content: space-between; font-size: 0.875em; }
footer > .inner ul a { color: #FFF; text-decoration: none; padding: 5px 0; border-left: 1px solid #FFF; text-align: center; display: block; }
footer > .inner ul li { width: 130px; }
footer > .inner ul li:last-child a { border-right: 1px solid #FFF; }

.copy { font-size: 0.688em; color: #fff; height: 68px; display: flex; justify-content: center; align-items: center; }


@media screen and (max-width:990px) {
  .open #Contents { position: relative; margin-top: 50px; z-index: -1; height: 100%; overflow: hidden; }
/*-----------------------------------------------------
Header
----------------------------------------------------- */
  header { position: relative; background: #FFF; }
  header > .inner { height: 50px; }
  header .logo { width: 227px; margin: 0 auto; }
  header p { display: none; }
  header .contact { display: none; }
  header #Menu { width: 50px; height: 50px; background: #e40a1f; position: absolute; right: 0; font-size: 0.625em; color: #FFF; font-weight: 700; display: flex; justify-content: center; align-items: center; flex-direction: column; cursor: pointer; }
  header #Menu span { display: block; width: 20px; height: 2px; background: #FFF; margin-bottom: 4px; }
  header #Menu::after { content: "メニュー"; color: #FFF; display: block; margin-top: 2px; }
  .open header { position: fixed; top: 0; width: 100%; }
  .open header #Menu::after { content: "閉じる"; }
  .open header #Menu span:nth-child(1) { transform: translateY(7px) rotate(-45deg); }
	.open header #Menu span:nth-child(2) { opacity: 0; }
	.open header #Menu span:nth-child(3) { transform: translateY(-5px) rotate(45deg); }
  
  nav { position: fixed; top: 50px; right: -100%; background: #FFF; z-index: 1000; height: calc(100vh - 50px); width: 100%; }
  nav ul { flex-direction: column; width: 100%; height: 97%; align-items: flex-start; justify-content: flex-start; overflow: auto; -webkit-overflow-scrolling: touch; }
  nav ul li { max-width: 100%; width: 100%; height: auto; padding: 0; box-sizing: border-box; position: relative; border-left: none; }
  nav ul li a { color: #000; font-size: 1.063rem; height: 56px; display: flex; justify-content: flex-start; align-items: center; border-bottom: 1px solid #9fa0a0; padding: 0 20px; }
  nav ul li a::after { content: ""; background: url("../images/ic_arrow.svg") no-repeat center; width: 8px; height: 13px; margin-left: auto; }
  nav ul li span { color: #000; font-size: 1.063rem; height: 56px; display: flex; justify-content: flex-start; align-items: center; border-bottom: 1px solid #9fa0a0; padding: 0 20px; width: 100%; font-weight: 700; box-sizing: border-box; }
  nav ul li span::before { content: "サービス一覧"; }
  nav ul li span::after { content: ""; display: block; background: url("../images/ic_plus.svg") #FFF no-repeat center; width: 15px; height: 15px; margin-left: auto; }
  nav ul li span.open::after { background-image: url("../images/ic_minus.svg"); }
  nav ul li ul li a { background: #f5f4f5; }
  nav ul li ul li a::after { display: none; }
  .open nav ul li ul { visibility: visible; }
  
  .open nav > ul > li:nth-child(2) > a { display: none; }
  
  
/*-----------------------------------------------------
Footer
----------------------------------------------------- */
  #Footnav { display: none; }
  footer .contact { background: #f5f4f5; padding: 30px 0; display: block; }
  footer .contact a { display: block; width: 280px; margin: 0 auto; }
  footer > .inner { display: block; height: auto; }
  footer > .inner ul { justify-content: center; border-bottom: 1px solid #FFF; padding: 10px 0; font-size: 0.750rem; }
  footer > .inner ul a { border: none!important; }
  
  .copy { text-align: center; padding: 10px 0 15px 0; height: auto; width: 95%; margin: 0 auto; }

}

@media screen and (max-width:640px) {
  .sp-show { display: block; }
}