@charset "shift-jis";

/* -----------------------------------------

 VIEW CARD Structure CSS
 更新日:14/12/17
 
----------------------------------------- */

/* -----------------------------------------
	Reset Item
----------------------------------------- */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
	background: transparent;
	border:  0;
	font-size:  100%;
	margin:  0;
    outline: 0;
	padding:  0;
	vertical-align:  baseline;
}
html, body {
	line-height: 1;
}
article, aside, details, figcaption, figure, footer,
header, hgroup, menu, nav, section {
	display:  block;
}
ul,li {
	list-style: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
	font-size: inherit;
	empty-cells: show;
	border: 1px solid #333;
	width: 100%;
}
th {
	font-weight: normal;
	text-align: left;
	border: 1px solid #333;
}
td {
	border: 1px solid #333;
}
a {
    margin: 0;
    padding: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
a:link,
a:visited {
	color: #007dbb;
	text-decoration: underline;
}
a:hover,
a:active {
	color: #f60;
	text-decoration: underline;
}
img {
	border: none;
}
hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #cccccc;
    margin: 1em 0;
    padding: 0;
}
b, strong {
    font-weight:  bold;
}
input, select {
	font-size: 99%;
    vertical-align: middle;
}
textarea {
	font-size: 99%;
}
address {
	font-style: normal;
}
blockquote, q {
    quotes: none;
}
blockquote::before,
blockquote::after,
q:before,
q:after {
    content: '';
    content: none;
}
abbr[title],
dfn[title] {
    border-bottom: 1px dotted;
    cursor: help;
}

/* -----------------------------------------
	Base Item
----------------------------------------- */

body {
	background: #fff;
	color: #000;
	font-family:"Hiragino Kaku Gothic ProN","ヒラギノ角ゴ ProN W3", "メイリオ",'Meiryo',"ＭＳ Ｐゴシック",Helvetica,Arial,sans-serif;
	font-size: 81.3%;
	-webkit-font-smoothing:  antialiased;
	line-height: 1.6;
	margin: 0;
	padding: 0;
	text-align: center;
	-webkit-text-size-adjust: 100%;
}
body * {
	box-sizing: border-box;
	-moz-box-sizing:  border-box;
	-webkit-box-sizing:  border-box; 
}
.content {
	min-height:1px;
	margin: 0 auto;
	text-align: left;
	width: 950px;
}
.content:after {
	content: "";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
#skipLink {
	text-align: center;
	width: 100%;
}
#skipLink a {
	color: #333;
	display: block;
	background: #eee;
	margin-top: -1px;
	font-size: 1px;
	line-height: 0;
	height: 1px;
	overflow: hidden;
	zoom: 1;
}
#skipLink .show-block {
	height: 1em;
	font-size: 100%;
	line-height: 1;
	padding: 5px 0;
}

/* -----------------------------------------
	Header
----------------------------------------- */
#header {
  position: relative;
  background: #fff;
  box-shadow: 0 2px 6px 0 rgba(0, 0, 0, 0.08);
}
.globalHeader_head {
  display: flex;
  align-items: center;
  height: 17.9487179487vw;
  padding-left: 3.8461538462vw;
}
.globalHeader_body {
  padding: 0 5.1282051282vw 0;
  font-size: clamp(11px, 3.5897435897vw, 25px);
}
.globalHeader_body a {
  color: #222;
	text-decoration: none;
}
#header .logo {
  width: 43.5897435897vw;
}
#header .privateNav {
  display: flex;
  background: #f5f6f7;
  padding: 3.3333333333vw 5.1282051282vw;
  column-gap: 2.5641025641vw;
}
#header .privateNav_item {
  flex: 1;
}
#header .privateNav_btn {
  display: block;
  padding: 1.7948717949vw 0;
  text-align: center;
  border: 1px solid;
  border-radius: 9999px;
  font-size: clamp(11px, 3.5897435897vw, 25px);
  font-weight: 500;
  line-height: 1;
  transition: background-color 0.3s ease;
}
#header .privateNav_btn::before {
  display: inline-block;
  width: 4.1025641026vw;
  margin-right: 1.2820512821vw;
  padding-top: 3.5897435897vw;
  background-repeat: no-repeat;
  content: "";
}
#header .btnApply {
  background: #fff;
  color: #222;
}

#header .btnApply:hover {
  text-decoration: none;
}

#header .btnApply::before {
  background-image: url(/card/shared/img/icon_card.svg);
  background-size: 4.1025641026vw auto;
  background-position: 0 100%;
}
@media (hover: hover) and (pointer: fine) {
  #header .btnApply:hover {
    background: #edeff0;
  }
}
#header .btnLogin {
  background: #222;
  color: #fff;
}
#header .btnLogin::before {
  background-image: url(/card/shared/img/icon_login.svg);
  background-size: auto 3.5897435897vw;
}
@media (hover: hover) and (pointer: fine) {
  #header .btnLogin:hover {
    background: #555;
  }
}
#header .infoNav {
  display: flex;
  margin-bottom: 8.9743589744vw;

  white-space: nowrap;
}
#header .infoNav_item:not(:first-child) {
  position: relative;
  padding-left: 7vw;
  /* padding-left: 8.9743589744vw; */
}
#header .infoNav_item:not(:first-child)::before {
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 3.5vw;
  /* left: 4.6153846154vw; */
  transform: translateY(-50%);
  width: 1px;
  height: 1em;
  background-image: linear-gradient(to bottom, #e8e8e8, #e8e8e8 1px, transparent 1px, transparent 1px);
  background-position: right;
  background-size: 1px 2px;
  background-repeat: repeat-y;
  content: "";
}
#header .infoNav_link.is-active {
  color: #0075c2;
  text-decoration: underline;
  font-weight: 600;
}
@media (hover: hover) and (pointer: fine) {
  #header .infoNav_link:hover {
    text-decoration: underline;
  }
}
#header .contentsNav {
  margin-bottom: 7.6923076923vw;
}
@media (hover: hover) and (pointer: fine) {
  #header .contentsNav_link:hover::before {
    opacity: 1;
  }
}
#header .helpNav {
  margin-bottom: 5.641025641vw;
}
#header .helpNav_item:first-child {
  margin-bottom: 4.358974359vw;
}
#header .helpNav_link {
  position: relative;
}
#header .helpNav_link::after {
  display: block;
  position: absolute;
  top: 50%;
  right: -2.8205128205vw;
  transform: translateY(-50%);
  width: 2.0512820513vw;
  height: 2.0512820513vw;
  background: url(/card/shared/img/icon_arrow.svg) no-repeat 0 0;
  background-size: auto 100%;
  content: "";
}
#header .helpNav_link[target=_blank]::after {
  right: -1.2820512821vw;
  background: url(/card/shared/img/icon_blank.svg) no-repeat 50% 0;
  background-size: auto 100%;
}
@media (hover: hover) and (pointer: fine) {
  #header .helpNav_link:hover {
    text-decoration: underline;
  }
}
#header .logoJr {
  width: 14.358974359vw;
  height: 14.358974359vw;
  margin: 0 -5.1282051282vw 0 auto;
  background: #008803;
}
#header .logoJr a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
@media screen and (max-width: 750px) {
  .globalHeader_body {
    overflow: hidden;
    opacity: 0;
    height: 0;
    padding: 0 5.1282051282vw 0;
    transition: all 0.3s ease;
  }
  .globalHeader_btn {
    position: absolute;
    top: 3.8461538462vw;
    right: 5.1282051282vw;
  }
  #header .contentsNav {
    border: 1px solid #e8e8e8;
    border-radius: 10px;
    font-size: clamp(13px, 4.1025641026vw, 31px);
  }
  #header .contentsNav_item:not(:first-child) {
    border-top: 1px solid #e8e8e8;
  }
  #header .contentsNav_link {
    display: flex;
    align-items: center;
    height: 13.8461538462vw;
    padding: 0 4.1025641026vw;
    position: relative;
  }
  #header .contentsNav_link::after {
    position: absolute;
    top: 50%;
    right: 4.1025641026vw;
    transform: translateY(-50%);
    display: block;
    width: 3.3333333333vw;
    height: 3.3333333333vw;
    background-size: cover;
    content: "";
  }
  #header .btn {
    display: block;
    position: relative;
    overflow: hidden;
    width: 12.8205128205vw;
    height: 10.2564102564vw;
    padding: 0;
    border: 1px solid #e8e8e8;
    border-radius: 5px;
    background: #fff;
    text-indent: 100%;
    white-space: nowrap;
  }
  #header .btn::after,
  #header .btn span::after,
  #header .btn span::before {
    position: absolute;
    display: block;
    left: 50%;
    top: 50%;
    margin-left: -3.2051282051vw;
    width: 6.4102564103vw;
    height: 2px;
    background: #222;
    content: "";
    transition: all 0.2s;
  }
  #header .btn::after {
    margin-top: 6px;
  }
  #header .btn span::before {
    margin-top: -8px;
  }
  #header .btn span::after {
    margin-top: -1px;
  }
  #header.is-active .globalHeader_body {
    overflow: auto;
    opacity: 1;
    height: auto;
    padding: 7.6923076923vw 5.1282051282vw 0;
  }
  #header.is-active .btn::after {
    margin-top: 1px;
    transform: rotate(45deg);
  }
  #header.is-active .btn span::before {
    margin-top: 1px;
    transform: rotate(-45deg);
  }
  #header.is-active .btn span::after {
    margin: 0 0 0 50%;
    opacity: 0;
  }
}
@media screen and (min-width: 751px) {
  #header {
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.08);
  }
  .globalHeader_inside {
    position: relative;
    margin: 0 auto 15px;
  }
  .globalHeader_head {
    align-items: flex-start;
    width: min(93.75vw, 1200px);
    height: auto;
    margin: 0 auto;
    padding: 0;
  }
  .globalHeader_body {
    position: relative;
    margin: 0 auto 15px;
    padding: 0;
  }
  .globalHeader_separate {
    display: flex;
    justify-content: space-between;
    gap: min(3.41796875vw, 35px);
    width: min(70.3125vw, 920px);
    margin-left: auto;
    padding-right: min(4.58984375vw, 47px);
  }
  #header .logo {
    width: min(19.53125vw, 240px);
    margin-top: min(3.515625vw, 36px);
  }
  #header .privateNav {
    justify-content: flex-end;
    width: min(93.75vw, 1200px);
    margin: min(0.9765625vw, 10px) auto min(2.05078125vw, 21px);
    padding: 0;
    background: #fff;
    column-gap: min(0.9765625vw, 10px);
  }
  #header .privateNav_item {
    flex: none;
    width: min(14.6484375vw, 150px);
  }
  #header .privateNav_btn {
    padding: min(0.78125vw, 8px) 0;
    font-size: clamp(11px, 1.3671875vw, 14px);
  }
  #header .privateNav_btn::before {
    width: min(1.5625vw, 16px);
    margin-right: min(0.48828125vw, 5px);
    padding-top: min(1.3671875vw, 14px);
  }
  #header .btnApply::before {
    background-size: min(1.5625vw, 16px) auto;
  }
  #header .btnLogin::before {
    background-size: auto min(1.3671875vw, 14px);
  }
  #header .helpNav,
  #header .contentsNav {
    display: flex;
  }
  #header .infoNav {
    font-size: clamp(11px, 1.3671875vw, 14px);
    margin: min(4.19921875vw, 43px) 0 0;
    white-space: nowrap;
  }
  #header .infoNav_item:not(:first-child) {
    padding-left: min(3.41796875vw, 35px);
  }
  #header .infoNav_item:not(:first-child)::before {
    left: min(1.7578125vw, 18px);
    height: min(2.63671875vw, 27px);
  }
  #header .infoNav_link {
    color: #222;
  }
  #header .contentsNav {
    justify-content: center;
    margin: 0;
    font-size: clamp(12px, 1.5625vw, 16px);
    text-align: center;
  }
  #header .contentsNav_item {
    position: relative;
  }
  #header .contentsNav_item::before, #header .contentsNav_item::after {
    display: inline-block;
    position: absolute;
    top: 0.3em;
    width: 1px;
    height: 1em;
    background: #e8e8e8;
    vertical-align: middle;
    content: "";
  }
  #header .contentsNav_item::before {
    left: 0;
  }
  #header .contentsNav_item::after {
    left: 100%;
  }
  #header .contentsNav_link {
    display: block;
    position: relative;
    padding: 0 min(2.05078125vw, 21px) min(1.953125vw, 20px);
  }
  #header .contentsNav_link::before {
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    opacity: 0;
    width: 100%;
    height: 2px;
    background: #0075c2;
    content: "";
    transition: opacity 0.2s ease;
  }
  #header .contentsNav_link.is-current::before {
    opacity: 1;
  }
  #header .helpNav {
    margin: min(1.953125vw, 20px) 0 0;
    font-size: clamp(10px, 1.26953125vw, 13px);
  }
  #header .helpNav_item {
    margin-bottom: 0;
  }
  #header .helpNav_item:first-child {
    margin: 0 min(2.05078125vw, 21px) 0 0;
  }
  #header .helpNav_link {
    color: #222;
  }
  #header .helpNav_link::after {
    position: relative;
    display: inline-block;
    width: min(0.78125vw, 8px);
    height: min(0.78125vw, 8px);
    margin-left: .2em;
    vertical-align: middle;
    background-position: center !important;
    transform: none;
    top: auto;
    right: auto !important;
  }
  #header .helpNav_link[target=_blank]::after {
    margin-left: 0;
  }
  #header .logoJr {
    position: absolute;
    top: 0;
    right: 0;
    width: min(5.859375vw, 60px);
    height: min(5.859375vw, 60px);
    margin: 0;
  }
}
@media screen and (min-width: 1280px) {
  .globalHeader_inside {
    max-width: 1440px;
  }
  .globalHeader_separate {
    width: 920px;
  }
  #header .contentsNav_link {
    padding: 0 41px 20px;
  }
}
@media screen and (min-width: 1320px) {
  .globalHeader_separate {
    padding-right: 1%;
  }
  #header .privateNav {
    margin-top: -20px;
  }
}
@media screen and (min-width: 1350px) {
  .globalHeader_separate {
    padding-right: 0;
  }
}


