
/*テキストの間隔調整
------------------------- */
.text_comfortable{letter-spacing: 0.06em;}

/* 画像
------------------------- */
.img100{width:100%;}


/* リンクの枠線を消す
------------------------- */
a { outline: none;}
a:focus, *:focus { outline:none; }

/* margin
------------------------- */

.mt05 {margin-top: 5px;}  .mb05 {margin-bottom: 5px;}
.mt10 {margin-top: 10px;}  .mb10 {margin-bottom: 10px;}
.mt15 {margin-top: 15px;}  .mb15 {margin-bottom: 15px;}
.mt20 {margin-top: 20px;}  .mb20 {margin-bottom: 20px;}
.mt25 {margin-top: 25px;}  .mb25 {margin-bottom: 25px;}
.mt30 {margin-top: 30px;}  .mb30 {margin-bottom: 30px;}
.mt35 {margin-top: 35px;}  .mb35 {margin-bottom: 35px;}
.mt40 {margin-top: 40px;}  .mb40 {margin-bottom: 40px;}
.mt45 {margin-top: 45px;}  .mb45 {margin-bottom: 45px;}
.mt50 {margin-top: 50px;}  .mb50 {margin-bottom: 50px;}
.mt55 {margin-top: 55px;}  .mb55 {margin-bottom: 55px;}
.mt60 {margin-top: 60px;}  .mb60 {margin-bottom: 60px;}
.mt65 {margin-top: 65px;}  .mb65 {margin-bottom: 65px;}
.mt70 {margin-top: 70px;}  .mb70 {margin-bottom: 70px;}
.mt75 {margin-top: 75px;}  .mb75 {margin-bottom: 75px;}
.mt80 {margin-top: 80px;}  .mb80 {margin-bottom: 80px;}
.mt85 {margin-top: 85px;}  .mb85 {margin-bottom: 85px;}
.mt90 {margin-top: 90px;}  .mb90 {margin-bottom: 90px;}
.mt95 {margin-top: 95px;}  .mb95 {margin-bottom: 95px;}
.mt100 {margin-top: 100px;}  .mb100 {margin-bottom: 100px;}

.ml05{margin-left:5px;}  .mr05{margin-right:5px;}
.ml10{margin-left:10px;}  .mr10{margin-right:10px;}
.ml15{margin-left:15px;}  .mr15{margin-right:15px;}
.ml20{margin-left:20px;}  .mr20{margin-right:20px;}
.ml25{margin-left:25px;}  .mr25{margin-right:25px;}
.ml30{margin-left:30px;}  .mr30{margin-right:30px;}
.ml35{margin-left:35px;}  .mr35{margin-right:35px;}
.ml40{margin-left:40px;}  .mr40{margin-right:40px;}
.ml45{margin-left:45px;}  .mr45{margin-right:45px;}
.ml50{margin-left:50px;}  .mr50{margin-right:50px;}

.mb50sp30{margin-bottom: 50px;}
.mb50sp00{margin-bottom: 50px;}



@media only screen and (max-width: 767px) {
.mb50sp30{margin-bottom: 30px;}
.mb50sp00{margin-bottom: 0px;}
.sp_mt00{margin-top:0;}
.sp_mb00{margin-bottom:0;}
.sp_pt00{padding-top:0;}
.sp_pb00{padding-bottom:0;}
}

/* padding
------------------------- */

.pt05 {padding-top: 5px;}  .pb05 {padding-bottom: 5px;}
.pt10 {padding-top: 10px;}  .pb10 {padding-bottom: 10px;}
.pt15 {padding-top: 15px;}  .pb15 {padding-bottom: 15px;}
.pt20 {padding-top: 20px;}  .pb20 {padding-bottom: 20px;}
.pt25 {padding-top: 25px;}  .pb25 {padding-bottom: 25px;}
.pt30 {padding-top: 30px;}  .pb30 {padding-bottom: 30px;}
.pt35 {padding-top: 35px;}  .pb35 {padding-bottom: 35px;}
.pt40 {padding-top: 40px;}  .pb40 {padding-bottom: 40px;}
.pt45 {padding-top: 45px;}  .pb45 {padding-bottom: 45px;}
.pt50 {padding-top: 50px;}  .pb50 {padding-bottom: 50px;}
.pt55 {padding-top: 55px;}  .pb55 {padding-bottom: 55px;}
.pt60 {padding-top: 60px;}  .pb60 {padding-bottom: 60px;}
.pt65 {padding-top: 65px;}  .pb65 {padding-bottom: 65px;}
.pt70 {padding-top: 70px;}  .pb70 {padding-bottom: 70px;}
.pt75 {padding-top: 75px;}  .pb75 {padding-bottom: 75px;}
.pt80 {padding-top: 80px;}  .pb80 {padding-bottom: 80px;}
.pt85 {padding-top: 85px;}  .pb85 {padding-bottom: 85px;}
.pt90 {padding-top: 90px;}  .pb90 {padding-bottom: 90px;}
.pt95 {padding-top: 95px;}  .pb95 {padding-bottom: 95px;}
.pt100 {padding-top: 100px;}  .pb100 {padding-bottom: 100px;}

