@charset "utf-8";
/* CSS Document */

body {
	background-color: #f5f5f5;
	text-align: center;
	position: relative;
}

body.menuOpen {
	overflow: hidden;
}

.con {
	max-width: 1280px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 8px;
	padding-right: 8px;
	overflow: hidden;
}

.conS {
	max-width: 720px
}

.pc {
	display: none;
}

.center {
	text-align: center !important;
}

@media screen and (min-width:720px) {
	.sp {
		display: none;
	}

	.pc {
		display: block;
	}

	.con {
		padding-left: 16px;
		padding-right: 16px;
	}
}

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

言語切替

----------------------*/
#langWrap {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(255, 255, 255, 0.98);

	z-index: 100;
}

#langWrap>div {
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
}

#langWrap ul {
	border-radius: 10px;
	box-shadow: 0 0 15px 0 #bbb;
	height: 300px;
	margin-top: 50px;

}

#langWrap li a {
	display: block;
	font-size: 20px;
	line-height: 60px;
	width: 300px;
	height: 60px;
	border-bottom: 1px solid #e5e5e5;

	text-decoration: none;
	color: #666;
}

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

ヘッダー

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

header {
	background: #fff;

	position: fixed;
	width: 100%;
	height: 52px;
	left: 0;
	top: 0;

	border-bottom: 1px solid #e5e5e5;

	display: flex;
	align-items: center;
	justify-content: left;

	z-index: 3;
}

header .con {
	text-align: left;
	position: relative;
	width: 100%;
	padding: 0;
}

header h1.logo {
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	height: 44px;
	width: 220px;
	background-image: url("../img/logo.png");
	background-position: left 8px center;
	background-size: 212px 30px;
	background-repeat: no-repeat
}

header h1.logo a {
	display: block;
	height: 44px;
	width: 220px;
	color: transparent;
	text-decoration: none;
}

.headerBlock h1{
	display: inline-block;
}

.headerBlock .nttbpLogo{
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	height: 44px;
	width: 124px;
	background-image: url("/img/common/nttbp_logo.png");
	background-position: left 8px center;
	background-size: 112px 31px;
	background-repeat: no-repeat
}
header h1.nttbpLogo a {
	display: block;
	height: 44px;
	width: 124px;
	color: transparent;
	text-decoration: none;
}


@media screen and (max-width:398px) {


.headerBlock .nttbpLogo{
	width: 112px;
	background-size: 100px 28px;
}
header h1.nttbpLogo a {
	width: 112px;
}
}
/*---------------------

メインコンテンツ

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

main {
	text-align: center;
	margin-top: 52px;
	display: block;
}

main h1 {
	text-align: center;
	font-weight: 400;
	font-size: 24px;
	color: #333;
	position: absolute;
	width: 100%;
	height: auto;
	top: 0;
	left: 0;
	padding: 50px 0 32px;
	line-height: 1.3
}

main h2 {}

.back {
	position: absolute;
	width: 100%;
	height: 50px;
	top: 100px;
	left: 0;
	display: none;
}

.back a {
	display: block;
	width: 50px;
	height: 50px;
	margin: 0 auto;
	background-color: rgba(255, 255, 255, 0.8);
	border-radius: 50%;
	box-shadow: 0 2px 2px 1px #ddd;
}

.read {
	text-align: left;
}

#bgMain {
	position: absolute;
	width: 100%;
	height: 235px;
	top: 0;
	left: 0;
	z-index: -1;
	overflow: hidden;
	transform: skew(0deg, -6deg);
	margin-top: -102px;
	background-color: #fff;
}

#bgMainWrap {
	transform: skew(0deg, 6deg);

	width: 100%;
	height: 500px;
	background-image: url("../img/bg_main.png");
	background-position: center center;
	background-size: 1920px 501px;
}

main #main {
	padding-top: 180px;
}

@media screen and (min-width:720px) {
	.read {
		text-align: center;
	}
}

.pList {
	display: none;
}

@media screen and (min-width:720px) {
	.pList {
		display: block;
		text-align: left;
		padding-top: 20px;
		padding-bottom: 40px;
	}

	.pList li {
		display: inline-block;
		font-size: 14px;
		line-height: 16px;
		text-align: left;
		overflow: hidden;
	}

	.pList #currentPage {
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		max-width: 800px;
		height: 16px;
	}

	.pList li a {
		display: block;
		position: relative;
		padding-right: 20px;
		height: 16px;
	}

	.pList li a::after {
		content: "";
		display: block;
		position: absolute;
		top: 4px;
		right: 4px;
		width: 8px;
		height: 8px;
		border: 2px solid;
		border-color: transparent #666 #666 transparent;
		transform: rotate(-45deg);

	}
}

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

フッター

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

footer {
	padding: 32px 0;
	text-align: center;
	display: none;
}

footer.short {
	position: fixed;
	bottom: 0;
	height: 350px;
	width: 100%;

}

.pageTop {
	padding: 0 0 32px;
}

.pageTop a {
	display: block;
	width: 84px;
	height: 24px;
	margin: 0 auto;
}

.footerInfo {
	background: #fff;
	padding: 24px 0;
}

.dlBlock {
	display: flex;
	justify-content: center;
}

.dlBlock p a {
	display: block;
	height: 50px;
	width: auto;
	/*margin: 25px 8px 0;*/
	margin: 0 8px 0
}

.dlBlock p a img {
	height: 50px;
	width: auto
}

.snsBlock {
	display: flex;
	justify-content: center;
}

.snsBlock p a {
	display: block;
	width: 50px;
	height: 50px;
	margin: 25px 13px;
}

.bpLogo {
	width: 130px;
	height: 60px;
	margin: 12px auto;
}

.copyright {
	font-size: 10px;
}

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

共通スタイル

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

h2 {
	font-weight: bold;
	font-size: 24px;
	padding: 24px;
}

h3 {
	font-weight: bold;
	font-size: 16px;
	padding: 24px;
}

.pic {
	padding: 32px 64px;
	margin: 0 auto;
	max-width: 640px;

}

.picL {
	padding: 32px 0;
	margin: 0 auto;
	max-width: 720px;

}

.picL2 {
	margin: 0 auto;
	max-width: 720px;

}

.left {
	margin: 0;
}

.btn {
	padding: 0 16px;
}

.btn a {
	display: block;
	width: 100%;
	max-width: 480px;
	margin-left: auto;
	margin-right: auto;
	height: 48px;
	border-radius: 24px;
	text-align: center;

	background-color: #E20022;
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
	line-height: 48px;
	margin-bottom: 24px;
}

.btn a:link {
	color: #fff;
}

.btn a:visited {
	color: #fff;
}

.btn a:hover,
.btn a:active {
	color: #fff;
	background-color: #B5001B;
}

.btn.btnRv a {

	background-color: #fff;
	color: #e20022;
	border: 1px solid #e20022;
}

.btn.btnRv a:link {
	color: #e20022;
}

.btn.btnRv a:visited {
	color: #e20022;
}

.btn.btnRv a:hover,
.btn.btnRv a:active {
	color: #e20022;
	background-color: #f5f5f5;
}

.btn.btnGr a {

	background-color: #fff;
	color: #555555;
	border: 1px solid #e5e5e5;
}

.btn.btnGr a:link {
	color: #555555;
}

.btn.btnGr a:visited {
	color: #555555;
}

.btn.btnGr a:hover,
.btn.btnGr a:active {
	color: #555555;
	background-color: #f5f5f5;
}

a:focus {
	outline: 1px dotted #e20022;
}

.subLink {
	font-size: 12px;
}

.cap {
	font-size: 12px;
}