#header a {
	text-decoration: none;
}

#header a:hover {
	text-decoration: underline;
}


/* -----------------------------------------
	Contents
----------------------------------------- */

#main {
	font-size: 107.7%;
	line-height: 1.6;
}
#main .breadCrumbs {
	font-size: 85.7%;
	margin: 0 auto 10px;
	overflow: hidden;
	width: 950px;
}
#main .breadCrumbs li {
	float: left;
	margin-right: 8px;
}
#main .breadCrumbs li + li a {
	display: block;
	padding-left: 13px;
	position: relative;
}
#main .breadCrumbs li + li a:before {
	background: url(/card/common/img/cmn-parts.png) no-repeat -132px 0;
	content: "";
	display: block;
	height: 7px;
	left: 0;
	position: absolute;
	top: .52em;
	width: 8px;
}
#main .breadCrumbs li:last-child a {
	color: #000;
	text-decoration: none;
}
#article {
	float: left;
	padding-bottom: 50px;
	width: 710px;
}
#article.fullArticle {
	float: none;
	width: 950px;
}
#main .content {
	margin-bottom: 50px;
	position: relative;
}
#main .toTop {
	bottom: 0;
	font-size: 114.3%;
	right: 0;
	position: absolute;
}
#main .toTop a {
	display: block;
	padding-top: 30px;
	position: relative;
	text-decoration: none;
}
#main .toTop a:before {
	background: url(/card/common/img/cmn-parts.png) no-repeat -49px -23px;
	display: block;
	content: "";
	height: 20px;
	margin-left: -10px;
	position: absolute;
	left: 50%;
	top: 0;
	width: 19px;
}
#main .toTop a:hover:before {
	background-position: -70px -23px;
}
@media print {
	#main .toTop {display: none;}
}

/* おすすめエリア（幅広版） */
.recommendCardWrap2{
	padding: 0 15px;
	display: block;
	min-height: 1%;
	margin-bottom: 50px;
}

.recommendCard2{
	width: 600px;
	min-height: 1%;
	display: flex;
	justify-content: space-between;
}

.recommendCard2.item2{
	width: 920px;
}

.recommendCard2 .image {
	margin: 0;
}

.recommendCard2 .textWrap {
	width: 340px;
	line-height: 1.3;
}

.recommendCard2 .textWrap .name {
	font-size: 128.6%;
	margin: 0 0 10px;
	font-weight: bold;
}
.recommendCard2 .textWrap .btn {
	margin: 10px 0 0;
}
.recommendCard2 .textWrap .btn a {
	display: block;
	padding: 7px 0 0;
	background: url(/card/common/img/recommend-card-btn.png) no-repeat left top;
	position: relative;
	text-align: center;
	color: #fff;
	text-decoration: none;
	font-weight: bold;
}
.recommendCard2 .textWrap .btn a:after {
	background: url(/card/common/img/cmn-parts.png) no-repeat -265px -36px;
	display: block;
	content: "";
	height: 12px;
	margin-top: -7px;
	position: absolute;
	left: 15px;
	top: 50%;
	width: 12px;
}
.recommendCard2 .textWrap .btn a:hover {
	background-position: -680px top;
}
.recommendCard2 .textWrap .btn a > span {
	display: block;
	padding: 0 0 7px;
	background: url(/card/common/img/recommend-card-btn.png) no-repeat -340px bottom;
}
.recommendCard2 .textWrap .btn a:hover > span {
	background-position: -1020px bottom;
}
.recommendCard2 .textWrap .btn a span span {
	display: block;
	padding: 14px 5px 16px;
	background: #ff9100;
	font-size: 128.6%;
}
.recommendCard2 .textWrap .btn a:hover span span {
	background: #ea5506;
}

.cardListLinkWrap {
	background: #f3fbff;
	padding: 26px;
	font-size: 114.3%;
	text-align: center;
}

/* おすすめエリア（はばせま版） */
.recommendCardSection_n {
	clear: both;
	margin: 0 0 50px;
}
.recommendCardSection_n h2 {
	margin: 0 0 20px !important;
}
.recommendCardSection_n .recommendCardWrap {
	margin-bottom:20px !important;
	padding: 0 15px;
	display: block;
	min-height: 1%;
}

.recommendCardSection_n .recommendCardWrap:after {
	clear: both;
	content:".";
	display: block;
	height: 0;
	visibility: hidden;
}

.recommendCardSection_n .recommendCard {
	float: left;
	width: 240px;
	display: block;
	min-height: 1%;
}
.recommendCardSection_n .recommendCardSpec {
	float:left;
	display: block;
	margin-left:10px;
	width:230px;
	min-height: 1%;
	line-height:1.5;
}
.recommendCardSection_n .recommendCardSpec p {
	margin:0;
	padding:0;
}
.recommendCardSection_n .recommendCardSpec img {
	margin:0;
	padding:0;
}
/*.recommendCardSection_n .recommendCardSpec dl {
	margin:0;
	padding:0;
}
.recommendCardSection_n .recommendCardSpec dl dt {
	float:left;
	margin:0 0 6px 0;
	border-bottom:1px dotted #cccccc;
	padding:0 0 4px 0;
	width:85px;
	height:19px;
}
.recommendCardSection_n .recommendCardSpec dl dd {
	float:left;
	margin:0 0 6px 0;
	border-bottom:1px dotted #cccccc;
	padding:0 0 4px 0;
	width:135px;
	height:19px;
	text-indent:5px;
}
.recommendCardSection_n .recommendCardSpec dl.price dd {
	text-align:center;
}
.recommendCardSection_n .recommendCardSpec dl.spec dd {
	text-align:center;
}
.recommendCardSection_n .recommendCardSpec dl.brand dt {
	margin-bottom:0;
	border-bottom:none;
}
.recommendCardSection_n .recommendCardSpec dl.brand dd {
	margin-bottom:0;
	border-bottom:none;
	text-align:center;
	text-indent:5px;
}
.recommendCardSection_n .recommendCardSpec dl.brand dd img {
	margin:0 3px 0 0;
}*/

.recommendCardSection_n .recommendCP {
	float: right;
	width: 200px;
	display: block;
	min-height: 1%;
}
.recommendCardSection_n .image {
	margin: 0 0 0 !important;
}
.recommendCardSection_n .name {
	margin:0 0 5px !important;
	font-size: 128.6%;
	font-weight: bold;
}
.recommendCardSection_n .txt {
	margin:0 0 10px !important;
}
.recommendCardSection_n .btn {
	margin: 10px 0 0;
}
.recommendCardSection_n .btn a {
	display: block;
	padding: 7px 0 0;
	background: url(/card/common/img/recommend-card-btn.png) no-repeat left top;
	position: relative;
	text-align: center;
	color: #fff;
	text-decoration: none;
	font-weight: bold;
	width:340px;
	margin-right:auto;
	margin-left:auto;
}
.recommendCardSection_n .btn a:after {
	background: url(/card/common/img/cmn-parts.png) no-repeat -265px -36px;
	display: block;
	content: "";
	height: 12px;
	margin-top: -7px;
	position: absolute;
	left: 15px;
	top: 50%;
	width: 12px;
}
.recommendCardSection_n .btn a:hover {
	background-position: -680px top;
}
.recommendCardSection_n .btn a > span {
	display: block;
	padding: 0 0 7px;
	background: url(/card/common/img/recommend-card-btn.png) no-repeat -340px bottom;
}
.recommendCardSection_n .btn a:hover > span {
	background-position: -1020px bottom;
}
.recommendCardSection_n .btn a span span {
	display: block;
	padding: 14px 5px 16px;
	background: #ff9100;
	font-size: 128.6%;
}
.recommendCardSection_n .btn a:hover span span {
	background: #ea5506;
}



/* -----------------------------------------
	Aside
----------------------------------------- */

#aside {
	float: right;
	margin-bottom: 100px;
	width: 230px;
}
#aside .admitBtn {
	display: none;
	font-size: 114.3%;
	font-weight: bold;
	line-height: 1.4;
	margin-bottom: 10px;
	position: relative;
}
#aside .admitBtn a {
	color: #fff;
	display: block;
	display: table-cell;
	-webkit-border-radius: 4px;
			border-radius: 4px;
	height: 80px;
	padding: 12px 10px 8px 35px;
	text-decoration: none;
	vertical-align: middle;
	width: 230px;
}
#aside .admitBtn a:before {
	background: url(/card/common/img/cmn-parts.png) no-repeat -52px 0;
	display: block;
	content: "";
	height: 16px;
	position: absolute;
	left: 15px;
	top: 32px;
	width: 10px;
}
/* IE8 style */
#aside .admitBtn a {
	background: url(/card/common/img/aside-admit-btn.png) no-repeat;
}
#aside .admitBtn a:hover {
	background-position: 0 -80px;
}
:root *> #aside .admitBtn a {
	background: #ff9100;
	border-bottom: 3px solid #d97b00;
}
:root *> #aside .admitBtn a:hover {
	background: #ea5506;
	border-bottom-color: #B93B00;
}


