﻿@charset 'UTF-8';

b, strong{
	font-weight:bold !important;
}

/* h2 --------------------------------------------- */

.heading-level2{
	text-align:center;
	font-size:1.625rem;
	font-weight:bold;
	color:#002663;
	background:#e5e9ef;
	line-height:50px;
	margin:30px 0;
}

/* Floating Navi --------------------------------------------- */

.lnav-float{
	padding:0;
	background:#002663;
}

.lnav-float + h2,
.lnav-float + section{
	margin-top:70px;
}

.lnav-float ul{
	margin:0 auto;
	display:flex;
	flex-wrap:wrap;
	align-items:center;
}

.fixed .lnav-float ul{
	position:fixed;
	top:61px;
	z-index:1;
}

.lnav-float ul li:nth-child(n+2){
	display:inline-block;
	margin:7px 30px 7px 0;
}

.lnav-float.narrow ul li{
	margin-right:15px;
}

.lnav-float ul li a{
	display:block;
	font-size:0.875rem;
	font-weight:bold;
	color:#fff;
	text-decoration:none;
	padding:0 0 0 30px;
	line-height:1.75rem;
	background:#1a3c73;
	border-radius:14px;
	transition:.1s;
}

.lnav-float ul li a::after{
	display:inline-block;
	content:'';
	background:url(/content/dam/amex/jp/membership-rewards/images/membership_icon_parts_arrow_01.png) no-repeat 50% 50%;
	background-size:contain;
	width:15px;
	height:15px;
	margin:0 10px;
	text-align:center;
	vertical-align:-3px;
	line-height:1;
}

.lnav-float ul li a:hover{
	background-color:#0d316b;
	background-position:calc( 100% - 14px ) 66.7%;
	transition:.1s;
}

.lnav-float ul li a:hover::after{
	transform:translateY(2px);
}

.lnav-float .lnav-drawer{
	display:none;
}

/* FTO Rate Table --------------------------------------------- */

.fto-rate{
	border-collapse:collapse;
	width:100%;
	margin:0 auto 3em;
	font-size:0.875rem;
	font-weight:bold;
}

.fto-rate caption{
	caption-side: top;
	 
	font-size:0.8125rem;
	font-weight:bold;
	color:#000;
	padding:0 0 5px;
}

.fto-rate th,
.fto-rate td{
	padding:10px;
}

.fto-rate th{
	color:#002663;
	width:40%;
	font-size:0.8125rem;
}

.fto-rate td{
	text-align:center;
}

.fto-rate b{
	font-size:1.125rem;
}

.fto-rate .mini{
	display:block;
	text-align:left;
	font-size:0.625rem;
	padding-left:calc( 50% - 12.5em);
}

.fto-rate .gray th{
	 background-color :#f6f5f5;
	 
}

.fto-rate .gray td{
	 background-color :#f6f5f5;
	 
}

.fto-rate .red  th{
	 background-color :#fdebf0;
	 
}

.fto-rate .red  td{
	 background-color :#fef5f7;
	 
}

.fto-rate .blue th{
	 background-color :#e6f5f9;
	 
}

.fto-rate .blue td{
	 background-color :#f2fafc;
	 
}

.fto-rate .red  b{
	 color: #e73369 ;
}

.fto-rate .blue b{
	 color: #0082be ;
}

/* Point Box --------------------------------------------- */

.point-box{
	border:solid 1px #99a8c1;
	margin:20px 0 5px;
	background:#fff;
}

.point-box h4{
	text-align:center;
	margin:0;
	font-size:1.000rem;
	padding:8px;
}

.point-box.type-a h4{
	background:#edf0f4;
}

.point-box.type-b h4{
	background:#f8f1ef;
}

.point-box h4 span{
	font-size:12px;
	font-weight:normal;
}

.point-box dl{
	padding:10px 0;
	display:flex;
	margin-bottom:0;
}

.point-box dl > *{
	margin:0 0 0 10px ;
}

.point-box dl::after{
	display:block;
	width:1px;
	content:'';
	background:url(/content/dam/amex/jp/membership-rewards/images/membership_bg_hr_dotted_02.png) repeat-y right top;
}