.capL {
	font-size: 14px;
}

.txt {
	display: inline-block;
	/*文中の気持ち悪い部分で折り返しそうな場合に入れる*/
}

.uaCheck {
	display: none;
	/*UAで表示を切り替え*/
}

.mtM {
	margin-top: 24px;
}

.mtL {
	margin-top: 40px;
}

.m0 {
	margin: 0;
}

.textL {
	font-size: larger !important;
	font-weight: 600;
}

.boxLink a {
	display: block;
	background-color: #fff;
	color: #333;
	text-decoration: none;
}

.boxLink a:link {
	color: #333;
}

.boxLink a:visited {
	color: #333;
}

.boxLink a:hover {
	background-color: rgba(0, 0, 0, 0.1);
}

.boxLink a:active {
	background-color: rgba(0, 0, 0, 0.2);
}

.boxLink a:focus {
	background-color: rgba(0, 0, 0, 0.2);
	outline: none;
}

.note {
	display: block;
	padding-left: 1em;
	text-indent: -1em;
}

.note::before {
	content: '※';

}

.note2 {
	background: #f5f5f5;
	border-radius: 5px;
	padding: 1em;
}

.note3 {
	border: 1px solid #e20022;
	padding: 1em;
}

.note3 h4,
.note3 p,
.note3 li {
	color: #E20022
}

.mokuji {
	border: 2px solid #e5e5e5;
	padding: 1.5em;
}

.mokuji li a {
	display: block;
	padding-bottom: 0.5em;
}

.tCenter {
	text-align: center !important;
}

.balloon1 {
	position: relative;
	display: inline-block;
	margin: 0 0 1.5em;
	padding: 12px 24px;
	min-width: 120px;
	max-width: 100%;
	color: #e20022;
	font-size: 20px;
	background: #fff;
	border: 1px solid #e20022;
	border-radius: 20px;
}

.balloon1:before {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -15px;
	border: 15px solid transparent;
	border-top: 15px solid #e20022;
}

.balloon1 p {
	margin: 0;
	padding: 0;
}


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

モーダル

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

.modal {
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	overflow: hidden;
	background-color: rgba(0, 0, 0, 0.2);
	z-index: 2;
}

.modalDark {
	background-color: rgba(0, 0, 0, 0.8);
}

.modalBox {
	background-color: rgba(255, 255, 255, 0.9);
	border-radius: 14px;
	position: absolute;
	width: 270px;
	height: auto;
	top: 200px;
	left: 50%;
	-webkit-transform: translate(-50%, 0);
	transform: translate(-50%, 0);
}

.modalTxt {
	padding: 20px 16px;
}

.modalTxt p {
	font-size: 13px;
}

.modalOk a {
	display: block;
	text-decoration: none;
	font-size: 17px;
	border-top: 1px solid #e5e5e5;
	line-height: 44px;
}

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

ハンバーガーメニュー

----------------------*/
#menuBtn {
	position: fixed;
	top: 0;
	right: 0;
	width: 44px;
	height: 44px;
	z-index: 5;
}

#menuBtn a {
	display: block;
	width: 44px;
	height: 44px;
	position: relative;
}

#menuBtn a span {
	display: block;
	width: 14px;
	height: 2px;
	background-color: #333;
	position: absolute;
	top: 14px;
	left: 15px;
}

#menuBtn a span:first-child {
	top: 14px;
	transition: 0.5s;
	-webkit-transition: 0.5s;
	transform: rotateZ(0deg);
	transform-origin: left top 0;
}

#menuBtn a.menuOpen span:first-child {
	transform: rotateZ(45deg);
	width: 18px;
	left: 16px;
}

#menuBtn a span:nth-child(2) {
	top: 20px;
}

#menuBtn a.menuOpen span:nth-child(2) {
	display: none;
}

#menuBtn a span:last-child {
	top: 26px;
	transition: 0.5s;
	-webkit-transition: 0.5s;
	transform: rotateZ(0deg);
	transform-origin: left bottom 0;
}

#menuBtn a.menuOpen span:last-child {
	transform: rotateZ(-45deg);
	width: 18px;
	left: 16px;
}

#menuWrap {
	position: fixed;
	top: 0;
	bottom: 0;
	right: -100vw;
	width: 100%;
	background-color: rgba(255, 255, 255, 0.8);

	opacity: 0;
	transition: 0.5s;
	-webkit-transition: 0.5s;
	z-index: 4;

	overflow: hidden;
}

#menuHeader {
	height: 44px;
}

#menuWrap.menuOpen {
	opacity: 1;
	right: 0;

	overflow-y: scroll;
}

#menuWrap h3 {
	text-align: left;
	color: #666;
	padding: 12px 16px 8px 40px;
	font-size: 14px;
	background-color: #f5f5f5;

	background-repeat: no-repeat;
	background-position: left 8px center;
	background-size: 24px 24px;
}

.menuList {
	border-bottom: 1px solid #e5e5e5;
}

h3.menuSpot {
	background-image: url("../img/icon_menu_spot.svg");
}

h3.menuSupport {
	background-image: url("../img/icon_menu_support.svg");
}

h3.menuBlog {
	background-image: url("../img/icon_menu_blog.svg");
}

h3.menuAbout {
	background-image: url("../img/icon_menu_about.svg");
}

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

	#menuBtn {
		position: fixed;
		top: 4px;
		right: 16px;
	}

	#menuWrap {
		right: -400px;
		width: 400px;
		overflow: scroll;
		box-shadow: -1px 2px 2px 0 #eee;
	}

	/*#menuWrap.menuOpen{
	right: -16px;
	}*/
	#menuHeader {
		height: 52px;
	}
}

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

セルリスト

----------------------*/
.appCell {
	background: #fff
}

.appCell a {
	display: block;
	background-image: url("../img/icon_next.svg");
	background-size: 24px 24px;
	background-position: right 6px center;
	background-repeat: no-repeat;
	padding: 0 0 0 16px;
	text-align: left;
	color: #333;
	font-size: 14px;
	text-decoration: none;
}

.appCell a:link {
	color: #333;
}

.appCell a:visited {
	color: #333;
}

.appCell a:hover {
	background-color: rgba(0, 0, 0, 0.1);
}

.appCell a:active {
	background-color: rgba(0, 0, 0, 0.2);
}

.appCell a:focus {
	background-color: rgba(0, 0, 0, 0.2);
	outline: none;
}

.appCell li a span:not(.txt) {
	display: block;
	padding: 16px 36px 16px 0;
	border-bottom: 1px solid #e5e5e5;
}

.appCell li:last-child a span:not(.txt) {
	border-bottom: none;
}

.appCell li:first-child a {
	border-top: 1px solid #e5e5e5;
}

.appCell li:last-child a {
	border-bottom: 1px solid #e5e5e5;
}

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

FAQ / 新着情報

----------------------*/
/* #newsKeyWord{
	display: none;
} */
.news h2 {
	font-size: 20px;
	color: #333;
	font-weight: 400;
	padding-top: 0;
}

.news h2 span {
	padding: 0 4px 16px;
	display: inline-block;
	background-image: url("../../common/img/border.png");
	background-position: left bottom;
	background-repeat: repeat-x;
	background-size: 5px 1px
}

.tagLink {
	margin-bottom: 40px;
}

.tagLink li {
	display: inline-block;
	margin: 4px;
}

.tagLink a {
	display: block;
	background-color: #fff;
	border: 1px solid #e5e5e5;
	padding: 8px 16px;
	text-align: left;
	color: #333;
	font-size: 14px;
	text-decoration: none;
	border-radius: 20px;
}

