@charset "utf-8";

p {
	word-break: break-word;
}

.common-contents-area{
	font-family: Roboto, "ヒラギノ⾓ゴPro W3", "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, sans-serif;
	font-weight: 300;
	color: #0F1533;
	font-size: 14px;
	line-height: 22px;
	width: 100%;
	padding: 0 16px 64px;
	min-width: 328px;
	background-color: #F2F3F4;
}

.oshirase-detail-area {
	padding-top: 24px;
}


/****************************** ぱんくずリストエリア ******************************/

.breadcrumb {
	padding: 40px 16px 0;
}
.breadcrumb-list {
	display: inline;
	margin-right: 1em;
	padding-right: 1em;
	font-size: 12px;
	position: relative;
}
.breadcrumb-link {
    color: #0080ff!important;
}
.breadcrumb-link:hover {
    text-decoration: underline;
}
.breadcrumb-link::after {
    top: 48%;
    right: 0;
    width: 0.5em;
    height: 0.5em;
    border: 1px solid transparent;
    border-right: 1px solid #888888;
    border-bottom: 1px solid #888888;
    -webkit-transform: translateY(-50%) rotate(-45deg);
    -ms-transform: translateY(-50%) rotate(-45deg);
    transform: translateY(-50%) rotate(-45deg);
    position: absolute;
    display: block;
    content: '';
}


/****************************** お知らせ詳細エリア ******************************/

.color-red {
	color: #CC0033;
}
.t-bold {
	font-weight: bold;
}
.oshirase-detail-contents-area-inner {
	background-color: #FFFFFF;
	width: 100%;
	padding: 32px 16px;
	margin: 0;
	border-radius: 16px;
	box-shadow: 0 1px 3px 0 rgba(0,0,0,0.098);
}
.oshirase-detail-contents-area-title {
	font-size: 20px;
	line-height: 24px;
	font-weight: 700;
	margin-bottom: 24px;
}
.oshirase-detail-contents-area-date {
	font-size: 12px;
	line-height: 18px;
	text-align: right;
	margin-bottom: 16px;
}
.oshirase-detail-contents-area-important {
	background: #CF1131;
	border-radius: 4px;
	color: #fff;
	letter-spacing: 1px;
	text-align: center;
	line-height: 16px;
	display: inline-block;
	padding: 6px 12px 5px;
}
.oshirase-detail-contents-area-main-txt-box {
	font-size: 14px;
	line-height: 22px;
}
.oshirase-detail-contents-area-main-txt-box a {
	color: #093475!important;
}
.oshirase-detail-contents-area-main-txt-box a:visited {
	color: #7600B3!important;
}
.oshirase-detail-contents-area-main-txt-box a:hover {
	color: #3374DA!important;
}


/****************************** お知らせ詳細 メインテキストエリア ******************************/

.oshirase-detail-contents-area-txt {
	font-size: 16px;
	line-height: 24px;
	margin: 24px 0;
}
.oshirase-detail-contents-area-link-txt {
	text-align: right;
	margin: 16px 0;
	line-height: 20px;
}
.oshirase-detail-contents-area-link {
	position: relative;
	padding: 0 22px 0 0;
	color: #0080ff!important;
	display: inline-block;
}
.oshirase-detail-contents-area-link:hover {
	text-decoration: underline;
}
.oshirase-detail-contents-area-link::after {
	position: absolute;
	bottom: 2px;
	right: 0;
	width: 16px;
	height: 16px;
	background-image: url(/mydocomo/images_20m4/common/icons/icn_arrow_textlink_right.png);
	display: inline-block;
	content: '';
	background-size: contain;
	background-repeat: no-repeat;
}
.oshirase-detail-contents-btn-area {
	margin: 32px 0 0 0;
	text-align: center;
}
.oshirase-detail-contents-btn-area-btn {
	position: relative;
	display: block;
	width: 100%;
	padding: 9px 44px;
	font-size: 16px;
	line-height: 24px;
	font-weight: 400;
	color: #0F1533;
	background-color: #FFFFFF;
	border: 1px solid #CFD0D6;
	border-radius: 24px;
	text-align: center;
}
.oshirase-detail-contents-btn-area-btn:hover {
	background-color: #F7F7F8;
}
.oshirase-detail-contents-btn-area-btn::after {
	display: inline-block;
	content: "";
	height: 24px;
	width: 24px;
	background-size: contain;
	background-repeat: no-repeat;
	background-image: url(/mydocomo/images_20m4/common/btn/oval_arrow_left_black_on_gray.png);
	position: absolute;
	top: 50%;
	left: 10px;
	margin-top: -12px;
}