/* ログインエリア */
#aside .loginArea {
	border: 5px solid #085eb4;
	display: none;
	margin-bottom: 20px;
	padding: 5px 5px 0;
}
#aside .loginArea .loginBtn {
	position: relative;
}
#aside .loginArea .loginBtn a {
	-webkit-border-radius: 4px;
			border-radius: 4px;
	color: #fff;
	display: block;
	display: table-cell;
	font-size: 85.7%;
	height: 80px;
	letter-spacing: -.5px;
	padding: 10px 10px 8px 15px;
	text-decoration: none;
	vertical-align: middle;
	width: 210px;
}
#aside .loginArea .loginBtn a:before {
	background: url(/card/common/img/cmn-parts.png) no-repeat -52px 0;
	display: block;
	content: "";
	height: 16px;
	position: absolute;
	left: 15px;
	top: 22px;
	width: 10px;
}
/* IE8 style */
#aside .loginArea .loginBtn a {
	background: url(/card/common/img/aside-login-btn.png) no-repeat;
}
#aside .loginArea .loginBtn a:hover {
	background-position: 0 -80px;
}
:root *> #aside .loginArea .loginBtn a {
	background: #008CD0;
	border-bottom:3px solid #0077b1;
}
:root *> #aside .loginArea .loginBtn a:hover {
	background: #0077b1;
	border-bottom-color: #00387B;
}
#aside .loginArea .loginBtn a span {
	display: block;
	font-size: 138%;
	font-weight: bold;
	margin-left: 20px;
	margin-top:6px;
}
#aside .loginArea ul {
	margin: 10px 0;
}
#aside .loginArea ul li {
	margin-bottom: 0;
}
#aside .loginArea .supportBtn {
	border-top: 1px solid #eee;
	padding-top: 5px;
	position: relative;
}
#aside .loginArea .supportBtn a {
	-webkit-border-radius: 4px;
			border-radius: 4px;
	color: #008cd0;
	display: block;
	display: table-cell;
	font-size: 85.7%;
	height: 80px;
	padding: 8px 10px 8px 13px;
	text-decoration: none;
	vertical-align: middle;
	width: 210px;
}
/* IE8 style */
#aside .loginArea .supportBtn a {
	background: url(/card/common/img/aside-support-btn.png) no-repeat;
}
#aside .loginArea .supportBtn a:hover {
	background-position: 0 -80px;
}
#aside .loginArea .supportBtn a:before {
	background: url(/card/common/img/cmn-parts.png) no-repeat -282px 0;
	display: block;
	content: "";
	height: 16px;
	position: absolute;
	left: 14px;
	top: 25px;
	width: 10px;
}
:root *> #aside .loginArea .supportBtn a {
	background: #fff;
	border:1px solid #d9d9d9;
	border-bottom-width:3px;
}
:root *> #aside .loginArea .supportBtn a:hover {
	background: #efefef;
	border-bottom-color: #ccc;
}
#aside .loginArea .supportBtn a span {
	display: block;
	font-size: 166.7%;
	font-weight: bold;
	margin-left: 16px;
}


/* お客さまサポート */
#aside .sideNav {
	display: none;
	margin-bottom: 30px;
}
#aside .sideNav h2 {
	border-bottom: 1px solid #008cd0;
	color: #008cd0;
	font-size: 142.9%;
	font-weight: normal;
	padding-bottom: 3px;
}
#aside .sideNav ul li {
	border-bottom: 1px solid #eee;
}
#aside .sideNav ul li a {
	display: block;
	font-size: 85.7%;
	line-height: 1.5;
	padding: 10px 0 10px 9px;
	position: relative;
	text-decoration: none;
}
#aside .sideNav ul li a:hover {
	background: #eef9ff;
	color: #008cd0;
}
#aside .sideNav ul li a:before {
	background: url(/card/common/img/cmn-parts.png) no-repeat -67px 0;
	display: block;
	content: "";
	height: 6px;
	position: absolute;
	left: 0;
	top: 1.35em;
	width: 4px;
	z-index: 1;
}
#aside .sideNav ul li.linkSite a:before {
  background-position: -85px 0;
	width: 12px;
 	height: 12px;
 	top: 1.1em;
	left:-0.65em;
	margin-right: 10px;
}
#aside .sideNav ul .current > a,
#aside .sideNav ul .current > a:hover {
	background: #eef9ff;
	color: #333;
}
#aside .sideNav ul .current > a:before {
	background-position: -76px 0;
}
#aside .sideNav ul ul {
	border-top: 1px dotted #dedede;
	display: none;
}
#aside .sideNav ul ul li {
	border-top: 1px dotted #dedede;
	border-bottom: none;
}
#aside .sideNav ul ul li a {
	padding-left: 19px;
}
#aside .sideNav ul ul a:before {
	background-position: -67px -11px;
	height: 1px;
	left: 10px;
	top: 1.55em;
	width: 4px;
}
#aside .sideNav ul ul .current a:before {
	background-position: -76px -11px;
}
#aside .sideNav ul ul li:first-child {
	border-top: none;
}

/* セキュリティ */
#aside .securityNav ul li:nth-child(n+2) {
	padding-left: 13px;
}
#aside .securityNav ul li:nth-child(n+2) a::before {
	background-position: -76px -11px;
}

/* 関連リンク  */
#aside .relatedLinks,
#aside .relatedLinks2,
#aside .relatedLinks3 {
	background: #f6f6f6;
	display: none;
	margin-bottom: 10px;
	padding: 5px;
}
#aside .relatedLinks ul,
#aside .relatedLinks2 ul,
#aside .relatedLinks3 ul {
	border: 1px solid #ccc;
}
#aside .relatedLinks ul li,
#aside .relatedLinks2 ul li,
#aside .relatedLinks3 ul li {
	border-top: 1px solid #ccc;
	font-size: 85.7%;
	line-height: 1.5;
}
#aside .relatedLinks ul li:first-child,
#aside .relatedLinks2 ul li:first-child,
#aside .relatedLinks3 ul li:first-child {
	border-top: none;
}
#aside .relatedLinks ul a,
#aside .relatedLinks2 ul a,
#aside .relatedLinks3 ul a {
	background: #fff;
	color: #000;
	display: block;
	display: table;
	overflow: hidden;
	padding: 14px 30px 14px 9px;
	position: relative;
	text-decoration: none;
	width: 100%;
}
#aside .relatedLinks ul a:hover,
#aside .relatedLinks2 ul a:hover,
#aside .relatedLinks3 ul a:hover {
	background: #eef9ff;
}
#aside .relatedLinks ul a:before,
#aside .relatedLinks2 ul a:before,
#aside .relatedLinks3 ul a:before {
	background: url(/card/common/img/cmn-parts.png) no-repeat -37px 0;
	display: block;
	content: "";
	height: 18px;
	margin-top: -9px;
	position: absolute;
	right: 10px;
	top: 50%;
	width: 10px;
	z-index: 1;
}
#aside .relatedLinks ul span:first-child,
#aside .relatedLinks2 ul span:first-child,
#aside .relatedLinks3 ul span:first-child {
	padding-right: 10px;
	text-align: center;
	width: 45px;
}
#aside .relatedLinks ul span small,
#aside .relatedLinks2 ul span small,
#aside .relatedLinks3 ul span small {
	display: block;
	font-size: 83.3%;
}
#aside .relatedLinks ul img,
#aside .relatedLinks2 ul img,
#aside .relatedLinks3 ul img {
	vertical-align: bottom;
}
#aside .relatedLinks ul span,
#aside .relatedLinks2 ul span,
#aside .relatedLinks3 ul span {
	display: block;
	display: table-cell;
	height: 50px;
	vertical-align: middle;
}


/* FAQ（よくあるご質問）  */
#aside .faqArea {
	background: #eef9ff;
	cursor: pointer;
	display: none;
	margin-bottom: 10px;
	padding: 5px;
	position: relative;
}
#aside .faqArea:before {
	background: url(/card/common/img/cmn-parts.png) no-repeat -37px 0;
	display: block;
	content: "";
	height: 18px;
	margin-top: -9px;
	position: absolute;
	right: 15px;
	top: 50%;
	width: 10px;
	z-index: 1;
}
#aside .faqArea:after {
	background: url(/card/common/img/cmn-parts.png) no-repeat -145px 0;
	bottom: 20px;
	display: block;
	content: "";
	height: 48px;
	margin-top: -9px;
	position: absolute;
	right: 20px;
	width: 48px;
	z-index: 1;
}
#aside .faqArea .faqCont {
	background: #fff;
	border: 1px solid #cce0ea;
	padding: 20px 14px;
}
#aside .faqArea .faqCont:hover {
	background: #eef9ff;
}
#aside .faqArea h2,
#aside .faqArea h3 {
	margin-bottom: 15px;
}
#aside .faqArea ul {
	margin-bottom: 0;
}
#aside .faqArea ul li {
	font-size: 85.7%;
	line-height: 150.0%;
	margin-bottom: 0;
}


/* その他サービス・特典  */
#aside .serviceArea {
	display: none;
	margin-bottom: 10px;
}
#aside .serviceArea h2,
#aside .serviceArea h3 {
	background: #008CD0;
	color: #FFF;
	padding: 5px 10px;
	text-align: center;
}
#aside .serviceArea h3 {
	margin-bottom:0;
}
#aside .serviceArea .serviceCont {
	border: 1px solid #008CD0;
	padding: 0 9px 10px;
}
#aside .serviceArea ul li {
	border-top: 1px solid #eee;
	font-size: 85.7%;
	padding: 10px 0;
}
#aside .serviceArea ul li:first-child {
	border-top: none;
}
#aside .serviceArea ul li a {
	display: block;
	display: table;
	overflow: hidden;
}
#aside .serviceArea ul img {
	display: block;
	display: table-cell;
	vertical-align: bottom;
}
#aside .serviceArea ul span {
	display: block;
	display: table-cell;
	padding-left: 10px;
	vertical-align: middle;
}


/* キャンペーン・おすすめ情報エリア */
#aside .campaignArea {
	border: 1px solid #00ab5b;
	display: none;
	margin-bottom: 10px;
	padding: 0;
}
#aside .campaignArea h2,
#aside .campaignArea h3 {
	margin-bottom:0;
	background: #00ab5b;
	color: #fff;
	font-weight: bold;
	padding: 5px;
	text-align: center;
}
#aside .campaignArea ul li {
	border-top: 1px solid #eee;
	margin: 0 10px;
	padding: 10px 0;
}
#aside .campaignArea ul li:first-child {
	border-top: none;
}
#aside .campaignArea ul li > div {
	float: left;
	width: 90px;
}
#aside .campaignArea ul li > p {
	font-size: 85.7%;
	line-height: 1.3;
	overflow: hidden;
}
#aside .campaignArea ul li > p + p {
	margin-top: 5px;
}
#aside .campaignArea .linkCategory {
	margin: 0 10px 10px;
}

/* 右カラム下リンクエリア */
#aside .linkArea {
	background: #f2f9fd;
	display: none;
	margin-bottom: 10px;
	padding: 20px 10px 20px;
}


/* ログインウィンドウ  */
/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999;}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#eee; opacity: 0.9; filter: alpha(opacity = 90);}
#colorbox{outline:0;}
    #cboxContent{border:1px solid #ccc; overflow:visible; background:#fff; -webkit-box-shadow: 0 0 3px 0 rgba(100,100,100,.5);box-shadow: 0 0 3px 0 rgba(100,100,100,.5); font-size:116.7%; padding:39px; text-align:left; width:780px;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{background:#fff; padding:1px;}
        #cboxLoadingGraphic{background:url(/card/common/img/aside-entry-loading.gif) no-repeat center center;}
        #cboxLoadingOverlay{background:#fff;}
        #cboxTitle{position:absolute; top:-22px; left:0; color:#000;}
        #cboxCurrent{position:absolute; top:-22px; right:205px; text-indent:-9999px;}

        #cboxClose {background: url(/card/common/img/cmn-parts.png) no-repeat -195px 0; border:0; display:block; height:40px; margin:0; padding:0; overflow:hidden; position:absolute; right:14px; text-indent:3000px; top:14px; width:31px;}
 		#cboxClose:hover {background-position: -229px 0;}
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}

        #cboxPrevious{background-position:0px 0px; right:44px;}
        #cboxPrevious:hover{background-position:0px -25px;}
        #cboxNext{background-position:-25px 0px; right:22px;}
        #cboxNext:hover{background-position:-25px -25px;}
        .cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious{right:66px;}
        .cboxSlideshow_on #cboxSlideshow{background-position:-75px -25px; right:44px;}
        .cboxSlideshow_on #cboxSlideshow:hover{background-position:-100px -25px;}
        .cboxSlideshow_off #cboxSlideshow{background-position:-100px 0px; right:44px;}
        .cboxSlideshow_off #cboxSlideshow:hover{background-position:-75px -25px;}

