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


@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 100;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 200;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 300;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Medium");
  font-weight: 400;
}
@font-face {
  font-family: "Yu Gothic";
  src: local("Yu Gothic Bold");
  font-weight: bold;
}
@font-face {
  font-family: "Helvetica Neue";
  src: local("Helvetica Neue Regular");
  font-weight: 100;
}
@font-face {
  font-family: "Helvetica Neue";
  src: local("Helvetica Neue Regular");
  font-weight: 200;
}


html { 
  font-family: 'Quicksand', 'Noto Sans JP', "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ', Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  background: #e5e0cf;
}
@media all and (-ms-high-contrast: none)  {
  html {
    font-family: Verdana, Meiryo, sans-serif;
  }
}
@media all and (-ms-high-contrast: active) {
  html {
    font-family: Verdana, Meiryo, sans-serif;
  }
}

body{ line-height: 1.6; color: #5f4a16; font-size: 16px;}

body {
    background: url(../img/content_bg.png);
    background-size: 100%;
    background-position: center;
    background-size: 480px;
    max-width: 480px;
    margin: 0 auto;
}

img{ width: 100%;}
.key{position: relative; font-family: serif;}

.key > .in{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100%;}

.key p{ text-align: center;}
.key p.txt_hn{ position: absolute; top: 1em; font-size: 12px; left: 50%; transform: translate(-50%,0);}
.key p.in02 { padding: .5em 44px .25em; font-size: 20px; font-weight: bold;line-height: 1.8rem; margin-bottom: 1rem;}
.key p.in02 span{ font-size: .75em;}
.key p.in03{ width: 75%; margin: -.75em auto 0; font-size: 14px;}

p.s_txt{ padding: 1em 0; font-family: serif; text-align: center; font-size: 14px; line-height: 2rem; font-weight: bold; color: #5f4a16;}
p.s_ttl{ background: #f2e7d5; padding: .5em; text-align: center;}
p.s_txt > span{ color: #ce000d; font-weight: bold;}
p.messe{ padding: 1em; font-size:13px; color: #5f4a16;}



section.nav{ margin: 0 auto 5%; width: 80%;}
section.nav a{ color: inherit; text-decoration: none;}
div.li_nav{ background: url(../img/nav_bk.png) no-repeat; background-size: 100% 100%;}
div.li_nav.mgn{ margin: 1em auto;}
div.li_nav p{ padding: .25em .5em; text-align: center; font-size: 20px;}

footer{ background: #f2e7d5; text-align: center; padding: .5em 0;}


p.img {
  width: 20%;
  margin: 5px auto 4%;
}

iframe {
    width: 90%;
    margin: 0 auto;
    display: block;
    border: 3px solid #fff;
    box-shadow: 0 0 5px 2px #f8eebf;
    box-sizing: border-box;
}