@charset "utf-8";

/*  2021.10.07 update ver012 ---------------------*/

/* フォント　 ==============================*/
/* 基本テキスト　　*/

.msw-text{font-size:75%;line-height:1.5;}

/* テキストサイズ  通常は75%(12px)設定 */
.text_SS{font-size: 62.3%;line-height:1.5;}  /*10px*/
.text_S {font-size: 68.75%;line-height:1.5;} /*11px*/
.text_L {font-size: 87.5%;line-height:1.5;}  /*14px*/
.text_LL{font-size: 100%;line-height:1.5;}   /*16px*/


/* テキスト　ノーマル */
.text-nomal { font-weight: normal;}
/* テキスト　太字 */
.text-bold { font-weight: 700;}
/* テキストリセット */
.text-reset { font-size: 100% !important; }

/* 太文字タイトル　＋　テキスト　 */
/* DL */
dl.dl-nomal{margin: 0 0 20px;}
dl.dl-nomal dt,dl.dl-nomal dd{
font-size: 75%;
line-height: 1.5;
margin-bottom: 0.4em;
}
dl.dl-nomal dt {font-size: 87.5%;font-weight: 700; margin-top: 1em;}
dl.dl-nomal dt:first-child {margin-top: 0;}

/* P */
p.p-title{font-size: 87.5%;font-weight: 700; margin-bottom: 0.4em;}
p.p-text{font-size: 75%; margin-bottom: 20px;}


/* 見出し　 ==============================*/
/* 01 見出し　　右側にテキスト/画像 */
/*.テキスト */
span.r-txt{
display:inline-block;
position:absolute;
right:10px;
font-weight: normal;
text-indent: 0;
}
/* 画像 */
img.r-img{
display:inline-block;
position:absolute;
right:10px;
font-weight: normal;
}

/* 見出し　テキストのみ　黒文字 16px */
.msw-heading_txt{
font-size:95%;
font-weight:700;
line-height:1.5;
margin-bottom:16px;
}

/* 見出し　背景→薄いグレー、topにグレーのドットライン */
.msw-heading_dot{
font-size:90%;
font-weight:700;
line-height:1.5;
border-top: #bdbdbd dotted 1px;
background-color: #f3f3f3;
margin-bottom:16px;
padding: 5px 0 5px 10px;
}

/* 見出し　背景→グレー、テキスト→白 */
.msw-heading_gray-white{
font-size:90%;
font-weight:700;
line-height:1.5;
background-color: #999;
margin-bottom:16px;
padding: 5px 0 5px 10px;
color: #FFF;
}



/* カラムレイアウト　等倍 ==============================*/
/*2カラム　均等レイアウト*/

div.con_item2{
display: flex;
flex-wrap:wrap;
justify-content: space-between;
}
div.con_item2 div.div_item{
width: calc((100% - 40px)/2);
margin-bottom: 20px;
box-sizing: border-box;
}

/*3カラム　均等レイアウト*/
div.con_item3{
display: flex;
flex-wrap:wrap;
justify-content: space-between;
}
div.con_item3 div.div_item{
width: calc((100% - 60px)/3);
margin-bottom: 20px;
box-sizing: border-box;
}

/*4カラム　均等レイアウト*/
div.con_item4,
div.con_item4-sp2{
display: flex;
flex-wrap:wrap;
justify-content: space-between;
}
div.con_item4 div.div_item,
div.con_item4-sp2 div.div_item{
width: calc((100% - 60px)/4);
margin-bottom: 20px;
box-sizing: border-box;
}

/*5カラム　均等レイアウト*/
div.con_item5,
div.con_item5-sp3,
div.con_item5-sp2{
display: flex;
flex-wrap:wrap;
justify-content: space-between;
}

div.con_item5 div.div_item,
div.con_item5-sp3 div.div_item,
div.con_item5-sp2 div.div_item{
width: calc((100% - 40px)/5);
margin-bottom: 20px;
box-sizing: border-box;
}


/* リスト　==============================*/

/*リスト　2カラム　*/
.fa-normal_list.msw-normal_list_col2 ul li,
.fa-normal_list.msw-normal_list_col2-sp2 ul li{width:calc(50% - 20px);}
/*リスト　4カラム　*/
.fa-normal_list.msw-normal_list_col4 ul li,
.fa-normal_list.msw-normal_list_col4-sp2 ul li{width:calc(25% - 20px);}

/* list-style-none */
.list_style_none{list-style-type: none !important;}