/****************************** お知らせ詳細 サブテキストエリア ******************************/

.oshirase-detail-contents-area-sub-title {
	font-size: 22px;
	line-height: 34px;
	font-weight: bold;
	margin: 40px 0 16px;
}


/****************************** お知らせ詳細 サブテキストエリア アコーディオン ******************************/

.oshirase-detail-accordion-list {
	border: 1px solid #DFE4E9;
	border-radius: 8px;
}
.oshirase-detail-accordion-list-title {
    font-size: 16px;
    line-height: 18px;
    font-weight: bold;
    position: relative;
    padding: 16px 44px 16px 16px;
    border-top: 1px solid #DFE4E9;
}
.oshirase-detail-accordion-list-inner:first-child .oshirase-detail-accordion-list-title {
	border-top: none;
	border-radius: 8px 8px 0 0;
}
.oshirase-detail-accordion-list-inner:last-child .oshirase-detail-accordion-list-title {
	border-radius: 0 0 8px 8px;
}
.oshirase-detail-accordion-list-inner.oshirase-detail-accordion-list-inner-open:last-child .oshirase-detail-accordion-list-title {
	border-radius: 0;
}
.oshirase-detail-accordion-list-title.oshirase-detail-accordion-list-inner-open {
	border-radius: 8px 8px 0 0;
}
.oshirase-detail-accordion-list-title::after {
	background-image: url(/mydocomo/images_20m4/common/btn/btn_pulldown_down@2x.png);
	width: 24px;
	height: 24px;
	top: 50%;
	right: 10px;
	margin: -12px 0 0 0;
}
.oshirase-detail-accordion-list-title:hover {
	cursor: pointer;
	background-color: #f6f7f8;
}
.oshirase-detail-accordion-list-inner.oshirase-detail-accordion-list-inner-open .oshirase-detail-accordion-list-title::after {
	background-image: url(/mydocomo/images_20m4/common/btn/btn_pulldown_up@2x.png);
}
.oshirase-detail-accordion-list-inner.oshirase-detail-accordion-list-inner-open .oshirase-detail-accordion-accordion {
	display: block;
}
.oshirase-detail-accordion-accordion {
	display: none;
	padding: 0 0 24px 0;
}
.oshirase-detail-accordion-list-inner.oshirase-detail-accordion-list-inner-open .oshirase-detail-accordion-accordion {
	display: block;
}
.oshirase-detail-accordion-accordion-txt {
    font-size: 16px;
    line-height: 26px;
    margin: 0 16px 24px;
}
.oshirase-detail-accordion-accordion-txt:last-child {
	margin: 0 16px;
}


/****************************** お知らせ詳細 他テキストエリア ******************************/

.oshirase-detail-contents-area-more-title {
	font-size: 18px;
	line-height: 20px;
	font-weight: bold;
	margin: 40px 0 16px;
	position: relative;
	padding: 0 0 0 30px;
}
.oshirase-detail-contents-area-more-title::before {
	position: absolute;
	top: 50%;
	left: 0;
	margin: -12px 0 0 0;
	display: inline-block;
	content: '';
	width: 24px;
	height: 24px;
	background-image: url(/mydocomo/images_20m4/common/icons/icn_attention_line@2x.png);
	background-size: contain;
	background-repeat: no-repeat;
}
.oshirase-detail-contents-area-more-txt {
	font-size: 14px;
	line-height: 24px;
	margin: 32px 0 16px;
}
.oshirase-detail-contents-area-more-txt:nth-child(2) {
	margin: 0 0 16px;
}
.oshirase-detail-contents-area-more-txt:last-child {
	margin: 32px 0 0 0;
}


/****************************** TAB ******************************/