#entryModal h2 {
	color: #008cd0;
	font-size: 200%;
	font-weight: normal;
	margin-bottom: 10px;
}
#entryModal .txtU { text-decoration: underline; }
#entryModal .entryFlowttl {
	background-color: #f0f8fc;
	border-left-width: 4px;
	border-left-style: solid;
	border-left-color: #008cd0;
	padding-top: 5px;
	padding-right: 5px;
	padding-left: 5px;
	margin-bottom:20px;
}
#entryModal .entryFlowttl .ttltxt {
	font-weight: bold;
	float:left;
}
#entryModal .entryFlowttl .ttlcard {
	float:right;
	margin-right: 8px;
	padding-top:3px;
}


#entryModal .entryFlowonlineNew {
	display: flex;
	margin-bottom: 10px;
	justify-content: space-between;
}
#entryModal .entryFlowonlineNew li {
	margin-left: 3px;
	padding: 0.8em 20px 0.8em 2.2em;
	background: #efefef;
	font-size: 0.9em;
	line-height: 1.2;
	position: relative;
	display: flex;
	align-items: center;
	counter-increment: number;
	flex-grow: 1;
}
#entryModal .entryFlowonlineNew li.bg-blue { background: #a1d4ef; }
#entryModal .entryFlowonlineNew li:before {
	content: counter(number)".";
	margin-right: 5px;
	margin-left: -1.6em;
}
#entryModal .entryFlowonlineNew li:after {
	display: block;
	content: "";
	width: 20px;
	height: 100%;
	background: url(/card/common/img/aside-entry-flow-bg.jpg) no-repeat -10px center;
	
	position: absolute;
	right: 0;
	top: 0;
}
#entryModal .entryFlowonlineNew li.bg-blue:after { background-position: right center; }
#entryModal .entryFlowonlineNew li:first-child { margin-left: 0; }
#entryModal .entryFlowonlineNew li:last-child { padding-right: 0.6em; flex-grow: 2; }
#entryModal .entryFlowonlineNew li:last-child:after { display: none; }


#entryModal .entryFlowonline2 {
	margin-bottom: 10px;
	overflow: hidden;
}
#entryModal .entryFlowonline2 li.flow01,
#entryModal .entryFlowonline2 li.flow02 {
	float: left;
	height: 48px;
	overflow: hidden;
	text-indent: 100%;
	width: 180px;
	white-space: nowrap;
	background-image: url(/card/common/img/aside-entry-flowonline.png);
	background-repeat: no-repeat;
}
#entryModal .entryFlowonline2 li.flow02 {
	background-position: -180px 0;
}
#entryModal .entryFlowonline2 li.flow03 {
	background-position: -360px 0;
}

#entryModal .entryFlowsend {
	margin-bottom: 10px;
	overflow: hidden;
}
#entryModal .entryFlowsend li.flow01,
#entryModal .entryFlowsend li.flow02,
#entryModal .entryFlowsend li.flow03 {
	float: left;
	height: 48px;
	overflow: hidden;
	text-indent: 100%;
	width: 180px;
	white-space: nowrap;
	background-image: url(/card/common/img/aside-entry-flowsend.png);
	background-repeat: no-repeat;
}
#entryModal .entryFlowsend li.flow02 {
	background-position: -180px 0;
}
#entryModal .entryFlowsend li.flow03 {
	background-position: -360px 0;
}
#entryModal .entryFlowsend li.flow04 {
}
#entryModal .entryBox {
	border: 4px solid #ccc;
	margin-bottom: 30px;
	padding: 25px;
}
#entryModal .entryBox h3 {
	font-size: 114.3%;
	font-weight: normal;
	margin-bottom: 10px;
}
#entryModal .entryBox ul {
	letter-spacing: -.4em;
	margin: 0 0 10px -10px;
	overflow: hidden;
}
#entryModal .entryBox ul li {
	display: inline-block;
	letter-spacing: normal;
	margin: 0 0 10px 10px;
	vertical-align: top;
	width: 315px;
}
#entryModal .entryBox ul li a {
	border: 1px solid #ccc;
	display: block;
	color: #000;
	overflow: hidden;
	padding: 14px 10px 14px 35px;
	position: relative;
	text-decoration: none;
}
#entryModal .entryBox ul li a:before {
	background: url(/card/common/img/cmn-parts.png) no-repeat -264px 0;
	content: "";
	display: block;
	left: 9px;
	height: 16px;
	margin-top: -8px;
	position: absolute;
	top: 50%;
	width: 16px;
}
#entryModal .entryBox ul li a.current:before {
	background-position: -264px -18px;
	content: " ";
}
#entryModal .entryBox ul li a:hover,
#entryModal .entryBox ul li a.current {
	border: 2px solid #008cd0;
	padding: 13px 9px 13px 34px;
}
#entryModal .entryBox ul li a.current {
	background: #fffee3;
}
#entryModal .entryBox ul li a:hover:before,
#entryModal .entryBox ul li a.current:before {
	left: 8px;
}
#entryModal .entryBox ul li img {
	display: block;
	float: left;
	margin-right: 10px;
	vertical-align: middle;
}
#entryModal .entryBox ul li a span {
	display: block;
	margin-top: 5px;
	overflow: hidden;
}
#entryModal .entryBox ul li.line a span {
	margin-top: 0;
	line-height: 1.2;
}
#entryModal #entryBox02 {
	display: none;
}
#entryModal #entryBox02 li {
	font-size: 92.9%;
}
#entryModal .prevBox01 a {
	display: inline-block;
	margin-top: 10px;
	padding-left: 15px;
	position: relative;
}
#entryModal .prevBox01 a:before {
	background: url(/card/common/img/cmn-parts.png) no-repeat -132px -10px;
	content: "";
	display: block;
	left: 0;
	height: 9px;
	position: absolute;
	top: .5em;
	width: 10px;
}
#entryModal .btnLine {
	height: 50px;
	position: relative;
}
#entryModal .toEntry {
	left: 50%;
	margin-left: -115px;
	position: absolute;
	text-align: center;
	top: 0;
	width: 230px;
}
#entryModal .toEntry a {
	background: #ccc;
	-webkit-border-radius: 4px;
			border-radius: 4px;
	color: #fff;
	cursor: inherit;
	display: block;
	font-size: 171.4%;
	height: 50px;
	padding-top: 5px;
	position: relative;
	text-decoration: none;
}
#entryModal .toEntry a:before {
	background: url(/card/common/img/cmn-parts.png) no-repeat -127px -21px;
	content: "";
	display: block;
	left: 15px;
	height: 16px;
	margin-top: -8px;
	position: absolute;
	top: 50%;
	width: 10px;
}
#entryModal .toEntry a.active {
	background: #79ADDD;
	border-bottom: 3px solid #79ADDD;
	cursor: pointer;
}
#entryModal .toEntry a.active:hover {
	background: #085EB4;
	border-bottom-color: #085EB4;
}

#entryModal .musthaveBox { margin: 30px auto; }
#entryModal .musthaveBox h3 { margin-bottom: 10px; }
#entryModal .musthaveList {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	
	padding: 15px;
	font-size: 0.9em;
	border: 1px #ccc solid;
}
#entryModal .musthaveList > * { flex-basis: 48%; }
#entryModal .musthaveList > * > img {
	float: left;
	width: 100px;
}
#entryModal .musthaveList > * > p { padding-left: 115px; }



/* -----------------------------------------
  Footer
----------------------------------------- */
#footer {
  position: relative;
  width: 100%;
  background: #63686e;
  color: #fff;
  font-weight: 500;
}
.globalFooter_bottom {
  padding: 10.2564102564vw 0 15.3846153846vw;
  background: #fff;
  color: #222;
  text-align: center;
  font-size: clamp(12px, 3.0769230769vw, 23px);
  font-weight: 400;
}

.globalFooter_bottom > .content {
	width: 100%;
	text-align: center;
}