.point-box dl .unregistered     { order : 1 ; }
.point-box dl .unregistered + dd{ order : 2 ; }
.point-box dl .registered       { order : 4 ; }
.point-box dl .registered   + dd{ order : 5 ; }
.point-box dl::after            { order : 3 ; }


.point-box.invert dl .unregistered     { order : 4 ; }
.point-box.invert dl .unregistered + dd{ order : 5 ; }
.point-box.invert dl .registered       { order : 1 ; }
.point-box.invert dl .registered   + dd{ order : 2 ; }
.point-box.invert dl::after            { order : 3 ; }


.point-box dl dt{
	flex-basis:70px;
	flex-shrink:0;
	flex-grow:0;
	height:70px;
	text-align:center;
	color:#fff;
	font-size:0.875rem;
	font-weight:bold;
	padding:14px 10px;
}

.point-box dl .unregistered{
	background:#7f92b1;
}

.point-box dl .registered  {
	background:#00334d;
}

.point-box dl dd{
	padding:0;
	text-align:center;
	flex-grow:1;
	flex-basis:400px;
	display:flex;
	flex-direction:column;
	justify-content:space-between;
}

.point-box dl dd > *{
	margin:0;
}

.point-box dl dd h5{
	text-align:left;
	font-size:0.750rem;
}

.point-box dl .unregistered + dd h5{
	color:#4d6691;
}

.point-box dl .registered   + dd h5{
	color:#00334d;
}

.point-box .rewards{
	font-weight:bold;
	font-size:0.9375rem;
	display:flex;
	justify-content:center;
	align-items:flex-end;
	line-height:1;
}

.point-box .rewards.registered{
	align-items:center;
	padding:15px 0;
}

.point-box .rewards > span{
	text-align:left;
}

.point-box .rewards .arrow,
.point-box .rewards b{
	font-size:1.250rem;
	padding:0 3px;
}

.point-box .rewards.small,
.point-box .rewards.small .arrow,
.point-box .rewards.small b{
	font-size:0.875rem;
}

.point-box .rewards .arrow{
	padding:0 15px;
}

.point-box .rewards .mini{
	display:block;
	font-size:0.625rem;
}

.point-box dl .unregistered + dd .rewards .arrow,
.point-box dl .unregistered + dd .rewards b{
	color:#0096be;
}

.point-box .rewards.registered .arrow,
.point-box .rewards.registered b,
.point-box dl .registered   + dd .rewards .arrow,
.point-box dl .registered   + dd .rewards b{
	color:#e73369;
}

.point-box .note{
	text-align:center;
	font-size:0.750rem;
}

.point-box .rewards.registered + .note{
	margin-top:-10px;
	padding-bottom:15px;
}

.point-box.invert dl .unregistered + dd .rewards,
.point-box.invert dl .unregistered + dd .rewards .arrow,
.point-box.invert dl .unregistered + dd .rewards b{
	color:#000;
	font-weight:normal !important;;
	font-size:0.9375rem
}

/* Q&A --------------------------------------------- */

.search-area,
.search-area h2,
.search-area label,
.qa-list li{
	font-family: Meiryo, メイリオ, 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', sans-serif;
}
.search-area h2{
	font-size:20px;
	font-weight:bold;
	text-align:center;
	margin:0;
	padding:40px 0;
}

.search-area ul li input {
}
.search-area ul li input + label {
}
.search-area ul li input:checked + label {
}

.card-area{
	background:#002663;
	color:#fff;
}
.card-area input{
	display:none;
}
.card-list{
	width:980px;
	margin:0 auto;
	padding:0 64px;
	display:flex;
	flex-wrap:wrap;
}
.card-list li{
	flex-basis:142px;
	margin:0;
	padding:0;
	display:flex;
}
.card-list li label{
	opacity:0.3;
	transition:.1s;
	cursor:pointer;
}
.card-list.visible li label{
	opacity:1;
}
.card-list li label img{
	width:110px;
	margin:0 auto;
}
.card-list li label span{
	display:block;
	color:#fff;
	padding:0 10px;
}
.card-list li label.on,
.card-list li input:checked + label {
	opacity:1;
}