#newsList li {
	margin-bottom: 2px;
}

.newsIndex #newsList li {
	display: none;
}

.newsIndex.updateIndex #newsList li {
	display: block;
}

.newsIndex .newsDetail {
	background: #fff;
	padding: 0 16px;
	border-radius: 8px;
	box-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
}

.newsIndex .newsIndexList>li:not(:last-child) {
	margin-bottom: 48px;
}

#newsList li a {
	display: block;
	background-color: #fff;
	text-align: left;
	color: #333;
	font-size: 14px;
	text-decoration: none;
	padding: 16px 8px;
}

#newsList li h3 {
	font-size: 15px;
	font-weight: 400;
	padding: 0;
	position: relative;
}

@media screen and (min-width:720px) {
	#newsList li h3 {
		font-size: 18px;
	}
}

#faqBox #newsList li p {
	border-top: 1px dotted #e5e5e5;
	padding: 12px;
	text-align: left;
	line-height: 1.6
}

.detail .con {
	background-color: rgba(255, 255, 255, 0.8);
}

@media screen and (min-width:720px) {
	.detail .con {
		background-color: transparent;
	}
}

main #main.newsDetail {
	padding-top: 0px;
	background: rgba(255, 255, 255, 0.8)
}

.newsDetail h1 {
	text-align: left;
	position: relative;
	padding: 40px 0 16px;
	font-size: 24px;
	line-height: 1.5;
	border-bottom: 1px solid #e5e5e5;
	margin-bottom: 24px;
}

.newsDetail h1 span {}

.faq .newsDetail h1 {
	padding-left: 36px;
	background-image: url("../img/icon_menu_support.svg");
	background-position: left top 40px;
	background-size: 24px 24px;
	background-repeat: no-repeat;
	font-size: 20px;
}

.newsDetail h1 span {}

@media screen and (min-width:720px) {
	#main.newsDetail {
		border-radius: 10px;
		box-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
		padding: 0 20px 0;
	}

	.faq .newsDetail h1 {
		padding-left: 48px;
		background-image: url("../img/icon_menu_support.svg");
		background-position: left top 40px;
		background-size: 36px 36px;
		background-repeat: no-repeat;
		font-size: 24px;
	}
}

.newsDetail p {
	text-align: left;
}

.newsDetail .newsBlock {
	padding-bottom: 16px;
	counter-reset: chapter;
}

.newsDetail .newsBlock #newsThumb {
	max-width: 340px;
	margin: 0 auto;
}

.newsDetail .newsBlock h2 {
	text-align: left;
	font-size: 20px;
	padding: 4px 0 12px 0;
	margin: 72px 0 24px;
	border-bottom: 1px solid #EB6D80;
	font-weight: 600;
}

.newsDetail .newsBlock h3 {
	text-align: left;
	margin: 40px 0 20px;
	padding: 0 0 16px 0;
	/*color: #e20022;*/
	line-height: 1.5;
	border-bottom: 1px dotted #EB6D80;
}

.newsDetail .newsBlock h4 {
	margin-bottom: 4px;
	font-weight: 600;
	text-align: left;
	font-size: 16px;
	/*color:#e20022;*/
}

.newsDetail .newsBlock h2:first-child {
	margin-top: 0;
}

.newsDetail .newsBlock .hNum::before {
	counter-increment: chapter;
	content: counter(chapter) ". ";
}

.newsDetail .newsBlock h3.hNum {
	text-indent: -1em;
	padding-left: 1em
}

.newsDetail .newsBlock .hDark {
	background: #f5f5f5;
	color: #333333;
	padding: 4px 8px;
	border: none;
}

.newsDetail .newsBlock .hNumReset {
	counter-reset: chapter;
}

.newsDetail .newsBlock p {
	margin-bottom: 16px;
	font-size: 16px;
	text-align: left;
}

.newsDetail .newsBlock ul {
	margin-bottom: 16px;
}

.newsDetail .newsBlock li {
	list-style: disc;
	list-style-position: outside;
	font-size: 16px;
	text-align: left;
	margin-left: 1.5em;
}

.newsDetail .newsBlock ol li {
	list-style: decimal;
}

.newsDetail .newsBlock p strong {
	color: #e20022;
	font-weight: 600;
}

.newsDetail .newsBlock p.newsImg {
	width: 100%;
	max-width: 300px;
	display: inline-block;
	margin-right: 16px;
}

.newsDetail .newsBlock .newsExBox {
	padding-left: 1em;
	border-left: 2px solid #e20022
}

.newsDetail .newsBlock table {
	border-bottom: 1px solid #f0f0f0;
	width: 100%;
}

.newsDetail .newsBlock th {
	min-width: 60px;
	background: #f0f0f0;
	text-align: left;
	padding: 8px;
	border-top: 1px solid #fff;
}

.newsDetail .newsBlock th:first-child {
	border-top: 1px solid #f0f0f0;
}

.newsDetail .newsBlock td {
	text-align: left;
	padding: 8px;
	border-top: 1px solid #f0f0f0;
	border-right: 1px solid #f0f0f0;
}

.newsDetail .newsBlock dl {
	text-align: left
}

.newsDetail .newsBlock dt {
	font-weight: bold;
	padding: 4px 0;
}

.newsDetail .newsToc {
	border: 1px solid #ccc;
	padding: 12px;
}

.newsDetail .newsToc li {
	list-style: none;
	line-height: 2;
}


/* 追記 */
.newsDetail h1#newsTitle+p.note {
	margin-left: 1em;
}

.BasicTextColor {
	color: #333 !important;
}

/* Settings by screen size  */
@media screen and (min-width:720px) {
	.newsDetail .newsBlock .newsFBox {
		display: flex;
		justify-content: space-between;
	}

	.newsDetail .newsBlock p,
	.newsDetail .newsBlock .newsFBox>div {
		flex: 1;
	}

	.newsDetail .newsBlock p.newsImg {
		width: 300px;
	}
}

.newsDetail #newsUpdateBox,
.newsDetail .newsUpdateBox {
	padding-top: 4px;
	font-size: 12px;
	text-align: left;
	margin-bottom: 16px;
}

.newsDetail #newsUpdateBox p,
.newsDetail .newsUpdateBox p {
	display: inline-block;
	text-align: left;
}

#infoBox li a {
	display: flex;
	width: 100%;
}

#infoBox .newsThumb {
	width: 120px;
}

@media screen and (min-width:720px) {
	#infoBox .newsThumb {
		width: 240px;
	}
}

#infoBox .newsTitle {
	padding-top: 2px;
}

.markCategory {
	display: inline-block;
	border: none;
	color: #fff;
	padding: 2px 8px;
	font-size: 12px;
	line-height: 16px;
	margin-right: 4px;
}

.markCategory.update {
	background-color: #FFA801
}

.markCategory.howtouse {
	background-color: #F36F6E
}

.markCategory.tips {
	background-color: #FD7A56
}

.markCategory.maintenance {
	background-color: #3381C3
}

.markCategory.other {
	background-color: #73B435
}

.date {
	font-size: 14px;
}

#infoBox p.date {
	display: inline-block;
	border: none;
	line-height: 16px;
}

#faqBox #newsList li h3 {
	padding: 8px 32px;
	background-image: url("../img/icon_menu_support.svg");
	background-position: left 8px top 8px;
	background-size: 24px 24px;
	background-repeat: no-repeat;
}

.infoIndex .categoryList {
	margin-top: 0;
	display: none;
}

.infoIndex .categoryList li a {
	background-position: center top 12px;
	background-size: 74px 74px;
}

.categoryList li.cat-auto-connect a {
	background-image: url("../img/guide_auto-connect.svg");
}