@media screen and (min-width: 751px) {
  .globalFooter_bottom {
    padding: min(4.8828125vw, 50px) 0;
    font-size: clamp(10px, 1.171875vw, 12px);
  }
}
#footer .guidePlate {
  padding: 6.4102564103vw 0 15.3846153846vw;
}
#footer .guidePlate_grid:last-child {
  margin-top: 10.2564102564vw;
}
@media screen and (min-width: 751px) {
  #footer .guidePlate {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: min(7.8125vw, 80px) 0 min(9.765625vw, 100px);
  }
  #footer .guidePlate_grid {
    width: 31.3265306122%;
    margin-bottom: min(3.41796875vw, 35px);
    padding-left: min(0.68359375vw, 7px);
  }
  #footer .guidePlate_grid:last-child {
    margin: 0 0 0 auto;
    padding-top: min(2.9296875vw, 30px);
    border-top: 1px solid rgba(255, 255, 255, 0.3);
  }
}
#footer .category_theme {
  position: relative;
  padding: 6.4102564103vw 0;
  font-size: clamp(13px, 4.1025641026vw, 31px);
}
@media screen and (max-width: 750px) {
  #footer .category {
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  }
  #footer .category_theme {
    cursor: pointer;
  }
  #footer .category_theme::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 1em;
    height: 1em;
    background: url(/card/shared/img/icon_circle_plus.svg) no-repeat 0 0;
    background-size: 100% auto;
    content: "";
  }
  #footer .category_theme.is-open::after {
    background-image: url(/card/shared/img/icon_circle_minus.svg);
  }
  #footer .category_items {
    margin: 0 3.8461538462vw;
    padding-bottom: 5.1282051282vw;
  }
  #footer .category_items + .category_theme {
    border-top: 1px solid rgba(255, 255, 255, 0.12);
  }
}
@media screen and (min-width: 751px) {
  #footer .category_theme {
    padding: min(1.953125vw, 20px) 0 min(2.734375vw, 28px);
    font-size: clamp(13px, 1.7578125vw, 18px);
    font-weight: 600;
  }
  #footer .category_items + .category_theme {
    margin-top: min(2.9296875vw, 30px);
  }
}
#footer .navigation_item:not(:first-of-type) {
  margin-top: 2.5641025641vw;
}
#footer .navigation_link {
  color: #fff;
  font-size: clamp(11px, 3.5897435897vw, 25px);
  font-weight: 400;
  text-decoration: none;
}
#footer .navigation_link::after {
  display: inline-block;
  margin: 0 0 1px 5px;
  width: 0.572em;
  height: 0.572em;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%3Crect%20width%3D%228%22%20height%3D%228%22%20fill%3D%22none%22%2F%3E%3Cpath%20d%3D%22M9623-908.5a.5.5%2C0%2C0%2C1-.395-.193.5.5%2C0%2C0%2C1%2C.088-.7l3.992-3.105-3.992-3.105a.5.5%2C0%2C0%2C1-.088-.7.5.5%2C0%2C0%2C1%2C.7-.088l4.5%2C3.5a.5.5%2C0%2C0%2C1%2C.193.395.5.5%2C0%2C0%2C1-.193.395l-4.5%2C3.5A.5.5%2C0%2C0%2C1%2C9623-908.5Z%22%20transform%3D%22translate(-9621%20916.5)%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: 100% auto;
  content: "";
}
#footer .navigation_link[target=_blank]::after {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%3Cpath%20d%3D%22M7.428%2C8H2.857a.573.573%2C0%2C0%2C1-.572-.572V5.714H.571A.572.572%2C0%2C0%2C1%2C0%2C5.143V.571A.572.572%2C0%2C0%2C1%2C.571%2C0H5.143a.572.572%2C0%2C0%2C1%2C.571.571V2.285H7.428A.573.573%2C0%2C0%2C1%2C8%2C2.857V7.428A.573.573%2C0%2C0%2C1%2C7.428%2C8Zm-4-2.286V6.857H6.857V3.429H5.714V5.143a.572.572%2C0%2C0%2C1-.571.571ZM1.143%2C1.143V4.571H4.571V1.143Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E");
}
#footer .navigation_link[href$=".pdf"]::after {
	background-image: url("/card/shared/img/icon_pdf_w.svg");
	margin: 0 0 0 5px;
	width: 0.772em;
	height: 0.772em;
}
@media (hover: hover) and (pointer: fine) {
  #footer .navigation_link:hover {
    text-decoration: underline;
  }
}
@media screen and (min-width: 751px) {
  #footer .navigation_item:not(:first-of-type) {
    margin-top: min(0.5859375vw, 6px);
  }
  #footer .navigation_link {
    font-size: clamp(11px, 1.3671875vw, 14px);
  }
}
#footer .helpNaviList {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0 auto;
}
#footer .helpNaviList:last-of-type {
  margin-bottom: 3.0769230769vw;
}
#footer .helpNaviList_item {
  margin-bottom: 2.0512820513vw;
}
#footer .helpNaviList_item:not(:last-child)::after {
  display: inline-block;
  width: 1px;
  height: 1em;
  margin: 0 2.5641025641vw;
  background: #222;
  vertical-align: middle;
  content: "";
}
#footer .helpNaviList_link {
  color: #222;
  text-decoration: underline;
}
@media (hover: hover) and (pointer: fine) {
  #footer .helpNaviList_link {
    transition: 0.3s ease;
  }
  #footer .helpNaviList_link:hover {
    color: #888;
  }
}
@media screen and (min-width: 751px) {
  #footer .helpNaviList {
    width: min(85.5vw, 684px);
    width: clamp(560px, 66.796875vw, 684px);
    margin: 0 auto;
  }
  #footer .helpNaviList:last-of-type {
    margin-bottom: min(0.9765625vw, 10px);
  }
  #footer .helpNaviList_item {
    margin-bottom: min(0.78125vw, 8px);
  }
  #footer .helpNaviList_item:first-child {
    margin-left: min(2.9296875vw, 30px);
  }
  #footer .helpNaviList_item:nth-of-type(5) {
    margin-right: min(2.9296875vw, 30px);
  }
  #footer .helpNaviList_item:not(:last-child)::after {
    margin: 0 min(0.78125vw, 8px);
  }
}
#footer .snsList {
  display: flex;
  margin-top: 5.1282051282vw;
}
#footer .snsList_item:not(:first-child) {
  margin-left: 5.1282051282vw;
}
#footer .snsIcon-tw {
  width: 8.55641vw;
}
#footer .snsIcon-insta {
  width: 8.2051282051vw;
}
#footer .snsIcon-youtube {
  width: 12.205128vw;
}
@media screen and (min-width: 751px) {
  #footer .snsList {
    margin-top: min(1.953125vw, 20px);
  }
  #footer .snsList_item:not(:first-child) {
    margin-left: min(1.953125vw, 20px);
  }
  #footer .snsIcon-tw {
    width: min(2.20625vw, 33px);
  }
  #footer .snsIcon-insta {
    width: min(3.125vw, 32px);
  }
  #footer .snsIcon-youtube {
    width: min(3.325vw, 47px);
  }
}

#footer > .content {
	/* width: 100%; */
	max-width: 980px;
	padding: 0 3.8461538462vw;
	box-sizing: content-box !important;
}




/* -----------------------------------------
	PC Safari・iPad用調整（202110追加）
----------------------------------------- */
@media print, screen and (min-width: 641px) {
	.footer-display #footer .nav,
	.footer-display #footContents > ul,
	.footer-display #footer .copy {
		display: block;
	}
}

/* -----------------------------------------
	2208追加　法人のお客様ページ用
----------------------------------------- */
/* ログインエリア */
#aside .loginArea_co {
	border: 5px solid #085eb4;
	display: none;
	margin-bottom: 20px;
	padding: 5px 5px 0;
}
#aside .loginArea_co .loginBtn {
	position: relative;
}
#aside .loginArea_co .loginBtn a {
	-webkit-border-radius: 4px;
			border-radius: 4px;
	color: #fff;
	display: block;
	display: table-cell;
	font-size: 85.7%;
	height: 80px;
	letter-spacing: -.5px;
	padding: 10px 10px 8px 15px;
	text-decoration: none;
	vertical-align: middle;
	width: 210px;
}
#aside .loginArea_co .loginBtn a:before {
	background: url(/card/common/img/cmn-parts.png) no-repeat -265px -36px;
	display: block;
	content: "";
	height: 16px;
	position: absolute;
	left: 15px;
	top: 22px;
	width: 13px;
}
#aside .loginArea_co .loginBtn .txt_s {
	font-size: 80%;
}
/* IE8 style */
#aside .loginArea_co .loginBtn a {
	background: url(/card/common/img/aside-login-btn.png) no-repeat;
}
#aside .loginArea_co .loginBtn a:hover {
	background-position: 0 -80px;
}
:root *> #aside .loginArea_co .loginBtn a {
	background: #008CD0;
	border-bottom:3px solid #0077b1;
}
:root *> #aside .loginArea_co .loginBtn a:hover {
	background: #0077b1;
	border-bottom-color: #00387B;
}
#aside .loginArea_co .loginBtn a span {
	display: block;
	font-size: 138%;
	font-weight: bold;
	margin-left: 20px;
	margin-top:6px;
}
#aside .loginArea_co ul {
	margin: 10px 0;
}
#aside .loginArea_co ul li {
	margin-bottom: 0;
}
#aside .loginArea_co .supportBtn {
	border-top: 1px solid #eee;
	padding-top: 5px;
	position: relative;
}
#aside .loginArea_co .supportBtn a {
	-webkit-border-radius: 4px;
			border-radius: 4px;
	color: #008cd0;
	display: block;
	display: table-cell;
	font-size: 85.7%;
	height: 80px;
	padding: 8px 10px 8px 13px;
	text-decoration: none;
	vertical-align: middle;
	width: 210px;
}
/* IE8 style */
#aside .loginArea_co .supportBtn a {
	background: url(/card/common/img/aside-support-btn.png) no-repeat;
}
#aside .loginArea_co .supportBtn a:hover {
	background-position: 0 -80px;
}
#aside .loginArea_co .supportBtn a:before {
	background: url(/card/common/img/cmn-parts.png) no-repeat -282px 0;
	display: block;
	content: "";
	height: 16px;
	position: absolute;
	left: 14px;
	top: 25px;
	width: 10px;
}
:root *> #aside .loginArea_co .supportBtn a {
	background: #fff;
	border:1px solid #d9d9d9;
	border-bottom-width:3px;
}
:root *> #aside .loginArea_co .supportBtn a:hover {
	background: #efefef;
	border-bottom-color: #ccc;
}
#aside .loginArea_co .supportBtn a span {
	display: block;
	font-size: 166.7%;
	font-weight: bold;
	margin-left: 16px;
}

/* FAQ（よくあるご質問）  */
#aside .faqArea_co {
	background: #eef9ff;
	cursor: pointer;
	display: none;
	margin-bottom: 10px;
	padding: 5px;
	position: relative;
}
#aside .faqArea_co:before {
	background: url(/card/common/img/cmn-parts.png) no-repeat -37px 0;
	display: block;
	content: "";
	height: 18px;
	margin-top: -9px;
	position: absolute;
	right: 15px;
	top: 50%;
	width: 10px;
	z-index: 1;
}
#aside .faqArea_co:after {
	background: url(/card/common/img/cmn-parts.png) no-repeat -145px 0;
	bottom: 20px;
	display: block;
	content: "";
	height: 48px;
	margin-top: -9px;
	position: absolute;
	right: 20px;
	width: 48px;
	z-index: 1;
}
#aside .faqArea_co .faqCont {
	background: #fff;
	border: 1px solid #cce0ea;
	padding: 20px 15px 30px 15px;
}
#aside .faqArea_co .faqCont:hover {
	background: #eef9ff;
}
#aside .faqArea_co h2,
#aside .faqArea_co h3 {
	margin-bottom: 15px;
}
#aside .faqArea_co ul {
	margin-bottom: 0;
}
#aside .faqArea_co ul li {
	font-size: 85.7%;
	line-height: 150.0%;
	margin-bottom: 0;
}
/* その他サービス・特典  */
#aside .serviceArea_co {
	display: none;
	margin-bottom: 10px;
}
#aside .serviceArea_co h2,
#aside .serviceArea_co h3 {
	background: #008CD0;
	color: #FFF;
	padding: 5px 10px;
	text-align: center;
}
#aside .serviceArea_co h3 {
	margin-bottom:0;
}
#aside .serviceArea_co .serviceCont {
	border: 1px solid #008CD0;
	padding: 0 9px 10px;
}
#aside .serviceArea_co ul li {
	border-top: 1px solid #eee;
	font-size: 85.7%;
	padding: 10px 0;
}
#aside .serviceArea_co ul li:first-child {
	border-top: none;
}
#aside .serviceArea_co ul li a {
	display: block;
	display: table;
	overflow: hidden;
}
#aside .serviceArea_co ul img {
	display: block;
	display: table-cell;
	vertical-align: bottom;
}
#aside .serviceArea_co ul span {
	display: block;
	display: table-cell;
	padding-left: 10px;
	vertical-align: middle;
}
/* 右カラム下リンクエリア */
#aside .linkArea_co {
	background: #f2f9fd;
	display: none;
	margin-bottom: 10px;
	padding: 20px 10px 20px;
}




























/* -----------------------------------------
  Utility
----------------------------------------- */
.u-alert {
  color: #d10000;
}
.u-txtC {
  text-align: center;
}
.u-txtR {
  text-align: right;
}
.u-fontB {
  font-weight: 600;
}
.u-fontM {
  font-weight: 500;
}
.u-fontSz12 {
  font-size: clamp(12px, 3.0769230769vw, 23px);
}
.u-fontSz14 {
  font-size: clamp(11px, 3.5897435897vw, 25px);
}
.u-fontSz16 {
  font-size: clamp(13px, 4.1025641026vw, 31px);
}
.u-fontSz18 {
  font-size: clamp(15px, 4.6153846154vw, 35px);
}
.u-imgMax {
  display: block !important;
  max-width: 100%;
  height: auto;
}
.u-fullImg {
  display: block;
  width: 100%;
  height: auto;
}
.u-fullImgH {
  width: auto;
  height: 100%;
}
.u-alpha {
  transition: opacity 0.3s ease;
}
@media (hover: hover) and (pointer: fine) {
  .u-alpha:hover {
    opacity: 0.7;
  }
}
.u-mt0 {
  margin-top: 0 !important;
}
.u-mb0 {
  margin-bottom: 0 !important;
}
.u-pr0 {
  padding-right: 0 !important;
}
.u-pl0 {
  padding-left: 0 !important;
}
.u-lhSm {
  line-height: 1.4 !important;
}
.u-lhBase {
  line-height: 1.6 !important;
}
.u-lhLg {
  line-height: 1.8 !important;
}
.u-paragraph {
  margin-top: 1em;
}
.u-appear {
  opacity: 0;
  transition: transform 0.6s ease, opacity 0.6s linear;
}
.u-appear.is-show {
  opacity: 1;
}
.u-appear[data-animation=goup] {
  transform: translate3d(0, 20px, 0);
}
.u-appear[data-animation=goup].is-show {
  transform: translate3d(0, 0, 0);
}
.u-autoHide {
  overflow: hidden !important;
  height: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  border-color: rgba(255, 255, 255, 0) !important;
}
.u-fadeOut {
  animation: fadeOut 0.3s both;
}
.u-fadeIn {
  animation: fadeIn 0.3s both;
}
@media screen and (max-width: 750px) {
  .u-spTxtL {
    text-align: left;
  }
  .u-pcItem {
    display: none !important;
  }
}
@media screen and (min-width: 751px) {
  .u-fontSz12 {
    font-size: clamp(10px, 1.171875vw, 12px);
  }
  .u-fontSz14 {
    font-size: clamp(11px, 1.3671875vw, 14px);
  }
  .u-fontSz16 {
    font-size: clamp(12px, 1.5625vw, 16px);
  }
  .u-fontSz18 {
    font-size: clamp(13px, 1.7578125vw, 18px);
  }
  .u-pcTxtC {
    text-align: center;
  }
  .u-spItem {
    display: none !important;
  }
}





