@charset "utf-8";
html {
  font-size:6.25%;
  height:100%;
}
body {
  font-family:"Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", Meiryo,  Osaka, "ＭＳ Ｐゴシック", "MS PGothic","FOT-筑紫明朝 Pr6 M",serif;
  font-size: 16rem;
  color:#5C5858;
  margin: 0;
  padding: 0;
  width:100%;
  height:100%;
  position: relative; 
  min-height: 100%;
}
h1, h2, h3, h4, h5, h6, p, ul, ol, dl{
  font-size: 100%;
  margin: 0;
  padding: 0;
  list-style-type:none;
  text-align: justify;
}
h1, h2, h3, h4, h5, h6, p,dl{
  line-height: 1.6em;
}
article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary{
  display:block;
}
section p,section ul,section ol,section dl,section table,
article p,article ul,article ol,article dl,article table,
div p,div ul,div ol,div dl,div table{
  margin-bottom:15px;
}
section p:last-child,section ul:last-child,section ol:last-child,section dl:last-child,section table:last-child,
article p:last-child,article ul:last-child,article ol:last-child,article dl:last-child,article table:last-child,
div p:last-child,div ul:last-child,div ol:last-child,div dl:last-child,div table:last-child,
dd:last-of-type,li:last-of-type{
  margin-bottom:0;
}
a img {
  border: medium none;
  margin: 0;
  padding: 0;
  transition:all 0.3s;
}
a img:hover{
  opacity:0.6;
}
a{
  color: inherit;
  text-decoration: none;
  transition:all 0.5s ease 0s;
}
a:hover {
  color: #9fa0a0;
  text-shadow: 0 0 3px #8EB485;
}
table{
  table-layout: fixed;

}
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

/*  color  */
.red {
  color: #F63E3E !important;
}
.st_underline {
  text-decoration: underline double;
}
.blue {
  color: #2ea7e0 !important;
}
.purple{
  color:#006699 !important;
}
.gry01{
  color: #666666 !important;
}
.bk{
  color:#000 !important;
}
.pink{
  color:#F6C !important;
}
.orange{
  color:#ff5151 !important;
}
.yellow{
  color:#FF0 !important;
}
.opa{
  transition:0.3s;
}
.opa:hover{
  opacity:0.6;
}
/*margin*/
.mts {
  margin-top: .5em;
}
.mt1em {
  margin-top: 1em;
}
.mt15 {
  margin-top: 15px;
}
.mt20 {
  margin-top: 20px;
}
.mt30 {
  margin-top: 30px;
}
.mt45 {
  margin-top: 45px;
}
.mt60 {
  margin-top: 60px;
}
.mbs {
  margin-bottom: .5em;
}
.mb1em {
  margin-bottom: 1em;
}
.mb15 {
  margin-bottom: 15px;
}
.mb20 {
  margin-bottom: 20px;
}
.mb30 {
  margin-bottom: 30px;
}
.mb45 {
  margin-bottom: 45px;
}
.mb60 {
  margin-bottom: 60px;
}
/*  fade  */

.inview {
  opacity: 0;
  transform: translateY(30px);
  visibility: hidden;
  transition: opacity 1.6s ease, transform 0.6s ease;
}

.inview.is-show {
  visibility: visible;
  transform: translateY(0px);
  opacity: 1;
}


@media (min-width: 769px) {
  /* display */
  .dn_pc{
    display:none !important;
  }
  .in-block_sp{
    display:inline;
  }

}
@media (max-width: 768px) {
  body{
    font-size:14rem;
  }
  h1, h2, h3, h4, h5, h6, p{
    line-height:1.5em;
  }
  /* display */
  .dn_mob{
    display:none !important;
  }
  .db_mob{
    display:block !important;
  }
  .in-block_sp{
    display:inline-block;
  }
}

@media (min-width: 551px) {
  .div_mobframe_con {
    display: none;
  }
}
@media (max-width: 550px) {
  .div_mobframe{
    overflow-x:scroll;
    -webkit-overflow-scrolling: touch;
    position:relative;
  }
  .div_mobframe_con:before {
    background:url(../img/common/ic_flick.png) no-repeat left top;
    background-size:contain;
    content: " ";
    float: left;
    height: 46px;
    margin-left: -30px;
    position: relative;
    top: 0px;
    left:0px;
    width: 25px;
  }
  .div_mobframe_con {
    background: #ddd none repeat scroll 0 0;
    color:#8EB485;
    font-size: 16px;
    font-weight: bold;
    min-height: 85px;
    padding: 20px 10px 20px 50px;
    margin-bottom: 15px;
  }
}