.categoryList li.cat-biginner a {
	background-image: url("../img/guide_biginner.svg");
}

.categoryList li.cat-registration a {
	background-image: url("../img/guide_registration.svg");
}

.categoryList li.cat-reccomend a {
	background-image: url("../img/guide_reccomend.svg");
}

.categoryList li.cat-trouble a {
	background-image: url("../img/guide_trouble.svg");
}

.categoryList li.cat-faq a {
	background-image: url("../img/guide_faq.svg");
}

.categoryList li.cat-movie a {
	background-image: url("../img/guide_movie.svg");
}

.checkSelect {
	position: absolute;
	width: 100%;
	height: 50px;
	top: 100px;
	left: 0;
	display: none;
}

.checkSelect span {
	height: 50px;
}

.checkSelect .checkBlock {
	display: inline-block;
	height: 50px;
	line-height: 50px;
	padding: 0 20px;
	margin: 0 10px;
	position: relative;
	width: 180px;
	text-align: left;
}

.checkSelect.checkSelectLong .checkBlock {
	width: 200px;
}

.checkSelect span input {
	display: none;
}

.checkSelect span label {
	position: absolute;
	display: block;
	z-index: 1;
	top: 0;
	left: 0;
	width: 180px;
	height: 50px;
	padding-left: 10px;
	text-align: center;
	background-color: rgba(255, 255, 255, 0.8);
	box-shadow: 0 2px 2px 1px #ddd;
	border-radius: 50px;
	font-size: 14px;
}

.checkSelect.checkSelectLong span label {
	width: 200px;
}

.checkSelect span label::before {
	content: '';
	display: block;
	position: absolute;
	top: 17px;
	left: 12px;
	width: 16px;
	height: 16px;
	border: 1px solid #e5e5e5;
	background: #fff;
	border-radius: 4px;
	z-index: 2;
}

.checkSelect span :checked+label {
	background: #e20022;
	color: #fff;
}

.checkSelect span :checked+label::before {
	border: 1px solid #fff;
}

.checkSelect span :checked+label::after {
	content: '';
	display: block;
	position: absolute;
	z-index: 3;
	top: 18px;
	left: 14px;
	width: 12px;
	height: 9px;
	border-left: 3px solid #e20022;
	border-bottom: 3px solid #e20022;
	transform: rotate(-40deg);
}

.androidguide h3::after {
	content: 'for Android';
	display: inline-block;
	background: #CDE4B8;
	padding: 0px 12px;
	border-radius: 12px;
	font-size: 12px;
	margin-left: 8px;
}

.iOSguide h3::after {
	content: 'for iOS';
	display: inline-block;
	background: #ddd;
	padding: 0px 12px;
	border-radius: 12px;
	font-size: 12px;
	margin-left: 8px;
}

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

ご利用ガイド/チャート

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

.newsDetail .newsBlock .chartBox {}

.newsDetail .newsBlock .chartBox li {
	border-radius: 20px;
	border: 4px solid #e5e5e5;
	background: #fff;
	padding: 8px;
	list-style: none;
	text-align: center;
	margin-left: 0;
	margin-bottom: 30px;
	position: relative;
}

.newsDetail .newsBlock .chartBox li {
	display: none;
}

.newsDetail .newsBlock .chartBox li:first-child {
	display: block;

}

.newsDetail .newsBlock .chartBox li h2 {
	text-align: center;
	display: inline-block;
	font-size: 16px;
	padding-bottom: 4px;
	margin-bottom: 24px;
}

.newsDetail .newsBlock .chartBox li h3 {
	text-align: left;
	margin: 0 0 24px;
	padding: 0;
	font-size: 18px;
	border: none;
}

.chartBox h4.chartDh {
	background: #e5e5e5;
	height: 32px;
	line-height: 32px;
	margin-top: 24px;
	margin-bottom: 0;
	text-align: center;
	position: relative;
	cursor: pointer;
}

.chartBox h4.chartDh.chartOpen {
	background: #ccc;
}

.chartBox h4.chartDh::after {
	position: absolute;
	height: 32px;
	width: 32px;
	display: block;
	top: 0;
	right: 0;
	content: "+";
	line-height: 32px;
}

.chartBox h4.chartDh.chartOpen::after {
	content: "-";
}

.chartSelect {
	height: 44px;
	margin: 0 auto;
	width: 300px;
}

.chartSelect p {
	display: inline-block;
	text-align: center;
	width: 140px;
	padding: 0 10px 0;
	margin-bottom: 0;
}

.chartSelect p a {
	display: block;
	text-align: center;
	height: 44px;
	line-height: 44px;
	color: #fff;
	border-radius: 22px;
	text-decoration: none;
}

.chartSelect p.chartYes a {
	background: #00BFA5;
}

.chartSelect p.chartNo a {
	background: #bfbfbf;
	position: relative;
}

.chartSelect p.chartNo a.chartOpen::after {
	display: block;
	content: "";
	position: absolute;
	margin: 8px;
	top: 100%;
	left: 50%;
	margin-left: -12px;
	border: 12px solid transparent;
	border-top: 12px solid #bfbfbf;
}

.chartDetail {
	display: none;
	padding: 24px 16px;
	background: #f5f5f5;
}

.chartNext {
	text-align: center;
}

.chartNext a {
	width: 60px;
	height: 20px;
	margin: 20px auto 0;
	overflow: hidden;
	display: block;
}

.chartNext a span {
	width: 40px;
	background: #e5e5e5;
	height: 40px;
	display: block;
	transform: translateX(9px) translateY(-28px) rotate(45deg);
}

.chartPart {
	display: none;
}

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

	.newsDetail .newsBlock .chartBox li h2 {
		text-align: left;
		border-bottom: none;
		background: #f5f5f5;
		border-radius: 10px;
		padding: 8px 12px;
		display: block;
	}

	.chartTtl {
		display: flex;
		justify-content: space-between;
		align-items: flex-start
	}

	.chartTtl>div {
		text-align: left;
	}

	.chartTtl>div.chartSelect {
		margin: 0;
		text-align: right;
		width: 360px;
	}

	.newsDetail .newsBlock .chartDetail p.newsImg {
		margin: 0 0 0 10px;
		text-align: right;
	}
}


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

対応Wi-Fiサービス

----------------------*/
.wifiService .back {
	display: block;
}

.categoryList {
	display: flex;
	flex-wrap: wrap;
	margin-top: 24px;
}

.categoryList li {
	width: calc(50% - 10px);
	margin: 5px;
}

@media screen and (min-width: 588px) {
	.categoryList li {
		width: calc(33.333% - 10px);
	}

	.categoryList.miniBox {
		justify-content: center;
	}
}

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

	.categoryList li {
		width: calc(25% - 10px);
	}

	.categoryList.miniBox {
		justify-content: center;
	}
}

@media screen and (min-width: 980px) {
	.categoryList li {
		width: calc(20% - 10px);
	}

	.categoryList.miniBox {
		justify-content: center;
	}
}

.categoryList li {}

.categoryList li a {
	display: table;
	align-items: center;
	height: 160px;
	padding-top: 80px;
	width: 100%;
	background-image: url("../img/icon_category_store_color.svg");
	background-color: #fff;
	background-position: center top 25px;
	background-size: 50px 50px;
	background-repeat: no-repeat;
	box-shadow: 2px 2px 0 0 #e5e5e5;

	font-size: 16px;

	text-decoration: none;
	color: #333;
}

.categoryList li a span:not(.txt) {
	display: table-cell;
	vertical-align: middle;
	height: 80px;
}