/**********************************************************************/
/* トップページのモーダルウィンドウ **************************************/
/**********************************************************************/

/* モーダル
----------------------------------------- */

.modalPanel {
	display: none;
	z-index: 10002;
	position: absolute;
	top: 50%;
	left: 50%;
	width: calc(100% - 10.2564102564vw);
	margin-top: 15.3846153846vw;
	transform: translateX(-50%);
	opacity: 0;
}

.modalPanel[aria-hidden=false] {
	display: block;
	animation: fadeIn 0.3s 0.2s both;
}

.modalPanel_inner {
	position: relative;
	max-height: 100%;
	padding: 7.6923076923vw;
	overflow: auto;
	border-radius: 10px;
	background: #fff;
}

.modalPanel_btn {
	-webkit-appearance: none;
	-moz-appearance: none;
	display: block;
	appearance: none;
	position: absolute;
	top: -15.3846153846vw;
	right: 0;
	width: 10.2564102564vw;
	height: 10.2564102564vw;
	padding: 0;
	overflow: hidden;
	border: none;
	background: none;
	background: url(/card/first/img/btn_modal_close.png) no-repeat 0 0;
	background-size: cover;
	text-indent: 100%;
	white-space: nowrap;
	cursor: pointer;
	transition: opacity 0.3s ease;
}

.modalOverlay {
	display: none;
	z-index: 10000;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.6);
	opacity: 0;
}

/* カードのお届けまでの矢羽根 */

#entryModal .entryFlowonlineNew {
	margin-top: 20px;
}

#entryModal .entryFlowonlineNew li {
	display: flex;
	position: relative;
	align-items: center;
	justify-content: center;
	margin-bottom: 20px;
	padding: 5px;
	background: #efefef;
	counter-increment: number;
}

#entryModal .entryFlowonlineNew li::before {
	margin-right: 5px;
	margin-left: -1.6em;
	content: counter(number) ".";
}

#entryModal .entryFlowonlineNew li::after {
	display: block;
	position: absolute;
	right: 0;
	bottom: -45px;
	left: 0;
	width: 20px;
	height: 70px;
	margin-right: auto;
	margin-left: auto;
	transform: rotate(90deg);
	transform-origin: center;
	background: url(/card/common/img/aside-entry-flow-bg.jpg) no-repeat -10px center;
	content: "";
}

#entryModal .entryFlowonlineNew li.bg-blue {
	background-color: #a1d4ef;
}

#entryModal .entryFlowonlineNew li.bg-blue:after {
	background-position: right center;
}

#entryModal .entryFlowonlineNew li:first-child {
	margin-left: 0;
}

#entryModal .entryFlowonlineNew li:last-child {
	flex-grow: 2;
	padding-right: 0.6em;
}

#entryModal .entryFlowonlineNew li:last-child:after {
	display: none;
}

/* ご希望のカードを選び、次へボタンを押してください。 */

.cardEntryBtnOuter {
	margin-top: 20px;
	padding: 5.1282051282vw;
	border: 3px solid #e8e8e8;
	border-radius: 10px;
}

.cardEntryBtnList {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.cardEntryBtnListItem {
	width: 100%;
	margin-bottom: 15px;
}

.cardEntryRadioBtn {
	clip: rect(0 0 0 0);
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	white-space: nowrap;
	-webkit-clip-path: inset(50%);
	clip-path: inset(50%);
}

.cardEntryRadioLabel {
	display: flex;
	position: relative;
	align-items: center;
	width: 100%;
	height: 100%;
	padding: 15px 15px 15px 40px;
	border: 1px solid #e8e8e8;
	cursor: pointer;
	transition: background-color 0.3s ease;
}

.cardEntryRadioLabel:hover {
	background-color: #edeff0;
}

.cardEntryRadioLabel::before {
	display: block;
	position: absolute;
	top: 50%;
	left: 9px;
	width: 16px;
	height: 16px;
	margin-top: -8px;
	background: url(/card/common/img/cmn-parts.png) no-repeat -264px 0;
	content: "";
}

.cardEntryRadioBtn:checked + .cardEntryRadioLabel {
	background-color: #ffffce;
	cursor: auto;
}

.cardEntryRadioBtn:checked + .cardEntryRadioLabel::before {
	background-position: -264px -18px;
}

.cardEntryRadioLabel {
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
}

.cardEntryRadioLabel .cardEntryImg {
	display: flex;
	align-items: center;
	width: 60px;
	margin-right: 15px;
}

.cardEntryRadioLabel .cardEntryName {
	width: calc(100% - 75px);
	font-size: clamp(11px, 1.3671875vw, 14px);
}

@media (hover: hover) and (pointer: fine) {

.modalPanel_btn:hover {
	opacity: 0.7;
}

}

@media screen and (min-width: 751px) {

#entryModal .entryFlowonlineNew {
	display: flex;
	justify-content: space-between;
	margin-bottom: 10px;
}

#entryModal .entryFlowonlineNew li {
	display: flex;
	flex-grow: 1;
	align-items: center;
	margin-bottom: 0;
	margin-left: 3px;
	padding: 0.8em 20px 0.8em 2.2em;
	font-size: 0.9em;
	line-height: 1.2;
}

#entryModal .entryFlowonlineNew li::after {
	top: 0;
	right: 0;
	bottom: auto;
	left: auto;
	width: 20px;
	height: 100%;
	transform: rotate(0);
}

.cardEntryBtnOuter {
	padding: min(1.953125vw, 20px);
}

.cardEntryBtnListItem {
	width: 49%;
}

}

@media print, screen and (min-width: 751px) {

.modalPanel {
	width: 100%;
	max-width: 780px;
	margin-top: 30px;
}

.modalPanel_inner {
	padding: min(3.90625vw, 40px);
}

.modalPanel_btn {
	top: -50px;
	width: 40px;
	height: 40px;
}

.cardIntroduce {
	font-size: clamp(12px, 1.5625vw, 16px);
}

.separate {
	padding: min(7.8125vw, 80px) 0;
}

.borderFrame {
	padding: min(6.54296875vw, 67px) min(8.49609375vw, 87px);
	border-radius: 20px;
}

.borderFrame + .borderFrame {
	margin-top: min(3.90625vw, 40px);
}

.numberingTitle {
	min-height: min(5.6640625vw, 58px);
	margin-bottom: min(2.9296875vw, 30px);
	padding-left: min(9.5703125vw, 98px);
	font-size: clamp(23px, 3.125vw, 32px);
}

.numberingTitle_num {
	top: max(-0.9765625vw, -10px);
	width: min(6.640625vw, 68px);
	height: min(6.640625vw, 68px);
	padding: min(2.1484375vw, 22px) 0;
}

.text {
	font-size: clamp(13px, 1.7578125vw, 18px);
}

.subTxt {
	font-size: clamp(11px, 1.3671875vw, 14px);
}

.strongTxt {
	font-size: clamp(21px, 2.734375vw, 28px);
}

.pcAdjustPt20 {
	padding-top: min(1.953125vw, 20px);
}

.pcAdjustPb20 {
	padding-bottom: min(1.953125vw, 20px);
}

.toggleUnit_btn {
	padding: min(3.3203125vw, 34px) 0 min(3.125vw, 32px);
	border-width: 4px;
	font-size: clamp(19px, 2.5390625vw, 26px);
}

.toggleUnit_btn::after {
	left: calc(100% - min(6.4453125vw, 66px));
	width: min(3.90625vw, 40px);
	padding-top: min(3.90625vw, 40px);
	background-size: cover;
}

.toggleUnit_body {
	padding: min(5.859375vw, 60px) 0;
}

.pageHead {
	padding: min(7.8125vw, 80px) 0;
}

.pageHead_lead {
	margin-bottom: min(0.9765625vw, 10px);
	font-size: clamp(23px, 3.125vw, 32px);
	font-size: clamp(19px, 2.5390625vw, 26px);
}

.pageHead_card {
	width: min(36.1328125vw, 370px);
	margin: min(2.9296875vw, 30px) auto min(2.9296875vw, 30px);
}

.pageHead_img {
	border-radius: min(1.5625vw, 16px);
	box-shadow: 8px 16px 30px 0 rgba(0, 0, 0, 0.16);
}

.pageHead_logo {
	width: min(23.4375vw, 240px);
}

.pageHead_title {
	font-size: clamp(37px, 4.8828125vw, 50px);
}

.pageHead_btnHolder {
	margin-top: min(3.90625vw, 40px);
	padding: 0;
}

.pageLead {
	font-size: clamp(19px, 2.5390625vw, 26px);
}

.introduce_head {
	width: auto;
	margin-bottom: min(2.9296875vw, 30px);
}

.features_card {
	width: min(16.50390625vw, 169px);
	margin-bottom: min(4.19921875vw, 43px);
}

.features_title {
	line-height: 1.6;
}

.features_card-szM {
	width: 1.9em;
	margin: 0 9px 0 1px;
	vertical-align: sub;
}

.features_card-szS {
	width: 2.56em;
	margin: 0 3px;
}

.features_division {
	margin-bottom: min(2.9296875vw, 30px);
}

.features_img {
	margin: min(1.953125vw, 20px) auto;
}

.features_txtLogo {
	width: min(13.76953125vw, 141px);
}

.catchNote_primary {
	font-size: clamp(23px, 3.125vw, 32px);
}

.catchNote_balloon {
	width: min(48.828125vw, 500px);
	margin: min(2.05078125vw, 21px) auto 0;
	padding: min(1.7578125vw, 18px) 0 min(1.26953125vw, 13px);
	border-radius: 16px;
	font-size: clamp(12px, 1.5625vw, 16px);
}

.catchNote_balloon::before,
.catchNote_balloon::after {
	top: clamp(-11px, -1.07421875vw, -8px);
	border-width: 0 min(0.87890625vw, 9px) min(1.07421875vw, 11px) min(0.87890625vw, 9px);
}

.catchNote_em {
	font-size: clamp(18px, 2.34375vw, 24px);
}

.stepList {
	display: grid;
	justify-content: center;
}

.stepList_item::before {
	width: min(19.53125vw, 200px);
	height: min(19.53125vw, 200px);
	margin-left: min(0.9765625vw, 10px);
}

.stepList_item:not(:first-child) {
	margin-top: min(1.953125vw, 20px);
}

.stepNote {
	width: min(25.390625vw, 260px);
	margin-left: min(0.9765625vw, 10px);
	font-size: clamp(21px, 2.734375vw, 28px);
}

.stepNote_num {
	width: min(12.109375vw, 124px);
	margin: min(1.46484375vw, 15px) 0;
	padding: min(1.46484375vw, 15px) 0 min(1.07421875vw, 11px);
	font-size: clamp(18px, 2.34375vw, 24px);
}

.cardDetail {
	padding: min(7.8125vw, 80px) 0;
}

.cardDetail_division + .cardDetail_division {
	margin-top: min(4.8828125vw, 50px);
}

.cardDetailTable th {
	padding: min(1.07421875vw, 11px) min(1.953125vw, 20px);
	font-size: clamp(11px, 1.3671875vw, 14px);
}

.cardDetailTable td {
	padding: min(2.44140625vw, 25px) min(1.953125vw, 20px) min(3.22265625vw, 33px);
	font-size: clamp(12px, 1.5625vw, 16px);
	line-height: 2;
}

.cardDetailLogos {
	margin: min(0.5859375vw, 6px) 0;
}

.cardDetailLogos_item {
	margin: 0 min(1.46484375vw, 15px);
}

[class^=cardDetailLogo-] {
	padding: 0 min(0.5859375vw, 6px);
}

.cardDetailLogo-jcb {
	width: min(4.4921875vw, 46px);
}

.cardDetailLogo-suica {
	width: min(12.3046875vw, 126px);
}

.cardDetailLogo-jrepoint,
.cardDetailLogo-viewcard {
	width: min(4.8828125vw, 50px);
}

.cardDetailLogo-bic {
	width: min(4.8828125vw, 50px);
}

.cardDetailLogo-contactless {
	width: min(2.44140625vw, 25px);
}

.cardDetailBadge {
	padding: min(0.5859375vw, 6px) min(0.9765625vw, 10px);
	font-size: clamp(12px, 1.5625vw, 16px);
}

.cardDetailNotice {
	margin-top: min(2.1484375vw, 22px);
}

.cardDetailNotice_item {
	padding-left: 1.5em;
	font-size: clamp(12px, 1.5625vw, 16px);
	line-height: 1.7;
}

.cardDetailNotice_item::before {
	font-size: clamp(10px, 0.9765625vw, 10px);
}

.limited {
	padding: min(7.8125vw, 80px) min(6.0546875vw, 62px);
}

.limited_title {
	margin: min(3.90625vw, 40px) 0 min(1.953125vw, 20px);
	font-size: clamp(23px, 3.125vw, 32px);
}

.campaignArea {
	padding: min(7.8125vw, 80px) 0;
}

.campaignArea_title {
	margin-bottom: min(1.953125vw, 20px);
	font-size: clamp(23px, 3.125vw, 32px);
}

.cardsUsefulUse {
	padding: min(7.8125vw, 80px) 0;
}

.cardsUsefulUse::before {
	background-image: url(/card/shared/img/background_pc.jpg);
}

.cardsUsefulUse_card {
	width: min(14.6484375vw, 150px);
	margin: max(-0.9765625vw, -10px) auto min(2.9296875vw, 30px);
}

.usefulUseList {
	padding: 0;
}

.usefulUseList_item {
	width: 33.3333333333%;
	font-size: clamp(13px, 1.7578125vw, 18px);
	line-height: 1.4;
}

.usefulUseList_item:nth-of-type(n+4) {
	margin-top: min(1.953125vw, 20px);
}

.usefulUseList .viewcardLimitTag {
	width: 29.5%;
	margin-bottom: 0.5em;
}

.usefulUseImg {
	width: 50%;
	margin-bottom: 0.3em;
}

}

