@charset "utf-8";

/* 税込価格 -------------------------- */
.tax {
	font-size: 90%;
}
/* ----------------------------------- */

/* インデント追加 -------------------- */
.ind2_1_hq {
	padding-left: 2.1em !important;
	text-indent: -2.1em !important;
}

.ind5_hq {
	padding-left: 5em !important;
	text-indent: -5em !important;
}

.ind5_9_hq {
	padding-left: 5.9em !important;
	text-indent: -5.9em !important;
}
/* ----------------------------------- */



/* 見出しデザイン変更 ---------------- */
.level2Block h4 {
    font-size: 100%;
    line-height: 120%;
    border-left: 3px solid #02428a;
    background-color: #fff;
    padding: 1px 0 6px 7px;
    display: block;
    border-bottom: 1px dotted #515151;
}
/* ----------------------------------- */



/* 注釈・注目枠設定 ------------------ */
.noteArea.bg_color-gray{
	padding: 15px 20px;
	border: none;
	background-color: rgb(245, 245, 245);
}

.noteArea.bg_color-gray p{
	padding-top: 3px;
	padding-bottom: 3px;
	line-height:1.5;
	font-size: 12px;
}

.bg_color-yellow {
	padding: 20px;
}
/* ----------------------------------- */



/* 文字設定 -------------------------- */
.small{
	font-size: 80%;
}

.big {
	font-size: 130%;
}

.caution {
	color: #cc0000;
}
/* ----------------------------------- */



/* リンク設定 -------------------- */
div.level2BlockInner p.goPageTop {
	text-align: right;
	margin: 40px 0 10px 0;
}

a span.blank, a.new_win {
    margin-right: 5px;
    padding-right: 17px;
    background: url(/content/nttcom/hq/jp/personal/services/img/icon_out1.png) right 0.4em no-repeat;
}

div.noteArea a span.blank, div.noteArea a.new_win,
p.fs-12 a span.blank, p.fs-12 a.new_win {
    margin-right: 3px;
    padding-right: 14px;
    background: url(/content/nttcom/hq/jp/personal/services/img/icon_out2.png) right 0.35em no-repeat;
}

/* ----------------------------------- */



/* テーブル設定 ---------------------- */
.table-note {
    text-align: right;
    margin-bottom: 5px;
}
/* ----------------------------------- */


/* アコーディオン・デザイン変更 ------ */
.Accordion {
	width: 820px;
	margin: auto auto 20px auto;
	border: 1px solid #ccc;
	padding: 0 20px;
}

.area7 .Accordion {
	width: 860px;
	border: none;
	margin-bottom: 0;
	padding: 0;
}

.accordion_header {
	padding-left: 1.9em;
	text-indent: -1.9em;
}

.accordion_contents {
	padding-bottom: 35px;
}

/* ----------------------------------- */

@media screen and (max-width: 768px) {
.Accordion, .area7 .Accordion {
	width: 100%;
}
}
	
@media screen and (max-width: 480px) {
.Accordion, .area7 .Accordion {
	width: 100%;
}
}


/* よくあるご質問　変更 -------------- */
.faq .faq-a {
	color: #cc0000!important;
	font-weight: bold;
}
/* ----------------------------------- */