.wifiService main h1.shopping,
.categoryList li.shopping a {
	background-image: url("../img/icon_category_store_color.svg");
}

.wifiService main h1.restaurant,
.categoryList li.restaurant a {
	background-image: url("../img/icon_category_restaurant_color.svg");
}

.wifiService main h1.leisure,
.categoryList li.leisure a {
	background-image: url("../img/icon_category_leisure_color.svg");
}

.wifiService main h1.bus,
.categoryList li.bus a {
	background-image: url("../img/icon_category_bus_color.svg");
}

.wifiService main h1.train,
.categoryList li.train a {
	background-image: url("../img/icon_category_train_color.svg");
}

.wifiService main h1.airport,
.categoryList li.airport a {
	background-image: url("../img/icon_category_airport_color.svg");
}

.wifiService main h1.city,
.categoryList li.city a {
	background-image: url("../img/icon_category_city_color.svg");
}

.wifiService main h1.sports,
.categoryList li.sports a {
	background-image: url("../img/icon_category_sports_color.svg");
}

.wifiService main h1.other,
.categoryList li.other a {
	background-image: url("../img/icon_category_other_color.svg");
}

.wifiService main h1 {
	padding: 65px 0 32px;

	background-image: url("../img/icon_category_store_color.svg");
	background-position: center top 10px;
	background-size: 40px 40px;
	background-repeat: no-repeat;
}

.wifiCategory {
	display: none;
}

.wifiList ul {
	margin-top: 24px;
}

.wifiList li {
	background: #fff;
	border-radius: 8px;
	border: 1px solid #e5e5e5;
	padding: 12px 16px;
	margin-bottom: 4px;
	text-align: left;

}

.wifiList h3 {
	width: 100%;
	display: table-cell;
	vertical-align: middle;
	margin: 0;
	padding: 0;
	font-size: 16px;
	font-weight: 600;
	text-align: left;
}

.wifiList span.areaSign {
	width: 36px;
	height: 36px;
	display: inline-block;
	margin-right: 4px;
}

.wifiList li p {
	padding-top: 8px;
	text-align: left;
}

.wifiList .wifiCondition {
	margin-top: 8px;
	padding: 4px 0 2px 8px;
	border-left: 4px solid #e5e5e5;
}

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

利用規約

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

.tos .tosBlock {
	text-align: left;
}

.tos .tosBlock .blockTitle {
	padding: 0 0 24px;
	font-size: 20px;
	text-align: left;
}

.tos h2 {
	padding: 32px 0 12px;
	font-size: 18px;
	text-align: left;
}

.tos .tosBlock h3 {
	padding: 24px 0 12px;
	font-size: 14px;
}

.tos .tosBlock p,
.tos .tosBlock li {
	text-align: left;
	font-size: 13px;
}

.tos .tosBlock ul,
.tos .tosBlock p {
	padding-bottom: 8px;
}

.tos .tosBlock .block li {
	margin-left: 1em;
	list-style-position: inside;
}

.tos .tosBlock .block ul li {
	list-style: disc;
}

.tos .tosBlock .block ol.listAbc li {
	list-style: upper-alpha
}

.tos .tosBlock strong {
	font-weight: 600;
}

/*動画*/

.movieWrap {
	position: relative;
	max-width: 640px;
	margin: 0 auto;
	padding: 8px;
}

.topMainMovie {
	width: 100%;
	padding-bottom: 56.25%;
	/*高さをpaddingで指定(16:9)*/
	height: 0px;
	/*高さはpaddingで指定するためheightは0に*/
	position: relative;
	border: 1px solid #ccc;
	border-radius: 14px;
	background: #fff;
}

#movieModal .topMainMovie {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit-transform: translateY(-50%) translateX(-50%);
}

.topMainMovie iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border-radius: 10px;
}

#movieModalClose a {
	display: block;
	position: absolute;
	top: 70px;
	right: 0;
	text-decoration: none;
	color: #fff;
	width: 50px;
	height: 50px;
	text-align: center;
	line-height: 50px;
	font-size: 40px;
	font-family: "Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体", sans-serif;
	font-weight: 100;
}

/* OpenRoaming追加分 */
.jwor a:hover {
	cursor: pointer;
}

.hooray {
	display: flex;
}

.hooray::before {
	content: url(/jw-auto/common/img/jwor/hooray-left.svg);
	padding: 80px 10px 0 12%;
	font-size: 50px;
	color: #F20022;
}

.hooray::after {
	content: url(/jw-auto/common/img/jwor/hooray-right.svg);
	padding: 80px 12% 0 10px;
	font-size: 50px;
	color: #F20022;
}

.hooray_title {
	margin-top: 40px;
}

.hooray_title-m {
	font-size: 40px;
	font-weight: 700;
	display: inline-block;
	line-height: 1.7;
	color: #333333;
	margin: 0 auto;
	text-align: center;
}

.hooray_title-s {
	font-size: 28px;
	font-weight: 700;
	display: inline-block;
	line-height: 1.7;
	color: #F20022;
	margin: 0 auto;
	text-align: center;
}

