﻿@charset "utf-8";

/* font CSS */


/* テキストの共通クラス指定
---------------------------------------*/
.bold {font-weight: bold;}
.bold_li li{font-weight: bold;}
.ul_bold li{font-weight: bold;}
.normal {font-weight: normal !important;}

.f8{font-size: 8px !important;}
.f9{font-size: 9px !important;}
.f10{font-size: 10px !important;}
.f11{font-size: 11px !important;}
.f12{font-size: 12px;}
.f13{font-size: 13px;}
.f14{font-size: 14px;}
.f15{font-size: 15px;}
.f16{font-size: 16px;}
.f18{font-size: 18px;}
.f20{font-size: 20px;}
.f24{font-size: 24px;}
.f32{font-size: 32px;}
.f34{font-size: 34px;}

.f10B{font-size: 10px; font-weight:bold;}
.f11B{font-size: 11px; font-weight:bold;}
.f12B{font-size: 12px; font-weight:bold;}
.f13B{font-size: 13px; font-weight:bold;}
.f14B{font-size: 14px; font-weight:bold;}
.f16B{font-size: 16px; font-weight:bold;}
.f18B{font-size: 18px; font-weight:bold;}
.f20B{font-size: 20px !important; font-weight:bold;}
.f22B{font-size: 22px; font-weight:bold;}
.f24B{font-size: 24px !important; font-weight:bold;}
.f30B{font-size: 30px; font-weight:bold;}

.f9top{font-size:9px; vertical-align:top;}

ul.ul_f14 li{font-size: 14px; font-weight: normal;}


/* p ブロック行間設定
---------------------------------------------*/
.p1em{margin-bottom:1em;}
.p2em{margin-bottom:2em;}
.p3em{margin-bottom:3em;}
.p-1em{margin-top:-1.5em;}

/* テキスト 改行しない
---------------------------------------*/
.nowrap{white-space: nowrap;}