@media only screen and (max-width: 750px) {

.spAdjustPr20 {
	padding-right: 5.1282051282vw;
}

.spAdjustPl20 {
	padding-left: 5.1282051282vw;
}

.spFlowEntry {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 3.8461538462vw 3.8461538462vw 7.6923076923vw;
	background: #fff;
}

.spFlowEntry_btn {
	display: block;
	position: relative;
	padding: 1.2820512821vw 9.2307692308vw 3.0769230769vw 16.6666666667vw;
	font-size: clamp(14px, 4.358974359vw, 33px);
	line-height: 1.3;
}

.spFlowEntry_btn::before {
	display: block;
	position: absolute;
	top: 50%;
	left: 15.1282051282vw;
	width: 10.2564102564vw;
	padding-top: 6.4102564103vw;
	transform: translateY(-50%);
	border-radius: 2px;
	background: url(/card/shared/img/img_card_viewgoldplus.jpg) no-repeat 50% 50%;
	background-size: cover;
	content: "";
}

.usefulUseList_item:nth-of-type(n+3) {
	margin-top: 8.4615384615vw;
}

.cardDetail_spParagraph {
	margin-top: 1em;
}

.cardDetail_spParagraph > * {
	margin-top: 0.5em;
}

}

@keyframes fadeOut {

0% {
	opacity: 1;
}

100% {
	opacity: 0;
}

}

@keyframes fadeIn {

0% {
	opacity: 0;
}

100% {
	opacity: 1;
}

}





#entryModal h2.chapterHeading {
	margin-bottom: 7.6923076923vw;
	font-size: clamp(15px, 4.6153846154vw, 35px);
	font-weight: 600;
	line-height: 1.4;
	color: #222;
	text-align: left;
}

#entryModal h2.chapterHeading::after {
	display: block;
	width: 100%;
	height: 3px;
	margin-top: 3.3333333333vw;
	background: linear-gradient(to right, #0075c2 0%, #0075c2 18.6%, #e8e8e8 18.6%, #e8e8e8 100%);
	content: "";
}

@media print, screen and (min-width: 751px) {
	#entryModal h2.chapterHeading {
    margin-bottom: min(3.90625vw, 40px);
    font-size: clamp(18px, 2.34375vw, 24px);
  }

	#entryModal h2.chapterHeading::after {
    margin-top: min(1.26953125vw, 13px);
    background: linear-gradient(to right, #0075c2 0%, #0075c2 13.3%, #e8e8e8 13.3%, #e8e8e8 100%);
	}
}



#main h3.sectionHeading {
	margin-bottom: 5.1282051282vw;
	font-size: clamp(13px, 4.1025641026vw, 31px);
	font-weight: 600;
	line-height: 1.6;
	text-align: left;
}

#main h3.sectionHeading::after {
	display: block;
	width: 100%;
	height: 1px;
	margin-top: 3.0769230769vw;
	background: #e8e8e8;
	content: "";
}

@media print, screen and (min-width: 751px) {
	#main h3.sectionHeading {
		margin-bottom: min(2.9296875vw, 30px);
		font-size: clamp(13px, 1.7578125vw, 18px);
	}

	#main h3.sectionHeading::after {
    margin-top: min(1.46484375vw, 15px);
	}
}


#modalPanel .division {
	text-align: left;
}

#modalPanel p {
	text-align: left;
}

#modalPanel p.u-txtR {
	text-align: right;
}

#modalPanel .singleBtn,
#entryModal .singleBtn {
	background: #222;
	border-color: #222;
	color: #fff;
	text-decoration: none;
}

#modalPanel .cardEntryName {
	text-align: left;
}

@media (hover: hover) and (pointer: fine) {
  #modalPanel .singleBtn:hover,
	#entryModal .singleBtn:hover {
    background: #555;
  }
}

/* カードのお届けまでの矢羽根 */

#entryModal .entryFlowonlineNew {
	margin-top: 20px;
	display: block;
}

#entryModal .entryFlowonlineNew li {
	display: flex;
	position: relative;
	align-items: center;
	justify-content: center;
	margin-bottom: 20px;
	padding: 5px;
	background: #efefef;
	counter-increment: number;
}

#entryModal .entryFlowonlineNew li::before {
	margin-right: 5px;
	margin-left: -1.6em;
	content: counter(number) ".";
}

#entryModal .entryFlowonlineNew li::after {
	display: block;
	position: absolute;
	right: 0;
	bottom: -45px;
	left: 0;
	width: 20px;
	height: 70px;
	margin-right: auto;
	margin-left: auto;
	transform: rotate(90deg);
	transform-origin: center;
	background: url(/card/common/img/aside-entry-flow-bg.jpg) no-repeat -10px center;
	content: "";
}

#entryModal .entryFlowonlineNew li.bg-blue {
	background-color: #a1d4ef;
}

#entryModal .entryFlowonlineNew li.bg-blue:after {
	background-position: right center;
}

#entryModal .entryFlowonlineNew li:first-child {
	margin-left: 0;
}

#entryModal .entryFlowonlineNew li:last-child {
	flex-grow: 2;
	padding-right: 0.6em;
}

#entryModal .entryFlowonlineNew li:last-child:after {
	display: none;
}


@media screen and (min-width: 751px) {

	#entryModal .entryFlowonlineNew {
		display: flex;
		justify-content: space-between;
		margin-bottom: 10px;
	}
	
	#entryModal .entryFlowonlineNew li {
		display: flex;
		flex-grow: 1;
		align-items: center;
		margin-bottom: 0;
		margin-left: 3px;
		padding: 0.8em 20px 0.8em 2.2em;
		font-size: 0.9em;
		line-height: 1.2;
	}
	
	#entryModal .entryFlowonlineNew li::after {
		top: 0;
		right: 0;
		bottom: auto;
		left: auto;
		width: 20px;
		height: 100%;
		transform: rotate(0);
	}
}