.card-area-img {
	padding: 0;
	width: 60px;
	margin-left: -18px;
}

.rcpcard-area-img {
	padding: 0;
	margin-left: -18px;
}

@media (min-width: 769px) {
	.card-list li:hover label{
		opacity:1;
	}
}

.category-list{
	width:980px;
	margin:0 auto 20px;
	border-collapse:collapse;
	border:solid 3px #002663;
	color:#002663;
}

.category-list input{
	display:none;
}

.category-list th,
.category-list td{
	border:solid #7f92b1;
	border-width:1px 0;
}

.category-list th,
.category-list td,
.category-list label{
	font-size:14px;
}

.category-list th{
	background:#f3f5f8;
	width:30%;
	vertical-align:top;
}

.category-list td span{
	display:inline-block;
}

.category-list label{
	padding:0 28px 0 21px;
	background:transparent url(/content/dam/amex/jp/membership-rewards/images/membership_icon_parts_checkbox_04.png) no-repeat left 50%;
}

.category-list :checked + label{
	background-image:url(/content/dam/amex/jp/membership-rewards/images/membership_icon_parts_checkbox_03.png);
}

.category-list :disabled + label{
	opacity:0.25;
}

.qa-list{
	width:980px;
	margin:0 auto;
	padding:0;
}

.qa-list li{
	display:none;
	border-bottom:solid 1px #b4b4b4;
	padding-right:50px;
	background:transparent url(/content/dam/amex/jp/membership-rewards/images/membership_icon_parts_arrow_08.png) no-repeat right 50%;
}

.qa-list li.is-active{
	display:flex;
	justify-content:stretch;
}

.qa-list li::before{
	content:'Q';
	font-weight:bold;
	font-size:21px;
	color:#002663;
	flex-basis:30px;
	flex-grow:0;
	flex-shrink:0;
	display:inline-flex;
	align-items:center;
}

.qa-list li a{
	flex-grow:1;
	font-size:16px;
	line-height:20px;
	font-weight:bold;
	display:inline-block;
	padding:27px 0;
}


/* Contact List of Partners --------------------------------------------- */

.contact-box{
	display:flex;
	flex-wrap:wrap;
	margin-bottom:90px;
}

.contact-box .heading-level3{
	flex-basis:100%;
	font-size:1.375rem;
	color:#002663;
	border-bottom:solid 1px #002663;
	padding-bottom:2px;
	margin:25px 0;
}

.contact-box .logo{
	flex-basis:158px;
	text-align:center;
	margin-bottom:15px;
}

.contact-box .contact-detail{
	flex-basis:calc( 100% - 158px );
	border:solid 2px #002663;
	padding:10px 15px 10px 65px;
	margin-bottom:10px;
	position:relative;
}

.contact-box .contact-detail::before{
	display:inline-block;
	content:'';
	width:40px;
	height:40px;
	background:url(/content/dam/amex/jp/membership-rewards/images/membership_icon_parts_tel_02.png) no-repeat;
	background-size:contain;
	position:absolute;
	top:10px;
	left:10px;
}

.contact-box .contact-detail h4{
	color:#000;
	font-size:0.875rem;
	margin-bottom:0;
}

.contact-box .contact-detail p{
	margin-bottom:5px;
	font-size:0.875rem;
}

.contact-box .contact-detail .tel{
	font-weight:bold;
	font-size:0.750rem;
}

.contact-box .contact-detail .tel .number{
	font-size:1.125rem;
	color:#3d6bb5;
	pointer-events: none;
	cursor:text;
}

.contact-box .kome{
	flex-basis:100%;
	padding-left:158px;
}

.contact-box .kome li{
	list-style-type:none;
	margin-left:1.5em;
	text-indent:-1.5em;
	font-size:0.875rem;
}

/* SAN --------------------------------------------- */

.lnav-san{
	background:#969696;
	height:50px;/*changed*/
	font-size:1rem;/*changed*/
	text-align:center;
}

.lnav-san .san-drawer{
	display:none;
}

.lnav-san > ul{
	margin:0;
	padding:0;
	width:100%;
	display:inline-flex;
}