.highlighter {
	font-weight: 700;
	background: linear-gradient(transparent 70%, #b6ff50 70%);
	padding: 0 2px;
	margin: 0 2px;
}

.jwor_card2 {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	width: 900px;
	margin: 40px auto 0;
}

.jwor_card {
	width: 400px;
	border-radius: 20px;
	border: 6px solid #E5E5E5;
	display: flex;
	flex-direction: column;
	align-items: center;
	background: #FFFFFF;
}

.jwor_card-top {
	display: flex;
	flex-direction: column;
	align-items: center;
	height: 170px;
	justify-content: space-around;
}

.jwor_card-bottom {
	margin-top: 20px;
	margin-bottom: 20px;
}

.jwor_card-bottom p {
	font-size: 24px !important;
	text-align: center !important;
	color: #333333 !important;
}

.jwor_plus {
	width: 67px;
	display: flex;
	align-items: center;
}

.font-bold {
	font-weight: bold;
}

.fontcolor-red {
	color: #E20022 !important;
}

.fontcolor-red-s {
	color: #E20022;
	font-size: 14px;
}

.fontcolor-red-l {
	color: #E20022;
	font-size: 24px;
}

.redcircle-new {
	position: relative;
	padding-top: 20px;
	padding-left: 57px;
	margin-bottom: 0 !important;
}

.redcircle-new::before {
	content: "NEW";
	width: 57px;
	height: 57px;
	text-align: center;
	line-height: 57px;
	font-size: 14px;
	color: #FFFFFF;
	background: #E20022;
	border-radius: 50%;
	display: block;
	position: absolute;
	left: -10px;
}

.intention {
	position: relative;
	padding-bottom: 60px;
	margin-bottom: 40px;
}

.intention-bg {
	border-radius: 9999px;
	background: #E20022;
	display: inline-block;
	width: 970px;
	box-shadow: 0 2px 2px 0.8px rgba(212, 212, 212, 1);
	position: absolute;
	right: 0;
	left: 0;
	margin: 0 auto;
	bottom: 0;
}

.intention-text,
.intention-text-en {
	text-align: center;
	font-size: 38px !important;
	font-weight: bold;
	position: relative;
	display: inline-block;
	vertical-align: middle;
	color: #FFFFFF;
	margin: 10px 0 !important;
}

.intention-text::before {
	content: url(/jw-auto/common/img/jwor/jwor_spbubble-l.png);
	position: absolute;
	left: -23%;
}

.intention-text-en::before {
	content: url(/jw-auto/common/img/jwor/jwor_spbubble-l.png);
	position: absolute;
	left: -10%;
}

.intention-text::after {
	content: url(/jw-auto/common/img/jwor/jwor_spbubble-r.png);
	position: absolute;
	right: -23%;
}

.intention-text-en::after {
	content: url(/jw-auto/common/img/jwor/jwor_spbubble-r.png);
	position: absolute;
	right: -10%;
}

.index {
	margin-top: 40px;
	border-left: 6px solid #E5E5E5;
}

.index h4 {
	margin-left: 20px;

}

.index ul {
	margin-top: 20px;
	margin-left: 20px;
	padding-bottom: 10px;
}

.index li {
	list-style: none !important;
	margin-left: 0 !important;
	color: #2A4AB7;
	font-weight: bold;
	padding-bottom: 10px;
	text-decoration: underline;
}

.index li:hover {
	text-decoration: none;
}

.jwor_main {
	counter-reset: number 0;
}

.jwor_main strong {
	color: inherit !important;
}

.jwor_main a {
	color: inherit !important;
	color: #2A4AB7 !important;
	text-decoration: underline;
}

.jwor_main a:hover {
	text-decoration: none;
	color: #e20022 !important;
}

.jwor_main li {
	list-style: none !important;
	margin-left: 5px !important;
}

.jwor_main h2 {
	font-size: 24px !important;
}

.jwor_main_list h3 {
	margin-left: 60px !important;
	border-bottom: none !important;
	font-size: 24px;
	position: relative;
}

.jwor_main_list h3::before {
	counter-increment: number 1;
	content: counter(number) " ";
	width: 57px;
	height: 57px;
	text-align: center;
	line-height: 57px;
	font-size: 24px;
	color: #FFFFFF;
	background: #E20022;
	border-radius: 50%;
	display: block;
	position: absolute;
	top: -10px;
	left: -67px;
}

.jwor_main_annotation {
	border-radius: 20px;
	background: #F5F5F5;
	padding: 20px;
}

@media (max-width : 1059px) {
	.intention-bg {
		width: 100%;
	}
}

@media (max-width : 974px) {
	.jwor_card {
		width: 100%;
		max-width: 400px;
	}

	.jwor_card2 {
		width: 100%;
		flex-direction: column;
		align-content: center;
		align-items: center;
	}

	.jwor_plus {
		margin-top: 10px;
		margin-bottom: 10px;
	}

	.intention {
		position: relative;
		padding-bottom: 100px;
	}

	.intention-text,
	.intention-text-en {
		font-size: 16px !important;
	}

	.intention-text::before,
	.intention-text-en::before {
		top: -10px;
		left: -48px;
	}

	.intention-text::after,
	.intention-text-en::after {
		top: -10px;
		right: -48px;
	}
}

@media (max-width : 746px) {
	.hooray::before {
		padding: 60px 0px 0 0;
	}

	.hooray::after {
		padding: 60px 0 0 0;
	}

	.hooray_title-m {
		font-size: 28px;
		line-height: 1.2;
	}

	.hooray_title-s {
		font-size: 16px;
	}
}


/*---------------------
テーブル
----------------------*/
.tbl h3 {
	text-align: inherit !important;
	margin: 0 !important;
	padding: 10px 0 20px !important;
	color: inherit;
	line-height: 1.5;
	border-bottom: none !important;
	margin-left: 8px !important;
}


.tbl1stLine .tblTd h3 {
	padding: 16px;
	font-size: 20px;
	font-weight: 600;
	color: #015676;
}

.tblTd p {
	font-size: 16px;
}

.lhS {
	line-height: 1.5;
}

.tblTd h3 {
	padding: 16px;
	font-size: 20px;
	font-weight: 600;
	color: #015676;
}

.tbl h4 {
	padding: 14px;
	font-size: 16px;
	font-weight: 600;
}

.tbl h4 a,
.tbl h3 a {
	text-decoration: underline;
	white-space: nowrap
}

.tbl h4 a:hover,
.tbl h3 a:hover {
	text-decoration: none;
}

.tbl .price {
	font-weight: 600;
	color: #015676;
}

.tbl .priceL {
	font-size: 28px;

}

.tbl .priceM {
	font-size: 18px;

}

.tbl .priceS {
	font-size: 14px;
	font-weight: 400;
}

.tblTd2 p {
	font-size: 14px;
}

.lhS {
	line-height: 1.5;
}

.tblTd2 .tblTd p {
	padding: 12px;
}

.tbl ol {
	list-style: decimal;
	font-size: 16px;
	padding: 4px 1.6rem;
}

.tbl ol li,
.tbl ul li {
	margin-bottom: 10px;
}

.tbl ul {
	list-style: disc;
	font-size: 16px;
	padding: 4px 1rem;
}

.tblBold {
	font-weight: 600;
	color: #015676;
}

.tbl li a {
	text-decoration: underline;
	color: #0352AC;
}

.tbl li a:hover {
	text-decoration: none;
}


@media screen and (min-width: 786px) {
	.tbl {
		display: flex;
		justify-content: center;
	}

	.tbl h3 {
		text-align: center;
		border-left: 2px solid #e5e5e5;
		border-right: 2px solid #e5e5e5;
		border-top: 2px solid #e5e5e5;
		margin-left: 8px;
		border-radius: 10px 10px 0 0;
		background: #FFFFFF;
	}

	.tbl h3 img {
		width: 52px;
	}

	.tblTr {
		max-width: 390px;
	}

	.tblTr h3 {
		min-width: 282px;
	}


	.tbl .tblTh:nth-child(odd),
	.tbl .tblTd:nth-child(odd) {
		background: #FFFFFF;
	}

	.tbl .tblTh:nth-child(even),
	.tbl .tblTd:nth-child(even) {
		background: #F5F5F5;
	}

	.tbl .tblTh:nth-child(1),
	.tbl .tblTd:nth-child(1),
	.tbl .tblTh:nth-child(15),
	.tbl .tblTd:nth-child(15) {
		background: none;
	}

	.tbl .tblTd:nth-child(2) {
		border-top: 2px solid #e5e5e5;
	}

	.tbl .tblTd:last-child {
		border-bottom: 2px solid #e5e5e5;
	}

	.tbl .lastcorner {
		border-bottom: 2px solid #e5e5e5;
		border-radius: 0 0 10px 0;
	}

	.tbl .tblTh:nth-child(15),
	.tbl .tblTd:nth-child(1) {
		background: none;
	}

	.tbl .tblTh {
		max-width: 300px;
		line-height: 1.7;
		border-left: 2px solid #e5e5e5;
	}

	.tbl .tblTh:nth-child(1) {
		border-left: none;
	}

	.tbl .tblTh:nth-child(2) {
		border-radius: 10px 0 0 0;
		border-left: 2px solid #e5e5e5;
		border-top: 2px solid #e5e5e5;
	}

	.tbl .tblTh:last-child {
		border-radius: 0 0 0 10px;
		border-left: 2px solid #e5e5e5;
		border-bottom: 2px solid #e5e5e5;
	}

	.tbl .tblTd>div {
		border-left: 2px solid #e5e5e5;
		border-right: 2px solid #e5e5e5;
		margin-left: 8px;
	}

	.tbl .l15>div {
		display: flex;
		flex-direction: row-reverse;
	}

	.tblTh>div {
		padding: 12px;
	}

	.tblTd>div {
		padding: 12px;
	}

	.tbllastLine>div {
		min-height: 56px;
	}

	.tbllastLine div {
		border-left: 2px solid #e5e5e5;
		border-right: 2px solid #e5e5e5;
		border-bottom: 2px solid #e5e5e5;
		margin-left: 8px;
		border-radius: 0 0 10px 10px;
	}
}


@media screen and (max-width: 785px) {

	.tbl .tblTh {
		display: none;
	}

	.tblTd p {
		padding: 8px 4px;
	}

	.tbl ul {
		padding: 4px 1.6rem;
	}

	.tbl .tblTd::before {
		font-size: 16px;
		font-weight: 600;
		background: #F5F5F5;
		display: block;
		border-bottom: 1px solid #015676;
		margin-top: 20px;
		padding: 8px 4px;
		text-align: left;
	}

	.tbl h3 img {
		width: 52px;
	}

	.tblTd h3 {
		padding-left: 0px;
		margin-top: 60px;
		font-size: 24px;
	}

	.tbl .priceL {
		font-size: 18px;
	}

	.tblTr .t1 {
		margin-top: 60px;
	}

	.tblTr .t2::before {
		content: 'Wi-Fiサービスを提供する通信事業者'
	}

	.tblTr .t3::before {
		content: '地図・対応サービス一覧への掲載'
	}

	.tblTr .t4::before {
		content: '自動接続'
	}

	.tblTr .t5::before {
		content: '接続通知'
	}

	.tblTr .t6::before {
		content: '無線区間の暗号化'
	}

	.tblTr .t7::before {
		content: '接続履歴'
	}

	.tblTr .t8::before {
		content: '対応OS：'
	}

	.tblTr .t9::before {
		content: '利用回数や時間の制限'
	}

	.tblTr .t10::before {
		content: '青少年フィルター'
	}

	/*---------------------
	en
	----------------------*/
	.tblTr .t2-en::before {
		content: 'Carriers that provide Wi-Fi services'
	}

	.tblTr .t3-en::before {
		content: 'Listing on maps and supported services'
	}

	.tblTr .t4-en::before {
		content: 'Automatic connection'
	}

	.tblTr .t5-en::before {
		content: 'Connection notification'
	}

	.tblTr .t6-en::before {
		content: 'encryption of radio sections'
	}

	.tblTr .t7-en::before {
		content: 'Connection History'
	}

	.tblTr .t8-en::before {
		content: 'Supported OS:'
	}

	.tblTr .t9-en::before {
		content: 'Restrictions on the number of times and times of use'
	}

	.tblTr .t10-en::before {
		content: 'youth filter'
	}

	/*---------------------
	ch1
	----------------------*/
	.tblTr .t2-ch1::before {
		content: '提供Wi-Fi服务的运营商'
	}

	.tblTr .t3-ch1::before {
		content: '发布在地图/兼容服务列表中'
	}

	.tblTr .t4-ch1::before {
		content: '自动连接'
	}

	.tblTr .t5-ch1::before {
		content: '连接通知'
	}

	.tblTr .t6-ch1::before {
		content: '无线电段加密'
	}

	.tblTr .t7-ch1::before {
		content: '连接历史记录'
	}

	.tblTr .t8-ch1::before {
		content: '支持的操作系统：'
	}

	.tblTr .t9-ch1::before {
		content: '使用次数和时间的限制'
	}

	.tblTr .t10-ch1::before {
		content: '青少年过滤器'
	}

	/*---------------------
	ch2
	----------------------*/
	.tblTr .t2-ch2::before {
		content: '提供Wi-Fi服務的運營商'
	}

	.tblTr .t3-ch2::before {
		content: '發佈在地圖/兼容服務列表中'
	}

	.tblTr .t4-ch2::before {
		content: '自動連線'
	}

	.tblTr .t5-ch2::before {
		content: '連接通知'
	}

	.tblTr .t6-ch2::before {
		content: '無線電段加密'
	}

	.tblTr .t7-ch2::before {
		content: '連接歷史記錄'
	}

	.tblTr .t8-ch2::before {
		content: '支援的作業系統：'
	}

	.tblTr .t9-ch2::before {
		content: '使用次數和時間的限制'
	}

	.tblTr .t10-ch2::before {
		content: '青少年過濾器'
	}

	/*---------------------
	kr
	----------------------*/
	.tblTr .t2-kr::before {
		content: 'Wi-Fi서비스를 제공하는 통신사업자'
	}

	.tblTr .t3-kr::before {
		content: '지도 · 대응 서비스 일람에 게재'
	}

	.tblTr .t4-kr::before {
		content: '자동 접속'
	}

	.tblTr .t5-kr::before {
		content: '연결 알림'
	}

	.tblTr .t6-kr::before {
		content: '무선 구간암 호화'
	}

	.tblTr .t7-kr::before {
		content: '연결기록'
	}

	.tblTr .t8-kr::before {
		content: '지원 OS:'
	}

	.tblTr .t9-kr::before {
		content: '사용 횟수 및 시간제한'
	}

	.tblTr .t10-kr::before {
		content: '청소년 필터'
	}

}

.decoration_detail {
	text-align: right;
	position: relative;
	padding-right: 25px;
	font-weight: 700;
	color: #02b8bd;
	min-height: 28px;
}

.decoration_detail span::before {
	content: '';
	width: 22px;
	height: 22px;
	background: #02b8bd;
	border-radius: 50%;
	position: absolute;
	top: 45%;
	right: 0;
	margin-top: -9px;
}

.decoration_detail span::after {
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 5px 0 5px 7px;
	border-color: transparent transparent transparent #fff;
	position: absolute;
	top: 49%;
	right: 6px;
	margin-top: -4px;
}

.tbl .l15 a {
	display: inline-flex;
	margin-top: 5px;
	margin-left: 50px;
}

@media screen and (max-width: 785px) {
	.tbl .l14 a {
		margin-left: 0px;
	}
}

.decoration_detail span {
	border-bottom: 1px solid #02b8bd;
}

#case li a:hover .decoration_detail span,
#relate li a:hover .decoration_detail span,
#column li a:hover .decoration_detail span,
#relateColumn li a:hover .decoration_detail span {
	border-bottom: none;
}