/* 枠追加 -------------- */
.wakuArea {
    display: table;
    margin: 0 auto;
}
.wakuArea:after {
	content: "";
	display: table;
	clear: both;
}
.wakuL {
    width: 250px;
    display: table-cell;
    vertical-align: bottom;
}
.waku-blue {
    text-align: center;
    background-color: #c9e7ff;
    padding: 10px;
    border: 2px solid #44acff;
    border-radius: 10px;
}
.waku-blue p {
    font-weight: bold;
    font-size: 14px;
    text-shadow: white 1px 1px 0px, white -1px 1px 0px, white 1px -1px 0px, white -1px -1px 0px;
}
.wakuC {
    width: 80px;
    display: table-cell;
    vertical-align: bottom;
}
.waku-plus {
    text-align: center;
    background-color: #fff;
}
.waku-plus p {
    font-size: 46px;
    font-weight: bold;
    color: #aeaeae;
}
.wakuR {
    width: 240px;
    display: table-cell;
    vertical-align: bottom;
}
.waku-pink {
    text-align: center;
    background-color: #ffe6e6;
    padding: 10px;
    border: 2px solid #ff7979;
    border-radius: 10px;
}
.waku-pink p {
    font-weight: bold;
    font-size: 14px;
    text-shadow: white 1px 1px 0px, white -1px 1px 0px, white 1px -1px 0px, white -1px -1px 0px;
}
@media screen and (max-width: 480px) {
	.wakuL {
		width: 250px;
		display: table;
	}
	.wakuC {
		width: 100%;
		display: table;
	}
	.waku-plus p {
		font-size: 36px;
		line-height: 36px;
		margin: 0 0 5px;
	}
	.wakuR {
		width: 250px;
		display: table;
	}
}
/* ----------------------------------- */

/* 主導ナビゲーションの上にタブ（リンク）を追加 -------------- */
ul.url_tab {
	box-sizing: border-box;
	width: 100%;
	margin: 70px 0 -1px;
    padding: 0;
	border-left: 1px solid #c6c6c6;
}
ul.url_tab li {
	box-sizing: border-box;
	list-style: none;
	text-align: center;
	width:50%;
	float: left;
	border-top: 1px #c6c6c6 solid;
	border-right: 1px #c6c6c6 solid;
	background-color: rgb(247,247,247);
}
ul.url_tab li.active {
	background-color: #8b186d;
	color: #fff;
}
ul.url_tab li a {
	display: block;
	text-decoration: none;
	padding: 14px 0;
}
.url_tab li.active a { color:#fff; }
.url_tab li a:hover {
	background-color: rgba(139,24,109,.8);
	color: rgb(255,255,255);
}

/* 既存CSS 微調整 */
.kojin_topNav ul {box-sizing: border-box; }
.area4 .grid_contents.groupSet .grid_cols {	padding:0; }

@media only screen and (max-width: 768px) {
	ul.url_tab { margin: 20px 0 0 0; }
	ul.url_tab li,
	ul.url_tab li.active {
		width:100%;
		float: none;
	}
}
/* ----------------------------------- */

/* 矢印ボックス -------------- */
.arrowArea {
	display: table;
	width: 100%;
	vertical-align: middle;
}
.arrow_box {
    display: table-cell;
    vertical-align: middle;
    width: 22%;
}
.arrow_box .arrow_inner {
    position: relative;
    background: #cc0000;
    padding: 23px 0 23px 10px;
    height: auto;
    border-radius: 0;
    width: 78%;
}
.arrow_box .arrow_inner:after {
    left: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(213, 0, 0, 0);
    border-left-color: #cc0000;
    border-width: 38px;
    margin-top: -38px;
}
.arrow_box .arrow_inner .title {
    color: #ffffff;
    font-size: 20px;
    font-weight: bold;
    line-height: 1.5;
    text-transform: uppercase;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
}
.text_box {
    display: table-cell;
    vertical-align: middle;
    width: 78%;
    padding-left: 10px;
}
.text_box p {
    font-size: 14px;
    line-height: 1.8;
    border-bottom: 1px solid #b4a7a7;
    display: inline;
    padding: 0 0 3px;
}
@media only screen and (max-width: 768px) {
	.arrowArea {
		display: block;
		width: 100%;
	}
	.arrow_box {
		display: block;
		width: 100%;
	}
	.arrow_box .arrow_inner {
		padding: 6px 0 5px;
		width: 100%;
	}
	.arrow_box .arrow_inner:after {
		border-width: 0;
		margin-top: 0;
	}
	.arrow_box .arrow_inner .title {
		font-size: 18px;
		text-align: center;
	}
	.text_box {
		width: 100%;
		display: block;
		padding: 10px;
		border: 1px solid #c00;
	}
}

/* ----------------------------------- */