/* テキストカラー共通クラス指定
---------------------------------------*/
.white{color:#fff;}

.red{color:#e80601/*ff3300*/;}

.black{color: #333;}

.ora,.oraB,.ora14B,.ora28B{color:#e95d2c/*eb3d02*/;}
.oraB{font-weight: bold;}
.ora14B{font-size: 14px; font-weight: bold;}
.ora28B{font-size: 28px; font-weight: bold;}

.gray{color:#9e9e9e;}
.grayL{color:#5d5d5d;}
.blue{color: #2ea3d9 !important;}
.blueB{color: #03649b/*037ea8*/;}
.blueL{color:#458cb1;}

.green{color: #209d00;}
.greenL{color: #85b200;}
.greenB{color: #51bba7;}/*Cloud For Business*/
.yellowB{color: #f3b728;}/*専用サーバー*/
.purpleB{color: #7d5295;}/*AWS*/


/* テキスト行間　共通クラス指定
---------------------------------------*/
.lh100{line-height: 100%;}
.lh120{line-height: 120%;}
.lh130{line-height: 130%;}
.lh150{line-height: 150%;}
.lh160{line-height: 160%;}
.lh170{line-height: 170%;}
.lh180{line-height: 180%;}
.lh190{line-height: 190%;}
.lh200{line-height: 200%;}
.lh300{line-height: 300%;}

/* リスト行間
---------------------------------------*/
.lh_list5 li{padding-bottom: 5px;}
.lh_list10 li{padding-bottom: 10px;}


/* テキスト 配置指定
---------------------------------------*/
.textTop{vertical-align: text-top;}
.textMiddle{vertical-align: middle;}
.textBottom{vertical-align: text-bottom;}
.textBase{vertical-align: baseline;}

@media all and (-ms-high-contrast:none){
 *::-ms-backdrop, .noIE{vertical-align: text-top;} /* IE11 */
}

/* テキスト 字間
---------------------------------------*/
.ls_01{letter-spacing: -0.01em;}
.ls_02{letter-spacing: -0.02em;}
.ls_03{letter-spacing: -0.03em;}
.ls_04{letter-spacing: -0.04em;}
.ls_05{letter-spacing: -0.05em;}
.ls00{letter-spacing: 0.05em;}
.ls01{letter-spacing: 0.1em;}
.ls02{letter-spacing: 0.2em;}
.ls03{letter-spacing: 0.3em;}


/* テキスト インデント ドット
---------------------------------------*/

.indent_11pxdot li,p.indent_11pxdot{ background: url(/images/indent/indent_11pxdot.gif) no-repeat 0 6px;
	padding-left: 14px; margin-bottom: 3px;
    text-align: left;
	}

.indent_13pxdot li,p.indent_13pxdot,h3.indent_13pxdot,h4.indent_13pxdot,h5.indent_13pxdot{ background: url(/images/indent/indent_blue_dot.gif) no-repeat 0 6px;
	padding-left: 16px;
	}

.indent_7pxdotblue li,p.indent_7pxdotblue{ background: url(/images/indent/indent_blue_7px.png) no-repeat 0 7px; padding-left: 12px;
	}
	
.indent_7pxdotora li,p.indent_7pxdotora{ background: url(/images/indent/indent_ora_7px.png) no-repeat 0 7px; padding-left: 12px;
	}

.indent_7pxdotgray li,p.indent_7pxdotgray{ background: url(/images/indent/indent_gray_7px.png) no-repeat 0 7px; padding-left: 12px;
	}

/* テキスト インデント
---------------------------------------*/

.indent{text-indent: -1em; padding-left: 1em;}
.indentNum {
    text-indent: -2.0em;
    padding-left: 2.0em;
}
.indent1em li{text-indent: -1.2em; padding-left: 1.2em;}
.indent2em li{text-indent: -2.2em; padding-left: 2.2em;}

/* テキスト インデント 矢印
---------------------------------------*/
.arrowBold {font-size: 14px; font-weight: bold; background: url(/images/indent/arrow_gray11px.gif) no-repeat 0 7px; padding-left: 14px;  line-height:180%;
	}
.arrowindent {font-size: 12px; background: url(/images/indent/arrow_gray11px.gif) no-repeat 0 4px; padding-left: 14px;  line-height:180%;
	}

.arrowgray11px li { background: url(/images/indent/arrow_gray11px.gif) no-repeat 0 4px;
	padding-left: 14px; line-height:180%;
	}

.arrowblue11px li, p.arrowblue11px { font-size: 12px;
    background: url(/images/indent/arrow_blue11px.png) no-repeat 0 3px;
    padding-left: 14px;
    line-height: 180%;
    }

.arrowblue10px li, p.arrowblue10px { font-size: 10px;
	background: url(/images/indent/arrow_blue11px.png) no-repeat 0 1px;
	padding-left: 14px; line-height:180%;
	}

.arrowblue11pxs li, p.arrowblue11pxs {
	background: url(/images/indent/arrow_blue11px.png) no-repeat 0 4px;
	padding-left: 14px; line-height:170%;
	}

.arrowblue11pxss li, p.arrowblue11pxss { font-size: 13px;
	background: url(/images/indent/arrow_blue11px.png) no-repeat 0 3px;
	padding-left: 14px; line-height:180%;
	}

/* arrowblue16px font-size: 13px → 14px 20210823 16px gif→png*/
.arrowblue16px li, p.arrowblue16px { font-size: 14px; font-weight: bold;
	background: url(/images/indent/arrow_blue16px.png) no-repeat 0 3px;
	padding-left: 20px; line-height:180%;
	}

.arrowgray16px li, p.arrowgray16px { font-size: 13px; font-weight: bold;
	background: url(/images/indent/arrow_gray16px.gif) no-repeat 0 3px;
	padding-left: 20px; line-height:180%;
	}

.arrowgray9px li, p.arrowgray9px {
	background: url(/images/indent/arrow_gray_9px.png) no-repeat 0 3px;
	padding-left: 13px; line-height:180%;
	}

.arrowwhite12px li, p.arrowwhite12px{
	font-size: 13px;
	background: url(/images/indent/arrow_white12px.gif)no-repeat 0 2px;
	padding-left: 20px; line-height:180%;
	}

.arrow_blue15px{ padding-right: 20px;
	background:url(/images/indent/arrow_blue15px.png)no-repeat right;}

.arrow_green15px{ padding-right: 20px;
	background:url(/images/indent/arrow_green15px.png)no-repeat right;}

.arrow_ora15px{ padding-right: 20px;
	background:url(/images/indent/arrow_ora15px.png)no-repeat right;}

.indent_faq{ min-height: 35px; padding-left: 55px; padding-top: 7px;
	background:url(/images/icon/icon_qa.png)no-repeat 10px 0; }

.arrowblue_sc16px li, p.arrowblue_sc16px {
	background: url(/images/indent/arrow_blue_sc16px.gif) no-repeat 0 6px;
	padding-left: 20px; line-height:190%;
	}

.arrowblue_sc14px li, p.arrowblue_sc14px {
	background: url(/images/indent/arrow_blue_sc14px.gif) no-repeat 0 6px;
	padding-left: 20px; line-height:190%;
	}

.arrowblue_sc12px li, p.arrowblue_sc12px {
	background: url(/images/indent/arrow_blue_sc12px.gif) no-repeat 0 4px;
	padding-left: 20px; line-height:190%;
	}

/* メールアイコンの設定 */

.email-address_icon {
    position: relative;
    padding-left: 28px;/* アイコンの幅 + 余白を考慮 */
}

.email-address_icon::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;/* アイコンの幅 */
    height: 20px;/* アイコンの高さ */
    background-image: url(/images/indent/mail-icon.svg);
    background-size: cover;
}

@media only screen and (max-width: 768px) {

    /* テキスト 改行
    ---------------------------------------*/
    .sp-nowrap{white-space: nowrap;}
    .sp-wrap-normal {
        white-space: normal;
    }
    .arrowblue_sc16px li, p.arrowblue_sc16px {
        background: url(/images/indent/arrow_blue_sc16px.gif) no-repeat 0 6px;
        padding-left: 20px;
        line-height: 190%;
        font-size:14px !important;
    }
    .arrowblue11px li, p.arrowblue11px {
        font-size: 13px;
    }
    /*FAQ*/
    .indent_faq {
        padding-left: 45px; padding-top: 15px;
		min-height: 50px;
        background: url(/images/icon/icon_qa.png)no-repeat 0 8px;
    }

    /* テキスト行間　共通クラス指定
    ---------------------------------------*/
    .sp-lh50{line-height: 50% !important;}
    .sp-lh100{line-height: 100% !important;}
    .sp-lh120{line-height: 120% !important;}
    .sp-lh130{line-height: 130% !important;}
    .sp-lh150{line-height: 150% !important;}
    .sp-lh160{line-height: 160% !important;}
    .sp-lh170{line-height: 170% !important;}
    .sp-lh180{line-height: 180% !important;}
    .sp-lh190{line-height: 190% !important;}
    .sp-lh200{line-height: 200% !important;}
    .sp-lh300{line-height: 300% !important;}


    /* テキスト 字間
    ---------------------------------------*/
    .sp-ls_01{letter-spacing: -0.01em !important;}
    .sp-ls_02{letter-spacing: -0.02em !important;}
    .sp-ls_03{letter-spacing: -0.03em !important;}
    .sp-ls_04{letter-spacing: -0.04em !important;}
    .sp-ls_05{letter-spacing: -0.05em !important;}
    .sp-ls00{letter-spacing: 0.05em !important;}
    .sp-ls01{letter-spacing: 0.1em !important;}
    .sp-ls02{letter-spacing: 0.2em !important;}
    .sp-ls03{letter-spacing: 0.3em !important;}

    /* テキストの共通クラス指定
    ---------------------------------------*/

    .sp-f8{font-size: 8px !important;}
    .sp-f9{font-size: 9px !important;}
    .sp-f10{font-size: 10px !important;}
    .sp-f11{font-size: 11px !important;}
    .sp-f12{font-size: 12px !important;}
    .sp-f13{font-size: 13px !important;}
    .sp-f14{font-size: 14px !important;}
    .sp-f15{font-size: 15px !important;}
    .sp-f16{font-size: 16px !important;}
    .sp-f18{font-size: 18px !important;}
    .sp-f20{font-size: 20px !important;}
    .sp-f24{font-size: 24px !important;}
    .sp-f32{font-size: 32px !important;}
    .sp-f34{font-size: 34px !important;}

    .sp-f10B{font-size: 10px; font-weight:bold !important;}
    .sp-f11B{font-size: 11px; font-weight:bold !important;}
    .sp-f12B{font-size: 12px; font-weight:bold !important;}
    .sp-f13B{font-size: 13px; font-weight:bold !important;}
    .sp-f14B{font-size: 14px; font-weight:bold !important;}
    .sp-f16B{font-size: 16px !important; font-weight:bold !important;}
    .sp-f18B{font-size: 18px; font-weight:bold !important;}
    .sp-f20B{font-size: 20px !important; font-weight:bold !important;}
    .sp-f22B{font-size: 22px; font-weight:bold !important;}
    .sp-f24B{font-size: 24px !important; font-weight:bold !important;}
    .sp-f30B{font-size: 30px; font-weight:bold !important;}
}
