@charset "utf-8";
#contentsWrap{
  width: 100%;
  background: #fff;
  box-sizing: content-box;
  margin-left: -15px;
  margin-right:-15px;
  padding-left:15px;
  padding-right:15px;
}

/* image */
#contentsWrap img{max-width: 100%;border: 0;vertical-align: bottom;}
/* image end */

/* font-size */
#contentsHeader h1{display:none;}
#contentsWrap h2{font-size: 1.2em;margin: 0.75em 0 1.75em;font-weight: bold;border-left: 5px solid #333;padding-left: 8px;line-height: 1.3;}
#contentsWrap h3 {border-bottom: 1px solid;display: inline-block;font-size: 100%;margin: 0 0 .75em;}
#contentsWrap .f100_120{font-size:100% !important;}
#contentsWrap .f120_150{font-size:120% !important;}
#contentsWrap .f150_200{font-size:150% !important;}
#contentsWrap .small,#contentsWrap small{font-size: 70%;}
/* font-size end */


/* font-weight */
#contentsWrap .bold,#contentsWrap b{font-weight:bold;}
#contentsWrap .font-weight100{font-weight:100;}
/* font-weight ned */

/* padding margin */
#contentsWrap #contentsHeaderMainImg{margin: 16px -15px;}
#contentsWrap p{margin: 0 0 .75em;}
#contentsHeader, #contentsMain, #contentsFooter{padding: 10px 0 0;}
#contentsWrap .marginTop10{margin-top: 10%;}
#contentsWrap .marginBottom10{margin-Bottom: 10%;}
#contentsWrap .paddingTop10{padding-top: 10%;}
#contentsWrap .paddingBottom10{padding-bottom: 10%;}
/* padding margin end */


/* flex style */
#contentsWrap .flexContainer{
  list-style-type: none;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  justify-items: stretch;
}
#contentsWrap .inlineFlexContainer{
  list-style-type: none;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  justify-items: stretch;
}
#contentsWrap .items-center{
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
#contentsWrap .items-end{
  -webkit-box-align: flex-end;
  -ms-flex-align: flex-end;
  align-items: flex-end;
}
#contentsWrap .self-center{
  -ms-flex-item-align:center;
  -ms-grid-row-align:center;
  align-self:center;
}
#contentsWrap .self-end{
  -ms-flex-item-align:end;
  -ms-grid-row-align:end;
  align-self:end;
}
#contentsWrap .flexDirection_columnToRow{
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
#contentsWrap .flexDirection_rowToColumn{
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
}
/* flex style end */

/* list style */
#contentsWrap .contentsList100_50,
#contentsWrap .contentsList50_100,
#contentsWrap .contentsList50,
#contentsWrap .contentsList33_100,
#contentsWrap .contentsList33_50,
#contentsWrap .contentsList33{margin: 0;padding: 0;font-size: 0;list-style: none;text-align: center;box-sizing: border-box;}
#contentsWrap .contentsList100_50 li,
#contentsWrap .contentsList50_100 li,
#contentsWrap .contentsList50 li,
#contentsWrap .contentsList33_100 li,
#contentsWrap .contentsList33_50 li,
#contentsWrap .contentsList33 li{display: inline-block;font-size: 13px;padding: 1%;box-sizing: border-box;vertical-align: middle;}
#contentsWrap .contentsList100_50>li{width: 50%;}
#contentsWrap .contentsList50>li{width: 50%;}
#contentsWrap .contentsList50_100>li{width: 100%;}
#contentsWrap .contentsList33_100>li{width: 100%;}
#contentsWrap .contentsList33_50>li{width: 50%;}
#contentsWrap .contentsList33>li{width: 33.333333333%;}
#contentsWrap ul li p{text-align: left;}
/* list style end */


/* color */
#contentsWrap .colorGreen{color: #008089;}
#contentsWrap .colorBlue{color:#4A89D2;}
#contentsWrap .colorRed{color:#EF2121;}
#contentsWrap .color_pink{color: #F44855;}
/* color end */


/* border */
#contentsWrap .border1{border:1px solid;}
#contentsWrap .border3{border:3px solid;}
#contentsWrap .border5{border:5px solid;}
#contentsWrap .border8{border:8px solid;}
#contentsWrap .boxBorder{border: 1px solid #ccc;}
/* border end */


/* border-radius */
#contentsWrap .borderR50{border-radius:50%;}
#contentsWrap .borderR3{border-radius:3px;}
#contentsWrap .borderR8{border-radius:8px;}
/* border-radius end */

/* position */
#contentsWrap .relative{position:relative;}
#contentsWrap .absolute{position:absolute;width:100%;}
#contentsWrap .fixed{position:fixed;}
/* ↓width & height not yet setting. pearent need width & height;padding-top*/
#contentsWrap .positionCenter{position:absolute;top:0;left:0;right:0;bottom:0;margin:auto;}
/* position end */


/* for pc or for smp */
#contentsWrap .forPc{display: none;}
#contentsWrap .forSmp{display: block;}
/* for pc or for smp end */


/* vertical-align text-align */
#contentsWrap .VA_top{vertical-align: top !important;}
#contentsWrap .textA_center{text-align: center !important;}
/* vertical-align text-align end */


/* white-space */
#contentsWrap .whiteSpace{white-space: nowrap;}
/* white-space end */

/* other */
#contentsWrap .inline_b{display: inline-block;}
#contentsWrap .contentsText{background-color: #DDD8D8;padding: 1%;display: inline-block;}
#contentsWrap .wordNoneBreak{display: inline-block;word-wrap: break-word;word-break: break-all;}
#contentsWrap #contentsHeaderMainImg img{width: 100%;max-width: inherit;}
/* other end */


@media screen and (min-width:768px){
  #contentsWrap{
    font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    max-width:1020px;
    margin:auto;
    padding:0;
    box-sizing: border-box;
  }
  #contentsHeader h1{
    display: block;
    font-weight: bold;
    margin-bottom: .75rem;
    text-align: left;
    font-size: 1.37em;
  }
  #contentsWrap #contentsHeaderMainImg{margin:36px auto;}
  #contentsWrap h2{font-size:1.5em;}
  #contentsWrap h3 {font-size:120%;}
  #contentsWrap .f100_120{font-size:120% !important;}
  #contentsWrap .f120_150{font-size:150% !important;}
  #contentsWrap .f150_200{font-size:200% !important;}
  #contentsHeader, #contentsMain, #contentsFooter{padding: 3% 0;}
  #contentsWrap .flexDirection_columnToRow{
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
  }
  #contentsWrap .flexDirection_rowToColumn{
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  #contentsWrap .contentsList50_100>li{width: 50%;}
  #contentsWrap .contentsList33_100>li{width: 33.333333333%;}
  #contentsWrap .contentsList33_50>li{width: 33.333333333%;}
  #contentsWrap .forPc{display: block;}
  #contentsWrap .forSmp{display: none;}
  #contentsWrap .contentsList100_50>li{width: 100%;}

}
@media screen and (min-width:720px){
    #contentsHeader h1{font-size: 1.57em;}
}