@charset "utf-8";

/* ===============================================
# base
=============================================== */
*{
  box-sizing:border-box;
}
body{
  font-family:"Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3","メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, sans-serif;
  word-wrap:break-word;
  overflow-wrap:break-word;
  font-size:75%;
  line-height:1.5;
  color:#000000;
  background-color:#ffffff;
}
h1,h2,h3,h4,h5,h6,.ruby{
  word-break : break-all;
}
.wrapper{
  width:100%;
  min-width:986px;
  position:relative;
}
img{
  height:auto;
  max-width:100%;
  -webkit-touch-callout:none;
  -moz-touch-callout:none;
  touch-callout:none;
}
a,
a:visited{
  color:#000000;
  text-decoration:none;
}
a:hover{
  color:#000000;
  text-decoration:underline;
}

@media screen and (max-width : 768px){
  .wrapper{
    min-width:0;
  }
}

/* ===============================================
# margin/padding
=============================================== */

.m05 { margin: 5px; }
.m10 { margin: 10px; }
.m20 { margin: 20px; }
.m30 { margin: 30px; }
.m40 { margin: 40px; }
.m50 { margin: 50px; }

.mt05 { margin-top: 5px; }
.mt10 { margin-top: 10px; }
.mt20 { margin-top: 20px; }
.mt30 { margin-top: 30px; }
.mt40 { margin-top: 40px; }
.mt50 { margin-top: 50px; }

.mb05 { margin-bottom: 5px; }
.mb10 { margin-bottom: 10px; }
.mb20 { margin-bottom: 20px; }
.mb30 { margin-bottom: 30px; }
.mb40 { margin-bottom: 40px; }
.mb50 { margin-bottom: 50px; }

.ml05 { margin-left: 5px; }
.ml10 { margin-left: 10px; }
.ml20 { margin-left: 20px; }
.ml30 { margin-left: 30px; }
.ml40 { margin-left: 40px; }
.ml50 { margin-left: 50px; }

.mr05 { margin-right: 5px; }
.mr10 { margin-right: 10px; }
.mr20 { margin-right: 20px; }
.mr30 { margin-right: 30px; }
.mr40 { margin-right: 40px; }
.mr50 { margin-right: 50px; }

.p05 { padding: 5px; }
.p10 { padding: 10px; }
.p20 { padding: 20px; }
.p30 { padding: 30px; }
.p40 { padding: 40px; }
.p50 { padding: 50px; }

.pt05 { padding-top: 5px; }
.pt10 { padding-top: 10px; }
.pt20 { padding-top: 20px; }
.pt30 { padding-top: 30px; }
.pt40 { padding-top: 40px; }
.pt50 { padding-top: 50px; }

.pb05 { padding-bottom: 5px; }
.pb10 { padding-bottom: 10px; }
.pb20 { padding-bottom: 20px; }
.pb30 { padding-bottom: 30px; }
.pb40 { padding-bottom: 40px; }
.pb50 { padding-bottom: 50px; }

.pl05 { padding-left: 5px; }
.pl10 { padding-left: 10px; }
.pl20 { padding-left: 20px; }
.pl30 { padding-left: 30px; }
.pl40 { padding-left: 40px; }
.pl50 { padding-left: 50px; }

.pr05 { padding-right: 5px; }
.pr10 { padding-right: 10px; }
.pr20 { padding-right: 20px; }
.pr30 { padding-right: 30px; }
.pr40 { padding-right: 40px; }
.pr50 { padding-right: 50px; }

.indent01 { padding-left: 1em; }
.indent02 { padding-left: 2em; }
.indent03 { padding-left: 3em; }
.indent04 { padding-left: 4em; }
.indent05 { padding-left: 5em; }

.indent_mk {
  text-indent:-1em;
  padding-left: 1em;
}


@media screen and (max-width : 768px){

  .mt05sp { margin-top: 5px; }
  .mt10sp { margin-top: 10px; }
  .mt20sp { margin-top: 20px; }
  .mt30sp { margin-top: 30px; }

}


/* ===============================================
# align
=============================================== */

.txt_center { text-align: center; }
.txt_left { text-align: left; }
.txt_right { text-align: right; }

.v_top { vertical-align:top; }
.v_middle { vertical-align:middle; }
.v_bottom { vertical-align:bottom; }

.float_left { float: left; }
.float_right { float: right; }
.clear { clear: both; }

.lh10 { line-height: 1; }
.lh15 { line-height: 1.5; }
.lh20 { line-height: 2; }


/* ===============================================
# width
=============================================== */

.w10p{ width:10%; }
.w15p{ width:15%; }
.w20p{ width:20%; }
.w25p{ width:25%; }
.w30p{ width:30%; }
.w33p{ width:33.33%; }
.w35p{ width:35%; }
.w40p{ width:40%; }
.w45p{ width:45%; }
.w50p{ width:50%; }
.w55p{ width:55%; }
.w60p{ width:60%; }
.w65p{ width:65%; }
.w66p{ width:66.66%; }
.w70p{ width:70%; }
.w75p{ width:75%; }
.w80p{ width:80%; }
.w85p{ width:85%; }
.w90p{ width:90%; }
.w95p{ width:95%; }
.w100p{ width:100%; }


/* ===============================================
# responsive layout
=============================================== */

.for_pc{
  display:block;
}
.for_sp{
  display:none;
}
img.for_pc,
span.for_pc{
  display:inline;
}
img.for_sp,
span.for_sp{
  display:none;
}

@media screen and (max-width : 768px){

  .for_pc{
    display:none;
  }
  .for_sp{
    display:block;
  }
  img.for_pc,
  span.for_pc{
    display:none;
  }
  img.for_sp,
  span.for_sp{
    display:inline;
  }

}


/* ===============================================
# etc
=============================================== */

.over:hover {
    opacity: 0.6;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
}


ul:after,
.clearfix:after {
  display: block;
  clear: both;
  content: "";
}
.block {
	display: block;
}
.inline {
	display: inline;
}
.hide {
	display: none;
}