.pl05{padding-left:5px;}  .pr05{padding-right:5px;}
.pl10{padding-left:10px;}  .pr10{padding-right:10px;}
.pl15{padding-left:15px;}  .pr15{padding-right:15px;}
.pl20{padding-left:20px;}  .pr20{padding-right:20px;}
.pl25{padding-left:25px;}  .pr25{padding-right:25px;}
.pl30{padding-left:30px;}  .pr30{padding-right:30px;}
.pl35{padding-left:35px;}  .pr35{padding-right:35px;}
.pl40{padding-left:40px;}  .pr40{padding-right:40px;}
.pl45{padding-left:45px;}  .pr45{padding-right:45px;}
.pl50{padding-left:50px;}  .pr50{padding-right:50px;}



/* 色指定
------------------------- */
.color_primary{color:#000;}　 /*クライアントカスタマイズ*/
.color_secondly{color:#000;}　 /*クライアントカスタマイズ*/
.color_accent{color:#000;}　 /*クライアントカスタマイズ*/


/* 背景色
------------------------- */



/* 文字揃え
------------------------- */
.textC,text_center{text-align:center;}
.textR,text_right{text-align:right;}
.textL;text_left{text-align:left;}
.textLspC{text-align:Left;}
.textCspL{text-align:center;}
.textCspR{text-align:center;}

.br::before {
	content: "\A" ;
	white-space: pre ;
}

@media only screen and (max-width: 767px) {
.textCspL{text-align:left;}
.textLspC{text-align:center;}
.textCspR{text-align:right;}
.sp_text_center{text-align:center;}
.sp_text_left{text-align:left;}
.sp_text_right{text-align:right;}
}

/* 文字装飾
------------------------- */
.size110{font-size:110%;}
.size120{font-size:120%;}

.bold{font-weight:600;}


/* ボックス枠
------------------------- */
/* テーブル
------------------------- */
.table{
border-collapse: collapse;
width:100%;
}

.table_auto{table-layout:auto;
width:100%;}


/* ul リスト装飾
------------------------- */

.ul_circle{width:100%;padding-left:1.2em;}
.ul_circle li{	list-style-type: none;line-height:1.5;text-indent:-.6em;margin-bottom:.2em;}
.ul_circle li:before{
	content: '';
	width: 8px;
	height: 8px;
	display: inline-block;
	border-radius: 50%;
	background: #ccc; /*クライアントカスタマイズ*/
	position: relative;
	left: -.4em;
	top: 0px;
}

.ul_basic{width:100%;padding-left:1.2em;}
.ul_basic li,.singleListCircle{	list-style-type: none;line-height:1.6;text-indent:-.6em;}
.ul_basic li:before,.singleListCircle:before {
	content: '';
	width: 8px;
	height: 8px;
	display: inline-block;
	border-radius: 50%;
	background: #ccc;
	position: relative;
	left: -.4em;
	top: 0px;
}

.single_list_circle{margin-left:.6em;padding-left:.6em;text-indent:-1em;line-height:1.5;margin-bottom:.4em;}
.single_list_circle:before {
	content: '';
	width: 8px;
	height: 8px;
	display: inline-block;
	border-radius: 50%;
	background: #ccc; /*クライアントカスタマイズ*/
	position: relative;
	left:-0.1em;
	top: 0px;
}

.ul_square{width:100%;padding-left:1.6em;}
.ul_square li{	list-style-type: none;line-height:1.5;text-indent:-1.2em;margin-bottom:.4em;}
.ul_square li:before{
	content: '';
	width: 12px;
	height: 12px;
	display: inline-block;
	background: #ccc; /*クライアントカスタマイズ*/
	position: relative;
	left: -.4em;
	top: 0px;
}

.single_list_square{margin-left:.5em;padding-left:.6em;text-indent:-1em;line-height:1.5;margin-bottom:.4em;}
.single_list_square:before {
	content: '';
	width: 12px;
	height: 12px;
	display: inline-block;
	background: #ccc;
	position: relative;
	left:-0.1em;
	top: 0px;
}


.marker_red li:before,
.marker_red:before{
	background: red; /*クライアントカスタマイズ*/
}　


/* dl リスト装飾
------------------------- */
.dl_basic{line-height:1.4;margin-bottom:.5em;}
.dl_basic dt{font-weight:bold;margin-bottom:.2em;}
.dl_basic dd{margin-left:1em;margin-bottom:.4em;}





/* ボタン装飾
------------------------- */

/*ボタン　背景ベタ */
.btn_normal{
	display: flex;
	align-items: center;
	justify-content: center;
	background: #ccc; /*クライアントカスタマイズ*/
	border: solid 2px #ccc; /*クライアントカスタマイズ*/
	color: #000; /*クライアントカスタマイズ*/
	font-size: 1.6rem;
	font-weight: 600;
	height: auto;
	line-height: 1;
	padding: 1em;
	-webkit-transition: all 0.2s;
	transition: all 0.2s;
	width: 100%;height:48px;
}

.btn_normal > {
	display: block;
}
.btn_normal:hover {
	background: #000;
	border: solid 2px #000;
	color: #fff;
	opacity: 1;
}

/*ボタン　ボーダー */
.btn_border{
	display: flex;
	align-items: center;
	justify-content: center;
	border: solid 2px #7a1b1b; /*クライアントカスタマイズ*/
	color: #7a1b1b; /*クライアントカスタマイズ*/
	background:rgba(122,27,27,0);/*クライアントカスタマイズ*/
	font-size: 1.6rem;
	font-weight: 600;
	height: auto;
	line-height: 1;
	padding: 1em;
	-webkit-transition: all 0.2s;
	transition: all 0.2s;
	width: 100%;height:48px;
	width:96%;margin-left:2%;/*クライアントカスタマイズ横幅調整*/
}

.btn_border > {
	display: block;
}
.btn_border:hover {
	background: #7a1b1b;/*クライアントカスタマイズ*/
	border: solid 2px #7a1b1b;/*クライアントカスタマイズ*/
	color: #fff;/*クライアントカスタマイズ*/
	opacity: 1;
}

.btn_block{display:inline-block;width: auto;padding: 1em 1.5em;}


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

}
@media only screen and (max-width: 360px) {

}

/*　→ リンク
------------------------- */
.arrow_link {
position: relative;
display: inline-block;
padding: 0 5px 0 26px;
color: #000;
font-weight: 700;border-bottom:1px dotted #ccc;
}

.arrow_link:hover {
	border-bottom:1px dotted #000;/*クライアントカラーにカスタマイズ*/
}

.arrow_link:before,
.arrow_link:after{
position: absolute;
top: 0;
bottom: 0;
left: 0;
margin: auto;
content: "";
vertical-align: middle;
}

.arrow_link:before {
left: 2px;
width: 17px;
height: 2px;
background: #000;/*クライアントリンクカラーにカスタマイズ*/
}

.arrow_link:after{
left: 10px;
width: 8px;
height: 8px;
border-top: 2px solid #000;/*クライアントリンクカラーにカスタマイズ*/
border-right: 2px solid #000;/*クライアントリンクカラーにカスタマイズ*/
border-radius: 1px;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}


@media only screen and (max-width: 767px) {
.arrow_link,.arrow_link:hover  {border:0;}
}

/*　他ページ指定位置へのリンクがずれるのを防ぐ（必要に応じて使用）
------------------------- */
.link_offset{padding-top:80px;margin-top:-80px;}

@media only screen and (max-width: 767px) {
.link_offset{padding-top:150px;margin-top:-150px;}
}

/* 改行調整
------------------------- */
.brCont,br_cont{display:inline-block;}
.brContPC,br_cont_pc{display:inline-block;}
.brContSP,.br_cont_sp{display:inline;}

@media only screen and (max-width: 767px) {
.brContPC,br_cont_pc{display:inline;}
.brContSP,.br_cont_sp{display:inline-block;}
}


/* 罫線
------------------------- */



/* 時間経過でフェードイン
------------------------- */
.time_fadeIn {
    animation: fadeIn 3s ease 0s 1 normal;
    -webkit-animation: fadeIn 3s ease 0s 1 normal;
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}


/*モーダル
-------------------------------------------------- */

/* モーダルCSS */
.modalArea {
  display: none;
  position: fixed;
  z-index: 10; /*サイトによってここの数値は調整 */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.modalBg {
  width: 100%;
  height: 100%;
  background-color: rgba(30,30,30,0.9);
}

.modalWrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform:translate(-50%,-50%);
  width: 70%;
  max-width: 500px;
  padding: 10px 30px;
  background-color: #fff;
}

.closeModal {
  position: absolute;
  top: 0.5rem;
  right: 1rem;
  cursor: pointer;
}

@media only screen and (max-width: 767px) {
.modalWrapper {
 width:90%;
}
}

/*--------------------------------------------------
--------------------------------------------------
印刷用
-------------------------------------------------- 
-------------------------------------------------- */

@media print{
.st-header.is-fixed {
	position: rerative;}



}


