@charset "utf-8";

/******************** 共通スタイル ********************/
header { background-color: #fff; width: 100%; }

header:after {
	content: "";
	clear: both;
	display: block;
}

img { width: 100%; height: auto; }
a { display: block; }

/* 大枠 */
.wrapper { padding-left: 0; padding-top: 0;}

/* コンテンツ内構造 */
.contents { width: 100%; background-color: #e7e7e7;}

.sp-other { display: none; }
.sp-only { display: block; }
.sp-tb-only { display: block; }
.pc-only { display: none; }

/* タブレット用指定 */
@media screen and (min-width: 768px) {
	.sp-only { display: none; }
	.sp-other { display: block; }
	.sp-tb-only { display: block; }
	.pc-only { display: none; }
}

/*  PC用指定 960px～max */
@media screen and (min-width: 960px) {
	.sp-only { display: none; }
	.sp-other { display: block; }
	.sp-tb-only { display: none; }
	.pc-only { display: block; }
}


/*************** リンク関連 ***************/

/* テキストリンク、矢印アイコンあり（青色） */
.t-link-blue, .t-link-b-arrow, .tlink-block-arrow, .t-noline-arrow, .tcol2-blue-arrow { color: #0070c9; text-decoration: none; }
.t-link-blue:hover, .tlink-block-arrow:hover, .t-link-b-arrow:hover, tcol2-blue-arrow:hover { color: #0080ff; text-decoration: underline; }

.t-unlink-blue { text-decoration: underline !important; }

.t-link-blue:active, .tlink-block-arrow:active,
.t-link-b-arrow:active, .t-noline-arrow:active, tcol2-blue-arrow:active{
	color: rgba(0,112,201,0.5);
	text-decoration: none;
}

.tcol2-blue-arrow:hover {
	background-color: rgba(0, 0, 0, 0.15);
	-webkit-filter: brightness(0.85);
	-moz-filter: brightness(0.85);
	-o-filter: brightness(0.85);
	-ms-filter: brightness(0.85);
	filter: brightness(0.85);
}	

/* テキストリンク（グレー） */
.t-link-d-gray { color: #757575; text-decoration: none; }
.t-link-d-gray:hover { color: #0080ff; text-decoration: underline; }
.t-link-d-gray:active { color: rgba(117,117,117,0.5); text-decoration: none; }

/* テキストリンク（黒） */
.t-link-black, a.t-link-black { color: #333333; text-decoration: none; }
.t-link-black:hover, a:hover.t-link-black  { color: #0080ff; text-decoration: underline; }
.t-link-black:active, a:active.t-link-black:active { color: rgba(51,51,51,0.5); text-decoration: none; }

/* アンカーリンク */
a.anc-link-up, a.anc-link-down {
	display: inline-block;
	padding-right: 24px;
}
a.anc-link-up:after, a.anc-link-down:after {
	content: "";
	height: 24px;
	width: 24px;
	position: absolute;
	margin-top: -1px;
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
	background-repeat: no-repeat;
	background-size: 384px;
	background-position: -24px -147px;
}
a.anc-link-up:after {
	-webkit-transform: rotate(270deg);
	transform: rotate(270deg);
}
a.anc-link-down:after {
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
}
a.anc-link-up:hover:after, a.anc-link-down:hover:after { background-position: -192px -147px; }

/* リストリンク */
.list-link {
	display: -webkit-flex;
	display: flex;
	color: #333;
	width: 100%;
	height: 100%;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-flex-grow: 1;
	flex-grow: 1;
}

.list-link-block:hover{
	background-color: rgba(0, 0, 0, 0.15);
	-webkit-filter: brightness(0.85);
	-moz-filter: brightness(0.85);
	-o-filter: brightness(0.85);
	-ms-filter: brightness(0.85);
	filter: brightness(0.85);
}

/* アイコンボタン、バナーリンク */
.ico-link:hover, .bnr-link:hover {
    filter:alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
}

/* テキストリンク（青色） 無効時 */
.t-link-blue-disabled {
	pointer-events: none;
	cursor: default;
	color: rgba(0,112,201,0.25);
}

/* 矢印アイコンあり（青色）下線あり・なし */
.tlink-block-arrow, .t-link-b-arrow, .t-noline-arrow, .tcol2-blue-arrow {
	position: relative;
}

.t-link-b-arrow:after, .t-noline-arrow:after,
.tlink-block-arrow:after, .tcol2-blue-arrow:after {
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
}

.t-link-b-arrow:after {
	content: "";
	height: 24px;
	width: 24px;
	position: absolute;
	margin-top: -1px;
	background-repeat: no-repeat;
	background-size: 384px;
	background-position: -24px -147px;
}

.t-noline-arrow:after, .tlink-block-arrow:after {
	content: "";
	height: 24px;
	width: 24px;
	position: absolute;
	top: 50%;
	right: 0;
	margin-top: -12px;
	background-repeat: no-repeat;
	background-size: 384px;
	background-position: -24px -147px;
}

.tcol2-blue-arrow:after {
	content: "";
	height: 24px;
	width: 24px;
	position: absolute;
	top: 50%;
	right: 16px;
	margin-top: -12px;
	background-repeat: no-repeat;
	background-size: 384px;
	background-position: -24px -147px;
}

.tlink-block-arrow:hover::after, .t-link-b-arrow:hover::after,
.t-noline-arrow:hover::after, .tcol2-blue-arrow:hover::after { background-position: -192px -147px; }


/* リスト型リンクアイコン */
.ico-link-arrow, .ico-ac-open, .ico-ac-close { position: relative; }

.ico-link-arrow:after {
	content: "";
	height: 24px;
	width: 24px;
	position: absolute;
	top: 50%;
	right: 16px;
	margin-top: -12px;
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
	background-repeat: no-repeat;
	background-size: 384px;
}

.ico-ac-open:after, .ico-ac-close:after {
	content: "";
	height: 24px;
	width: 24px;
	position: absolute;
	top: 50%;
	right: 12px;
	margin-top: -12px;
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
	background-repeat: no-repeat;
	background-size: 384px;
}


/* 矢印リンクアイコン（右寄せ、上下中央） */
.ico-link-arrow:after { background-position: 0 -147px; }

/* アコーディオンボタン（開く） */
.ico-ac-open:after { background-position: -72px -147px; }

/* アコーディオンボタン（閉じる） */
.ico-ac-close:after { background-position: -48px -147px; }


/* テキストアイコン（文頭・文末） */
.ico-aft-sp:after, .ico-bef-sp:before {
	content: "";
	width: 34px;
	height: 18px;
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
	background-repeat: no-repeat;
	background-size: 384px;
	background-position: -129px -113px;
}

.ico-aft-nopc:after, .ico-bef-nopc:before {
	content: "";
	width: 18px;
	height: 18px;
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
	background-repeat: no-repeat;
	background-size: 384px;
	background-position: -269px -113px;
}

.ico-aft-sp:after, .ico-aft-nopc:after {
	display: inline-block;
	vertical-align: middle;
	margin: -1px 0 0 8px;
}

.ico-bef-sp:before, .ico-bef-nopc:before {
	position: absolute;
	left: 0;
	margin: 0;
}

.ico-txt-bef {
	position: relative;
	padding-left: 42px;
}

.ico-bef-nopc {
	position: relative;
	padding-left: 26px;
}

.ico-bef-sp + .ico-bef-nopc {
	padding-left: 42px;
}

.t-link-area a { display: inline-block; }

.t-block-r12 {
	padding: 12px;
	text-align: right;
}

/* イメージ画像、テキストリンク */

.snd-link-area { color: #333; }

.snd-link-area:hover{
	background-color: rgba(0, 0, 0, 0.15);
	-webkit-filter: brightness(0.85);
	-moz-filter: brightness(0.85);
	-o-filter: brightness(0.85);
	-ms-filter: brightness(0.85);
	filter: brightness(0.85);
	zoom: 1;
}

/* RSS画像 */
.ico-rss {
	display: block;
	width: 54px;
	height: 18px;
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
	background-repeat: no-repeat;
	background-size: 384px;
}

.ico-rss { background-position: -173px -113px; }


/* ！ 感嘆符 赤色 */
.ico-exclamation-mark {
	padding-left: 28px;
	position: relative;
}

.ico-exclamation-mark:before {
	content: "";
	height: 24px;
	width: 24px;
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -12px;
	background-position: -264px -147px;
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
	background-repeat: no-repeat;
	background-size: 384px;
}

/* ！ 感嘆符 灰色 */
.ico-exclamation-graymark {
	position: relative;
	font-size: 12px;
	padding: 16px 12px 16px 44px;
}

.ico-exclamation-graymark:before {
	content: "";
	height: 24px;
	width: 24px;
	position: absolute;
	top: 14px;
	left: 12px;
	background-position: -312px -147px;
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
	background-repeat: no-repeat;
	background-size: 384px;
}






/*************** テキスト関連 ***************/

/* 太字 */
.t-bold, .txt-bold { font-weight: bold; }

/* サイズ */
.t-small { font-size: 12px !important; }
.t-default { font-size: 14px !important; }

/* 位置 */
.t-left { text-align: left !important; }
.t-right { text-align: right !important; }
.t-center { text-align: center !important; }

/* テキストカラー */
.color-yellow { color: #fdd000; }
.color-orange { color: #fda400; }
.color-red { color: #cc0033; }
.color-green { color: #329ab5; }
.color-blue { color: #0080ff; }
.color-d-blue { color: #0070c9; }
.color-black { color: #333333; }
.color-d-gray { color: #757575; }
.color-gray { color: #cccccc; }
.color-l-gray { color: #e7e7e7; }
.color-r-stage { color: #b03b40; }
.color-s-stage { color: #6e6e73; }
.color-b-stage { color: #915a3d; }
.color-g-stage { color: #996c2f; }

.b-g-premiar { color: #c1c98c; }
.b-premiar { color: #b1bebd; }
.b-third { color: #aace36; }
.b-second { color: #ea545d; }
.b-first { color: #62b0e3; }
.b-gold { color: #f1c709; }
.b-silver { color: #81878c; }
.b-bronze { color: #c67c05; }
.b-reguler { color: #bf2f36; }


/* 背景色 */
.bg-c-white { background-color: #fff; }
.bg-c-gray { background-color: #fafafa; }


/* 注記 */
.mod-list-area { padding: 0 16px 16px 16px; }
.container-r > .mod-list-area { padding: 12px 0 0 0; }
.gray-area > .mod-list-area { padding: 16px 16px 0; text-align: left; }
.gray-area > .mod-list-area ul { max-width: 320px; margin: 0 auto; }

.list-num-notes, .list-tnum-notes { padding: 0 16px 16px; }

.list-num-notes, .list-tnum-notes, .list-notes { font-size: 12px; }


.list-num-notes > li:last-child,
.list-tnum-notes > li:last-child,
.list-notes > li:last-child {
	 margin-bottom: 0;
}


.list-notes > li {
	counter-increment: notes;
	margin-bottom: 12px;
	padding-left: 16px;
	text-indent: -16px;
}

.list-notes > li:before {
	content: "\203b";
	padding-right: 4px;
}

/* 注記連番 */
.list-num-notes > li {
	counter-increment: notes;
	margin-bottom: 12px;
	padding-left: 32px;
	text-indent: -32px;
}

.list-num-notes > li:before {
	content: "\203b" counter(notes);
	padding-right: 12px;
}

/* 注記＋番号テキスト記載 */
.list-tnum-notes > li {
	margin-bottom: 12px;
	padding-left: 32px;
	text-indent: -32px;
}

.list-tnum-notes > li span { padding-right: 12px; }



/* TB、PC用指定 */
@media screen and (min-width: 768px) {

	/* 注記 */
	.mod-list-area { padding: 0 32px 16px 32px; }
	/* 注記＋番号テキスト記載 */
	.list-num-notes { padding: 0 32px 16px 0; }
	.list-tnum-notes { padding: 0 32px 16px; }

}



/*************** 余白関連 ***************/

.mt-4 { margin-top: -4px !important; }

.mt0 { margin-top: 0px !important; }
.mt4 { margin-top: 4px !important; }
.mt8 { margin-top: 8px !important; }
.mt12 { margin-top: 12px !important; }
.mt16 { margin-top: 16px !important; }
.mt24 { margin-top: 24px !important; }
.mt32 { margin-top: 32px !important; }

.mb0 { margin-bottom: 0px !important; }
.mb4 { margin-bottom: 4px !important; }
.mb8 { margin-bottom: 8px !important; }
.mb12 { margin-bottom: 12px !important; }
.mb16 { margin-bottom: 16px !important; }
.mb24 { margin-bottom: 24px !important; }
.mb32 { margin-bottom: 32px !important; }
.mb72 { margin-bottom: 72px !important; }

.ml4 { margin-left: 4px !important; }
.mr4 { margin-right: 4px !important; }


.margin-auto { margin: 0 auto; }

.pd0 { padding: 0 !important; }

.pb8 { padding-bottom: 8px !important; }
.pb12 { padding-bottom: 12px !important; }
.pb16 { padding-bottom: 16px !important; }
.pb24 { padding-bottom: 24px !important; }

.pr24 { padding-right: 24px; }

/*************** ブロック要素 ***************/

.pd12-block { padding: 12px; }
.pd16-block { padding: 16px; }

.pd-block-part1 { padding: 12px 16px; }
.pd-block-part2 { padding: 12px 16px 0 16px; }
.pd-block-part3 { padding: 16px 16px 0 16px; }
.pd-block-part4 { padding: 0 16px; }
.pd-block-part5 { padding: 16px 12px; }
.pd-block-part6 { padding: 0 16px 16px; }
.pd-block-part7 { padding: 0 32px; }
.pd-block-part8 { padding: 48px 16px; }

/***************  sprite画像 ***************/
.img-gnav-sprite, .img-sprite,
.img-fnav-sprite {
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
	background-repeat: no-repeat;
	background-size: 384px;
	position: relative;
}

/* ● sprite指定 */
li.login-circle { position: relative; }

.ico-circle-blue, .ico-circle-red, .ico-circle-yellow {
	position: absolute;
	width: 16px;
	height: 16px;
	content: "";
	top: 44%;
	left: 0;
	margin-top: -6px;
}

.ico-circle-blue { background-position: -20px -113px;}
.ico-circle-red { background-position: -36px -113px;}
.ico-circle-yellow { background-position: -52px -113px;}

/* ログアウト／ログイン ボタン表示 */
.btn-logout, .btn-login {
	width: 83px;
	height: 23px;
	content: "";
	cursor: pointer;
}

.btn-logout { background-position: -96px -84px; }
.btn-login { background-position: 0 -84px; }

/* ログアウト／ログイン マウスオーバー、訪問済、アクティブ */
.btn-logout:hover, .btn-logout:visited, .btn-logout:active { background-position: -288px -84px; }
.btn-login:hover, .btn-login:visited, .btn-login:active { background-position: -192px -84px; }

/* リンク無効時 */
.link-disabled {
	pointer-events: none;
	cursor: default;
	opacity: 0.25;
}


/*************** モジュール ***************/

/* 基本的な状態変化（SMT:480px、TAB:768px、PC:960pxの中央寄せ） */
.mod-layout-01 {
	max-width: 480px;
	min-width: 320px;
	margin: 0 auto;
}

/* TAB用指定 */
@media screen and (min-width: 768px) {
	.mod-layout-01 {
		max-width: 768px;
	}
}

/* PC用指定 */
@media screen and (min-width:960px){
	.mod-layout-01 {
		max-width: 960px;
	}
}

/* 基本的な状態変化（SMT:480px、TAB:768px、PC:960pxの左寄せ） */
.mod-layout-02 {
	max-width: 480px;
	min-width: 320px;
}

/* TAB用指定 */
@media screen and (min-width: 768px) {
	.mod-layout-02 {
		max-width: 768px;
	}
	.mod-layout-02 .list-num-notes,
	.mod-layout-02 .list-tnum-notes {
		padding: 0 0 16px;
	}
}

/* PC用指定 */
@media screen and (min-width:960px){
	.mod-layout-02 {
		max-width: 960px;
	}
}


/* ローディング中 */
.mydcm-load{
	position: fixed;
	height: 100%;
	width: 100%;
	/* top,padding-bottomともに、グローバルバナーの高さも考慮 */
	/* top: 239px;
	padding-bottom: 239px; */
	top: 287px;
	padding-bottom: 287px;
	background: #fff;
	z-index: 99;
}
.mydcm-load img{
	width: 100px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -4px 0 0 -50px;
}
.load-img{
	height: 100%;
	position: relative;
}

/* グローバルバナー */
/* ローディング中と連動したスタイル */
.global-bnr-teaser {
	position: relative;
	height: 48px;
	min-width: 320px;
	/*
	background-repeat: repeat;
	background-size: auto;
	background-image: url(/mydocomo/images_17v3/common/globalbnr/bg_global.gif);
	background-color: #ffe933;
  */
	overflow: hidden;
}
.global-bnr-teaser > a {
	position: absolute;
	left: 50%;
}
.global-bnr-teaser > a.global-bnr-sp {
	width: 375px;
	margin-left: -187.5px;
}
.global-bnr-teaser > a.global-bnr-tab {
	width: 768px;
	margin-left: -384px;
}
.global-bnr-teaser > a.global-bnr-pc {
	width: 960px;
	margin-left: -480px;
}

/* SP用ヘッダー高さ調整用 */
@media screen and (min-width: 421px) {
	.mydcm-load{
		/* top,padding-bottomともに、グローバルバナーの高さも考慮 */
		/* top: 221px;
		padding-bottom: 221px; */
		top: 269px;
		padding-bottom: 269px;
	}
}
@media screen and (min-width: 469px) {
	.mydcm-load{
		/* top,padding-bottomともに、グローバルバナーの高さも考慮 */
		/* top: 203px;
		padding-bottom: 203px; */
		top: 251px;
		padding-bottom: 251px;
	}
}
@media screen and (max-width: 767px) {
	.global-bnr-teaser > a.global-bnr-sp { display: block; }
	.global-bnr-teaser > a.global-bnr-tab { display: none; }
	.global-bnr-teaser > a.global-bnr-pc { display: none; }
}

/* TB用 */
@media screen and (min-width: 768px) {
	.mydcm-load{
		/* top,padding-bottomともに、グローバルバナーの高さも考慮 */
		/* top: 146px;
		padding-bottom: 146px; */
		top: 194px;
		padding-bottom: 194px;
	}
	.mydcm-load img{
		width: 150px;
		margin: -6px 0 0 -75px;
	}
	.global-bnr-teaser > a.global-bnr-sp { display: none; }
	.global-bnr-teaser > a.global-bnr-tab { display: block; }
	.global-bnr-teaser > a.global-bnr-pc { display: none; }
}

/* PC用 */
@media screen and (min-width: 960px) {
	.mydcm-load{
		/* top,padding-bottomともに、グローバルバナーの高さも考慮 */
		/* top: 144px;
		padding-bottom: 144px; */
		top: 192px;
		padding-bottom: 192px;
	}
	.mydcm-load img{
		width: 200px;
		margin: -8px 0 0 -100px;
	}
	.global-bnr-teaser > a.global-bnr-sp { display: none; }
	.global-bnr-teaser > a.global-bnr-tab { display: none; }
	.global-bnr-teaser > a.global-bnr-pc { display: block; }
}


/* リスト型リンク（FAQで使用） */
.mod-link-list li a {
	padding: 0 16px;
	color: #333;
}
.mod-link-list li:first-child p {
	border-top: 1px solid #ddd;
}
.mod-link-list p {
	border-bottom: 1px solid #ddd;
	padding: 16px 48px 16px 8px;
}
.mod-link-list li:first-child .list-inner {
	border-top: 1px solid #ddd;
}


/* ログインモジュール */
.main-login {
	max-width: 480px;
	min-width: 320px;
	padding: 0 16px;
	margin: 0 auto 8px;
}

.main-login:after {
	content: "";
	clear: both;
	display: block;
	*zoom: 1;
}

.main-login .main-balloon {
	display: -webkit-flex;
	display: flex;
	position: relative;
	margin: 0;
	padding: 12px 0 16px 0;
	width: 100%;
	background: #fff;
	border-radius: 2px;
	text-align: center;
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
}

.main-login .main-balloon:before{
	content: "";
	position: absolute;
	top: -9px;
	left: 40px;
	margin-left: -9px;
	width: 0;
	height: 0;
	border-bottom: 9px solid #fff;
	border-left: 9px solid transparent;
	border-right: 9px solid transparent;
}

.main-balloon-col {
	display: -webkit-flex;
	display: flex;
	width: 100%;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-align-items: center;
	align-items: center;
	padding: 0 16px;
}

.main-balloon-col li { width: 100%; }

/* ログイン ボタン表示 */
.btn-main-login {
	width: 256px;
	height: 41px;
	content: "";
}

.btn-main-login-block {
	width: 256px;
	margin: 0 auto 16px;
	cursor: pointer;
}

.btn-main-login { background-position: 0 -522px; }
.btn-main-login:hover, .btn-main-login:visited, .btn-main-login:active { background-position: 0 -572px; }


.main-balloon-col li:first-child p {
	margin-bottom: 16px;
	font-size: 14px;
}

.main-balloon-col li p {
	margin-bottom: 24px;
	font-size: 12px;
}

.main-balloon-col li p:last-child { margin-bottom: 0; }
.main-balloon-col li p a, .main-balloon-col p a { display: inline; }
.main-balloon-col li p a { display: inline-block; }


/* ログアウトモジュール  17.11.16（index.cssから移動） */
.main-login .main-balloon-logout {
	position: relative;
	margin: 0;
	padding: 12px 0 16px 0;
	width: 100%;
	background: #fff;
	border-radius: 2px;
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
}

.main-login .main-balloon-logout:before{
	content: "";
	position: absolute;
	top: -9px;
	left: 40px;
	margin-left: -9px;
	width: 0;
	height: 0;
	border-bottom: 9px solid #fff;
	border-left: 9px solid transparent;
	border-right: 9px solid transparent;
}

.balloon-logout-col {
	width: 100%;
	padding: 0 16px;
}

.balloon-logout-col {width: 100%; }

.ttl-logout {
	font-size: 18px;
	padding: 12px 16px 24px;
	text-align: center;
}

.ttl-s-logout {
	font-size: 16px;
	padding: 12px 0;
	margin-bottom: 16px;
	border-bottom: 1px solid #bbb;
	text-align: left;
}

.balloon-logout-col .t-link-blue {
	display: inline-block;
	font-size: 12px;
}

/* ホーム ご利用状況部分 */
.balloon-logout-inner li {
	display: -webkit-flex;
	display: flex;
	margin-bottom: 16px;
}

.balloon-logout-inner li:first-child { margin-top: 16px; }
.balloon-logout-inner li:last-child { margin-bottom: 0; }


/* 吹き出しなし 横長 17.11.16追加 */

.mod-main { padding: 0 16px 16px; }

.main-white-box {
  width: 100%;
  border-radius: 2px;
  background-color: #fff;
  margin: 0 auto;
  padding-bottom: 16px;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
}

.main-wbox-inner { padding: 0 16px; }
.main-wbox-inner li {
	display: -webkit-flex;
	display: flex;
	margin-bottom: 16px;
}

.main-wbox-inner li:first-child { margin-top: 16px; }
.main-wbox-inner li:last-child { margin-bottom: 0; }


/* TB用指定 */
@media screen and (min-width: 768px) {
	/* 1to1 吹き出し指定 */
	.main-login {
		min-width: 768px;
		padding: 0 32px 0 32px;
	}
	
	.main-balloon-col li { 
		width: 50%;
		padding: 0 6px;
	}
	
	.btn-main-login-block { margin: 0 auto; }

	/* ログアウトモジュール 17.11.16（index.cssから移動） */
	.main-login .main-balloon-logout { padding: 12px 0; }
	
	.balloon-logout-inner {
		display: -webkit-flex;
		display: flex;
	}

	.balloon-logout-col {
		display: -webkit-flex;
		display: flex;
		width: 50%;
		padding: 0 16px;
		-webkit-flex-direction: column;
		flex-direction: column;
	}
	
  	.balloon-logout-col:first-child { border-right: 1px solid #ddd; }
	.balloon-logout-col:last-child { border-right: none; }
	.balloon-logout-col:only-child { width: 100%; }
	
	
	/* 吹き出しなし 横長 17.11.16追加 */
	.mod-main { padding: 0 32px 24px; }
	
	.main-wbox-inner {
		display: -webkit-flex;
		display: flex;
	}
	.main-wbox-col {
		display: -webkit-flex;
		display: flex;
		width: 50%;
		padding: 0 16px;
		-webkit-flex-direction: column;
		flex-direction: column;
	}
	
	.main-wbox-col:first-child { border-right: 1px solid #ddd; }
	.main-wbox-col:last-child { border-right: none; }
	
}


/* PC用指定 メインエリア中央寄せ */
@media screen and (min-width: 960px) {
	/* 1to1 吹き出し指定 */
	.main-login { min-width: 960px; }
}


/* ★2カラム レイアウト */

/* ボタンリンク */

a.btn-basic {
	border-radius: 3px;
	display: block;
	font-weight: bold;
	margin: 0 auto;
	padding: 4px;
	text-align: center;
	max-width: 320px;
	width: 100%;
	min-height: 36px;
}

a.btn-white, a.btn-blue {
	display: -webkit-flex;
    display: flex;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
}

.mod-btn-area {
	display: -webkit-flex;
    display: flex;
}

a.btn-white {
	background-color: #fff;
	border: 2px solid #0070c9;
	color: #0070c9;
}

a.btn-white-right {
	display: -webkit-inline-flex;
	display: inline-flex;
	-webkit-align-items: center;
	align-items: center;
	min-height: 36px;
	padding: 4px 16px;
	text-align: center;
	color: #0070c9;
	background-color: #fff;
	border: 2px solid #0070c9;
	border-radius: 4px;
}

a.btn-blue{
	background-color: #0080ff;
	border: 2px solid #0070e0;
	color: #fff;
	min-height: 36px;
}

a:hover.btn-white, a:hover.btn-white-right,
a:hover.btn-blue-arrow {
	background-color: rgba(0, 0, 0, 0.15);
	-webkit-filter: brightness(0.85);
	-moz-filter: brightness(0.85);
	-o-filter: brightness(0.85);
	-ms-filter: brightness(0.85);
	filter: brightness(0.85);
}

a:hover.btn-blue {
	background-color: #0070c9;
	-webkit-filter: brightness(0.85);
	-moz-filter: brightness(0.85);
	-o-filter: brightness(0.85);
	-ms-filter: brightness(0.85);
	filter: brightness(0.85);
}


/* アコーディオンメニューリスト */

/* タイトル */
/* 18.01.25追加 */
.mod-ac-menu > li { margin: 0 0 8px; }

.mod-ac-menu > li .title{
	display: -webkit-flex;
    display: flex;
	-webkit-align-items: center;
	align-items: center;
	padding: 12px 44px 12px 12px;
	border: 1px solid #ddd;
	background-color: #fff;
    cursor: pointer;
    font-size: 14px;
    text-align: left;
}
.mod-ac-menu > li .title:hover{
	background-color: rgba(0, 0, 0, 0.15);
	-webkit-filter: brightness(0.85);
	-moz-filter: brightness(0.85);
	-o-filter: brightness(0.85);
	-ms-filter: brightness(0.85);
	filter: brightness(0.85);
}
.mod-ac-menu .ico-ac-open:after,
.mod-ac-menu .ico-ac-close:after {
    right: 12px;
}

/* コンテンツ */
.mod-ac-menu > li div.con {
	display: none;
	font-size: 12px;
	padding: 16px 12px 24px;
	border: 1px solid #ddd;
	border-top: none;
}
.mod-ac-menu .section { margin-bottom: 24px; }
.mod-ac-menu .section > * { margin-bottom: 12px; }
.mod-ac-menu .section > *:last-child { margin-bottom: 0; }
.mod-ac-menu .section:last-child { margin-bottom: 0; }
.mod-ac-menu > li:nth-child(even) .con > *:last-child { margin-bottom: 0; }

.mod-ac-menu a.btn-basic > ul { width: 100%; }


/* 注釈・中黒リスト */
.mod-ac-menu .list-ac-notes > li, .mod-ac-menu .list-ac-dot > li {
	counter-increment: notes;
	padding-left: 16px;
	text-indent: -16px;
}
.mod-ac-menu .list-ac-notes > li:before {
	content: "\203b";
	padding-right: 4px;
}
.mod-ac-menu .list-ac-dot > li:before {
	content: "\30FB";
	padding-right: 4px;
}

/* ボタン */
.mod-ac-menu a.btn-basic { font-size: 14px; }
.mod-ac-menu a.btn-white {
	font-size: 12px;
	font-weight: normal;
	padding: 2px;
	min-height: 24px;
	border: 1px solid #0070c9;
}

/* テキストリンク */
.mod-ac-menu a.t-link-b-arrow {
	display: inline-block;
	font-size: 14px;
	padding-right: 24px;
}

/* 2カラムボタン */
.mod-ac-menu .link-2col-area {
	display: -webkit-flex;
	display: flex;
	padding:0 20px;
}
.mod-ac-menu .link-2col-area .col {
	width: 50%;
}
.mod-ac-menu .link-2col-area .col:nth-child(odd) {
	padding-right: 8px;
}
.mod-ac-menu .link-2col-area .col:nth-child(even) {
	padding-left: 8px;
}

/* テキストリンク */
.mod-ac-menu .section .link-area {
	padding: 0 20px;
	margin-bottom: 12px;
}

.mod-ac-menu .section .link-area > ul li {
	display: -webkit-flex;
	display: flex;
	margin-bottom: 8px;
}

.mod-ac-menu .section .link-area > ul li:last-child {
	margin-bottom: 0;
}

/* 注記エリア */
.ac-notes-area {
	font-size: 12px;
	padding: 0 16px 16px;
}

/* TB、PC用指定 */
@media screen and (min-width: 768px) {

/* 18.01.25修正 */
	.mod-ac-menu {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		margin-bottom: -8px;
		margin-right: -16px;
	}
	
	.mod-ac-menu > li{
		width: 50%;
		padding-right: 16px;
	}
	
	.ac-notes-area { padding: 0 32px 16px; }

}




/* カード（セカンドページ） */
.mod-card-sec {
	width: 100%;
	border-radius: 2px;
	background-color: #fff;
	margin: 0 auto 8px;
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
}

.mod-card-sec .inner {
	display: -webkit-flex;
	display: flex;
	width: 100%;
	position:relative;
    padding: 0;
}

.mod-card-sec li.pd16-block{ padding: 16px; }
.mod-card-sec .double {
	-webkit-flex-direction: column;
	flex-direction: column;
}

.mod-card-sec .single li:first-child {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-grow: 1;
	flex-grow: 1;
	min-height: 48px;
	position:relative;
	-webkit-align-items: center;
	align-items: center;
    padding: 8px 12px 8px 52px;
}

.mod-card-sec .single li:last-child {
	display: -webkit-flex;
	display: flex;
	width: 60px;
	font-size: 12px;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
    padding: 8px 12px 8px 0;
}

.mod-card-sec .card-sec-tit {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-grow: 1;
	flex-grow: 1;
	min-height: 48px;
	position:relative;
	-webkit-align-items: center;
	align-items: center;
    padding: 8px 12px 8px 52px;
	border-bottom: 1px solid #ddd;
}


/* アイコンなしstate用ブロック */
.mod-card-sec .double-state {
	-webkit-flex-direction: column;
	flex-direction: column;
}

/* カード全体リンク 青色矢印有り */
.mod-card-link {
	width: 100%;
    border-radius: 2px;
    background-color: #fff;
	margin: 0 auto;
 	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
}

.mod-card-link a:hover {
	background-color: rgba(0, 0, 0, 0.15);
	-webkit-filter: brightness(0.85);
	-moz-filter: brightness(0.85);
	-o-filter: brightness(0.85);
	-ms-filter: brightness(0.85);
	filter: brightness(0.85);
}

.mod-card-link a {
	display: -webkit-flex;
	display: flex;	
}

.card-link-inner {
	display: -webkit-flex;
	display: flex;
	min-height: 56px;
	padding: 0 16px;
	margin: 0 auto;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	text-align: center;
}

.mod-card-link .card-link-inner {
	display: -webkit-flex;
	display: flex;
	min-height: 56px;
	padding: 8px 16px;
	margin: 0 auto;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	text-align: left;
}

.card-link-inner span.t-block { padding: 0 24px 0 0; }


/* カード内リンクブロック1カラム */
.mod-card-sec .link-col-block {
	width: 100%;
	border-top: 1px solid #ddd;
}

.link-col-block .link-col-inner {
	display: -webkit-flex;
	display: flex;
	min-height: 56px;
	-webkit-align-items: center;
	align-items: center;
	width: 100%;
	-webkit-justify-content: center;
	justify-content: center;
	padding: 8px 16px;
}

/* カード内リンクブロック2カラム */
.mod-card-sec .link-col2 { overflow: hidden; }

.mod-card-sec .link-col2-block {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	background-color: #fff;
	border-top: 1px solid #ddd;
	margin-bottom: -1px;
}

.mod-card-sec .link-col2-block li {
	display: -webkit-flex;
	display: flex;
	width: 50%;
	border-bottom: 1px solid #ddd;
	border-right: 1px solid #ddd;
}

.mod-card-sec .link-col2-block li:nth-child(2n) { border-right: none; }

.link-col2-block .link-col2-inner {
    display: -webkit-flex;
	display: flex;
    width: 100%;
    min-height: 56px;
	-webkit-align-items: center;
    align-items: center;
	-webkit-justify-content: center;
    justify-content: center;
 	padding: 8px 16px;
}

.mod-card-sec .link-col-block > a,
.mod-card-sec .link-col2-block li > a {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-grow: 1;
	flex-grow: 1;
}

.link-col-inner span.t-block,
.link-col2-inner span.t-block {
	padding-right: 24px;
}

.double-col-inner {
	display: -webkit-flex;
	display: flex;
	width: 100%;
	-webkit-flex-grow: 1;
	flex-grow: 1;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-flex-direction: column;
	flex-direction: column;
}



/****************************** ヘッダー構造 ******************************/

/* ホームヘッダーメニュー掲載パーツ */
.global-nav {
	width: 100%;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}

.global-nav-inner {
	display: -webkit-flex;
	display: flex;
	width: 100%;
	max-width: 480px;
	min-width: 320px;
	margin: 0 auto;
	border-left: 1px solid #ddd;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}

.global-nav-inner .gnav-col {
	display: -webkit-flex;
	display: flex;
	width: 25%;
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}

.global-nav-inner .t-gnav {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-grow: 1;
	flex-grow: 1;
	width: 100%;
	padding: 0 4px 10px 4px;
	margin: 0 auto;
	font-size: 12px;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-flex-direction: column;
	flex-direction: column;
	text-align: center;
}

.global-nav-inner a {
	color: #000;
	display: -webkit-flex;
	display: flex;
	width: 100%;
	-webkit-flex-direction: column;
	flex-direction: column;
}
/* 19m1(phase2) hover remain  対応 start */
/* .global-nav-inner a:hover, .global-nav-inner a:active { background-color: #fdd000; } */
.global-nav-inner.pc a:hover, .global-nav-inner.pc a:active { background-color: #fdd000; } 
/* .global-nav-inner.sp a:active { background-color: #fdd000; }  */
/* 19m1(phase2) hover remain  対応 end   */

.global-nav-inner .gnav-on {
	background-color: #fdd000;
	pointer-events: none;
	cursor: default;
}

.global-nav-inner .gnav-col:nth-child(4),
.global-nav-inner .gnav-col:last-child {
	border-right: 1px solid #ddd;
}

.global-nav-inner .gnav-col:nth-child(n+5) { border-bottom: none; }

/* ホームメニュー画像掲載指定 */
.ico-home, .ico-data, .ico-charge, .ico-apply, .ico-mailservice, .ico-point, .ico-support, .ico-shop {
	display: block;
	width: 32px;
	height: 32px; 
	margin:10px auto 4px auto;
}

.ico-home { background-position: 0 0;}
.ico-data { background-position: -32px 0;}
.ico-charge { background-position: -64px 0;}
.ico-apply { background-position: -96px 0; }
.ico-mailservice { background-position: -129px 0; }
.ico-point { background-position: -161px 0; }
.ico-support { background-position: -192px 0; }
.ico-shop { background-position: -224px 0; }


/* データ量、契約内容・手続き、オンラインショップ アイコンhover,active用 */

a:hover .ico-data, a:visited .ico-data, a:active .ico-data { background-position: -256px 0; }
a:hover .ico-apply, a:visited .ico-apply, a:active .ico-apply { background-position: -288px 0; }
/*19m1(phase2) chg start */
/* a:hover .ico-shop, a:visited .ico-shop, a:active .ico-shop { background-position: -320px 0; } */
.global-nav-inner.pc > a:hover .ico-shop, .global-nav-inner.pc > a:visited.ico-shop, .global-nav-inner.pc > a:active .ico-shop { background-position: -320px 0; }
/*19m1(phase2) chg end   */

.global-nav-inner .gnav-on > .ico-data  { background-position: -256px 0; }
.global-nav-inner .gnav-on > .ico-apply { background-position: -288px 0; }
/*19m1(phase2) chg start */
/* .global-nav-inner .gnav-on > .ico-shop { background-position: -320px 0; } */
.global-nav-inner.pc .gnav-on > .ico-shop { background-position: -320px 0; }
/*19m1(phase2) chg end   */


/* TB用指定 */
@media screen and (min-width: 768px) {
	
	/* コンテンツメニュー */
	.global-nav-inner {
		max-width: 768px;
		-webkit-flex-wrap: nowrap;
		flex-wrap: nowrap;
	}

	.global-nav-inner .gnav-col {
		border-bottom: none;
		width: 96px;
	}
	
	.global-nav-inner .gnav-col { border-bottom: none;	}
	.global-nav-inner .gnav-col:nth-child(4) { border-right: 1px solid #ddd; }

}


/*  PC用指定 */
@media screen and (min-width: 960px) {
	.hd-inner { min-height: none; height: 100%; }
	
	/* コンテンツメニュー */
	.global-nav-inner { max-width: 960px; }
	.global-nav-inner .gnav-col { width: 120px; }

	/* ホームメニュー画像掲載指定 */
	.ico-home, .ico-data, .ico-charge, .ico-apply, .ico-mailservice, .ico-point, .ico-support, .ico-shop {
		display: block;
		width: 48px;
		height: 48px; 
	}
	
	.ico-home { background-position: 0 -0;}
	.ico-data { background-position: -49px 0;}
	.ico-charge { background-position: -97px 0;}
	.ico-apply { background-position: -144px 0; }
	.ico-mailservice { background-position: -192px 0; }
	.ico-point { background-position: -240px 0; }
	.ico-support { background-position: -288px 0; }
	.ico-shop { background-position: -337px 0; }

	/* データ量、契約内容・手続き、オンラインショップ アイコンhover,active用 */
	a:hover .ico-data, a:visited .ico-data, a:active .ico-data  { background-position: -385px 0; }
	a:hover .ico-apply, a:visited .ico-apply, a:active .ico-apply { background-position: -432px 0; }
	a:hover .ico-shop, a:visited .ico-shop, a:active .ico-shop { background-position: -481px 0; }

	.global-nav-inner .gnav-on > .ico-data  { background-position: -385px 0; }
	.global-nav-inner .gnav-on > .ico-apply { background-position: -432px 0; }
	.global-nav-inner .gnav-on > .ico-shop {  background-position: -481px 0; }
}


/* PC用ヘッダーナビ sprite画像 */
@media screen and (min-width:960px) {
	/* sprite画像 */
	.img-gnav-sprite {
		background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
		background-repeat: no-repeat;
		background-size: 576px;
	}
}



/****************************** header ******************************/

/* H01 グローバルヘッダー */
.hd-inner { overflow: hidden; }

.global-hd {
	display: -webkit-flex;
	display: flex;
	min-width: 320px;
	width: 100%;
	height: 52px;
	-webkit-align-items: center;
	align-items: center;
	position: relative;
	padding: 0 16px;
}

.ico-toggle {
	position: absolute;
	width: 24px;
	height: 24px;
	top: 14px;
	left: 16px;
	content: "";
}

.ico-toggle {background-position: -169px -147px;}

.ico-toggle:hover { opacity: 0.5;}

.logo-mydocomo {
	width: 40px;
	margin: 0 auto;
}

.logo-mydocomo img { width: 40px; }

.logo-docomo {
	position: absolute;
	top: 17px;
	right: 16px;
}

.logo-docomo img { width: 76px; }

/* H03 ステータスバー */
.status-login, .status-logout {
	max-width: 480px;
	min-width: 320px;
	display: -webkit-flex;
	display: flex;
	font-size: 12px;
	padding: 12px 16px 12px 8px;
	margin: 0 auto;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-flex-direction: column;
	flex-direction: column;
	position: relative;
}

.status-login-area {
	display: -webkit-flex;
	display: flex;
	width: 100%;
	-webkit-align-items: center;
	align-items: center;
	-webkit-flex-direction: row;
	flex-direction: row;
}

.status-logout-area {
	display: -webkit-flex;
	display: flex;
	width: 100%;
	padding-right: 83px;
	-webkit-align-items: center;
	align-items: center;
	-webkit-flex-direction: row;
	flex-direction: row;
}

.status-user {
	display: -webkit-flex;
	display: flex;
	width: 60%;
	-webkit-flex-grow: 1;
	flex-grow: 1;
	position: relative;
	word-break: break-all;
}

.status-user .t-area {
	padding: 0 8px 0 24px;
	text-align: left;
}

.status-user-in li { margin-bottom: 4px; }

.status-user-in li:last-child { margin-bottom: 0; }

.status-btn-logout {
	display: -webkit-flex;
	display: flex;
	width: 83px;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
}

.status-btn-login {
	position: absolute;
	top: 23%;
	right: 16px;
}

/* 自動ログイン */
.status-auto {
	display: -webkit-flex;
	display: flex;
	width: auto;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
}


/* ログアウト */
.status-logout-tlink {
	display: -webkit-flex;
	display: flex;
	width: auto;
	padding-top: 12px;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
}

li.account {
	width: auto;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-grow: 1;
	flex-grow: 1;
}

li.account .t-area a { display: inline; }


/* ステータスバーシステムエラー */
.status-error {
	width: 100%;
	margin: 0 auto;
	background: #fff0ab;
}

.status-error .status-error-block { position: relative; }

.status-error .status-error-block:before {
	content: "";
	position: absolute;
	top: -9px;
	left: 32px;
	margin-left: -9px;
	display: block;
	width: 0;
	height: 0;
}

.status-login + .status-error .status-error-block:before {
	border-bottom: 9px solid #fff0ab;
	border-left: 9px solid transparent;
	border-right: 9px solid transparent;
}

.status-error .status-error-inner {
	padding: 12px 12px 16px 12px;
	width: 100%;
}

.status-error a { display: inline-block; }

.ico-error {
  position: relative;
  padding-left: 28px;
  margin-bottom: 8px;
}

.mod-ico-error {
  position: relative;
  padding-left: 32px;
  margin-bottom: 16px;
  text-align: left;
}

.ico-error:before, .mod-ico-error:before {
  content: "";
  height: 24px;
  width: 24px;
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -12px;
  background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
  background-repeat: no-repeat;
  background-size: 384px;
}


.ico-error:before, .mod-ico-error:before { background-position: -240px -147px; }

.ico-error:before, .mod-ico-error:before {
	content: "";
	clear: both;
	display: block;
	*zoom: 1;
}


/* TB、PC用指定 */
@media screen and (min-width: 768px) {

	/* ステータスバーシステムエラー */
	.status-error .status-error-inner:before{ left: 40px; }
	.status-error .status-error-inner { padding: 12px 44px 16px 44px; }
	
}



/* TB用指定 */
@media screen and (min-width: 768px) {

	/* H01 グローバルヘッダー */
	.global-hd {
		clear: both;
		width: 100%;
		height: 52px;
		-webkit-align-items: center;
		align-items: center;
		-webkit-justify-content: flex-start;
		justify-content: flex-start;
		padding: 0 24px;
		margin: 0 auto;
	}	
	
	.ico-toggle { position: static; }
	.logo-docomo { position: static; }
	.global-toggle { margin-right: 24px; }
	
	.logo-mydocomo {
		-webkit-flex-grow: 1;
		flex-grow: 1;
	}
	
	.logo-mydocomo a, .logo-mydocomo img { width: 112px; }
	
	
	/* H03 ステータスバー */
	.status-login, .status-logout {
		max-width: 768px;
		min-height: 23px;
		padding: 12px 32px 12px 8px;
		-webkit-align-items: center;
		align-items: center;
		-webkit-flex-direction: row;
		flex-direction: row;
		position: static;
	}
	
	.status-btn-login { position: static; }

	.status-user-in .t-area {
		padding: 0 16px 0 24px;
		text-align: left;
	}

	.status-user-in li:last-child .t-area { padding: 0 0 0 0; }

	.status-user-in li { margin-bottom: 0; }

	.status-user .status-user-in {
		display: -webkit-flex;
		display: flex;
		-webkit-align-items: center;
		align-items: center;
	}

	.login-info-in {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-direction: row;
		flex-direction: row;
	}
	
	
	/* ログアウト */
	.status-logout-area {
		display: -webkit-flex;
		display: flex;
		-webkit-align-items: center;
		align-items: center;
		-webkit-flex-direction: row;
		flex-direction: row;
		-ms-flex: 0 1 auto; /* IE10表示用 */
	}

	.status-logout-tlink {
		width: 36%;
		padding: 0 16px 0 0;
	}

	.logout-area-in {
		width: 100%;
		-webkit-flex-grow: 1;
		flex-grow: 1;
	}

	li.account {
		border-left: 1px solid #ddd;
		padding-left: 16px;
	}

	.logout-area-in .status-user {
		display: -webkit-flex;
		display: flex;
		text-align: left;
		-webkit-flex-grow: 1;
		flex-grow: 1;
		-webkit-align-items: center;
		align-items: center;
		margin-bottom: 0;
		border-right: none;
	}
	
}


/*  PC用指定 960px～max */
@media screen and (min-width: 960px) {
	
	/* H01 グローバルヘッダー */
	.logo-mydocomo a, .logo-mydocomo img { width: 112px; }
	
	/* H03 ステータスバー */
	.status-login, .status-logout {	max-width: 960px; }
	
	/* ログアウト */
	.logout-area-in li .t-area { padding: 0 16px 0 24px; }
	
	.logout-area-in li.account .t-area { padding: 0 0 0 16px; }
	
}

/****************************** /ヘッダー構造 ******************************/


/****************************** alert他 ******************************/

.main-box-in {
	max-width: 480px;
	min-width: 320px;
	padding: 12px 16px 0;
	margin: 0 auto;
	text-align: center;
}

.main-box-in .box-col {
	width: 100%;
	border-radius: 2px;
	background-color: #fff;
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
	margin: 0 auto;
	position: relative;
	text-align: left;
}

.main-box-in .box-col a { color: #333; }

.box-alert-area, .box-info-area { padding-top: 12px; }

.box-alert-area + .box-info-area,
.box-info-area + .box-alert-area {
	padding-top: 0;
} 

.box-alert-area li,
.box-info-area li {
	background-color: #f3f3f3;
	font-size: 12px;
	min-height: 48px;
}
.box-alert-area li {
	color: #cc0033;
	border-top: none;
	border-right: 2px solid #cc0033;
	border-left: 2px solid #cc0033;
	border-bottom: 2px solid #cc0033;
	position: relative;
}
.box-alert-area li:first-child { border-top: 2px solid #cc0033; }
.box-alert-area li:nth-child(n+2) { min-height: 46px; }

.box-alert-area li:before {
	content: "";
	height: 24px;
	width: 24px;
	position: absolute;
	top: 10px;
	left: 10px;
	background-position: -264px -147px;
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
	background-repeat: no-repeat;
	background-size: 384px;
}
.box-alert-area li a {
	color: #cc0033;
	padding: 13px 12px 13px 40px;
	text-decoration: underline;
}
.box-info-area li { border-bottom: 1px solid #ddd; }

.box-info-area li:last-child { border-bottom: none; }

.box-info-area li a {
	color: #333;
	padding: 15px 12px;
	text-decoration: underline;
}

.box-reco-wrap {
	display: inline-block;
	position: relative;
	vertical-align: middle;
}

/* 2018.02.08修正対応 */
.box-reco-txt { padding: 16px 40px 16px 12px; }

/*
.box-reco-txt { padding: 16px 12px; }
*/

.box-reco-txt:hover {
	background-color: rgba(0, 0, 0, 0.15);
	-webkit-filter: brightness(0.85);
	-moz-filter: brightness(0.85);
	-o-filter: brightness(0.85);
	-ms-filter: brightness(0.85);
	filter: brightness(0.85);
}

.sp-only .box-reco-img {
	max-height: 252px;
	max-width: 100%;
	width: initial;
}

.box-recommend h3 {
	font-weight: bold;
	margin-bottom: 8px;
}

.close-area {
	position: absolute;
	top: 0;
	right: 0;
}

.close-area a {
	padding: 8px;
	height: 40px;
	width: 40px;
}

.close-area a:hover {
	background-color: rgba(0, 0, 0, 0.15);
	-webkit-filter: brightness(0.85);
	-moz-filter: brightness(0.85);
	-o-filter: brightness(0.85);
	-ms-filter: brightness(0.85);
	filter: brightness(0.85);
}

.close-area .close {
	display: block;
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
	background-position: -144px -147px;
	background-repeat: no-repeat;
	background-size: 384px;
	height: 24px;
	width: 24px;
}


/* TB用指定 */
@media screen and (min-width: 768px) {
	.main-box-in {
		min-width: 768px;
		padding: 12px 32px 0 32px;
	}
	
	.box-reco-area { margin: 0; }
	
	.box-alert-area, .box-info-area {
		padding: 12px 32px 0;
		min-width: 768px;
	}
	
}


/*  PC用指定 960px～max */
@media screen and (min-width: 960px) {

	.main-box-in { min-width: 960px; }
	.box-alert-area, .box-info-area { min-width: 960px; }

}


/****************************** /alert他 ******************************/


/****************************** タイトル設定 ******************************/

.rec-title {
	padding: 12px 0;
	font-size: 18px;
	text-align: center;
	margin: 0 auto;
}

.title {
	text-align: center;
	padding: 24px 16px;
	font-size: 18px;
	max-width: 480px;
	margin: 0 auto;
}

.tit-cont {
	font-size: 18px;
	padding: 0 16px 24px;
}

/* TB用指定 */
@media screen and (min-width: 768px) {

	.rec-title {
		padding: 20px 32px;
		max-width: 768px;
	}

	.title {
		padding: 32px 64px;
		max-width: 768px;
		margin: 0;
	}
	
}

/*  PC用指定 960px～max */
@media screen and (min-width: 960px) {

	.rec-title { 
		font-size: 24px;
		max-width: 960px;
	 }

	.title { 
		font-size: 24px;
		max-width: 960px;
	 }
	
}

/****************************** /タイトル設定 ******************************/



/****************************** コンテンツ構造 ******************************/

/* ユーザー情報 */
.tit-use-area {
	padding: 12px 16px;
	font-size: 12px;
	font-weight: bold;
}

/* 法人用 */
.tit-use-area p:nth-child(1) { float: left; }

.tit-use-area p:nth-child(2) {
	float: right;
	padding-left: 12px;
	text-align: right;
}

.tit-use-area:after {
	content: "";
	clear: both;
	display: block;
	*zoom: 1;
}



/* ユーザー情報余白対応追加 18.06.26 */
.tit-use-block {
	padding: 12px 0;
	font-size: 12px;
	font-weight: bold;
}

.tit-use-block p:nth-child(1) { float: left; }

.tit-use-block p:nth-child(2) {
	float: right;
	padding-left: 12px;
	text-align: right;
}

.tit-use-block:after {
	content: "";
	clear: both;
	display: block;
	*zoom: 1;
}



.main {
	display: -webkit-flex;
	display: flex;
	max-width: 480px;
	min-width: 320px;
	margin: 0 auto;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}

.main-login .tit-use-info {
	padding: 12px 0;
	font-size: 12px;
	font-weight: bold;
}

.main.main-inner { padding: 0 16px 8px 16px; }

.main.snd-main-inner { padding: 0 16px 16px; }

.disabled-text {
	filter:alpha(opacity=25);
	-moz-opacity: 0.25;
	opacity: 0.25;
}

.card-t-number {
	font-size: 26px;
	white-space: nowrap;
}

.card-t-snumber {
	font-size: 20px;
	white-space: nowrap;
}

.card-t-ssnumber {
	font-size: 18px;
	white-space: nowrap;
}

.logout-t {
	font-size: 18px;
	font-weight: bold;
}

.t-unit {
	font-size: 12px !important;
	font-weight: bold;
	margin-left: 4px;
}
.t-taxin {
	font-size: 12px !important;
	margin-right: 4px;
}

.centering-block {
	display: table;
	width: 100%;
	position: relative;
}

.in-data-line {
	position: absolute;
	bottom: 5px;
	left: 50%;
	width: 22px;
	margin-left: -11px;
	text-align: center;
}

.centering-block .in-data-use p,
.centering-block .in-data-total p {
	margin-bottom: 4px;
}

.centering-block .in-data-use {
	display: table-cell;
	text-align: center;
	width: 50%;
	padding-right: 11px
}

.centering-block .in-data-total {
	display: table-cell;
	text-align: center;
	width: 50%;
	padding-left: 11px;
}


/* 追加 18v1対応 */
.centering-t-area {
	width: 100%;
	font-size: 12px;
	text-align: left;
	padding: 4px 16px;
	background-color: #fafafa;
	border-bottom: 1px solid #ddd;
}

/* 追加 18v1対応 */
.flex-inner-right {
	-webkit-align-self: flex-end;
	align-self: flex-end;
}



/* SMT用指定 ホーム1to1カード部分指定内容をindex.cssから移動 */

.main .main-col {
	width: 100%;
    border-radius: 2px;
    background-color: #fff;
	margin: 0 auto 8px;
	-webkit-flex-direction: column;
	flex-direction: column;
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
}

.main .main-col-inner {
	position:relative;
	border-bottom: 1px solid #ddd;
}

.main-col .main-col-inner a {
	display: -webkit-flex;
	display: flex;
	width: 100%;
	color: #333;
	padding: 8px 12px;
}

.main-col .main-col-inner a:hover {
	background-color: rgba(0, 0, 0, 0.15);
	-webkit-filter: brightness(0.85);
	-moz-filter: brightness(0.85);
	-o-filter: brightness(0.85);
	-ms-filter: brightness(0.85);
	filter: brightness(0.85);
}

/* タブレット用指定 */
@media screen and (min-width: 768px) {

	.tit-use-area { padding: 12px 32px; }
	
	.main { min-width: 768px; }
	.main.main-inner { padding: 0 24px 8px 24px; }
	.main.snd-main-inner { padding: 0 32px 24px 32px }
	
	.main .main-col {
		display: -webkit-flex;
		display: flex;
		width: 344px;
		margin: 0 8px 8px 8px;
	}
	
}


/* PC用指定 メインエリア中央寄せ */
@media screen and (min-width: 960px) {

	.main { min-width: 960px; }
	
	.main .main-col {
		display: -webkit-flex;
		display: flex;
		width: 288px;
	}
	
}



/* バナー＋テキスト */
.col-in > .tit-bnr {
	padding: 16px;
	font-weight: bold;
	background-color: #efefef;
}

.bnr-link-block {
	display: -webkit-flex;
	display: flex;
	color: #333;
	-webkit-flex-grow: 1;
	flex-grow: 1;
}

.bnr-link-block:hover {
	background-color: rgba(0, 0, 0, 0.15);
	-webkit-filter: brightness(0.85);
	-moz-filter: brightness(0.85);
	-o-filter: brightness(0.85);
	-ms-filter: brightness(0.85);
	filter: brightness(0.85);
}

.bnr-t-list {
	width: 100%;
	padding: 16px;
}

.bnr-t-list dt {
	float: left;
	clear: both;
	width: 110px;
}

.bnr-t-list dt > img {
	display: block;
	width: 110px;
	border: 1px solid #ddd;
}

.bnr-t-list dd {
	margin-top: 4px;
	margin-left: 110px;
	padding-left: 16px;
}


/****************************** /コンテンツ構造 ******************************/



/****************************** サブコンテンツ構造 ******************************/

.sub-contents { padding-bottom: 8px; }
.sub-contents > *:last-child { margin-bottom: 0 !important; }

/* タブ切り替え */
ul.bc-tab-menu {
	display: -webkit-flex;
	display: flex;
	width: 100%;
}

ul.bc-tab-menu li {
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	width: 50%;
	text-align: center;
	cursor: pointer;
}

ul.bc-tab-menu li p { width: 100%; }

ul.bc-tab-menu li p {
	color: #999;
	display: block;
	padding: 12px;
}

ul.bc-tab-menu li.active p {
	color: #333;
	font-weight: bold;
	padding-bottom: 8px;
}

ul.bc-tab-menu li.active { border-bottom: 4px solid #fdd000; }

ul.bc-tab-menu li.active:hover { cursor: default; }
ul.bc-tab-menu li:not(.active):hover{
	background-color: rgba(0, 0, 0, 0.15);
	-webkit-filter: brightness(0.85);
	-moz-filter: brightness(0.85);
	-o-filter: brightness(0.85);
	-ms-filter: brightness(0.85);
	filter: brightness(0.85);
}


/* お困りのことはありますか？ */
.support-area {
	background-color: #fff;
}

.support-area .inner {
	display: block;
	width: 100%;
}

.support-area .inner .ico-area { 
	display: -webkit-flex;
	display: flex;
	padding: 0 16px;
	position: relative;
}

.support-area .tit-cont {
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	min-height: 80px;
	padding: 16px 0 16px 56px;
}

.support-area .tit-cont:before {
	content: "";
	height: 48px;
	width: 48px;
	position: absolute;
	margin-top: -24px;
	top: 50%;
	left: 16px;
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
	background-repeat: no-repeat;
	background-size: 384px;
}
.support-area .ico-hatena h3:before { background-position: 0 -238px; }
.support-area .ico-question h3:before { background-position: -48px -238px; }

.support-area .ico-hatena-s:before,
.support-area .ico-question-s:before {
	content: "";
	height: 32px;
	width: 32px;
	position: absolute;
	margin-top: -16px;
	top: 50%;
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
	background-repeat: no-repeat;
	background-size: 384px;
}
.support-area .ico-hatena-s:before { background-position: -96px -238px; }
.support-area .ico-question-s:before { background-position: -128px -238px; }


/* よくあるご質問 */
.tit-question {
	padding: 16px;
	font-weight: bold;
	background-color: #efefef;
}

.support-area .inner .col { background-color: #fff; }

/* 17.11.21修正 */
.support-area .inner .col .col-in {
	display: -webkit-flex;
	display: flex;
	max-width: 480px;
	width: 100%;
	margin: 0 auto;
	-webkit-flex-direction: column;
	flex-direction: column;
}

.support-area .col-in .support-list a {
	display: -webkit-flex;
	display: flex;
}
.support-area .col-in .support-list p {
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	padding: 8px 32px 8px 40px;
	min-height: 48px;
	width: 100%;
}

.support-area .inner .col .t-link-pd a {
	display: -webkit-flex;
	display: flex;	
	font-weight: bold;
	padding: 16px;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	text-align: left;	
}

.support-area .inner .col .t-link-pd span { padding-right: 24px; }


/* お知らせ */
.info-area .list-inner {
	border-bottom: 1px solid #ddd;
	padding: 12px 32px 12px 8px;
}
.info-area .list-inner dt {
	font-size: 12px;
	margin-bottom: 4px;
}
.info-area .list-inner dd { font-size: 12px; }

.info-area .t-link-pd a {
	display: -webkit-flex;
	display: flex;
	font-weight: bold;
	padding: 16px;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	text-align: left;
}

.info-area .t-link-pd span { padding-right: 24px; }


/* TB用指定 */
@media screen and (min-width: 768px) {

	.support-area .inner {
		display: -webkit-flex;
		display: flex;
		margin: 0 auto;
		padding: 0 32px;
		text-align: left;
		max-width: 768px;
	}
	
	.support-area .inner .col {
		display: -webkit-flex;
		display: flex;
		width: 50%;
	}
	
	/* サブコンテンツ よくあるご質問 */
	.support-area .inner .col:first-child {
		border-right: 1px solid #ddd;
		border-bottom: none;
		margin-bottom: 0;
	}

	.info-area { padding: 0 32px; }
	.info-area .t-link-pd { margin-top: 12px; }
}


/* PC用指定 */
@media screen and (min-width:960px) {

	.support-area .inner { max-width: 960px; }
	
}


/****************************** /サブコンテンツ構造 ******************************/



/****************************** ドロワー構造 ******************************/

/******* ドロワー全体 *******/
.drw-area {
	position: absolute;
	display: -webkit-flex;
	display: flex;
	height: 100%;
	width: 100%;
	z-index: 999;
}


/******* グレイ背景エリア *******/
.drw-bg {
	padding-right: 48px;
	background-color: rgba(0,0,0,0.5);
	-webkit-flex-grow: 1;
	flex-grow: 1;
    position: relative;
}
/* ×ボタン */
.drw-btn-close-area {
	display: block;
	height: 24px;
	width: 24px;
	position: absolute;
	right: 12px;
	top: 12px;
}
.btn-drw-close { background-position: -120px -147px; }
.btn-drw-close {
	display: block;
	height: 24px;
	width: 24px;
}


/******* 白背景エリア *******/
.drw-content {
	width: 316px;
	min-width: 272px;
	height: 100%;
	overflow: auto;
	background: #fff;
}

/******* グレイ背景エリア *******/
.drw-title-area {
	background-color: #fafafa;
	font-size: 12px;
	padding: 20px 16px 12px;
}

/******* 認証情報エリア *******/
.drw-o2o-area .o2o-info {
	border-bottom: 1px solid #ddd;
}
.drw-o2o-area .auth-info {
	position: relative;
	padding-left: 76px;
	margin-bottom: 16px;
}
.drw-o2o-area .auth-info dl a {
	display: inline;
	color: #0070C9;
}
.drw-o2o-area .auth-info dt { font-size: 12px; }
.drw-o2o-area .auth-info dd { font-size: 13px; }

/* ユーザーアイコン */
.ico-user { background-position: -92px -113px; }
.ico-user{
	display: block;
	height: 32px;
	width: 32px;
	position: absolute;
	left: 16px;
	top: 8px;
}

/* カラー丸アイコン */
.ico-drw-circle-blue { background-position: -20px -113px; }
.ico-drw-circle-red { background-position: -36px -113px;}
.ico-drw-circle-yellow { background-position: -52px -113px;}
.ico-drw-circle-blue, .ico-drw-circle-red, .ico-drw-circle-yellow {
    position: absolute;
    width: 16px;
    height: 16px;
    content: "";
    top: 12px;
    left: 52px;
}
.drw-o2o-area .auth-info dl{ padding: 12px 16px 0 0; }
.drw-o2o-area .auth-info dl dd{ margin-top: 4px; }

/* アコーディオン（開く・閉じる）ボタン */
.btn-o2o-ac {
	position: absolute;
	width: 24px;
	height: 24px;
    bottom: 0;
    right: 16px;
}
.ico-o2o-ac-open { background-position: -72px -147px; }
.ico-o2o-ac-close { background-position: -48px -147px; }

.ico-o2o-ac-open, .ico-o2o-ac-close {
	display: block;
	height: 24px;
	width: 24px;
}

/* 最終ログイン・ニックネーム */
.last-login-date, .drw-nickname {
	font-size: 12px;
	padding:0 16px;
	margin-top: 24px;
}
.drw-nickname { padding-bottom: 16px; }

.last-login-date dt, .last-login-date dd, .drw-nickname dt, .drw-nickname dd {
	display: inline-block;
}
.drw-nickname dd{
	font-size: 14px;
	font-weight: bold;
}

.link-wrap { border-top: 1px solid #ddd; }
.link-wrap a {
	color: #333;
	font-size: 12px;
	padding: 16px;
}
.color-link{ color: #4195d7; }


/******* ステージ情報 *******/
.stage-info { border-bottom: 1px solid #ddd; }
.stage-info a{
	color: #333;
	position: relative;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	padding: 16px 48px 16px 16px;
}
.stage-info .stage-info-inner {
	font-size: 12px;
	font-weight: bold;
}

/* dアイコン */
.ico-drw-stage { background-position: -68px -113px; }

/* ドコモポイントアイコン 17.11.24追加 */
.ico-drw-docomopoint { background-position: -237px -113px; }

.ico-drw-stage, .ico-drw-docomopoint {
	display: block;
    width: 24px;
    height: 24px;
    position: absolute;
    top: 50%;
    left: 16px;
    margin-top: -12px;
}

.stage-info dl{ padding-left: 28px; }


/* ステージsprite画像設定 18v1対応 */
.img-stage {
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
	background-repeat: no-repeat;
	background-size: 384px;
	position: relative;
	font-size: 0;
}

.drw-stage-1st, .drw-stage-2nd, .drw-stage-3rd, .drw-stage-4th, .drw-stage-platinum,
.drw-stage-bpc1st, .drw-stage-bpc2nd, .drw-stage-bpc3rd, .drw-stage-bpcpremiere, .drw-stage-bpcgpremiere, .drw-stage-bpcgold {
	display: block;
	width: 80px;
	height: 16px;
}

.drw-stage-bpc1st, .drw-stage-bpc2nd, .drw-stage-bpc3rd, .drw-stage-bpcpremiere, .drw-stage-bpcgpremiere, .drw-stage-bpcgold {
	margin-top: 2px;
}

.drw-stage-1st { background-position: 0 -621px; }
.drw-stage-2nd { background-position: -86px -621px; }
.drw-stage-3rd { background-position: -172px -621px; }
.drw-stage-4th { background-position: -258px -621px; }
.drw-stage-platinum { background-position: 0 -641px; }

.drw-stage-bpc1st { background-position: 0 -661px; }
.drw-stage-bpc2nd { background-position: -86px -661px; }
.drw-stage-bpc3rd { background-position: -172px -661px; }
.drw-stage-bpcpremiere { background-position: -258px -661px; }
.drw-stage-bpcgpremiere { background-position: 0 -681px; }
.drw-stage-bpcgold { background-position: -86px -681px; }



/* dポイント掲載箇所差し替え 18v1対応 */
.stage-info dd {
	display: -webkit-flex;
	display: flex;
	margin-top: 4px;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}


/******* ログイン・ログアウトボタン *******/
.drw-logged-area {
	text-align: center;
	padding-bottom: 16px;
	margin-top: 24px;
}
.drw-logged-area a {
	display: inline-block;
	vertical-align: top;
}
.btn-drw-login, .btn-drw-logout {
	display: block;
	height: 46px;
	width: 152px;
}
.btn-drw-login { background-position: -0 -412px; }
.btn-drw-login:hover, .btn-drw-login:active{
	background-position: 0 -467px;
}
.btn-drw-logout { background-position: -160px -412px; }
.btn-drw-logout:hover, .btn-drw-logout:active {
	background-position: -160px -467px;
}


/******* リンクリスト *******/
.drw-link-list > li > a, .drw-link-list > .title, .ac-link-list li a{
	color: #333;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	min-height: 48px;
	padding: 13px 48px 13px 16px;
	font-size: 14px;
	font-weight: bold;
}

/* アコーディオン内のリスト */
.ac-link-list li a {
	font-weight: normal;
	padding: 13px 48px 13px 32px;
}

.drw-link-list .identify {
	border-bottom: 1px solid #ddd;
}
.drw-link-list .identify a {
	color: #0070C9;
	font-size: 12px;
	font-weight: bold;
	min-height: 40px;
	padding: 11px 48px 11px 16px;
}

/* リンクリストの見出し */
.drw-link-list > .title {
	font-weight: normal;
	background-color: #fafafa;
	margin-bottom: 8px;
}
.drw-link-list > .title p{
	margin-top: 8px;
	font-size: 12px;
}

/* drwリンクリスト追加 タイトル＋テキスト */
.drw-link-listcol > li { border-top: 1px solid #ddd; }

.drw-link-listcol > li > a {
	color: #333;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-flex-grow: 1;
  	flex-grow: 1;
	min-height: 48px;
	padding: 13px 48px 13px 16px;
	font-size: 12px;
}

.drw-link-listcol > li > a > span {
	display: block;
	margin-bottom: 8px;
	font-weight: bold;
	font-size: 14px;
}


/****************************** /ドロワー構造 ******************************/


/******************** /footer構造 ********************/

/* My docomoメニュー1、2 */
.myd-menu-01 .list-area a,
.myd-menu-02 .list-area a {
	position: relative;
	padding-left: 12px;
	color: #333;
}
.myd-menu-02 .list-area a {
	min-height: auto;
}
.myd-menu-01 .list-area a:after,
.myd-menu-02 .list-area a:after {
	content: "";
	height: 24px;
	width: 24px;
	position: absolute;
	top: 50%;
	right: 12px;
	margin-top: -12px;
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
	background-repeat: no-repeat;
	background-size: 384px;
	background-position: 0 -146px;
}
.myd-menu-01 .tb-link,
.myd-menu-02 .tb-link {
	display: table;
	width: 100%;
	padding: 16px 0;
	border-bottom: 1px solid #ddd;
}
.myd-menu-01 .tb-link li,
.myd-menu-02 .tb-link li{
	display: table-cell;
	vertical-align: middle;
}
.myd-menu-01 .tb-link li:first-child,
.myd-menu-02 .tb-link li:first-child{
	width: 48px;
}
.myd-menu-01 .tb-link li:last-child,
.myd-menu-02 .tb-link li:last-child{
	padding: 0 44px 0 12px;
}
.myd-menu-01 .tb-link li:last-child p:first-child,
.myd-menu-02 .tb-link li:last-child p:first-child {
	font-weight: bold;
}
.myd-menu-01 .tb-link li:last-child p:last-child {
	font-size: 12px;
	color: #757575;
	margin-top: 8px;
}

/* アイコン */
.ico-foot-home, .ico-foot-data, .ico-foot-charge, .ico-foot-apply, .ico-foot-mailservice, .ico-foot-point, .ico-foot-device, .ico-foot-shop, .ico-first, .ico-service-list, .ico-appli {
	display: block;
	width: 48px;
	height: 48px;
}

.ico-foot-home { background-position: 0 -181px;}
.ico-foot-data { background-position: -48px -181px;}
.ico-foot-charge { background-position: -96px -181px;}
.ico-foot-apply { background-position: -144px -181px; }
.ico-foot-mailservice { background-position: -192px -181px; }
.ico-foot-point { background-position: -240px -181px; }
.ico-foot-device { background-position: -288px -181px; }
.ico-foot-shop { background-position: -336px -181px; }
.ico-first { background-position: 0 -296px; }
.ico-service-list { background-position: -48px -296px; }
.ico-appli { background-position: -96px -296px; }



/* SNSエリア */
.ft-sns-area{
	text-align: center;
	padding: 32px 0;
	border-bottom: 1px solid #ddd;
}
.ft-sns-area .sns-catch {
	font-weight: bold;
	margin-bottom: 12px;
}
.ft-sns-area .sns-catch:before {
	content: "/";
	-webkit-transform: rotateX(180deg);
	transform: rotateX(180deg);
	display: inline-block;
	margin-right: 4px;
}
.ft-sns-area .sns-catch:after {
	content: "/";
	display: inline-block;
	margin-left: 4px;
}
.ico-facebook, .ico-twitter, .ico-line, .ico-youtube {
	display: block;
	width: 48px;
	height: 48px;
}

.ico-facebook { background-position: 0 -354px; }
.ico-twitter { background-position: -48px -354px; }
.ico-line { background-position: -96px -354px; }
.ico-youtube { background-position: -144px -354px; }

.ft-sns-area .sns-link li {
	display: inline-block;
	vertical-align: top;
	margin-right: 16px;
}
.ft-sns-area .sns-link li:last-child { margin-right: 0; }


/* リンクリスト */
.ft-link-list{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}
.ft-link-list li{
	display: -webkit-flex;
	display: flex;
	width: 50%;
	border-bottom: 1px solid #ddd;
	border-right: 1px solid #ddd;
}
.ft-link-list li:nth-child(odd){ border-left: 1px solid #ddd; }

.ft-link-list.col3 li{ width: 50%; }
.ft-link-list.col4 li{ width: 50%; }

.ft-link-list li a{
	display: -webkit-flex;
	display: flex;
	color: #333;
	width: 100%;
	font-size: 12px;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	padding: 16px 12px;
}


/* 検索エリア */
.ft-search-area {
	padding: 16px 0;
	background-color: #fff;
	border-left: 1px solid #ddd;
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	min-height: 102px;
}
.ft-search-area li{
	text-align: center;
}
.ft-search-area .docomo-text{
	font-size: 12px;
	font-weight: bold;
	margin-bottom: 20px;
}
.ft-search-area .docomo-text img{
	width: 63px;
	vertical-align: middle;
	margin: -5px 4px 0 0;
}
.ft-search-area .search-box {
	margin: 0 auto;
	padding: 0 24px;
	width: 100%;
}
.ft-search-area .search-box input[type=text] {
	width: 100%;
	padding: 4px 32px 4px 8px;
	height: 32px;
	border: 1px solid #ddd;
	border-radius: 3px;
}
.ft-search-area .search-box .form-search {
	position: relative;
}
.ft-search-area .search-box input[type=image] {
	padding: 8px;
    position: absolute;
    right: 0;
    top: 0;
}

/* コピーライトエリア */
.ft-copyright-area{
	background-color: #d1d1d1;
	padding:16px 0 48px;
}
.ft-copyright-area .inner{
	padding: 0 12px;
}
.ft-copyright-area .text-link{
	margin-bottom: 24px;
	font-size: 0px; /* 余白バグ対策 */
}
.ft-copyright-area .text-link li{
	font-size: 12px;
	display: inline-block;
	border-right: solid 1px #333;
	padding-right: 10px;
	margin-right: 10px;
}
.ft-copyright-area .text-link li:last-child {
	border-right: none;
}

.ft-copyright-area .copyright{
	font-size: 12px;
	text-align: center;
}



/* TB用指定 */
@media screen and (min-width: 768px) {

	/* My docomoメニュー1、2 */
	.myd-menu-02-area {
		border-bottom: 1px solid #ddd;
	}
	.myd-menu-01 {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		border-top: 1px solid #ddd;
		border-left: 1px solid #ddd;
	}
	.myd-menu-02 {
		display: -webkit-flex;
		display: flex;
	}
	.myd-menu-01 .list-area {
		display: -webkit-flex;
		display: flex;
		width: 25%;
		border-right: 1px solid #ddd;
		border-bottom: 1px solid #ddd;
	}
	.myd-menu-02 .list-area {
		width: 33.33%;
	}
	.myd-menu-01 .list-area a {
		width: 100%;
		padding: 12px 16px;
	}
	.myd-menu-02 .list-area a {
		padding: 12px 16px 16px 16px;
		min-height: 113px;
	}
	.myd-menu-01 .list-area a:after,
	.myd-menu-02 .list-area a:after {
		display: none;
	}
	.myd-menu-01 .tb-link,
	.myd-menu-02 .tb-link {
		display: block;
		padding: 0;
		border-bottom: none;
	}
	.myd-menu-01 .tb-link li,
	.myd-menu-02 .tb-link li{
		display: block;
	}
	.myd-menu-01 .tb-link li:first-child,
	.myd-menu-02 .tb-link li:first-child{
		width: 100%;
		margin-bottom: 4px;
	}
	.myd-menu-01 .tb-link li:last-child,
	.myd-menu-02 .tb-link li:last-child{
		padding: 0;
	}
	.ico-foot-home, .ico-foot-data, .ico-foot-charge, .ico-foot-apply, .ico-foot-mailservice, .ico-foot-point, .ico-foot-device, .ico-foot-shop, .ico-first, .ico-service-list, .ico-appli {
		margin: 0 auto;
	}
	.myd-menu-01 .tb-link li:last-child p:first-child,
	.myd-menu-02 .tb-link li:last-child p:first-child {
		text-align: center;
	}
	.myd-menu-01 .tb-link li:last-child p:last-child {
		margin-top: 12px;
		font-size: 12px;
		color: #757575;
	}
	
	/* sprite画像(仮) */
	.img-fnav-sprite {
		background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
		background-repeat: no-repeat;
		background-size: 480px;
	}

	/* アイコン */
	.ico-foot-home, .ico-foot-data, .ico-foot-charge, .ico-foot-apply, .ico-foot-mailservice, .ico-foot-point, .ico-foot-device, .ico-foot-shop, .ico-first, .ico-service-list, .ico-appli {
		display: block;
		width: 60px;
		height: 60px;
	}
	.ico-foot-home { background-position: 0 -226px;}
	.ico-foot-data { background-position: -60px -226px;}
	.ico-foot-charge { background-position: -120px -226px;}
	.ico-foot-apply { background-position: -180px -226px; }
	.ico-foot-mailservice { background-position: -240px -226px; }
	.ico-foot-point { background-position: -300px -226px; }
	.ico-foot-device { background-position: -360px -226px; }
	.ico-foot-shop { background-position: -420px -226px; }
	.ico-first { background-position: 0 -370px; }
	.ico-service-list { background-position: -60px -370px; }
	.ico-appli { background-position: -120px -370px; }

	.ft-copyright-area .text-link {
		text-align: center;
	}


	/* リンクリスト */
	.ft-link-list{
		border-left: 1px solid #ddd;
	}
	.ft-link-list li:nth-child(odd){
		border-left: none;
	}
	.ft-link-list.col3 li{ width: 33.33%; }
	.ft-link-list.col4 li{ width: 25%; }

	/* 検索エリア */
	.ft-search-area{
		display: table;
		min-height: 62px;
		text-align: center;
		width: 100%;
	}
	.ft-search-area .docomo-text {
		display: table-cell;
		margin-bottom: 0;
	}
	.ft-search-area .search-box {
		display: table-cell;
		text-align: right;
		padding: 0 24px;
		width: 50%;
	}
}

/* PC用指定 */
@media screen and (min-width:960px){
	
	.myd-menu-02 .list-area a {
		min-height: 120px;
	}

	/* sprite画像(仮) */
	.img-fnav-sprite {
		background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
		background-repeat: no-repeat;
		background-size: 480px;
	}

	/* アイコン */
	.ico-foot-home, .ico-foot-data, .ico-foot-charge, .ico-foot-apply, .ico-foot-mailservice, .ico-foot-point, .ico-foot-device, .ico-foot-shop, .ico-first, .ico-service-list, .ico-appli {
		display: block;
		width: 60px;
		height: 60px;
	}
	.ico-foot-home { background-position: 0 -226px;}
	.ico-foot-data { background-position: -60px -226px;}
	.ico-foot-charge { background-position: -120px -226px;}
	.ico-foot-apply { background-position: -180px -226px; }
	.ico-foot-mailservice { background-position: -240px -226px; }
	.ico-foot-point { background-position: -300px -226px; }
	.ico-foot-device { background-position: -360px -226px; }
	.ico-foot-shop { background-position: -420px -226px; }
	.ico-first { background-position: 0 -370px; }
	.ico-service-list { background-position: -60px -370px; }
	.ico-appli { background-position: -120px -370px; }

	.ft-copyright-area .text-link {
		text-align: center;
	}
}


/******************** /footer構造 ********************/




/******************** 2カラム **********************/
.container-l,
.container-r {
	width: 100%;
}

.no-link { width: 100%; }

.container-l .tit-use-info {
	padding: 12px 0;
	font-size: 12px;
	font-weight: bold;
}


.container-r .tit-use-info {
	padding: 16px 0 12px 0;
	font-size: 12px;
	font-weight: bold;
}

.snd-tit {
	font-weight: bold;
	padding-bottom: 4px;
	margin-bottom: 12px;
	border-bottom: 1px solid #ddd;
}

.snd-s-tit {
	font-weight: bold;
	padding: 12px 0 8px 0;
}

.snd-main-balloon {
	display: -webkit-flex;
	display: flex;
	position: relative;
	margin-bottom: 8px;
	padding: 12px 0 16px;
	width: 100%;
	background: #fff;
	border-radius: 2px;
	text-align: center;
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
}

.snd-main-balloon:before{
	content: "";
	position: absolute;
	top: -9px;
	left: 40px;
	margin-left: -9px;
	width: 0;
	height: 0;
	border-bottom: 9px solid #fff;
	border-left: 9px solid transparent;
	border-right: 9px solid transparent;
}

.snd-main-balloon .main-balloon-col li:first-child p {
	margin-bottom: 16px;
	font-size: 14px;
}

.snd-main-balloon .main-balloon-col li { width: 100%; }

/* セカンド 1col 背景灰色 */
.snd-gray-area {
	width: 100%;
	background-color: #fafafa;
	padding: 32px 16px;
}

.snd-gray-area p:first-child {
	font-size: 12px;
	text-align: center;
	margin-bottom: 16px;
}

.container-r .menu-block {
	width: 100%;
	border-radius: 2px;
	background-color: #fff;
	margin: 0 auto;
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1);
	overflow: hidden;
}

.container-r .gray-area {
	background-color: #fafafa;
	padding: 32px 0;
	text-align: center;
	margin-top: 1px;
}

.container-r .gray-area p:first-child { margin: 0 12px; }

.container-r .gray-area p.btn-block { margin: 16px 16px 0 16px; }

.container-r-list {
	width: 100%;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	background-color: #fff;
	margin-bottom: -1px;
}

.container-r-list li {
	display: -webkit-flex;
	display: flex;
	width: 33.3333%;
	-webkit-flex-direction: column;
	flex-direction: column;
}

.container-r-list li {
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}

.container-r-list > li:nth-child(3n) {
	border-right: none;
	border-bottom: 1px solid #ddd;
	-webkit-flex-grow: 1;
	flex-grow: 1;
}

.container-r-list a {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-grow: 1;
	flex-grow: 1;
}

.container-r-list li > div {
	-webkit-flex-grow: 1;
	flex-grow: 1;
}

.container-r-list li:last-child p {
	border-bottom:0;
}

.container-r-list .link-t-area {
	padding: 64px 8px 12px 8px;
	text-align: center;
	width: 100%;
	color: #333;
	font-size: 12px;
}

.container-r-list .ico-link-arrow:after { display: none; }


/* TB用指定 */
@media screen and (min-width: 768px) {
	.container-l {
		width: 434px;
		margin-right: 16px;
	}
	
	.main .snd-main-col { margin: 0 auto 24px; }
	
	/* セカンド 1col 背景灰色 */
	.snd-gray-area p:first-child {
		font-size: 14px;
		text-align: center;
		margin-bottom: 16px;
	}
	
	.container-r { width: 254px; }
	.container-r .tit-use-info { padding: 12px 0; }
	
	.container-r-list li {
		width: 100%;
 		border-right: none;
 	}
	
	.container-r-list a { font-size: 14px; }
	
	.container-r-list .link-t-area {
		padding: 0;
		text-align: left;
		font-size: 14px;
	}
	
	.container-r-list .ico-link-arrow:after { display: block; }

	.container-r .menu-block { margin: 0 auto; }

	/* disabled 矢印アイコン表示 */
	.container-r-list.disabled-text > li div:after {
		background-position: 0 -147px;
		content: "";
		height: 24px;
		width: 24px;
		position: absolute;
		top: 50%;
		right: 16px;
		margin-top: -12px;
		background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
		background-repeat: no-repeat;
		background-size: 384px;
	}

}

/* PC用指定 */
@media screen and (min-width: 960px) {
	.container-l {
		width: 516px;
		margin-right: 46px;
	}
	
	.container-r { width: 332px; }

}


/******************** /2カラム **********************/

/* アコーディオンエリア */
.title-bg-gray {
	padding: 12px 16px;
	font-weight: bold;
	background-color: #efefef;
}

.ac-menu-area { margin: 16px; }

/* TB、PC用指定 */
@media screen and (min-width: 768px) {

	.title-bg-gray { margin: 0 32px; }

	/* 18.01.25 修正 */
	.ac-menu-area { margin: 16px 32px; }

}


/********** レコメンド **********/
.reco-area {
	position: relative;
	padding-bottom: 52px;
}
.reco-img-list {
	overflow: hidden;
}
.reco-img-list img {
	width: 150%;
	-webkit-transform: translate(-16.6%, 0);
	transform: translate(-16.6%, 0);
}
.reco-dots {
	position: absolute;
	bottom: 32px;
	width: 100%;
	height: 10px;
	text-align: center;
}
.reco-dots li {
	position: relative;
	display: inline-block;
	vertical-align: top;
	width: 10px;
	height: 10px;
	margin: 0 2px;
	cursor: pointer;
}
.reco-dots li button:before {
	content: '';
	width: 10px;
	height: 10px;
	background: #ccc;
	border-radius: 5px;
	position: absolute;
	top: 0;
	left: 0;
}
.reco-dots li button {
	font-size: 0;
	display: block;
	width: 10px;
	height: 10px;
	cursor: pointer;
	border: 0;
	padding: 0;
	background: transparent;
}
.reco-dots li.active button:before { background-color: #fdd000!important; }


/* TB、PC用指定 */
@media screen and (min-width: 768px) {

	.reco-area { padding-bottom: 32px; }
	.reco-img-list img {
		width: 100%;
		-webkit-transform: none;
		transform: none;
	}
	
}


/********** /レコメンド **********/



/****************************** JSOFF ******************************/

/* ヘッダーJS無効表示 */
.status-jsoff {
	width: 100%;
	margin: 0 auto;
	background: #fff0ab;
}

.status-jsoff { position: relative; }

.ico-error-jsoff {
  position: relative;
  padding-left: 28px;
}

.ico-error-jsoff:before {
  content: "";
  height: 24px;
  width: 24px;
  position: absolute;
  top: 0;
  left: 0;
  background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
  background-repeat: no-repeat;
  background-size: 384px;
}

.ico-error-jsoff:before { background-position: -240px -147px; }

.ico-error-jsoff:before {
	content: "";
	clear: both;
	display: block;
	*zoom: 1;
}


/****************************** お知らせ、静的ページmodule ******************************/

.mod-contents { padding-bottom: 8px; padding-top: 12px; }
.mod-contents > *:last-child { margin-bottom: 0; }

.mod-title {
	display: -webkit-flex;
	display: flex;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #bbb;
	background-color: #fafafa;
	padding: 16px;
	margin-bottom: 16px;
 	font-size: 18px;
 }

.mod-title .img-block {
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	padding-left: 4px;
	margin-left: auto;
}


/* TB、PC用指定 */
@media screen and (min-width: 768px) {

	.mod-title { margin: 0 32px 16px; }

}



/****************************** common 静的 ******************************/

/* フォントサイズ */
.fs12 { font-size: 12px !important; }
.fs14 { font-size: 14px !important; }
.fs16 { font-size: 16px !important; }
.fs18 { font-size: 18px !important; }
.fs22 { font-size: 22px !important; }
.fs24 { font-size: 24px !important; }


/* マージン、パディング */
.ml-auto{ margin: 0 0 0 auto !important; }
.mr-auto{ margin: 0 auto 0 0 !important; }

.mt-12 { margin-top: -12px !important; }

.pt0{ padding-top: 0 !important; }
.pb0{ padding-bottom: 0 !important; }


/* セクション */
.com-inner { padding: 0 16px 32px; }
.com-t-inner { padding: 0 16px 16px; } /* section テキスト＋テキスト余白 */
.com-tlink-inner { padding: 0 0 32px; } /* section 横線＋テキストリンク余白 */

a.com-img-anchor { display: inline; } /* 画像リンク */
a.com-t-inline { display: inline; }


/* section 横線 */
.com-t-line { border-top: 1px solid #ddd; }



/* テキストリンク、アンカーリンク */
a.com-inline-link, a.com-anchor-link {
	display: inline;
	color: #0070c9;
	text-decoration: underline;	
}
a.com-anchor-link {
	display: inline-block;
	padding-right: 24px;
	position: relative;
}
a.com-anchor-link:after {
	content: "";
	height: 24px;
	width: 24px;
	position: absolute;
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
	background-repeat: no-repeat;
	background-size: 384px;
	background-position: -24px -147px;
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
}
a.com-inline-link:hover, a.com-anchor-link:hover {
	color: #0080ff;
	text-decoration: none;
}

/* テキストリンク（青文字+右矢印）（左矢印+青文字）181114更新 */
.com-t-r-arrow, .com-t-l-arrow {
	color: #0070c9;
	position: relative;
	display: inline-block;
}

.com-t-r-arrow { padding: 0 24px 0 0; }
.com-t-l-arrow { padding: 0 0 0 24px; }

.com-t-r-arrow:after, .com-t-l-arrow:before {
	content: "";
	height: 24px;
	width: 24px;
	position: absolute;
	top: 50%;
	margin-top: -12px;
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20181114);
	background-repeat: no-repeat;
	background-size: 384px;
	background-position: -24px -147px;
}

.com-t-l-arrow:before {
	left: 0;
	-webkit-transform: rotateY(180deg);
	transform: rotateY(180deg);
}

.com-t-r-arrow:hover, .com-t-l-arrow:hover {
	color: #0080ff;
	text-decoration: underline;
}

/* ページ内リンク */
.com-anchor-block li { padding-bottom: 12px; }
.com-anchor-block li:first-child { padding-top: 12px; }

/* ボタンリンク（白背景） */
.btn-basic-area, .btn-secion-area  {
	display: -webkit-flex;
	display: flex; /* IE対策 */
	margin: 16px 0;
}

.com-btn-basic {
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	min-height: 36px;
	width: 100%;
	max-width: 320px;
	padding: 4px 16px;
	border: 2px solid #0070c9;
	border-radius: 4px;
	background-color: #fff;
	color: #0070c9;
	font-weight: bold;
	text-align: center;
}

.com-btn-basic:hover {
	background-color: rgba(0, 0, 0, 0.15);
	-webkit-filter: brightness(0.85);
	-moz-filter: brightness(0.85);
	-o-filter: brightness(0.85);
	-ms-filter: brightness(0.85);
	filter: brightness(0.85);
}

/* ボタンリンク（青背景） */
.com-btn-basic.strong {
	color: #fff;
	background-color: #0080ff;
}

.com-btn-basic.strong:hover {
	background-color: #0070c9;
	-webkit-filter: brightness(0.85);
	-moz-filter: brightness(0.85);
	-o-filter: brightness(0.85);
	-ms-filter: brightness(0.85);
	filter: brightness(0.85);
}

/* ボタンリンク（inline-block） */
.btn-mini-area {
	display: -webkit-flex;
	display: flex; /* IE対策 */
	margin: 12px 0;
}

.com-btn-basic.mini {
	display: -webkit-inline-flex;
	display: inline-flex;
	width: auto;
	max-width: 100%;
	margin: 0;
	font-size: 12px;
}


/* ボタンの配置変更 */
.btn-left { margin-right: auto !important; }
.btn-right { margin-left: auto !important; }
.btn-center{ margin-left: auto !important; margin-right: auto !important; }


/* 見出し */
.title-lev1, .title-lev2, .title-lev3, .title-lev4, .title-lev5, .title-lev6 { line-height:1.25; }

.title-lev1 {
	font-size: 22px;
	text-align: center;
	padding: 48px 16px;
}
.title-lev2 {
	display: -webkit-flex;
	display: flex;
	padding: 16px;
	margin-bottom: 16px;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #bbb;
	background-color: #fafafa;
	font-size: 18px;
}

.title-lev2 .img-block {
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	padding-left: 8px;
	margin-left: auto;
}

.title-lev3, .title-lev4, .title-lev5 {
	font-size: 14px;
	padding: 12px 0;
	border-bottom: 1px solid #bbb;
	margin: 0 16px 16px;
}

.title-lev6 {
	padding: 8px 0;
	border-bottom: 1px solid #bbb;
	margin: 0 16px 16px;
}

.title-lev3 { font-size: 16px; }
.title-lev4 { font-size: 14px; }
.title-lev5, .title-lev6 {
	font-size: 12px;
	border-top: 1px solid #ccc;
}


.sec-col2-left2 { margin-bottom: 32px; }


/* 「・」、「※」付きリスト */
ul.com-list-note, ul.com-list-dot { margin-left: 1em; }

.com-list-dot > li { position: relative; }
.com-list-note > li { position: relative; font-size: 12px;}

.com-list-dot > li:before,
.com-list-note > li:before {
	margin-left: -1.0em;
}

.com-list-dot > li:before { content: "\30FB"; }
.com-list-note > li:before { content: "\203b"; }

.com-list-note > li { margin-bottom: 8px; } /* 17.11.14追加 */
.com-list-note > li:last-child { margin-bottom: 0; } /* 17.11.14追加 */

/* 注釈右寄せテキスト 17.12.08追加 */
 p.com-list-note {
	display: -webkit-flex;
	display: flex;
	font-size: 12px;
	margin-left: 1em;
	text-align: left;
	-webkit-justify-content: flex-end;
	justify-content: flex-end;
}

p.com-list-note:before {
	content: "\203b";
	margin-left: -1.0em;
}

/* 連番 17.11.24追加 */
ul.com-list-num { margin-left: 1.8em; }

.com-list-num > li {
	position: relative;
	counter-increment: section;
}

.com-list-num > li:before {
	/* position: absolute; */
	content: counter(section) ".";
	margin-left: -1.8em;
	margin-right: 1em;
}

/* 注記連番 17.12.6追加 */
ul.com-list-numnote { margin-left: 2.5em; }
.com-list-numnote > li {
	font-size: 12px;
	position: relative;
	counter-increment: notes;
	margin-bottom: 8px;
}
.com-list-numnote > li:last-child { margin-bottom: 0; }
.com-list-numnote > li:before {
	content: "\203b" counter(notes);
	margin-left: -3em;
	margin-right: 1em;
}


/* 表組 17.11.14追加 */
figcaption { display: none; line-height: 0; }

.table-block {
	width: 100%;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
}

.table-block th, .table-block td {
	padding: 12px 8px;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	font-size: 12px;
}

.table-block th {
	background-color: #e7e7e7;
	font-weight: bold;
	vertical-align: top;
}

.table-block th { width: 25%; white-space: nowrap; }
.table-block td { width: 75%; }


/* 2列 */
.sec-col2-block .col2-com-inner { margin: 0 16px; }
.sec-col2-block .img-mt { margin-top: 32px; }

/* 3列リスト(中黒) */
.sec-list-col3 li { width: 100%; }

/* 画像表示 */
.sec-lev1 figure > img, .sec-lev2 figure > img,
.sec-lev3 figure > img, .sec-lev4 figure > img,
.sec-lev5 figure > img, .sec-lev6 figure > img {
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100%;
	border: 1px solid #ddd;
}

/* 画像線なし指定 */
.sec-lev1 figure.no-border > img, .sec-lev2 figure.no-border > img,
.sec-lev3 figure.no-border > img, .sec-lev4 figure.no-border > img,
.sec-lev5 figure.no-border > img, .sec-lev6 figure.no-border > img {
	border: none;
}

/* 1:3（画像＋テキスト）*/
.sec-col2-block > li figure {
	margin: 0 16px;
}

/* notice */
.sec-notice-box {
	border: 2px solid #cc0033;
	font-size: 12px;
	padding: 12px;
	color: #333;
}

.sec-notice-box > .notice-t-box { padding-left: 28px; margin-top: 12px; }

.ico-notice {
	position: relative;
	padding-left: 28px;
	margin-bottom: 8px;
}

.ico-notice:before {
	content: "";
	height: 24px;
	width: 24px;
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -12px;
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20180903);
	background-repeat: no-repeat;
	background-size: 384px;
}

.ico-notice:before { background-position: -240px -147px; }

.ico-notice:before {
	content: "";
	clear: both;
	display: block;
	*zoom: 1;
}

/* App Store */
figure.sec-bnr-download {
	margin: 16px auto;
	text-align: center;
}

figure.sec-bnr-download img {
	width: auto;
	height: 39px;
}


/* タブレット用指定 */
@media screen and (min-width: 768px) {
	/* セクション */
	.sec-lev1, .sec-lev2, .sec-lev3, .sec-lev4, .sec-lev5, .sec-lev6 { padding: 0 32px; }

	/* 表組 17.11.14追加 */
	.table-row-block th, .table-row-block td,
	.table-block th, .table-block td { display: table-cell; }
	.table-row-block th, .table-block th { width: 16.66%; }
	.table-row-block td, .table-block td { width: 83.34%; }
	
	/* ブロック要素 17.11.14追加 */
	.sec-col-block {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	
	/* 2列表示 */
	.sec-col2-inner li {
		-webkit-flex-direction: column;
		flex-direction: column;
		width: 50%;
	}
	
	/* 3列表示 */
	.sec-col3-inner li {
		-webkit-flex-direction: column;
		flex-direction: column;
		width: 33.33%;
	}
	
	.sec-col2-inner > .com-inner,
	.sec-col3-inner > .com-inner {
		padding: 0 16px 32px;
	}
	
	/***** 画像＋テキスト *****/
	.sec-col2-block {
		display: -webkit-flex;
		display: flex;
		width: 100%;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	
	/* 17.12.07 */
	.sec-col2-block > li:nth-child(odd) {
		width: 33.33%;
		padding-bottom: 32px;
	}
	
	.sec-col2-block > li figure { margin: 0 16px 0 0; }

	.sec-col2-block > li:nth-child(even) {
		width: 66.67%;
		padding-bottom: 32px;
	}
	
	.sec-col2-block > li:nth-child(even) .com-inner { padding: 0 16px; }
	
	.sec-col2-block > li .title-lev4 { padding: 0 0 12px; }
	
	
	.com-inner-col2 { padding: 0 0 0 16px; }
	
	
	/* 画像＋テキスト余白 */
	.com-inner-mt24 { margin-top: 24px; }
	.sec-col2-tblock > .title-lev4 { padding: 0 0 12px; }
	
	/* テキスト＋表 */
	.sec-col2-left2 { 
		width: 70%;
		padding-right: 32px;
		margin-bottom: 0;
	}
	
	.sec-col2-text {
		width: 30%;
		-webkit-flex-grow:1;
		flex-grow: 1;
	}
	
	/* 17.12.22追加 */
	.sec-lev1 .sec-col-block figure > img, .sec-lev2 .sec-col-block figure > img,
	.sec-lev3 .sec-col-block figure > img, .sec-lev4 .sec-col-block figure > img,
	.sec-lev5 .sec-col-block figure > img, .sec-lev6 .sec-col-block figure > img,
	.sec-lev1 .sec-col2-block figure > img, .sec-lev2 .sec-col2-block figure > img,
	.sec-lev3 .sec-col2-block figure > img, .sec-lev4 .sec-col2-block figure > img,
	.sec-lev5 .sec-col2-block figure > img, .sec-lev6 .sec-col2-block figure > img {
		width: auto;
		height: auto;
		max-width: 100%;
		max-height: 100%;
	}
	
	/* 1画像 w640pxより大きい画像の場合 */
	.sec-lev1 figure > img, .sec-lev2 figure > img,
	.sec-lev3 figure > img, .sec-lev4 figure > img,
	.sec-lev5 figure > img, .sec-lev6 figure > img {
		max-width: 640px;
	}
	
	/* 1画像 w640pxより大きく線なしリンクあり */
	.sec-lev1 figure.no-border a > img, .sec-lev2 figure.no-border a > img,
	.sec-lev3 figure.no-border a > img, .sec-lev4 figure.no-border a > img,
	.sec-lev5 figure.no-border a > img, .sec-lev6 figure.no-border a > img {
		max-width: 640px;
	}
	
	/* 注記 */
	.mod-list-area { padding: 0 32px 16px 32px; }
	/* 注記＋番号テキスト記載 */
	.list-num-notes { padding: 0 32px 16px 0; }
	.list-tnum-notes { padding: 0 32px 16px; }
	
	
	/* 3列リスト(中黒) */
	ul.com-list-dot.sec-list-col3{ margin-left: 0; }

	.sec-list-col3 {
		display: -webkit-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
		margin: 0 -32px 0 0;
	}
	
	.sec-list-col3 li {
		width: 33.33%;
		padding: 0 32px 0 1.2em;
	}
	
	/* App Store */
	figure.sec-bnr-download {
		margin: 16px 0;
		text-align: left;
	}
	
}



/* PC用指定 */
@media screen and (min-width: 960px) {
	/* 見出し */
	.title-lev1 { font-size: 24px; }

	/* 2列、3列表示画像 */
	.sec-col1-inner figure > img, .sec-col2-inner figure > img,
	.sec-col3-inner figure > img, .sec-col4-inner figure > img,
	.sec-col5-inner figure > img, .sec-col6-inner figure > img {
		max-width: 100%;
	}
	
	.sec-col2-block figure > img {
		max-width: 100%;
	}
	
	
}



/****************************** 旧端末用 ******************************/

.old-mobile .global-nav-inner,
.old-mobile .status-login,
.old-mobile .status-login-area,
.old-mobile .global-toggle,
.old-mobile .myd-menu-02-area {
	display: none;
}

.old-mobile .global-hd {
	display: block;
	min-width: 0;
	padding: 0;
}
.old-mobile .logo-mydocomo { padding-top: 6px; }

/* 「本画面が表示されているお客様へ」ボタン表示対応 */
.old-mobile #restriction {display: block !important;}

/* TB、PC用指定 */
@media screen and (min-width: 768px) {
	.old-mobile .global-hd {
		display: table;
		padding: 0 24px;
	}
	.old-mobile .logo-mydocomo {
		display: table-cell;
		padding-top: 0;
		vertical-align: middle;
	}
	.old-mobile .logo-docomo {
		display: table-cell;
		vertical-align: middle;
		text-align: right;
	}
}

.old-mobile .ico-bef-sp:before,
.old-mobile .ico-aft-sp:after {
	background-image: url(/mydocomo/sitemap/images/ico/ico_no_wifi@2x.png);
	background-position: 0 0;
	-webkit-background-size: 34px 18px;
	background-size: 34px 18px;
}
.old-mobile .ico-bef-nopc:before,
.old-mobile .ico-aft-nopc:after {
	background-image: url(/mydocomo/sitemap/images/ico/ico_nopc@2x.png);
	background-position: 0 0;
	-webkit-background-size: 18px 18px;
	background-size: 18px 18px;
}
.old-mobile .t-link-b-arrow:after {
	background-image: url(/mydocomo/sitemap/images/ico/ico_arrow_blue@2x.png);
	background-position: 0 0;
	-webkit-background-size: 24px;
	background-size: 24px;
}

.old-mobile .ft-sns-area .sns-link{
	width: 256px;
	overflow: hidden;
	padding-left: 16px;
	margin: 0 auto;
}
.old-mobile .ft-sns-area .sns-link li{
	float: left;
}
.old-mobile .ft-sns-area .img-sprite{
	background-image: none;
	-webkit-background-size: auto;
	background-size: auto;
	background-position: 0 0;
}
.old-mobile .ft-sns-area .ico-facebook{ background-image: url(/mydocomo/images_17v3/common/ico/ico_sns_facebook.png); }
.old-mobile .ft-sns-area .ico-twitter{ background-image: url(/mydocomo/images_17v3/common/ico/ico_sns_twitter.png); }
.old-mobile .ft-sns-area .ico-line{ background-image: url(/mydocomo/images_17v3/common/ico/ico_sns_line.png); }
.old-mobile .ft-sns-area .ico-youtube{ background-image: url(/mydocomo/images_17v3/common/ico/ico_sns_youtube.png); }

/* SPリンク強制表示対応 */
.old-mobile #mydcm_footer_area .ft-link-list .mydcm-ua-sp { display: block !important; }

.old-mobile .ft-link-list{
	display: block;
	overflow: hidden;
	border-left: 1px solid #ddd;
}
.old-mobile .ft-link-list.col3 li {
	display: block;
	float: left;
}
.old-mobile .ft-search-area .search-box .form-search {
	width: 260px;
	margin: 0 auto;
}
.old-mobile .ft-search-area .search-box .form-search .submit{
	height: 16px;
	width: 17px;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	-o-box-sizing: content-box;
	-ms-box-sizing: content-box;
	box-sizing: content-box;
}
.old-mobile .ft-link-list.col4 li {
	display: block;
	float: left;
}
.old-mobile .ft-link-list li:nth-child(odd) {
	border-left: none;
}
.old-mobile .ft-link-list li a {
	display: block;
	width: auto;
	text-align: center;
	padding: 16px 0px;
}
.old-mobile .ft-search-area .search-box{ width: auto;}
.old-mobile .ft-search-area input.osp_searchBox{
	height: 22px;
	width: 218px;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	-o-box-sizing: content-box;
	-ms-box-sizing: content-box;
	box-sizing: content-box;
}
.old-mobile .ft-copyright-area .text-link li, .old-mobile .ft-copyright-area .text-link a{
	display: inline;
}
.old-mobile a.btn-basic{
	padding: 0;
}



/****************************** サードパーティCookie設定お知らせ（未認証のみ） 18.07.13 ******************************/

.main-balloon-col .ico-attention {
	margin-bottom: 24px !important;
	white-space: nowrap;
}
.main-balloon-col .ico-attention-img {
	width: 24px;
	margin-top: -3px;
	margin-right: 4px;
}
.main-balloon-col .ico-attention a {
	white-space: normal;
	display: inline;
}

@media screen and (min-width: 768px) {
	.main-balloon-col .ico-attention { margin-top: 16px; }
	.main-balloon-col .ico-attention.mb-none { margin-bottom: 0 !important; }
}



/****************************** 未認証レコメンドバナー ******************************/

.bnr_rec_image { display: none; }

/* sp画像用 */
.box-recommend .box-reco-img {
	max-height: 252px;
	max-width: 100%;
}


/* 契約内容・手続き レコメンド余白対応（フッター直前に移動、表示の場合）  */

#mydcm_faq ~ #mydcm_recommend_lower > .inner { margin-top: 8px !important; }



/****************************** h2＋アコーディオン表示追加 ******************************/

.mod-card-sec .inner > h2.ico-ac-open:hover,
.mod-card-sec .inner > h2.ico-ac-close:hover {
	background-color: rgba(0, 0, 0, 0.15);
	-webkit-filter: brightness(0.85);
	-moz-filter: brightness(0.85);
	-o-filter: brightness(0.85);
	-ms-filter: brightness(0.85);
	filter: brightness(0.85);
}

.mod-card-sec .inner > h2.ico-ac-close { border-bottom: 1px solid transparent; }

.mod-card-sec .inner > h2.ico-ac-open,
.mod-card-sec .inner > h2.ico-ac-close {
	cursor: pointer;
}




/****************************** ツールチップ（questionマーク） *****************************/

.ico-tooltip-question {
	display: inline-block;
	width: 18px;
	height: 18px;
	margin-left: 4px;
	vertical-align: middle;
	position: relative;
	cursor: pointer;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.ico-tooltip-question:before {
  content: "";
  height: 18px;
  width: 18px;
  position: absolute;
  top: 50%;
  right: 0;
  margin-top: -10px;
  background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20181126);
  background-repeat: no-repeat;
  background-size: 384px;
}

.ico-tooltip-question:before { background-position: -295px -113px; }
.ico-tooltip-question.active:before { background-position: -318px -113px; }

.ico-tooltip-question .tooltip-box {
	position: absolute;
	z-index: 1000;
	left: -45px;
	cursor: text;
	font-size: 12px;
}

/* 上付吹き出し */
.ico-tooltip-question .tooltip-box.tooltip-top { bottom: 26px; }

/* 下付吹き出し */
.ico-tooltip-question .tooltip-box.tooltip-bottom { top: 24px; }

.ico-tooltip-question .tooltip-box .tooltip-box-inner {
	display: block;
	border: 2px solid #fdd000;
	background-color: #fff;
	padding: 12px 16px;
	width: 416px;
	border-radius: 3px;
	box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.25);
}

.ico-tooltip-question .tooltip-box .tooltip-box-inner:after {
	display: block;
	content:"";
	position: absolute;
	left: 55px;
	margin-left: -9px;
	width: 12px;
	height: 12px;
	border: 2px solid #fdd000;
	background-color: #fff;
	clip: rect(auto 12px 12px auto);
}

/* 上付吹き出し */
.ico-tooltip-question .tooltip-box.tooltip-top .tooltip-box-inner:after {
	bottom: -5px;
	-ms-transform: rotate(-134deg);
	-webkit-transform: rotate(-134deg);
	-moz-transform: rotate(-134deg);
	transform: rotate(-134deg);
}

/* 下付吹き出し */
.ico-tooltip-question .tooltip-box.tooltip-bottom .tooltip-box-inner:after {
	top: -5px;
	-ms-transform: rotate(406deg);
	-webkit-transform: rotate(406deg);
	-moz-transform: rotate(406deg);
	transform: rotate(406deg);
}

/* ツールチップ内×ボタン表示 */
.tooltip-box .tooltip-close-area {
	right: 2px;
	top: 2px;
	position: absolute;
}

.tooltip-box .tooltip-close-area a {
	padding: 4px;
	height: 32px;
	width: 32px;
}

.tooltip-box .tooltip-close-area a:hover {
	background-color: rgba(0, 0, 0, 0.15);
	-webkit-filter: brightness(0.85);
	-moz-filter: brightness(0.85);
	-o-filter: brightness(0.85);
	-ms-filter: brightness(0.85);
	filter: brightness(0.85);
}

.tooltip-box .tooltip-close-area .close {
	display: block;
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20181126);
	background-position: -96px -147px;
	background-repeat: no-repeat;
	background-size: 384px;
	height: 24px;
	width: 24px;
}

.ico-tooltip-question .tooltip-box .tooltip-box-inner span { display: block; }

.disp-service-none,
.disp-service-error,
.disp-service-notes,
.procedures-service-inner,
.procedures-service-inner > li,
.tooltip-box {
	display: none;
}


/* TB～PC用指定 */
@media screen and (min-width: 768px) {

	.ico-tooltip-question .tooltip-box .tooltip-box-inner { width: 311px; }

}



/* PC用指定 */
@media screen and (min-width:960px){

	.ico-tooltip-question:hover::before { background-position: -318px -113px; }

}




/****************************** キャンペーンモーダル構造 ******************************/


/* paymentから移行？同一内容をcommonにコピー 18.12.26 */
.charge-modal-bg{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
	background-color: rgba(0,0,0,0.5);
	height: 100%;
	width: 100%;
	min-width: 320px;
	padding: 16px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 99;
}
.modal-content {
	overflow: auto;
	max-height: 100%;
	width: 100%;
	/* max-width: 448px; */
	max-width: 337px !important;
	background: #fff;
	border-radius: 4px;
	position: relative;
}
.charge-modal-tit {
	font-size: 16px;
	font-weight: bold;
	text-align: left;
	padding: 24px 16px;
}
.modal-close-area {
	position: absolute;
	top: 16px;
	right: 16px;
}

/* TB用指定 */
@media screen and (min-width: 768px) {
	/* .modal-content { max-width: 434px; } */
	.modal-content { max-width: 337px !important; }
}


/* PC用指定 */
@media screen and (min-width: 960px) {
	/* .modal-content { max-width: 516px; } */
	.modal-content { max-width: 337px !important; }
}


/* モーダル追加対応 18.12.26 */
.modal-title-area {
	width: 100%;
	padding: 24px 36px 16px 16px;
	overflow: hidden;
}

.modal-title-area dt {
	float: left;
	clear: both;
	width: 40px;
	margin: 6px 0;
}

.modal-title-area dd { margin-left: 48px; }

.btn-close-glay {
	position: absolute;
	top: 4px;
	right: 4px;
	height: 32px;
	width: 32px;
	padding: 4px;
	cursor: pointer;
}

.btn-close-glay:after {
	content: "";
	display: block;
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20181226);
	background-position: -96px -147px;
	background-repeat: no-repeat;
	background-size: 384px;
	height: 24px;
	width: 24px;
}

.btn-close-glay:hover {
	background-color: rgba(0, 0, 0, 0.15);
	-webkit-filter: brightness(0.85);
	-moz-filter: brightness(0.85);
	-o-filter: brightness(0.85);
	-ms-filter: brightness(0.85);
	filter: brightness(0.85);
}

.mydcm-modal-close  span { cursor: pointer; }

/* モーダル追加対応 19.02.01 */
.mydcm-modal { min-height: 475px; }
.mydcm-modal a.btn-basic,
.mydcm-modal .com-btn-basic {
	max-width: none;
}

/* モーダル追加対応 190820 */
.modal-title-area-new {
	width: 100%;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	padding: 16px 8px;
	overflow: hidden;
}
.modal-title-area-new dt { width: 100px; }
.modal-title-area-new .btn-close-glay-new {
	cursor: pointer;
}
.modal-title-area-new .btn-close-glay-new:after {
	content: "";
	display: block;
	background-image: url(/mydocomo/images_17v3/common/sprite/sprite_mydocomo@2x.png?20181226);
	background-position: -96px -147px;
	background-repeat: no-repeat;
	background-size: 384px;
	height: 24px;
	width: 24px;
}
.modal-title-area-new .btn-close-glay-new:hover {
	background-color: rgba(0, 0, 0, 0.15);
	-webkit-filter: brightness(0.85);
	-moz-filter: brightness(0.85);
	-o-filter: brightness(0.85);
	-ms-filter: brightness(0.85);
	filter: brightness(0.85);
}

.mydcm-modal-contents-new {
	border-top: 1px solid #ddd;
	padding: 16px 16px 32px;
	text-align: center;
}
.mydcm-modal-contents-new > .mydcm-modal-block:not(:last-child) {
	margin-bottom: 12px;
}

.mydcm-modal-contents-new .mydcm-modal-borderbox {
	border: 1px solid #333333;
	padding: 24px 16px;
}


/* CRP_web運_アンケートモーダルHTMLモック作成200813 */
.mydcm-modal-contents-questionnaire {
	border-top: 1px solid #ddd;
	padding: 24px 16px 32px;
}
.mydcm-modal-contents-questionnaire .modal-title {
	padding-bottom: 24px;
	text-align: center;
	font-weight: bold;
	font-size: 18px;
}
.mydcm-modal-contents-questionnaire .modal-recommend-level {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}
.mydcm-modal-contents-questionnaire .modal-recommend-level label {
	margin-right: 4px;
	width: 9.09%;
}
.mydcm-modal-contents-questionnaire .modal-recommend-level label:last-child {
	margin-right: 0;
	-webkit-flex-grow: 1;
	flex-grow: 1;
}
.mydcm-modal-contents-questionnaire .modal-recommend-level input[type="radio"] {
	display: none;
}
.mydcm-modal-contents-questionnaire .modal-recommend-level .radio-dec {
	height: 36px;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
	color: #0070c9;
	background-color: #fff;
	border: 1px solid #0070c9;
	border-radius: 4px;
}
.mydcm-modal-contents-questionnaire .modal-recommend-level input[type="radio"]:checked + .radio-dec {
	font-weight: bold;
}
.mydcm-modal-contents-questionnaire .modal-recommend-level input[type="radio"]:checked + .radio-dec,
.mydcm-modal-contents-questionnaire .modal-recommend-level input[type="radio"] + .radio-dec:hover {
	color: #fff;
	background-color: #0080ff;
}
.mydcm-modal-contents-questionnaire .modal-recommend-level input[type="radio"]:checked + .radio-dec:hover {
	cursor: default;
}
.mydcm-modal-contents-questionnaire textarea {
	-webkit-appearance: none;
	appearance: none;
	vertical-align: middle;
	color: inherit;
	font: inherit;
	background: transparent;
	margin: 0;
	/* outline: 0; */
	border-radius: 0;
	text-align: inherit;
	overflow: auto;
	resize: none;
	
	width: 100%;
	height: 80px;
	padding: 4px 8px;
	border: 1px solid #ddd;
}
.mydcm-modal-contents-questionnaire #questionnaire_modal-send.btn-disabled {
	background-color: #ccc;
	border-color: #b3b3b3;
	pointer-events: none;
	cursor: default;
}
/* /CRP_web運_アンケートモーダルHTMLモック作成200813 */


/* CRP_web運_iOS13対応(Mac・iPad判定) 190917 */
.mod-sbs-btn {
	display: -webkit-flex;
	display: flex;
}
.mod-sbs-btn > a {
	width : 50%;
	margin-left: 10px;
}
.mod-sbs-btn > a:first-child {
	margin-left: 0;
}

.mod-bothend-area {
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

/* CRP_web運_19m3(phase2)リリース191219 */
html body .mydcm-modal-wifi { min-height: auto; }
html body .mydcm-modal-wifi .modal-title-area { padding: 0px 0px 0px 16px; }
html body .mydcm-modal-wifi .modal-title-area dd {
	margin-top: 16px;
	margin-left: 60px;
}
body.mydcm-body-fixed-wifi {
	overflow: hidden;
	width: 100%;
}

/* 誘導フロートバナー200612 */
.floatbnr-area {
	width: 100%;
	position: fixed;
	bottom: 0;
	z-index: 98;
}
.floatbnr-contents {
	font-size: 0;
}
.floatbnr-width {
	display: inline-block;
	position: relative;
	max-width: 75%;
	box-shadow: 1px 1px 5px 2px rgba(0,0,0,0.5);
	margin: 0 0 10px 10px;
}
.floatbnr-img img {
	width: auto;
	height: auto;
	max-width: 100%;
}
.floatbnr-close {
	position: absolute;
	top: -10px;
	right: -10px;
	width: 24px;
	overflow: hidden;
	cursor: pointer;
}

/* TB用指定 */
@media screen and (min-width: 768px) {
	.floatbnr-width {
		max-width: 80%;
		margin: 0 0 20px 20px;
	}
	.floatbnr-close {
		top: -16px;
		right: -16px;
		width: auto;
	}
}

/* PC用指定 */
@media screen and (min-width: 960px) {
	.floatbnr-contents{
		max-width: 960px;
		margin: 0 auto;
		font-size: 0;
	}
	.floatbnr-width {
		max-width: 768px;
		margin-left: 4px;
	}
}
/* 誘導フロートバナー200612 end*/

/* プレースホルダー */
#questionnaire_modal-comment textarea:focus::-webkit-input-placeholder { color: white; } /* Chrome・Safari・Opera用(※Edge) */
#questionnaire_modal-comment textarea:focus:-moz-placeholder { color: white; }  /* Firefox18以前用 */
#questionnaire_modal-comment textarea:focus::-moz-placeholder { color: white; } /* Firefox19以上用 */
#questionnaire_modal-comment textarea:focus::placeholder { color: white; } 

/* CRP_web運_home_OLSランキング表示調整210122 */
.data-rank:hover{
	transition: unset;
	opacity: 0.4;
}
.data-rank a {
    outline: none;
}
.data-rank {
    transition: none!important;
}