.lnav-san > ul > li{
	height:50px;/*changed*/
	color:#fff;
	text-align:center;
	list-style-type:none;
	flex-grow:1;
	border-right:solid 1px #fff;
	position:relative;
	display:flex;
	flex-direction:column;
	justify-content:center;
	cursor:pointer;
	white-space:nowrap;
}

.lnav-san > ul > li.blank-item{
	display:none;
}


.lnav-san > ul > li:hover{
	background-color:#fff !important;
	color:#002561 !important;
}

.lnav-san.index  .san-drawer span:nth-child(1),
.lnav-san.save   .san-drawer span:nth-child(2),
.lnav-san.mile   .san-drawer span:nth-child(3),
.lnav-san.plus   .san-drawer span:nth-child(4),
.lnav-san.with_p .san-drawer span:nth-child(5),
.lnav-san.item   .san-drawer span:nth-child(6){
	display:flex;
}

.lnav-san.index  > ul > li:nth-child(2),
.lnav-san.save   > ul > li:nth-child(3),
.lnav-san.mile   > ul > li:nth-child(4),
.lnav-san.plus   > ul > li:nth-child(5),
.lnav-san.with_p > ul > li:nth-child(6),
.lnav-san.item   > ul > li:nth-child(7){
	background-color:#5a5a5a;
}

.lnav-san > ul > li:nth-child(2){
	border-left:solid 1px #fff;
}

.lnav-san > ul > li > a{
	color:#fff;
	width:100%;
	display:block;
	text-align:center;
	transition:none;
}

.lnav-san > ul > li:hover > a{
	color:#002561;
}

.lnav-san > ul > li > a:hover{
	text-decoration:none;
}

.lnav-san > ul > li > ul{
	text-align:left;
	background:#fff;
	margin:0;
	padding:0;
	position:absolute;
	top:50px;/*changed*/
	left:0;
	display:none;
	box-shadow:0px 3px 5px 0px rgba(0,0,0,0.2);
}

.lnav-san > ul > li:hover > ul{
	display:inline-block;
	z-index:1;
}

.lnav-san > ul > li > ul li{
	display:block;
}

.lnav-san > ul > li > ul li a{
	display:block;
	line-height:50px;/*changed*/
	background:#fff;
	padding:0 30px 0 10px;
	font-size:0.875rem;
	transition:none;
}

.lnav-san > ul > li > ul li a:hover{
	background:#0082be;
	color:#fff;
	text-decoration:none;
}

.lnav-san > ul > li > ul li a::before{
	display:inline-block;
	content:'・';
	width:15px;
	text-align:center;
}


/* ===================== F O R   S M A R T   P H O N E S ===================== */

@media (min-width: 768px){
	.lnav-san > ul,
	.lnav-float ul {
	max-width: 720px;
	padding-left: 18px;
	padding-right: 18px;
	}
}

@media screen and (min-width:768px) and ( max-width:1024px) {
	.lnav-san > ul li{
		font-size:10px;
	}
}

@media (min-width: 1024px){
	.lnav-san > ul,
	.lnav-float ul {
	max-width: 940px;
	padding-left: 20px;
	padding-right: 20px;
	}

}

@media (min-width: 1280px){
	.lnav-san > ul,
	.lnav-float ul {
	max-width: 1240px;
	padding-left: 20px;
	padding-right: 20px;
	}

}

