@charset "utf-8";
@font-face{font-family:YuGothicM;src:local("Yu Gothic Medium")}
a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video{
  margin:0;
  padding:0;
  border:0;
  font-style:normal;
  font-weight:400;
  font-size:100%;
  vertical-align:baseline;
  font-family:-apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック Medium", YuGothic, YuGothicM, "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, sans-serif;
  color:#1e1813;
  -webkit-font-smoothing:antialiased;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section{display:block}
html{overflow-y:scroll}
blockquote, q{quotes:none}
blockquote:after, blockquote:before, q:after, q:before {content:'';content:none}
, input, textarea{margin:0;padding:0}
ol, ul{list-style:none}
table{border-collapse:collapse;border-spacing:0}
caption, th{text-align:left}
sub{font-size:90%}
a:focus{outline:0}
.clearfix{min-height:1px}
.clearfix:after{visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0}
* html .clearfix{zoom:1}
:root img{border:none\0/}
.both{clear:both}
.inline_block{display:inline-block}
a{text-decoration:none}
a:hover{opacity:.7;-moz-opacity:.7}
a:hover img{opacity:.8;-moz-opacity:.8}
.pc_main{display:inline-block}
.sp_main{display:none}
.pc{display:block}
.sp{display:none}
*, :after, :before{
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  -o-box-sizing:border-box;
  -ms-box-sizing:border-box;
  box-sizing:border-box;
}

.wrap{position:relative;width:100%;margin:0 auto}
article .wrap:first-child{margin:0 auto;padding-bottom:60px}
article .wrap:last-child{margin-bottom:0}
.inner{display:block;width:960px;margin:0 auto;padding:0}
.top-inner{position:relative;display:block;width:100%;height:auto;overflow:hidden}
.cont-inner{max-width:820px;margin:0 auto;border:green 1px solid}
#header .inner{width: 100%;padding: 20px 20px 0 20px}
#header .wrap:first-child{height: 60px;margin: 10px 0 0 0;background: #fff}
#header .wrap:nth-child(2){padding: 0;background: #3e3228}
#header{position:fixed;top:0;left:0;width:100%;z-index:99}
#header h1{display:nline-block;padding:23px 0 23px 20px}
#header h1 a{display: block;width: 100%;height: 100%}
#header h1.sp_main{display: none}
#header h1 object, #header h1 object img{width:auto;height:50px}

#head_navi{position:relative;float:right;width:650px;margin:20px 0 12px 0}

.nav_inner{right:0;background:#fff}
.nav{border:width:57.3%}
.nav li{font-size:14px}
.nav li:first-child::before{
  content:'';
  position:absolute;
  top:10px;
  left:0;
  display:inline-block;
  width:1px;
  height:20px;
  -moz-transform:translateX(-50%);
  -webkit-transform:translateX(-50%);
  -ms-transform:translateX(-50%);
  transform:translateX(-50%)
}

.nav li::after{
  content:'';
  position:absolute;
  top:10px;
  right:0;
  display:inline-block;
  width:1px;
  height:20px;
  -moz-transform:translateX(-50%);
  -webkit-transform:translateX(-50%);
  -ms-transform:translateX(-50%);
  transform:translateX(-50%)
}
.nav li a{text-align:center;padding:4px 0 3px 0;color:#000}
.nav li a:hover{opacity:1;-moz-opacity:1;color:#fa5858}
.sub-menu .triangle{display:none;width:20px;height:0;border-style:solid;border-width:11px 9px 0 9px;border-color:#c00 transparent transparent transparent}

#pagetop{position:fixed;width:50px;right:0;bottom:0;font-size:18px;line-height:1.2em;z-index:100}
#pagetop span{display:inline-block;color:#fff}
#pagetop a{
  position:relative;
  padding:0;
  z-index:9999;
  display:block;
  width:50px;
  height:50px;
  background:#646464;
  font-size:16px;
  font-weight:700;
  text-align:center;
  text-decoration:none;
  transition:.2s ease-in-out
}

span#pagetop_triangle{
  width:0;
  height:0;
  margin-top:7px;
  text-align:center;
  border-style:solid;
  border-width:0 7.5px 13px 7.5px;
  border-color:transparent transparent #fff transparent
}
.footer_list{width:100%}
.footer_list ul{display:flex;-webkit-justify-content:space-around;justify-content:space-around}
.footer_list ul:first-child{width:75%;margin:0 auto .5rem auto;text-align:center}
.footer_list li{font-size:.8rem}
.footer_list li a{position:relative;display:block;line-height:1.3rem;color:#fff}
footer .wrap{margin-top:20rem;padding:1rem 0;background:#000}
footer .wrap:last-child .inner{display:flex;flex-wrap:wrap}
footer .inner>ul.last {margin-right:0}
footer #footer_name{height:30px}
footer #footer_name h4{width:100%;margin-top:0;text-align:center;line-height:30px;font-size:12px;color:#fff}

p{line-height:1.8em;margin-bottom:25px}
h2{margin:60px 0 0 0;text-indent:-.2em;font-size:30px;text-align:center;font-family:YuGothicM;src:local("Yu Gothic Medium")}
.topfirst h2{color:#fff;text-align:center}
.topfirst h2.wf-sawarabimincho::before{content:"";color:none}
h3{font-size:60px;}
h4{margin-bottom:20px;font-size:18px;}