@CHARSET "UTF-8";
/* style-common.css [ update: 2020/9/9 ] */

/* ===================================================================
電話リンク
=================================================================== */
a[href^="tel:"] { cursor: default; }

/* ===================================================================
初期化
=================================================================== */
body,
html,
header,
footer,
#container,
#wrapper,
div,
p,
nav,
article,
section{
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* 初期フォントサイズ設定 
html{ font-size: 16px; }*/
body { overflow-y: scroll; }

@media screen and (max-width: 480px){
  html{ font-size: 16px !important; }
}
@media screen and (min-width: 481px) and (max-width: 640px){
  html{ font-size: 17px !important; }
}
@media screen and (min-width: 641px){
  html{ font-size: 18px !important; }
}


/* ===================================================================
フォントサイズ
=================================================================== */
.text5{ font-size: .5em; }
.text6{ font-size: .6em; }
.text7{ font-size: .7em; }
.text8{ font-size: .8em; }
.text9{ font-size: .9em; }
.text10{ font-size: 1em; }
.text11{ font-size: 1.1em; }
.text12{ font-size: 1.2em; }
.text13{ font-size: 1.3em; }
.text14{ font-size: 1.4em; }
.text15{ font-size: 1.5em; }
.text16{ font-size: 1.6em; }
.text17{ font-size: 1.7em; }
.text18{ font-size: 1.8em; }
.text19{ font-size: 1.9em; }
.text20{ font-size: 2em; }
.text21{ font-size: 2.1rem; }
.text22{ font-size: 2.2rem; }
.text23{ font-size: 2.3rem; }
.text24{ font-size: 2.4rem; }
.text25{ font-size: 2.5rem; }
.text26{ font-size: 2.6rem; }


.line-height1{ line-height: 1; }
.line-height1p5{ line-height: 1.5; } /* 1 point 5 */
/* ===================================================================
横幅
=================================================================== */
.per5{ width: 5%;}
.per6{ width: 6%;}
.per7{ width: 7%;}
.per8{ width: 8%;}
.per9{ width: 9%;}
.per10{ width: 10%;}
.per11{ width: 11%;}
.per12{ width: 12%;}
.per13{ width: 13%;}
.per14{ width: 14%;}
.per15{ width: 15%;}
.per16{ width: 16%;}
.per17{ width: 17%;}
.per18{ width: 18%;}
.per19{ width: 19%;}
.per20{ width: 20%;}
.per21{ width: 21%;}
.per22{ width: 22%;}
.per23{ width: 23%;}
.per24{ width: 24%;}
.per25{ width: 25%;}
.per30{ width: 30%;}
.per33{ width: 33%;}
.per35{ width: 35%;}
.per40{ width: 40%;}
.per41{ width: 41%;}
.per42{ width: 42%;}
.per43{ width: 43%;}
.per44{ width: 44%;}
.per45{ width: 45%;}
.per46{ width: 46%;}
.per47{ width: 47%;}
.per48{ width: 48%;}
.per49{ width: 49%;}
.per50{ width: 50%;}
.per51{ width: 51%;}
.per52{ width: 52%;}
.per53{ width: 53%;}
.per54{ width: 54%;}
.per55{ width: 55%;}
.per56{ width: 56%;}
.per57{ width: 57%;}
.per58{ width: 58%;}
.per59{ width: 59%;}
.per60{ width: 60%;}
.per61{ width: 61%;}
.per62{ width: 62%;}
.per63{ width: 63%;}
.per64{ width: 64%;}
.per65{ width: 65%;}
.per66{ width: 66%;}
.per67{ width: 67%;}
.per68{ width: 68%;}
.per69{ width: 69%;}
.per70{ width: 70%;}
.per71{ width: 71%;}
.per72{ width: 72%;}
.per73{ width: 73%;}
.per74{ width: 74%;}
.per75{ width: 75%;}
.per76{ width: 76%;}
.per77{ width: 77%;}
.per78{ width: 78%;}
.per79{ width: 79%;}
.per80{ width: 80%;}
.per81{ width: 81%;}
.per82{ width: 82%;}
.per83{ width: 83%;}
.per84{ width: 84%;}
.per85{ width: 85%;}
.per86{ width: 86%;}
.per87{ width: 87%;}
.per88{ width: 88%;}
.per89{ width: 89%;}
.per90{ width: 90%;}
.per90{ width: 90%;}
.per95{ width: 95%;}
.per98{ width: 98%;}
.full{ width: 100%;}

.width1em{ width: 1em; }
.width2em{ width: 2em; }
.width3em{ width: 3em; }
.width4em{ width: 4em; }
.width5em{ width: 5em; }
.width6em{ width: 6em; }
.width7em{ width: 7em; }
.width8em{ width: 8em; }
.width9em{ width: 9em; }
.width10em{ width: 10em; }
.width11em{ width: 11em; }
.width12em{ width: 12em; }
.width13em{ width: 13em; }
.width14em{ width: 14em; }
.width15em{ width: 15em; }
.width16em{ width: 16em; }
.width17em{ width: 17em; }
.width18em{ width: 18em; }
.width19em{ width: 19em; }
.width20em{ width: 20em; }
.width21em{ width: 21em; }
.width22em{ width: 22em; }
.width23em{ width: 23em; }
.width24em{ width: 24em; }
.width25em{ width: 25em; }
.width26em{ width: 26em; }
.width27em{ width: 27em; }
.width28em{ width: 28em; }

.min-width100vw{ min-width: 100vw; }

.min-height100vh{ min-height: 100vh; }

/* ===================================================================
配置
=================================================================== */
/* position */
.posi-rel{ position: relative; }
.posi-abs{ position: absolute; }
.posi-fix{ position: fixed; }

/* vertical-align */
.ver-top{ vertical-align: top; }
.ver-middle{ vertical-align: middle; }
.ver-bottom{ vertical-align: bottom; }

/* text-align */
.align-center{ text-align: center; }
.align-center:not(.flex-item)
{ margin-left: auto; margin-right: auto; }

.align-right{ text-align: right; }
.align-right:not(.flex-item)
{ margin-left: auto; margin-right: 0;}

.align-left{ text-align: left; }
.align-left:not(.flex-item)
{ margin-left: 0; margin-right: auto;}

/* ===================================================================
article, section
==================================================================== */
article{ margin: 1rem auto 3rem; }
section{ margin: 0; padding: 1rem 0; }

/* ===================================================================
margin
==================================================================== */
.inner-margin{ margin: 1.5rem 0; }

/* ===================================================================
padding
=================================================================== */
.inner-padding{ padding: 1.5rem 0; }

.padding-top1rem{ padding-top: 1rem; }

.padding-left2rem{ padding-left: 2rem; }
.padding-right2rem{ padding-right: 2rem; }

/* ===================================================================
list
=================================================================== */
ul:not(.table),
ol:not(.table)
{ width: 100%; }

.not-list,
ul,
ul.disp-ib,
dl.disp-ib,
ol.disp-ib,
ul.disp-flex,
dl.disp-flex,
ol.disp-flex
{ list-style:none; }

ol.marker{ list-style-type: decimal; }
ol.marker li{ margin-left: 1.5em; }
ul.marker li{ margin-left: 1.5em; }
ul.marker.disc{ list-style-type: disc; }
ul.marker.circle{ list-style-type: circle; }
ul.marker.square{ list-style-type: square; }
ul.marker.disc{ list-style-type: disc; }
ul.marker.disc{ list-style-type: disc; }
/* ===================================================================
dl
=================================================================== */
dl{ width: 100%; }
dl dt{ font-weight: bold; }


/* ===================================================================
form
=================================================================== */
button, input, select, textarea {
  font-family : inherit;
  font-size : 1rem;
}

body textarea{ font-size : 1.1rem; }

input[type=text],
input[type=password],
input[type=search],
input[type=tel],
input[type=url],
input[type=email],
input[type=date],
input[type=time],
input[type=number],
input[type=range],
input[type=color],
input[type=datetime],
input[type=datetime-local],
input[type=month],
input[type=week],
select,
textarea{
  width: auto;
}
input[type=checkbox],
input[type=radio]{
  width: 1.5rem;
  height: 1.5rem;
}
/*
input[type=hidden],
input[type=file] {
}
input[type=submit],
input[type=reset],
input[type=button],
input[type=image],
button
{
  width: 100%;
}*/

html form input,
html form textarea,
html form select,
html button {
  background: #fff;
  border: solid 1px #aaa;
  -webkit-box-shadow: inner 0 0 4px rgba(0, 0, 0, 0.5);
          box-shadow: inner 0 0 4px rgba(0, 0, 0, 0.5);
  font-family : inherit;
  margin: .25em 0;
  padding: .25em .5em;
  vertical-align: middle;
  font-size: .9em;
}

form input,form select,form textarea{ display:inline-block; }

form .cal{
  display: inline-block;
  width:6.5em;
}

fieldset {
  border:1px solid #bcbcbc;
  padding: 0 .5em .5em;
  margin: .25rem .5rem .5rem;
}

form.img_chk fieldset input[type="radio"]+label,
form.img_chk fieldset input[type="checkbox"]+label{margin-left: .5rem;}

input.disabled,
textarea.disabled,
select.disabled,
button.disabled{ background: #ddd; color: #000; cursor: default; }

button.disabled:hover{ border-color: #000; border: solid rgba(66, 66, 66, 0.8) 2px; text-shadow: 1px 1px 0 rgba(66, 66, 66, 0.8); }
button:hover:not(.disabled),
input[type=radio]:not(.disabled)+label:hover,
input[type=checkbox]:not(.disabled)+label:hover{ cursor: pointer; }

input[type=radio]:not(.disabled)+label:hover,
input[type=checkbox]:not(.disabled)+label:hover{ color: #ff8c00; }


/* form: img_chkをもったformタグ内のラジオボタンとチェックボックスを画像にする */
form.img_chk input[type="radio"], form.img_chk input[type="checkbox"]{display: none;}
form.img_chk input[type="radio"]+label,
form.img_chk input[type="checkbox"]+label{
  position: relative;
  display: block;
  padding: .3rem 1rem .2rem 1.8rem;
}

form.img_chk input[type="radio"]+label:before,
form.img_chk input[type="checkbox"]+label:before{
  margin: auto 0;
  display: block;
  position: absolute;
  content: '';
  width: 1.4rem;
  height: 1.4rem;
  top: 0;
  bottom: 0;
  left: 0;
  background-repeat:no-repeat;
  -moz-background-size: auto 100%;
  background-size: auto 100%;
}
form.img_chk input[type="radio"]+label:before{ background-image: url("./images/iconmonstr-radio.png"); }
form.img_chk input[type="radio"]:checked+label:before{ background-image: url("./images/iconmonstr-radio_check.png") !important; }
form.img_chk input[type="checkbox"]+label:before{ background-image: url("./images/iconmonstr-square.png"); }
form.img_chk input[type="checkbox"]:checked+label:before{ background-image: url("./images/iconmonstr-square_check.png") !important; }


/* ===================================================================
display
=================================================================== */

/* inline-block --------------------------------------------------- */

.disp-ib{
  font-size: 0 !important;
  letter-spacing: -1em !important;
  word-spacing: -1em !important;
}
:root .disp-ib {
  font-size: 0.1px;
  letter-spacing: -1px;
  word-spacing: -1px;
}
.disp-ib > *{
  display: inline-block !important;
  font-size: 1rem;
  letter-spacing: normal;
  word-spacing: normal;
  *display: inline;
  *zoom: 1;
}

.disp-ib.pad > *{ margin: auto .5rem; }


/* flex ----------------------------------------------------------- */
/* http://shanabrian.com/web/css3/ */

.disp-flex{
  display:-webkit-box;
  display:-moz-box;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-moz-flex;
  display:flex;
}

/* justify-content:均等配置 */
.disp-flex.justify-content_space-between{
  -webkit-box-pack:justify;
  -moz-box-pack:justify;
  -webkit-flex-pack:justify;
  -moz-flex-pack:justify;
  -ms-flex-pack:justify;
  -webkit-justify-content:space-between;
  -moz-justify-content:space-between;
  justify-content:space-between;
}

/* justify-content:均等配置（先端・終端にも余白） */
.disp-flex.justify-content_space-around{
  -webkit-flex-pack:distribute;
  -moz-flex-pack:distribute;
  -ms-flex-pack:distribute;
  -webkit-justify-content:space-around;
  -moz-justify-content:space-around;
  justify-content:space-around;
}

/* justify-content:左寄せ */
.disp-flex.justify-content_start{
  -webkit-box-pack:start;
  -moz-box-pack:start;
  -webkit-flex-pack:start;
  -moz-flex-pack:start;
  -ms-flex-pack:start;
  -webkit-justify-content:flex-start;
  -moz-justify-content:flex-start;
  justify-content:flex-start;
}

/* justify-content:右寄せ */
.disp-flex.justify-content_end{
  -webkit-box-pack:end;
  -moz-box-pack:end;
  -webkit-flex-pack:end;
  -moz-flex-pack:end;
  -ms-flex-pack:end;
  -webkit-justify-content:flex-end;
  -moz-justify-content:flex-end;
  justify-content:flex-end;
}

/* justify-content:中央寄せ */
.disp-flex.justify-content_center{
  -webkit-box-pack:center;
  -moz-box-pack:center;
  -webkit-flex-pack:center;
  -moz-flex-pack:center;
  -ms-flex-pack:center;
  -webkit-justify-content:center;
  -moz-justify-content:center;
  justify-content:center;
}


/* align-items:要素のコンテンツ上辺を基準 */
.disp-flex.align-items_baseline{
  -webkit-box-align:baseline;
  -moz-box-align:baseline;
  -ms-flex-align:baseline;
  -webkit-align-items:baseline;
  -moz-align-items:baseline;
  align-items:baseline;
}

/* align-items:要素全体の上辺を基準 */
.disp-flex.align-items_start{
  -webkit-box-align:start;
  -moz-box-align:start;
  -ms-flex-align:start;
  -webkit-align-items:flex-start;
  -moz-align-items:flex-start;
  align-items:flex-start;
}

/* align-items:要素全体の下辺を基準 */
.disp-flex.align-items_end{
  -webkit-box-align:end;
  -moz-box-align:end;
  -ms-flex-align:end;
  -webkit-align-items:flex-end;
  -moz-align-items:flex-end;
  align-items:flex-end;
}

/* align-items:要素全体の中央を基準 */
.disp-flex.align-items_center{
  -webkit-box-align:center;
  -moz-box-align:center;
  -ms-flex-align:center;
  -webkit-align-items:center;
  -moz-align-items:center;
  align-items:center;
}

/* align-items:要素全体を最大幅 */
.disp-flex.align-items_stretch{
  -webkit-box-align:stretch;
  -moz-box-align:stretch;
  -ms-flex-align:stretch;
  -webkit-align-items:stretch;
  -moz-align-items:stretch;
  align-items:stretch;
}


/* align-self:auto */
.disp-flex > .flex-item.align-self_auto{
  -webkit-align-self:auto;
  -moz-align-self:auto;
  -ms-align-self:auto;
  align-self:auto;
}

/* align-self:flex-start */
.disp-flex > .flex-item.align-self_start{
  -webkit-align-self:flex-start;
  -moz-align-self:flex-start;
  -ms-align-self:flex-start;
  align-self:flex-start;
}

/* align-self:end */
.disp-flex > .flex-item.align-self_end{
  -webkit-align-self:flex-end;
  -moz-align-self:flex-end;
  -ms-align-self:flex-end;
  align-self:flex-end;
}

/* align-self:center */
.disp-flex > .flex-item.align-self_center{
  -webkit-align-self:center;
  -moz-align-self:center;
  -ms-align-self:center;
  align-self:center;
}

/* align-self:baseline */
.disp-flex > .flex-item.align-self_baseline{
  -webkit-align-self:baseline;
  -moz-align-self:baseline;
  -ms-align-self:baseline;
  align-self:baseline;
}

/* align-self:stretch */
.disp-flex > .flex-item.align-self_stretch{
  -webkit-align-self:stretch;
  -moz-align-self:stretch;
  -ms-align-self:stretch;
  align-self:stretch;
}


/* flex-wrap:折り返さない */
.disp-flex.flex-wrap_nowrap{
  -webkit-box-lines:single;
  -moz-box-lines:single;
  -webkit-flex-wrap:nowrap;
  -moz-flex-wrap:nowrap;
  -ms-flex-wrap:none;
  flex-wrap:nowrap;
}

/* flex-wrap:折り返す */
.disp-flex.flex-wrap_wrap{
  -webkit-box-lines:multiple;
  -moz-box-lines:multiple;
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
}

/* flex-wrap:逆方向へ折り返す */
.disp-flex.flex-wrap_wrap-reverse{
  -webkit-flex-wrap:wrap-reverse;
  -moz-flex-wrap:wrap-reverse;
  -ms-flex-wrap:wrap-reverse;
  flex-wrap:wrap-reverse;
}


/* flex-direction:左から右 */
.disp-flex.flex-direction_row{
  -webkit-box-direction:normal;
  -moz-box-direction:normal;
  -webkit-box-orient:horizontal;
  -moz-box-orient:horizontal;
  -webkit-flex-direction:row;
  -moz-flex-direction:row;
  flex-direction:row;
}

/* flex-direction:上から下 */
.disp-flex.flex-direction_column{
  -webkit-box-direction:normal;
  -moz-box-direction:normal;
  -webkit-box-orient:vertical;
  -moz-box-orient:vertical;
  -webkit-flex-direction:column;
  -moz-flex-direction:column;
  flex-direction:column;
}

/* flex-direction:右から左（右寄せ） */
.disp-flex.flex-direction_row-reverse{
  -webkit-box-direction:reverse;
  -moz-box-direction:reverse;
  -webkit-box-orient:horizontal;
  -moz-box-orient:horizontal;
  -webkit-flex-direction:row-reverse;
  -moz-flex-direction:row-reverse;
  flex-direction:row-reverse;
}

/* flex-direction:下から上 */
.disp-flex.flex-direction_column-reverse{
  -webkit-box-direction:reverse;
  -moz-box-direction:reverse;
  -webkit-box-orient:vertical;
  -moz-box-orient:vertical;
  -webkit-flex-direction:column-reverse;
  -moz-flex-direction:column-reverse;
  flex-direction:column-reverse;
}


/* align-content:等幅 */
.disp-flex.align-content_space-between{
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  flex-wrap:wrap;
  -webkit-flex-line-pack:justify;
  -moz-flex-line-pack:justify;
  -webkit-align-content:space-between;
  -moz-align-content:space-between;
  align-content:space-between;
}
 
/* align-content:等幅（先端・終端にも余白） */
.disp-flex.align-content_space-between{
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  flex-wrap:wrap;
  -webkit-flex-line-pack:distribute;
  -moz-flex-line-pack:distribute;
  -webkit-align-content:space-around;
  -moz-align-content:space-around;
  align-content:space-around;
}
 
/* align-content:上寄せ */
.disp-flex.align-content_start{
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  flex-wrap:wrap;
  -webkit-flex-line-pack:start;
  -moz-flex-line-pack:start;
  -webkit-align-content:flex-start;
  -moz-align-content:flex-start;
  align-content:flex-start;
}
 
/* align-content:下寄せ */
.disp-flex.align-content_end{
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  flex-wrap:wrap;
  -webkit-flex-line-pack:end;
  -moz-flex-line-pack:end;
  -webkit-align-content:flex-end;
  -moz-align-content:flex-end;
  align-content:flex-end;
}
 
/* align-content:中央 */
.disp-flex.align-content_center{
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  flex-wrap:wrap;
  -webkit-flex-line-pack:center;
  -moz-flex-line-pack:center;
  -webkit-align-content:center;
  -moz-align-content:center;
  align-content:center;
}
 
/* align-content:全体幅（初期値） */
.disp-flex.align-content_stretch{
  -webkit-flex-wrap:wrap;
  -moz-flex-wrap:wrap;
  flex-wrap:wrap;
  -webkit-flex-line-pack:stretch;
  -moz-flex-line-pack:stretch;
  -webkit-align-content:stretch;
  -moz-align-content:stretch;
  align-content:stretch;
}

.disp-flex > .flex-item.flex-grow{
  -webkit-box-flex:1;
  -moz-box-flex:1;
  -webkit-flex-grow:1;
  -moz-flex-grow:1;
  flex-grow:1;
}


/* area_flexの子要素に対してvertical-alignのような扱いをさせる */
.area_flex > *{
  -webkit-box-align:center;
  -moz-box-align:center;
  -ms-flex-align:center;
  -webkit-align-items:center;
  -moz-align-items:center;
  align-items:center;
  -webkit-box-pack:center;
  -moz-box-pack:center;
  -webkit-flex-pack:center;
  -moz-flex-pack:center;
  -ms-flex-pack:center;
  -webkit-justify-content:center;
  -moz-justify-content:center;
  justify-content:center;
}

/* .disp-flexの子要素のうち、可変領域に指定 */
.disp-flex > .variable{
  -webkit-box-flex:1;
  -moz-box-flex:1;
  -ms-flex-positive:1;
  -webkit-flex:1;
  -moz-flex:1;
  flex:1;
}

/* flex-itemの数調整 */
html .disp-flex .blank_area{
  display: none !important;
  -webkit-box-flex:1;
  -moz-box-flex:1;
  -webkit-flex-grow:1;
  -moz-flex-grow:1;
  flex-grow:1;
}

/* table -----------------------------------------------------------*/
.table{
  display: table;
  border-collapse: collapse;
}
.table.fixed{table-layout: fixed;}

.table > .row{ display: table-row; }

.table > .cell,
.table > .row > .cell{ display: table-cell; }


/* inline-block --------------------------------------------------- */


/* inline-block --------------------------------------------------- */


/* inline-block --------------------------------------------------- */

/* ===================================================================
media screen
=================================================================== */
/* スマホ */
@media screen and (max-width: 639px){
}

/* タブレット1 */
@media screen and (min-width: 640px) and (max-width: 799px){
}

/* タブレット2以下 */
@media screen and (max-width: 799px){
  .table:not(.not-res),
  .table:not(.not-res) > .cell,
  .table:not(.not-res) > .row,
  .table:not(.not-res) > .row > .cell
  { display: block; }
}


/* タブレット2以上 */
@media screen and (min-width: 800px){
}

/* ipad */
@media screen and (min-width: 800px) and (max-width: 1023px){

}

/* ipad以下 */
@media screen and (max-width: 1023px){
  .inner-margin{ margin: 1.5rem 1rem; }
  .inner-padding{ padding: 1.5rem 1rem; }
}

/* PC */
@media screen and (min-width: 1024px){
}