/*リスト　該当箇所を赤く　*/
ul li .current{
color: #e60000;
text-decoration: underline;
}

/* 注釈 （リスト）==============================*/
/* 半角 * */
ul.notes-nomal{margin: 0 0 20px;}
ul.notes-nomal li{
font-size: 75%;
line-height: 1.5;
margin-bottom: 0.4em;
text-indent: -1.2em;
padding-left:1.2em;
}
ul.notes-nomal li span{ padding-right: 0.5em;}

/* 数字あり * */
ul.notes-num{
margin: 0 0 20px;
}
ul.notes-num li{
font-size: 75%;
line-height: 1.5;
margin-bottom: 0.4em;
text-indent: -1.8em;
padding-left:1.8em;
}
ul.notes-num li span{ padding-right: 0.5em;}


/*  カラー  //////////////////////////////////////////////*/
/* カラー */
.notice { color: #FF0000;}

.red      { color: #E61717;} /*三菱レッド*/
.gray     { color: #b6b6b6;}/* 6/24変更した　他に影響しないといいけど */
.lightGray{ color: #e2e1e6;} 
.darkGray { color: #888888;} 
.blue     { color: #3789be;} 
.lightBlue{ color: #98a6c0;} 
.darkBlue { color: #8b8da2;} 
.skyBlue  { color: #00a1e9;}
.navy     { color: #003465;}
.lightNavy{ color: #697b91;}

/* 背景色 */
.bg_red      { background-color: #E61717;} /* NEW */
.bg_gray     { background-color: #b6b6b6;}
.bg_lightGray{ background-color: #e2e1e6;} 
.bg_darkGray { background-color: #888888;} 
.bg_blue     { background-color: #3789be;} 
.bg_lightBlue{ background-color: #98a6c0;} 
.bg_darkBlue { background-color: #8b8da2;} 
.bg_skyBlue  { background-color: #00a1e9;} /* Ver.UP */
.bg_navy     { background-color: #003465;}
.bg_lightNavy{ background-color: #697b91;}


/* 背景色ありテキスト //////////////////////////*/
.bg_icon {
color: #FFF;
font-size: 75%;
font-weight: 800;
padding:2px 5px 0px;
text-align: center;
display: inline-block;
letter-spacing: 0.1em;
}

@media only screen and (max-width: 768px) {
.bg_icon {
	font-size: 90%;
	padding:2px 5px;
	margin-bottom: 2px; /* 21/10/07追加*/
	}
}

/* テーブル関係 //////////////////////////*/
/* 折り返さない */
.table_nowrap {white-space: nowrap;}
/* 斜線の代わりにグレーアウトする */
.table_diagonal {background-color:#e6e6e6;}
/* セルの左右ボーダーを非表示にする 　左右のセル両方に設定をする必要あり*/
.table_boder_r_none{border-right: none !important;}
.table_boder_l_none{border-left: none !important;}

/* 横スクロールと自動改行を両立させる */
/* .fa-heading_table_scrollは使用しない */
.msw-heading_table_scroll {
overflow: auto;
}
.msw-heading_table_scroll table {
table-layout: fixed;
width:780px;
}

/* 横スクロールなし、th tdをカラム落ちさせる */
/* <div class="fa-heading_table fa-heading_table_scroll">は使用しない */
table.fa-heading_table_content.table_column .pcview {display: table-row;}

/* 関連資料欄で、自動生成されるテーブルの横幅を100％に指定 */
table.fa-heading_table_content.table_column table{width:100%;}

/* 関連資料欄で、画像のテーブルと資料番号のテーブルに枠線をつけない。docLinkSiryoのpaddingを0にする。 */
table.fa-heading_table_content.table_column table td.docLinkImage {border:none;}
table.fa-heading_table_content.table_column table td.docLinkSiryo {border:none;font-size:100%;text-align:left;padding: 0;}

/* GOTのみ　関連資料欄で、画像の枠を削除 */
#bu-got table.fa-heading_table_content.table_column table td.docLinkImage img{border:none;}


/* スマホ時、左固定右スクロールのテーブル */

.msw-heading_table_content{
border-collapse:collapse;
font-size:75%;
}

.msw-heading_table_content td,.msw-heading_table_content th{
padding:8px;
border:1px solid #ccc}

.msw-heading_table_content td p,.msw-heading_table_content th p{
margin-bottom:1em}
.msw-heading_table_content th{
background-color:#e6e6e6
}

.msw-heading_table_right_scroll{
display:flex;
}

/* 高さ指定：2行 */
.msw-heading_table_right_scroll .lines-2,
.msw-heading_table_right_scroll .lines-2-kome{
height:36px;
}
/* 高さ指定：3行 */
.msw-heading_table_right_scroll .lines-3,
.msw-heading_table_right_scroll .lines-3-kome,
.msw-heading_table_right_scroll .lines-3-kome-2{
height:54px;
}
/* 高さ指定：4行 */
.msw-heading_table_right_scroll .lines-4,
.msw-heading_table_right_scroll .lines-4-kome,
.msw-heading_table_right_scroll .lines-4-kome-2,
.msw-heading_table_right_scroll .lines-4-kome-3{
height:72px;
}
/* 高さ指定：5行 */
.msw-heading_table_right_scroll .lines-5,
.msw-heading_table_right_scroll .lines-5-kome,
.msw-heading_table_right_scroll .lines-5-kome-2,
.msw-heading_table_right_scroll .lines-5-kome-3,
.msw-heading_table_right_scroll .lines-5-kome-4{
height:90px;
}

.msw-heading_table_right_scroll .msw-heading_table_content.right-table td,
.msw-heading_table_right_scroll .msw-heading_table_content.right-table th{
border-left:none;/* 右のテーブルの左線無し */
}

.msw-heading_table_right_scroll .left-table{
white-space: nowrap; /* 改行しない */
}

.msw-heading_table_right_scroll .right-scroll-table-box{
flex-basis:100%;/* 右のテーブルの幅を100％に設定 */
}
.msw-heading_table_right_scroll .right-table{
width:100%;/* 右のテーブルの幅を100％に設定 */
}

@media only screen and (max-width: 768px) {

.msw-heading_table_right_scroll .right-scroll-table-box{
display: block;
overflow: scroll;
}

.msw-heading_table_right_scroll .right-table{
white-space: nowrap; /* 改行しない */
}


.msw-heading_table_right_scroll .lines-2{
height:34px;/* 高さ指定：2行 */
}
.msw-heading_table_right_scroll .lines-2-kome{
height:38px;/* 高さ指定：2行(注釈) */
}
.msw-heading_table_right_scroll .lines-3{
height:51px;/* 高さ指定：3行 */
}
.msw-heading_table_right_scroll .lines-3-kome{
height:55px;/* 高さ指定：3行(注釈) */
}
.msw-heading_table_right_scroll .lines-3-kome-2{
height:59px;/* 高さ指定：3行(注釈2行) */
}
.msw-heading_table_right_scroll .lines-4{
height:68px;/* 高さ指定：4行 */
}
.msw-heading_table_right_scroll .lines-4-kome{
height:72px;/* 高さ指定：4行(注釈1行) */
}
.msw-heading_table_right_scroll .lines-4-kome-2{
height:76px;/* 高さ指定：4行(注釈2行) */
}
.msw-heading_table_right_scroll .lines-4-kome-3{
height:80px;/* 高さ指定：4行(注釈3行) */
}
.msw-heading_table_right_scroll .lines-5{
height:85px;/* 高さ指定：5行 */
}
.msw-heading_table_right_scroll .lines-5-kome{
height:89px;/* 高さ指定：5行(注釈) */
}
.msw-heading_table_right_scroll .lines-5-kome-2{
height:93px;/* 高さ指定：5行(注釈2行) */
}
.msw-heading_table_right_scroll .lines-5-kome-3{
height:97px;/* 高さ指定：5行(注釈3行) */
}
.msw-heading_table_right_scroll .lines-5-kome-4{
height:101px;/* 高さ指定：5行(注釈4行) */
}

.msw-heading_table_content td,.msw-heading_table_content th{
	font-size:14px;
}
}

/* 画像　 //////////////////////////*/

/* 100％表示 (はみ出る時に対応) */
.img_100pa img,
img.img_100pa{max-width: 100%;height: auto;}

/* borderをつける */
.img_border img,.img_border{border:  1px solid #ccc;}

/* PCスマホで表示非表示 //////////////////////////////////////////////*/
.pcview {display: block;}
.spview {display: none;}

/* PCスマホ別に改行をいれる　 //////////////////////////*/
.br_pc { display:block; }
.br_sp { display:none; }


/*  レイアウト  //////////////////////////////////////////////*/

/* float　*/
.floatL{ float:left;}
.floatR{ float:right;}
.clear{ clear:both;}


/* 位置揃え　*/
.align-l{text-align: left;}
.align-r{text-align: right;}
.align-c{text-align: center;}

/* display */
.disp_il_block {display: inline-block;}
.disp_block {display: block;}

/* postion */
.position_rela{ position: relative;}
.position_abso{ position: absolute;}



/* margin
--------------------------*/
/* top */
.mt0  { margin-top:    0 !important; }
.mt05 { margin-top:  5px !important; }
.mt10 { margin-top: 10px !important; }
.mt15 { margin-top: 15px !important; }
.mt20 { margin-top: 20px !important; }
.mt25 { margin-top: 25px !important; }
.mt30 { margin-top: 30px !important; }
.mt35 { margin-top: 35px !important; }
.mt40 { margin-top: 40px !important; }
.mt45 { margin-top: 45px !important; }
.mt50 { margin-top: 50px !important; }
/* bottom */
.mb0  { margin-bottom:    0 !important; }
.mb05 { margin-bottom:  5px !important; }
.mb10 { margin-bottom: 10px !important; }
.mb15 { margin-bottom: 15px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb25 { margin-bottom: 25px !important; }
.mb30 { margin-bottom: 30px !important; }
.mb35 { margin-bottom: 35px !important; }
.mb40 { margin-bottom: 40px !important; }
.mb45 { margin-bottom: 45px !important; }
.mb50 { margin-bottom: 50px !important; }
/* right */
.mr0  { margin-right:    0 !important; }
.mr05 { margin-right:  5px !important; }
.mr10 { margin-right: 10px !important; }
.mr15 { margin-right: 15px !important; }
.mr20 { margin-right: 20px !important; }
.mr25 { margin-right: 25px !important; }
.mr30 { margin-right: 30px !important; }
.mr35 { margin-right: 35px !important; }
.mr40 { margin-right: 40px !important; }
.mr45 { margin-right: 45px !important; }
.mr50 { margin-right: 50px !important; }
/* left */
.ml0  { margin-left:    0 !important; }
.ml05 { margin-left:  5px !important; }
.ml10 { margin-left: 10px !important; }
.ml15 { margin-left: 15px !important; }
.ml20 { margin-left: 20px !important; }
.ml25 { margin-left: 25px !important; }
.ml30 { margin-left: 30px !important; }
.ml35 { margin-left: 35px !important; }
.ml40 { margin-left: 40px !important; }
.ml45 { margin-left: 45px !important; }
.ml50 { margin-left: 50px !important; }

/* padding
--------------------------*/
/* top */
.pt0 { padding-top: 0 !important; }
.pt05 { padding-top: 5px !important; }
.pt10 { padding-top: 10px !important; }
.pt15 { padding-top: 15px !important; }
.pt20 { padding-top: 20px !important; }
.pt25 { padding-top: 25px !important; }
.pt30 { padding-top: 30px !important; }
.pt35 { padding-top: 35px !important; }
.pt40 { padding-top: 40px !important; }
.pt45 { padding-top: 45px !important; }
.pt50 { padding-top: 50px !important; }
/*bottom*/
.pb0 { padding-bottom: 0 !important; }
.pb05 { padding-bottom: 5px !important; }
.pb10 { padding-bottom: 10px !important; }
.pb15 { padding-bottom: 15px !important; }
.pb20 { padding-bottom: 20px !important; }
.pb25 { padding-bottom: 25px !important; }
.pb30 { padding-bottom: 30px !important; }
.pb35 { padding-bottom: 35px !important; }
.pb40 { padding-bottom: 40px !important; }
.pb45 { padding-bottom: 45px !important; }
.pb50 { padding-bottom: 50px !important; }
/* right */
.pr0 { padding-right: 0 !important; }
.pr05 { padding-right: 5px !important; }
.pr10 { padding-right: 10px !important; }
.pr15 { padding-right: 15px !important; }
.pr20 { padding-right: 20px !important; }
.pr25 { padding-right: 25px !important; }
.pr30 { padding-right: 30px !important; }
.pr35 { padding-right: 35px !important; }
.pr40 { padding-right: 40px !important; }
.pr45 { padding-right: 45px !important; }
.pr50 { padding-right: 50px !important; }
/* left */
.pl0 { padding-right: 0 !important; }
.pl05 { padding-right: 5px !important; }
.pl10 { padding-right: 10px !important; }
.pl15 { padding-right: 15px !important; }
.pl20 { padding-right: 20px !important; }
.pl25 { padding-right: 25px !important; }
.pl30 { padding-right: 30px !important; }
.pl35 { padding-right: 35px !important; }
.pl40 { padding-right: 40px !important; }
.pl45 { padding-right: 45px !important; }
.pl50 { padding-right: 50px !important; }


/* 1カラム用 ////////////////////////////////////////*/
/* 1カラム時にフッタのサポート情報の幅が足りなくなるのを修正 FDM制作のstyle.ccに補足 */
#melfa_contents_1col .fa-support_info_title{background-size: cover;}

/* お問い合わせ・購入・見積もり仕様・機能よくあるご質問　の上下スペース調節用 */
#melfa_contents_1col .fa-contents_nav{margin-top: 0;}
#melfa_contents_1col .fa-contents_inquiry{margin-bottom:5px;}


/*////////////////////////////////////////////////////////////////////////////*/
/*　ス　マ　ホ　表　示
//////////////////////////////////////////////////////////////////////////////*/

@media only screen and (max-width: 768px){

/* フォントサイズのセット　 ==============================*/
ul.notes-nomal li,
ul.notes-num li
{font-size: 14px; line-height: 1.5;
}

/* 基本テキスト　14px; div等に使用 */
.msw-text{font-size: 14px; line-height: 1.5;}


/* テキストサイズ  通常は14px設定 */
p.text_SS{font-size: 12px;}
p.text_S{font-size: 12px;}


/* 上付き文字 */
article sup{
vertical-align: super;
font-size: 70%;
}


/* 01 見出し　1-2 H2　右側にテキスト 　下に落とす*/
span.r-txt {display:block;position:static;}
img.r-img {display:block;position:static;margin-top:5px;}

h3 span.r-txt {margin: 5px 0 0 0;}



/* 見出し　テキストのみ　黒文字 16px */
.msw-heading_txt{
font-size: 16px;
margin-top: 20px;
}

/* 見出し　背景→薄いグレー、topにグレーのドットライン */
.msw-heading_dot{
font-size: 16px;
margin-top: 20px;
}



/* カラムレイアウト　等倍 ==============================*/
div.con_item2 div.div_item,
div.con_item3 div.div_item,
div.con_item4 div.div_item{
width: 100%;
}

div.con_item4-sp2 div.div_item{width: calc((100% - 20px)/2);}
div.con_item5-sp3 div.div_item{width: calc((100% - 20px)/3);}
div.con_item5-sp2 div.div_item{width: calc((100% - 20px)/2);}


/*均等配置したリストの最終行を、左寄せにする方法（ justify-content: space-between使用）*/
div.con_item5-sp3::after {
content: "";
width: calc((100% - 20px)/3);
display: block;
height: 0;
}


/* リスト　==============================*/

/*リスト　2カラム　*/
.fa-normal_list.msw-normal_list_col2 ul li{width:calc(100%);}
/*リスト　4カラム　*/
.fa-normal_list.msw-normal_list_col4 ul li{width:calc(100%);}
.fa-normal_list.msw-normal_list_col4-sp2 ul li{width:calc(50% - 20px);}

/* 太文字タイトル　＋　テキスト　==============================*/
/* DL */
dl.dl-nomal dt{font-size: 16px;}
dl.dl-nomal dd{font-size: 14px;}
/* p */
p.p-title{font-size: 16px;}
p.p-text {font-size: 14px;}



/* PCスマホで表示非表示 //////////////////////////////////////////////*/
.pcview {
display: none;
}
.spview {
display: block;
}

/* スマホのみ　位置揃え　 ==============================*/
.sp_align-c{text-align: center;}
.sp_align-l{text-align: left;}
.sp_align-r{text-align: right;}
.sp_margin_auto{ margin: 0 auto;}

/* PCスマホ別に改行をいれる　 //////////////////////////*/
.br_pc { display:none; }
.br_sp { display:block; }


/* テーブル関係 //////////////////////////*/
/* 横スクロールなし、th tdをカラム落ちさせる */
/* <div class="fa-heading_table fa-heading_table_scroll">は使用しない */
table.fa-heading_table_content.table_column th { display: block;margin-top: 16px;}
table.fa-heading_table_content.table_column tr:first-child th:first-child { margin-top: 0;}
table.fa-heading_table_content.table_column td { display: block; border: none; border-bottom: 1px dotted #CCC;padding-top: 14px; padding-bottom: 14px;}
table.fa-heading_table_content.table_column tr td:last-child { border-bottom: none;}
table.fa-heading_table_content.table_column .pcview{display: none;}
/*trタグにClass「line_solid」を付けると、テーブルセル間の線が実線になる*/
table.fa-heading_table_content.table_column tr.line_solid {border-top:1px solid #CCC;}/* 21/10/07追加 */
}