/* ヘッダーとフッターのフォントを新デザインのものに合わせる ************************/
/* -----------------------------------------
  fontを読み込み
----------------------------------------- */
/* Regular */
@font-face {
  font-family: "Noto Sans JP";
  src: url("/card/shared/font/notosansjp-regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
}
/* Medium */
@font-face {
  font-family: "Noto Sans JP";
  src: url("/card/shared/font/notosansjp-medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
}
/* Bold */
@font-face {
  font-family: "Montserrat";
  src: url("/card/shared/font/montserrat-bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: "Noto Sans JP";
  src: url("/card/shared/font/notosansjp-bold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: "Noto Sans JP";
  src: url("/card/shared/font/notosansjp-bold.woff") format("woff");
  font-weight: 700;
  font-style: normal;
}
/* Black */
@font-face {
  font-family: "Noto Sans JP";
  src: url("/card/shared/font/notosansjp-black.woff") format("woff");
  font-weight: 900;
  font-style: normal;
}

body #header,
body #footer {
	font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", Helvetica, Arial, sans-serif !important;
}









/* 新デザインモーダルウィンドウCSSを移植 **********************/

.compartment-border {
  border: 1px solid #e8e8e8;
}

/* 小部屋
------------------------------ */
.compartment-border, .compartment-alert, .compartment-c03, .compartment-c02, .compartment {
  padding: 5.1282051282vw;
  border-radius: 10px;
  overflow-wrap: anywhere;
}
@media print, screen and (min-width: 751px) {
  .compartment-border, .compartment-alert, .compartment-c03, .compartment-c02, .compartment {
    padding: min(1.953125vw, 20px);
  }
}


/* grid */
@media only screen and (max-width: 750px) {
  .gridLyt_col:not(:first-child) {
    margin-top: 5.1282051282vw;
  }
}
@media print, screen and (min-width: 751px) {
  .gridLyt {
    display: flex;
    flex-wrap: wrap;
  }
  .gridLyt_col {
    width: min(37.109375vw, 380px);
    width: 48.7179487179%;
  }
  .gridLyt_col:nth-of-type(odd) {
    margin-right: min(2.5641025641%, 20px);
  }
  .gridLyt_col:nth-of-type(n+3) {
    margin-top: min(2.9296875vw, 30px);
  }
}


/* メインとサブ */
.contrastLyt {
  display: flex;
  flex-direction: column-reverse;
  row-gap: min(5.1282051282vw, 20px);
}
.contrastLyt_primary {
  font-size: clamp(13px, 4.1025641026vw, 31px);
  line-height: 1.8;
}
@media only screen and (max-width: 750px) {
  .contrastLyt_secondary {
    margin: auto;
  }
  .contrastLyt .lytSp-t {
    order: 2;
  }
}
@media print, screen and (min-width: 751px) {
  .contrastLyt {
    flex-direction: row;
    column-gap: min(3.90625vw, 40px);
  }
  .contrastLyt_primary {
    flex: 1;
    font-size: clamp(12px, 1.5625vw, 16px);
  }
  .contrastLyt .lytPc-r {
    order: 2;
  }
}


/* 仕分け */
.division {
  margin: 5.1282051282vw 0;
}
.division-szM {
  margin: 7.6923076923vw 0;
}
.division-szL {
  margin: 12.8205128205vw 0;
}
@media print, screen and (min-width: 751px) {
  .division {
    margin: min(2.9296875vw, 30px) 0;
  }
  .division-szM {
    margin: min(3.90625vw, 40px) 0;
  }
  .division-szL {
    margin: min(5.859375vw, 60px) 0;
  }
}




/* テキストリンク */
.textLink {
  display: inline-block;
  font-weight: 500;
  color: #0075c2;
  text-decoration: underline;
  text-indent: 0;
  overflow-wrap: anywhere;
}
@media (hover: hover) and (pointer: fine) {
  .textLink:hover {
    text-decoration: none;
  }
}

.textLinkIco-arw::before {
  display: inline-block;
  width: 2.5641025641vw;
  height: 2.5641025641vw;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%3Crect%20width%3D%228%22%20height%3D%228%22%20fill%3D%22none%22%2F%3E%3Cpath%20d%3D%22M9623-908.5a.5.5%2C0%2C0%2C1-.395-.193.5.5%2C0%2C0%2C1%2C.088-.7l3.992-3.105-3.992-3.105a.5.5%2C0%2C0%2C1-.088-.7.5.5%2C0%2C0%2C1%2C.7-.088l4.5%2C3.5a.5.5%2C0%2C0%2C1%2C.193.395.5.5%2C0%2C0%2C1-.193.395l-4.5%2C3.5A.5.5%2C0%2C0%2C1%2C9623-908.5Z%22%20transform%3D%22translate(-9621%20916.5)%22%20fill%3D%22%230075C2%22%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: cover;
  content: "";
}

.textLinkIco-blank::before {
  display: inline-block;
  width: 2.0512820513vw;
  height: 2.0512820513vw;
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%3Cpath%20d%3D%22M7.428%2C8H2.857a.573.573%2C0%2C0%2C1-.572-.572V5.714H.571A.572.572%2C0%2C0%2C1%2C0%2C5.143V.571A.572.572%2C0%2C0%2C1%2C.571%2C0H5.143a.572.572%2C0%2C0%2C1%2C.571.571V2.285H7.428A.573.573%2C0%2C0%2C1%2C8%2C2.857V7.428A.573.573%2C0%2C0%2C1%2C7.428%2C8Zm-4-2.286V6.857H6.857V3.429H5.714V5.143a.572.572%2C0%2C0%2C1-.571.571ZM1.143%2C1.143V4.571H4.571V1.143Z%22%20fill%3D%22%230075C2%22%2F%3E%3C%2Fsvg%3E");
  background-size: 2.0512820513vw auto;
  background-size: auto 100%;
  content: "";
}

.textLinkIco-question::before {
  display: inline-block;
  width: 5.1282051282vw;
  height: 5.1282051282vw;
  background: url(/card/shared/img/icon_question.svg) no-repeat 50% 50%;
  background-size: cover;
  content: "";
}

.textLinkIco-pdf::before {
  display: inline-block;
  width: 5.1282051282vw;
  height: 5.1282051282vw;
  background: url(/card/shared/img/icon_pdf.svg) no-repeat 50% 0;
  background-size: auto 100%;
  content: "";
}

.textLinkIco-arw::before {
  margin-right: 1.5384615385vw;
}
.textLinkIco-blank::before {
  margin: 0 0.2em;
}
.textLinkIco-anchor {
  position: relative;
  padding-left: 3.5897435897vw;
}
.textLinkIco-anchor::before {
  position: absolute;
  top: 0.55em;
  left: 0;
  transform: rotate(90deg);
}
.textLinkIco-pdf, .textLinkIco-question {
  position: relative;
  padding-left: 6.6666666667vw;
}
.textLinkIco-pdf::before, .textLinkIco-question::before {
  position: absolute;
  top: 0.2em;
  left: 0;
}
@media print, screen and (min-width: 751px) {
  .textLinkIco-arw::before {
    width: min(0.9765625vw, 10px);
    height: min(0.9765625vw, 10px);
    margin-right: min(0.5859375vw, 6px);
  }
  .textLinkIco-blank::before {
    width: min(0.78125vw, 8px);
    height: min(0.78125vw, 8px);
    margin-right: min(0.5859375vw, 6px);
  }
  .textLinkIco-anchor {
    padding-left: min(1.5625vw, 16px);
  }
  .textLinkIco-anchor::before {
    width: min(0.9765625vw, 10px);
    height: min(0.9765625vw, 10px);
  }
  .textLinkIco-pdf, .textLinkIco-question {
    padding-left: clamp(22px, 1.57em, 25px);
  }
  .textLinkIco-pdf::before, .textLinkIco-question::before {
    width: clamp(18px, 1.25em, 20px);
    height: clamp(18px, 1.25em, 20px);
  }
}


/* ボタン
------------------------------ */
/* 角丸単体 */
.singleBtn-c02, .singleBtn {
  display: inline-block;
  width: 100%;
  padding: 3.0769230769vw 9.2307692308vw 3.0769230769vw 5.1282051282vw;
  border: 1px solid;
  border-radius: 9999px;
  box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.25);
  text-align: center;
  font-size: clamp(13px, 4.1025641026vw, 31px);
  font-weight: 500;
  line-height: 1.6;
  transition: background-color 0.3s ease;
  position: relative;
}
.singleBtn-c02::after, .singleBtn::after {
  position: absolute;
  top: 50%;
  right: 3.8461538462vw;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  transform: translateY(-50%);
  display: block;
  width: 3.5897435897vw;
  height: 3.5897435897vw;
  background-size: cover;
  content: "";
}
[target=_blank].singleBtn-c02::after, [target=_blank].singleBtn::after {
  background-size: 3.0769230769vw auto;
}
@media print, screen and (min-width: 751px) {
  .singleBtn-c02, .singleBtn {
    padding: min(1.26953125vw, 13px) min(5.37109375vw, 55px) min(1.3671875vw, 14px) min(2.734375vw, 28px);
    font-size: clamp(15px, 1.953125vw, 20px);
  }
  .singleBtn-c02::after, .singleBtn::after {
    right: min(1.953125vw, 20px);
    width: min(1.7578125vw, 18px);
    height: min(1.7578125vw, 18px);
    background-position: 50% 50%;
  }
  [target=_blank].singleBtn-c02::after, [target=_blank].singleBtn::after {
    background-size: min(1.171875vw, 12px) auto;
  }
}

@media print, screen and (min-width: 751px) {
  .singleBtnHolder_item {
    display: inline-block;
    min-width: min(36.1328125vw, 370px);
  }
}

.singleBtn {
  background: #222;
  border-color: #222;
  color: #fff;
}
.singleBtn::after {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M8%2C1%2C8%2C0A8%2C8%2C0%2C1%2C1%2C0%2C8%2C8%2C8%2C0%2C0%2C1%2C8%2C0Z%22%20fill%3D%22%23fff%22%2F%3E%3Cpath%20d%3D%22M9623-910.25a.5.5%2C0%2C0%2C1-.4-.193.5.5%2C0%2C0%2C1%2C.089-.7l2.866-2.23-2.866-2.23a.5.5%2C0%2C0%2C1-.089-.7.5.5%2C0%2C0%2C1%2C.7-.088l3.375%2C2.625a.5.5%2C0%2C0%2C1%2C.192.395.5.5%2C0%2C0%2C1-.192.395l-3.375%2C2.625A.507.507%2C0%2C0%2C1%2C9623-910.25Z%22%20transform%3D%22translate(-9616.498%20921.375)%22%20fill%3D%22%23222%22%2F%3E%3C%2Fsvg%3E");
}
.singleBtn[target=_blank]::after {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%228%22%20height%3D%228%22%20viewBox%3D%220%200%208%208%22%3E%3Cpath%20d%3D%22M7.428%2C8H2.857a.573.573%2C0%2C0%2C1-.572-.572V5.714H.571A.572.572%2C0%2C0%2C1%2C0%2C5.143V.571A.572.572%2C0%2C0%2C1%2C.571%2C0H5.143a.572.572%2C0%2C0%2C1%2C.571.571V2.285H7.428A.573.573%2C0%2C0%2C1%2C8%2C2.857V7.428A.573.573%2C0%2C0%2C1%2C7.428%2C8Zm-4-2.286V6.857H6.857V3.429H5.714V5.143a.572.572%2C0%2C0%2C1-.571.571ZM1.143%2C1.143V4.571H4.571V1.143Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fsvg%3E");
}
@media (hover: hover) and (pointer: fine) {
  .singleBtn:hover {
    background: #555;
  }
}
.singleBtn-c02 {
  background: #fff;
  color: #222;
}
.singleBtn-c02::after {
  background-image: url(/card/shared/img/icon_circle_arrow.svg);
}
.singleBtn-c02[target=_blank]::after {
  background-image: url(/card/shared/img/icon_blank.svg);
}
@media (hover: hover) and (pointer: fine) {
  .singleBtn-c02:hover {
    background: #edeff0;
  }
}

.singleBtn.ico-posL,
.singleBtn-c02.ico-posL {
  padding-right: 5.1282051282vw;
  padding-left: 9.2307692308vw;
}
.singleBtn.ico-posL::after,
.singleBtn-c02.ico-posL::after {
  left: 3.8461538462vw;
}
@media print, screen and (min-width: 751px) {
  .singleBtn.ico-posL,
  .singleBtn-c02.ico-posL {
    padding-right: min(2.734375vw, 28px);
    padding-left: min(5.37109375vw, 55px);
  }
  .singleBtn.ico-posL::after,
  .singleBtn-c02.ico-posL::after {
    left: min(1.953125vw, 20px);
  }
}



/* マージン */
.u-mt20 {
	margin-top: 20px !important;
}

.u-mt30 {
	margin-top: 30px !important;
}



/* 上に戻る（新デザインのもの） */
.pagetopBtn {
  opacity: 0;
  position: fixed;
  bottom: 10px;
  z-index: 9999;
  right: 2.5641025641vw;
  width: 10.2564102564vw;
  height: 10.2564102564vw;
  border: 1px solid #222;
  border-radius: 50%;
  background: url(/card/shared/img/icon_arrow.svg) no-repeat 50% 50% #fff;
  background-size: 3.0769230769vw auto;
  transform: rotateZ(-90deg);
  transition: opacity 0.3s ease;
}
.pagetopBtn > * {
  display: block;
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
}
@media print, screen and (min-width: 751px) {
  .pagetopBtn {
    right: min(2.9296875vw, 30px);
    bottom: 50px;
    width: min(5.46875vw, 56px);
    height: min(5.46875vw, 56px);
    background-size: min(1.46484375vw, 15px) auto;
  }
}
.pagetopBtn.is-show {
  opacity: 1;
  cursor: pointer;
  transition: opacity 0.3s ease;
}
@media (hover: hover) and (pointer: fine) {
  .pagetopBtn.is-show:hover {
    opacity: 0.7;
  }
}