.white-space {
	white-space: nowrap
}

.target {
	scroll-margin-top: 60px;
}

.black {
	color: #000000 !important;
}

/*---------------------
詳設ページスタイル
----------------------*/
.privacy_document-bg {
	background-color: #FFFFFF;
}

#privacy_document {
	/*max-width: 375px;*/
	margin: 0 auto;
	letter-spacing: -0.05em;
	background-color: #FFFFFF;
}

@media (min-width: 768px) {
	#privacy_document {
		max-width: 700px;
	}
}


.pd-inner {
	/*max-width: 375px;*/
	margin: 0 auto;
	padding: 0 15px
}

.pd_adjust-top-30 {
	height: 30px;
}

.pd_adjust-top {
	height: 17.5px;
}

@media (min-width: 768px) {
	.pd-inner {
		max-width: 700px;
	}
}

@media (max-width: 1080px) {
	.section_content-card2-or {
		justify-content: space-evenly;
	}
}

#privacy_document h1 {
	text-align: center;
	font-weight: 400;
	font-size: 24px;
	color: #333333;
	position: static;
	line-height: 1.7;
}

#privacy_document-top h2,
#privacy_document-overview h2,
#privacy_document-content h2,
#privacy_document-inquiry h2 {
	text-align: center;
	font-weight: 400;
	font-size: 20px;
	color: #333333;
	position: static;
	line-height: 1.7;
	padding: 0 0 8px 0;
}
@media (min-width: 768px) {

#privacy_document-top h2,
#privacy_document-overview h2,
#privacy_document-content h2,
#privacy_document-inquiry h2 {
	font-size: 24px;
}
}

.pd-bg-gray  {
    background-color: #F8F8F8;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
}

#privacy_document-content h2 {
	margin-bottom: 30px;
}