@media (max-width: 767px){
	.heading-level2{
		min-width:auto;
		font-size:24px;
		line-height:1.4em;
		padding:12px;
		margin-bottom:50px;
	}

	.lnav-float{
		height:50px;
		position:relative;
	}

	.lnav-float ul{
		background:#002663;
		width:100%;
		padding:0;
		height:auto;
		max-height:50px;
		overflow:hidden;
		position:absolute;
		top:0;
		transition:max-height .3s;
		flex-direction:column;
		flex-wrap:nowrap;
		align-items:center;
		z-index:1;
	}

	.lnav-float.open ul{
		max-height:1000px;
	}

	.lnav-float ul li{
		margin: 0 30px 25px 0;
	}

	.lnav-float ul li a{
		font-weight:normal;
	}

	.lnav-float .lnav-drawer{
		margin:0;
		padding:0;
		display:block;
		width:100%;
		flex-basis:50px;
		flex-shrink:0;
		background:url(/content/dam/amex/jp/membership-rewards/images/membership_icon_parts_menu_open.png) no-repeat 10px 50%;
		background-size:30px 30px;
		cursor:pointer;
	}

	.lnav-float.open .lnav-drawer{
		background-image:url(/content/dam/amex/jp/membership-rewards/images/membership_icon_parts_menu_close.png);
	}

	.point-box h4{
		padding:10px 5px;
		line-height:1.4;
	}

	.point-box h4 span{
		display:inline-block;
	}

	.point-box dl{
		flex-wrap:wrap;
		padding:10px;
	}

	.point-box dl > *{
		margin:0;
	}

	.point-box dl::after{
		display: block;
		content: '';
		height:21px;
		background:url(/content/dam/amex/jp/membership-rewards/images/membership_bg_hr_dotted_05.png) repeat-x left 50%;
		width:100%;
	}

	.point-box dl .unregistered{      order:1;}
	.point-box dl .unregistered + dd{ order:2;}
	.point-box dl .registered{        order:4;}
	.point-box dl .registered + dd{   order:5;}
	.point-box dl::after{             order:3;}

	.point-box dl dt{
		height:auto;
		display:flex;
		align-items:center;
		justify-content:center;
		padding:0 5px;
		font-size:12px;
		flex-basis:50px;
	}

	.point-box dl dd{
		display:block;
		line-height:1.4;
		flex-basis: calc( 100% - 50px);
		padding-left:10px;
	}

	.point-box dl .unregistered + dd{
		background-image:none;
		position:relative;
	}

	.point-box dl .unregistered + dd h5,
	.point-box dl .registered + dd h5{
		font-size:12px;
	}

	.point-box .rewards{
		flex-direction:column;
		align-items:center;
	}

	.point-box .rewards > span,
	.point-box .rewards.small{
		font-size:12px;
	}

	.point-box .rewards .arrow,
	.point-box .rewards strong,
	.point-box .rewards.small .arrow,
	.point-box .rewards.small strong{
		font-size:16px;
	}

	.point-box .rewards .arrow{
		transform:rotate(0.25turn);
	}

	.search-area,
	.search-area h2,
	.search-area label,
	.qa-list li{}
	.search-area h2{}
	.search-area ul li input {}
	.search-area ul li input + label {}
	.search-area ul li input:checked + label {}
	.card-area{
		width:auto;
		padding:0 10px;
	}
	.card-area input{}
	.card-list{
		width:auto;
		padding:0;
	}
	.card-list li{
		flex-basis:calc( 100% / 3 );
	}
	.card-list li label{
		font-size:12px;
	}
	.card-list li label img{
		width:100%;
		padding:0 16px;
	}
	.card-list li label span{}
	.card-list li:hover label,
	.card-list li input:checked + label {}

	.category-list,
	.category-list th,
	.category-list td{
		display:block;
		width:auto;
	}
	.category-list{
		padding:0;
	}
	.category-list input{}
	.category-list th,
	.category-list td{
		border-width:0 0 1px;
	}
	.category-list th,
	.category-list td,
	.category-list label{}
	.category-list th{}
	.category-list td span{}
	.category-list label{}
	.category-list :checked + label{}

	.qa-list{
		width:auto;
		padding:0 13px;
	}
	.qa-list li{}
	.qa-list li.is-active{}
	.qa-list li::before{}
	.qa-list li a{}

	/* Contact List of Partners --------------------------------------------- */

	.contact-box{
		flex-direction:column;
	}

	.contact-box .logo,
	.contact-box .contact-detail,
	.contact-box .kome{
		flex-basis:auto;
	}

	.contact-box .contact-detail .tel .number{
		display:block;
		pointer-events:auto;
		cursor:pointer;
	}

	.contact-box .kome{
		padding-left:0;
	}

	.card-area-img {
		padding: 0;
		margin-left: 0;
		width:auto;
		text-align:center !important;
	}

	.card-area-img img{
		width:100px;
	}

	.rcpcard-area-img {
		padding: 0;
		margin-left: 0;
		text-align:center !important;
	}

/* SAN --------------------------------------------- */

.lnav-san{
	height:auto;
	overflow:hidden;
	background:#fff;
	color:#0082be;
	font-size:18px;
	line-height:1;
	padding:0;
	max-height:80px;
	transition:max-height .3s;
	position:relative;
}
.lnav-san.open{
	max-height:999px;
}

.lnav-san > ul{
	display:block;
}
.lnav-san > ul > li{
	display:block;
	text-align:left;
	color:#0082be;
	height:auto;
	border-top:solid 1px #ccc;
}

.lnav-san > ul > li:last-child{
	border-bottom:solid 1px #ccc;
}

/*
.lnav-san > ul > li > a:hover,
.lnav-san > ul > li > span:hover,
.lnav-san > ul > li > a:active,
.lnav-san > ul > li > span:active{
	background:#0082be;
	color:#fff;
}*/

.lnav-san > ul > li:hover{}

.lnav-san .san-drawer{
	display:flex;
	padding:15px 10px;
}

.lnav-san .san-drawer span{
	display:none;
	height:50px;
	border:solid 1px #ccc;
	border-radius:7px;
	flex-direction:column;
	justify-content:center;
	background:#fff url(/content/dam/amex/jp/membership-rewards/images/membership_icon_parts_arrow_07.png) no-repeat calc( 100% - 10px ) 50%;
	font-size:16px;
	padding-left:15px;
}

.lnav-san.open .san-drawer span{
	border-color:#002663;
	color:#002663;
}

.lnav-san.index  .san-drawer span:nth-child(1),
.lnav-san.save   .san-drawer span:nth-child(2),
.lnav-san.mile   .san-drawer span:nth-child(3),
.lnav-san.plus   .san-drawer span:nth-child(4),
.lnav-san.with_p .san-drawer span:nth-child(5),
.lnav-san.item   .san-drawer span:nth-child(6){
	display:flex;
}

.lnav-san.index  > ul > li:nth-child(2),
.lnav-san.save   > ul > li:nth-child(3),
.lnav-san.mile   > ul > li:nth-child(4),
.lnav-san.plus   > ul > li:nth-child(5),
.lnav-san.with_p > ul > li:nth-child(6),
.lnav-san.item   > ul > li:nth-child(7){
	background-color:#fff;
}
.lnav-san > ul > li:nth-child(2){}
.lnav-san > ul > li > a,
.lnav-san > ul > li > span{
	color:#0082be;
	display:flex;
	flex-direction:column;
	justify-content:center;
	height:60px;
	padding-left:30px;
	text-align:left;
	background:url(/content/dam/amex/jp/membership-rewards/images/membership_icon_parts_arrow_05.png) no-repeat 14px 23px;
}
.lnav-san > ul > li:hover > a{}
.lnav-san > ul > li > a:hover{}
.lnav-san > ul > li > ul{
	display:block;
	position:static;
	box-shadow:none;
	font-size:16px;
	background:#f5f5f5;
	max-height:0;
	overflow:hidden;
	transition:max-height .3s;
}

.lnav-san > ul > li.branch{
	background:url(/content/dam/amex/jp/membership-rewards/images/membership_icon_parts_plus_02.png) no-repeat calc( 100% - 20px ) 20px;
}

.lnav-san > ul > li.branch.open{
	background-image:url(/content/dam/amex/jp/membership-rewards/images/membership_icon_parts_minus_02.png);
}

.lnav-san > ul > li.open > ul{
	max-height:500px;
}

.lnav-san > ul > li:hover > ul{
	display:block;
}

.lnav-san > ul > li > ul li{
	display:block;
}

.lnav-san > ul > li > ul li a{
	display:flex;
	align-items:center;
	height:50px;
	background:transparent;
}
.lnav-san > ul > li > ul li a:hover{}
.lnav-san > ul > li > ul li a::before{}
}
.anchor{
    display: block;
    padding-top: 60px;
    margin-top: -60px;
    font-size: 0;
}
.anchor-h2{
    display: block;
    padding-top: 30px;
    margin-top: -30px;
    font-size: 0;
}
