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

/*************************************************************************************************************************
* reset
*************************************************************************************************************************/
html{ height: 100%; overflow-y: scroll; font-size: 62.5%;}
body{ height: 100%; margin: 0; padding: 0; text-align: justify; text-justify: inter-ideograph; -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-family: YakuHanJP_Noto, "Noto Sans JP", sans-serif; font-weight:500; -webkit-font-feature-settings: 'palt' 1; font-feature-settings: 'palt' 1; }
img{ width: 100%; max-width: 100%; height: auto; border: 0; vertical-align: bottom;}
svg{ vertical-align: bottom;}
form{ margin: 0; padding: 0;}
p{ margin: 0; padding: 0;}
a, a:hover{ text-decoration: none; outline: none;}
h1, h2, h3, h4, h5, h6{ margin: 0; padding: 0; font-size: 0; line-height: 0;}
ul, dl, dt, dd{ margin: 0; padding: 0;}
li, ol{ margin: 0; padding: 0; list-style: none;}
table{ border: 0; border-collapse: collapse; border-spacing: 0;}
caption, th{ text-align: left;}
figure { margin: 0; padding: 0; }
header, nav, main, article, aside, section, footer{ display: block;}
*{ box-sizing: border-box;}

/**********************************************************
*　追加ベース
**********************************************************/
body {  }
button{ background-color: transparent; border: none; cursor: pointer; outline: none; padding: 0; appearance: none; }


.sp-only { display: none !important; }
.sp-only-2 { display: none !important; }
.pc-only { display: block !important; }
.pc-only-2 { display: inline-block !important; }
@media screen and (max-width: 680px) {
	.sp-only { display: block !important; }
	.sp-only-2 { display: inline-block !important; }
	.pc-only { display: none !important; }
	.pc-only-2 { display: none !important; }
}



/*	iOS Sarafi Hack	*/
_::-webkit-full-page-media,
_:future,
:root .something {  }





.outer-wrap { width: 760px; margin-left: auto; margin-right: auto; }
.inner-wrap { position: relative; min-height: 1000px; }
.inner-wrap::before { position: absolute; top: 0; left: 0; display: block; width: calc(100% - 2px); height: calc(100% - 2px); border: 1px solid #808080; content: ""; pointer-events: none; z-index: 100; }

.main { position: relative; }
.main__img {  }
.main__inner { position: absolute; bottom: 0; right: 25px; width: 330px; z-index: 10; }
.main__ttl { font-size: 14px; font-weight: 900; line-height: 1.5; }
.main__txt { margin-top: 2px; font-size: 11px; font-weight: 700; line-height: 1.8; }
.bottom { margin-top: -18px; }
.p {  }
.p__ttl { width: 100%; padding: 18px 0 9px; text-align: center; }
.p__ttl img { width: 505px; }

.bnr-wrap { display: flex; justify-content: space-between; }
.bnr { position: relative; width: 50%; }
.bnr:nth-of-type(1)::before { position: absolute; bottom: 0; left: 0; display: block; width: 97px; height: 91px; background: url("../img/obj_ppl.png") no-repeat center/contain; content: ""; pointer-events: none; }
.footer { position: relative; display: flex; justify-content: space-between; align-items: center; min-height: 70px; background: #fff; padding: 0 25px; color: #000; }
.footer__inner { flex: 1; display: flex; align-items: center; }
.footer__label { display: flex; justify-content: center; align-items: center; width: 100px; height: 35px; border: 1px solid #000; margin-right: 10px; font-size: 12px; font-weight: 700; line-height: 1; letter-spacing: 0.1em; text-indent: 0.1em; text-align: center; }
.footer__txt-wrap {  }
.footer__txt { display: flex; align-items: center; font-size: 11px; font-weight: 700; line-height: 1; }
.footer__txt:not(:first-of-type) { margin-top: 5px; }
.footer__txt span { margin-left: 4px; font-size: 10px; }
.footer__txt span::before { content: "［"; margin-right: 4px; }
.footer__txt span::after { content: "］"; margin-left: 4px; }
.footer__logo { width: 129px; }
/*************************************************************************************************************************
* css for Recruit footer template
*************************************************************************************************************************/
.r-footer{ background: #fff; padding: 5px 0; position: relative; z-index: 10; border-top: 1px solid #e1e1e1; overflow: hidden;}
.r-footer ul li a{ position: relative; padding: 0 0 0 10px; font-size: 12px; line-height: 1; color: #333;}
.r-footer ul li a::before{ content: ""; width: 0; height: 0; position: absolute; top: 2px; left: 0; border-style: solid; border-width: 4px 0 4px 5px; border-color: transparent transparent transparent #454545;}
.r-footer > a{ display: block; width: 258px; height: 37px; margin: 15px 0 0;}

@media print, screen and (min-width: 681px){
  .r-footer{ display: flex; justify-content: space-between; align-items: center;}/*	 flex-direction: row-reverse;  padding: 15px 30px 20px;	*/
  .r-footer ul{ display: flex; }
  .r-footer ul li a{ padding-left: 5px;}
  .r-footer ul li a::before{ display: none;}
  .r-footer ul li a::after{ content: "｜"; padding: 0 0 0 5px;}
  .r-footer ul li:last-child a::after{ display: none;}
  .r-footer a{ margin-top: 0;}
}

img[width="1"]{ width: auto; position: absolute; top: 0; left: 0; z-index: -1000;}