#privacy_document h3 {
	line-height: 1.7;
}

.privacy_document-underline-gray,
.privacy_document-underline-red {
	position: relative;
	width: 100%;
	text-align: center;
}

.privacy_document-underline-gray::after,
.privacy_document-underline-red::after {
	content: "";
	display: block;
	width: 100%;
	max-width: 188px;
	height: 2px;
	background-color: #e20022;
	margin: 0 auto;
	position: relative;
	bottom: -8px;
}

.privacy_document-underline-gray::after {
	background-color: #e20022;
}

.privacy_document-underline-red::after {
	background-color: #E20022;
}

#privacy_document-top p {
	font-size: 16px;
	line-height: 1.7;
}
@media (min-width: 768px) {
	#privacy_document-top p {
	font-size: 18px;
}
}

.pd_block {
	display: flex;
	align-items: center;
	width: 100%;
}

.pd_left {
	flex-direction: row;
	justify-content: flex-start;
	padding-right: 10px;
}

.pd_right {
	flex-direction: row-reverse;
	justify-content: flex-end;
	padding-left: 10px;
}

.pd_block img {
	/*width: 170px;
	height: 150px;
	object-fit: cover;
	flex-shrink: 0;*/
}
.pd_img{
	width: 40%;
	flex-shrink: 0;
}

.pd_text {
	flex: 1;
	font-size: 14px;
	padding: 0;
	text-align: left;
	line-height: 1.7;
}
@media (min-width: 410px) {

.pd_text {
	font-size: 16px;
}
}
@media (min-width: 768px) {

.pd_text {
	font-size: 20px;
}
}

.pd_right .pd_text {
	text-align: right;
}

#privacy_document-overview img {
	width: 160px;
}

#privacy_document-overview ul {
	padding: 0 10px;
}

.pd-overview-card {
	background-color: #fff;
	border-radius: 20px;
	box-shadow: 0 2px 4px 0 rgb(0 0 0 / 14%);
}

.pd-overview-card-mb {
	margin-bottom: 37.5px;
}

.pd-overview-card-bottom {
	background-color: #F5F5F5;
	border-radius: 0 0 20px 20px;
	padding: 10px;
	font-size: 14px;
}

.pd-overview-card-link {
  display: block;
  color: inherit;
  text-decoration: underline;
  text-decoration-color: #007AE6;
  text-underline-offset: 3px;
}

.pd-overview-card-link:hover {
  text-decoration: none;
  color: #E20022;
}

.pd-overview-card-link:hover .pd-overview-card-bottom {
  background-color: #e0e0e0;
  cursor: pointer;
}

#privacy_document-overview h3 {
	padding: 30px 0 5px 0;
}

.pd-overview-card {
	position: relative;
	margin-top: 17.5px;
}

.pd-heading-numbered {
	position: relative !important;
}

.pd-overview-card::before,
.pd-heading-numbered::before {
	content: attr(data-number);
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	width: 35px;
	height: 35px;
	background-color: #E20022;
	color: #fff;
	font-size: 20px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 1;
}

.pd-overview-card::before {
	top: -17.5px;
}

.pd-heading-numbered::before {
	top: -57.5px;
}

.pdc-company-bplogo {
	width: 185px;
}

#privacy_document-content-company h3,
#privacy_document-content-optout h3 {
	padding: 0 0 20px;
	text-align: left;
	border-bottom: 1px dotted #E20022;
}

.pdc-company-list {
	padding: 0 10px;
}

.pdc-company-list p {
	text-align: left;
}

#privacy_document-content-company .font-bold {
	font-size: 16px;
	font-weight: 600;
}

.pd-lead p {
	font-size: 16px;
  margin: 0 5px;
}

.pdc-information-card {
	background-color: #fff;
	border-radius: 20px;
  margin: 0 5px;
}

.pdc-information-card-bottom {
	background-color: #fff;
	border-radius: 0 0 20px 20px;
	border-top: 2px solid #F8F8F8;
	padding: 5px;
	font-size: 14px;
}
@media (min-width: 768px) {

.pdc-information-card-bottom {
	font-size: 16px;
}
}

.pdc-information-card h4,
.pdc-information-location-card h4 {
	color: #666666;
	font-weight: 700;
	padding: 20px 0 10px;
	line-height: 1.7;
}

.pd-icon-text {
	display: flex;
	align-items: center;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.5;
	position: relative;
	width: fit-content;
	margin: 0 auto;
}

.pd-icon-text::before {
	content: "";
	display: inline-block;
	width: 30px;
	height: 30px;
	margin-right: 5px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	flex-shrink: 0;
}

.icon-xmark::before {
	background-image: url("/jw-auto/ja/tos/app/img/privacy_document-icon001.png");
}

.icon-check::before {
	background-image: url("/jw-auto/ja/tos/app/img/privacy_document-icon002.png");
}

.icon-note::before {
	background-image: url("/jw-auto/ja/tos/app/img/privacy_document-icon003.png");
}


.pdc-information-card-txt {
	font-size: 12px;
	text-align: left;
  padding: 0 5px;
}

.highlighter-gray {
	font-weight: 700;
	color: #333333;
	background: linear-gradient(transparent 40%, #BFEFE8 40%);
	padding: 0 2px;
	margin: 0 2px;
}

.pd-note-list {
	list-style: none;
	padding-left: 30px;
}

.pd-note-list li {
	position: relative;
	font-size: 14px;
	text-align: left;
}
@media (min-width: 768px) {

.pd-note-list li {
	font-size: 16px;
}
}

.pd-note-list li::before {
	content: "";
	position: absolute;
	left: -25px;
	top: 2px;
	width: 20px;
	height: 20px;
	background-image: url("/jw-auto/ja/tos/app/img/privacy_document-icon004.png");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.pd-note {
	background-color: #fff;
	border: 1px solid #E5E5E5;
	padding: 10px;
  margin: 0 5px;
}

.pdc-information-location-card {
	background-color: #F5F5F5;
	border-radius: 10px;
	border: 1px solid #E5E5E5;
  margin: 0 5px;
}

.pd-text-left {
	text-align: left;
	padding: 0 10px;
}

#privacy_document-content-location h4 {
	font-weight: 700;
	line-height: 1.7;
}

#privacy_document-content-optout h4 {
	font-size: 14px;
	font-weight: 700;
	padding: 0 0 10px;
	text-align: left;
}
@media (min-width: 768px) {

#privacy_document-content-optout h4 {
	font-size: 16px;
	text-align: left;
}
}

.pd-main-img{
	margin-left: auto;
	margin-right: auto;
	max-width: 520px;
}

.m-ss-t {
	margin-top: 10px;
}

.p-ss-t {
	padding-top: 10px;
}

.m-ss-b {
	margin-bottom: 10px;
}

.p-ss-b {
	padding-bottom: 10px;
}


.m-s-t {
	margin-top: 20px;
}

.p-s-t {
	padding-top: 20px;
}

.m-s-b {
	margin-bottom: 20px;
}

.p-s-b {
	padding-bottom: 20px;
}


.m-m-t {
	margin-top: 30px;
}

.p-m-t {
	padding-top: 30px;
}

.m-m-b {
	margin-bottom: 30px;
}

.p-m-b {
	padding-bottom: 30px;
}


.m-l-t {
	margin-top: 40px;
}

.p-l-t {
	padding-top: 40px;
}

.m-l-b {
	margin-bottom: 40px;
}

.p-l-b {
	padding-bottom: 40px;
}

.pd-bg {
	background-color: #FFFFFF;
}

.pd-p-t {
	padding-top: 40px !important;
}