@media screen and (min-width:768px) {

	/****************************** ぱんくずリストエリア ******************************/

	.breadcrumb.sp-other{
		display: none!important;
	}
	.breadcrumb {
		max-width: 748px;
		width: 100%;
		margin: 0 auto 40px;
		padding: 0;
	}
	.breadcrumb-list {
		font-size: 14px;
	}


	/****************************** 横幅調整 ******************************/

	.oshirase-detail-contents-area-inner {
		max-width: 1080px;
		width: 100%;
		margin: 0 auto;
	}


	/****************************** お知らせ詳細エリア ******************************/

	.oshirase-detail-contents-area-inner {
		padding: 32px;
	}
	.oshirase-detail-contents-area-txt {
		line-height: 32px;
		margin: 32px 0;
	}
	.oshirase-detail-contents-area-link-txt {
		margin: 0 0 16px 0;
	}
	.oshirase-detail-accordion-accordion-txt {
		margin: 16px;
		line-height: 32px;
	}
	.oshirase-detail-contents-area-title {
		font-size: 24px;
		line-height: 30px;
	}
	.oshirase-detail-contents-area-sub-title {
		font-size: 26px;
		line-height: 32px;
		margin: 64px 0 24px;
	}

/****************************** お知らせ詳細 メインテキストエリア ******************************/
	
	.oshirase-detail-contents-btn-area-btn {
		min-width: 240px;
		width: auto;
		display: inline-block;
	}
	
	/****************************** お知らせ詳細 サブテキストエリア アコーディオン ******************************/
	
	.oshirase-detail-accordion-list {
		display: flex;
		padding: 0 16px;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	.oshirase-detail-accordion-list-title {
		border-top: none;
		padding: 0;
		line-height: 22px;
	}
	.oshirase-detail-accordion-list-inner {
		width: 324px;
		border-top: 1px solid #DFE4E9;
		padding: 24px 16px;
	}
	.oshirase-detail-accordion-list-inner:nth-child(-n+2) {
		border-top: none;
	}
	.oshirase-detail-accordion-list-title:hover {
		cursor: auto;
		background-color: #fff;
	}
	.oshirase-detail-accordion-accordion {
		padding: 0;
		margin: 6px 0 0 0;
	}
	.oshirase-detail-accordion-accordion-description {
		margin: 6px 0 0 0;
		line-height: 20px;
		position: relative;
	}
	.oshirase-detail-accordion-list-title::after {
		display: none;
	}
	.oshirase-detail-accordion-accordion-txt, 
	.oshirase-detail-accordion-accordion-txt:last-child {
		margin: 0;
		font-size: 14px;
		line-height: 20px;
	}
	.oshirase-detail-accordion-accordion-description-btn {
		color: #0080ff;
		position: absolute;
		bottom: 0;
		right: 0px;
	}
	.oshirase-detail-accordion-accordion-description-btn:hover {
		text-decoration: underline;
		cursor: pointer;
	}
	
	
	
	/****************************** お知らせ詳細 他テキストエリア ******************************/
	
	.oshirase-detail-contents-area-more-title {
		font-size: 20px;
		line-height: 28px;
		padding: 0 0 0 40px;
		margin: 64px 0 16px;
	}
	.oshirase-detail-contents-area-more-title::before {
		width: 32px;
		height: 32px;
		margin: -16px 0 0 0;
	}
	.oshirase-detail-contents-area-more-txt {
		margin: 40px 0 16px;
	}
	.oshirase-detail-contents-area-more-txt:last-child {
		margin: 40px 0 0 0;
	}
	
	

}


/****************************** PC ******************************/

	@media screen and (min-width:980px) {



		/****************************** ぱんくずリストエリア ******************************/

		.breadcrumb.sp-other{
			display: none!important;
		}

		/****************************** お知らせ詳細 サブテキストエリア アコーディオン ******************************/
		
		.oshirase-detail-accordion-list {
			justify-content: inherit;
		}		
		.oshirase-detail-accordion-list-inner {
			width: 266px;
		}
		.oshirase-detail-accordion-list-inner:nth-child(-n+3) {
			border-top: none;
		}
		.oshirase-detail-accordion-list-inner:nth-child(3n+1) {
			padding-right: 32px;
			width: 282px;
		}
		.oshirase-detail-accordion-list-inner:nth-child(3n+3) {
			padding-left: 32px;
			width: 282px;
		}

}