/* ------------------------------------- */
/* Reset */
/* ------------------------------------- */
* {
	font-size:100%;
}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
	padding: 0;
	margin: 0;
	font-weight:normal;
}
img {
	border:none;
	vertical-align: bottom;
}
li {
	list-style: none;
}
p,li,dt,dd,td,th,h1,h2,h3,h4,h5,h6{
	line-height: 1.75;
}
a {
	color: #0075C2;
	outline:0;
	cursor:pointer;
	text-decoration: none;
}
/* ------------------------------------- */
/* Layout */
/* ------------------------------------- */
html {
	overflow-y: scroll;
	position:relative;
}
body {
	text-align:left;
	font-family:"Noto Sans JP", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:14px;
	background-color:#ffffff;
	color:#333333;
	min-width:1000px;
	-webkit-text-size-adjust: 100%;
}
@media all and (-ms-high-contrast: none) {
  body {
	  font-family: "メイリオ", Meiryo, sans-serif; 
  } 
}
.serif{
	font-family:'ヒラギノ明朝 Pro W3','Hiragino Mincho Pro W3','ＭＳ Ｐ明朝',serif;
}
.number{
	font-family:'Helvetica','Arial';
	letter-spacing:0.03em;
	font-weight:bold;
}
.font_roboto{
	font-family: "Roboto";
}
.bold {
	font-weight:bold;
}
/* ------------------------------------- */
/* Utilities */
/* ------------------------------------- */
.clearfix:after,
#content_inner:after {
	content:"";
	display:block;
	clear: both;
}
.clearfix,
#content_inner {
	display: inline-block;
	zoom:1;
}
/* no ie mac \*/
* html .clearfix,
* html #content_inner {
	height: 1%;
}
.clearfix,
#content_inner {
	display: block;
}
#container{
	position: relative;
	min-height: 100vh;
	padding-bottom: 130px;/*←footerの高さ*/
	box-sizing: border-box;/*←全て含めてmin-height:100vhに*/
}
#header,
#header_inner,
#content,
#content_inner,
#side,
#side_inner,
#main,
#main_inner,
#footer,
#footer_inner{
	position: relative;
	width:100%;
}
#header_inner,
#footer_inner,
#content_inner{
	max-width: 1420px;
	min-width:1000px;
	margin:0 auto;
	padding: 0 10px;
	box-sizing: border-box;
}
/* ------------------------------------- */
/* layout Thin_Wide */
/* ------------------------------------- */
.layout_tw #side {
	float: left;
	width: 21.5%;
	margin-right: 2.5%;
}
.layout_tw #main {
	float: left;
	width: 76%;
}
/* ------------------------------------- */
/* header */
/* ------------------------------------- */
#header{
	background-color:#fff;
	border-bottom: 1px solid #EBEDF2;
	position: fixed;
	z-index: 20;
}
#header_inner{
	width: 100%;
	height: 70px;
	display: table;
	vertical-align: middle;
}
/* ------------------------------------- */
/* header_left */
/* ------------------------------------- */
#header .header_left_wrapper{
	display: table-cell;
	vertical-align: middle;
	text-align: left;
}
#header .header_left{
	display: inline-block;
}
#header .header_left .header_logo{
	display: inline-block;
	width: 112px;
	height: 32px;
	vertical-align: middle;
}
#header .header_left .last_login{
	display: inline-block;
	margin-left: 20px;
	vertical-align: middle;
	font-size: 12px;
	color: #A8AFBF;
}
#header .header_left .last_login span{
	padding-left: 5px;
}
/* ------------------------------------- */
/* header_right */
/* ------------------------------------- */
#header .header_right_wrapper{
	display: table-cell;
	vertical-align: middle;
	text-align: right;
}
#header .header_right{
	display: inline-block;
}
#header .header_right .header_member_state_wrapper{
	display: table-cell;
	vertical-align: middle;
}
#header .header_right .header_member_state{
	border-right: 1px solid #EBEDF2;
}
#header .header_right .header_member_state .header_mybitcash,
#header .header_right .header_member_state .header_mycoin,
#header .header_right .header_member_state .header_mymenu{
	display: inline-block;
	vertical-align: middle;
	padding: 0 10px;
}
#header .header_right .header_member_state .header_mybitcash,
#header .header_right .header_member_state .header_mycoin,
#header .header_right .header_member_state .header_mymenu{
	background-color: #FFF;
	border-radius: 50px;
	margin-right: 10px;
}
#header .header_right .header_member_state .header_mybitcash:hover,
#header .header_right .header_member_state .header_mycoin:hover,
#header .header_right .header_member_state .header_mymenu:hover{
	background-color: #F2F4F7;
	border-radius: 50px;
}
#header .header_right .header_member_state .header_mybitcash p,
#header .header_right .header_member_state .header_mycoin p,
#header .header_right .header_member_state .header_mymenu p{
	position: relative;
	display: table-cell;
	height: 40px;
	vertical-align: middle;
}
#header .header_right .header_member_state .header_mybitcash p,
#header .header_right .header_member_state .header_mycoin p{
	font-size: 10px;
}
#header .header_right .header_member_state .header_mybitcash p span{
	font-size: 14px;
	color: #00388B;
	font-weight: bold;
	vertical-align: middle;
}
#header .header_right .header_member_state .header_mycoin p span{
	font-size: 14px;
	color: #E85298;
	font-weight: bold;
	vertical-align: middle;
}
#header .header_right .header_member_state .header_mymenu p{
	font-size: 14px;
}
#header .header_right .header_member_state .header_mybitcash p img{
	width: 14px;
	height: 16px;
	vertical-align: middle;
	margin-right: 5px;
}
#header .header_right .header_member_state .header_mycoin p img{
	width: 16px;
	vertical-align: middle;
	margin-right: 5px;
}
#header .header_right .header_member_state .header_mymenu p:before{
	font-family: 'Font Awesome 6 Pro';
	content: '\f007';
	font-weight: 400;
	vertical-align: middle;
	font-size: 20px;
	line-height: 1;
	margin-right: 5px;
}
#header .header_right .header_member_state .header_mybitcash p:after,
#header .header_right .header_member_state .header_mycoin p:after,
#header .header_right .header_member_state .header_mymenu p:after{
	font-family: 'Font Awesome 6 Pro';
	content: '\f107';
	font-weight: 400;
	vertical-align: middle;
	font-size: 20px;
	line-height: 1;
	margin-left: 5px;
}
/* ------------------------------------- */
/* 通知アイコン */
/* ------------------------------------- */
#header .header_right .notification{
	display: table-cell;
	vertical-align: middle;
	padding: 0 20px;
}
#header .header_right .notification .notification_icon{
	position: relative;
	line-height: 1;
	font-size: 24px;
}
#header .header_right .notification_new .notification_icon .notification_bell{
	animation-name: notification_new_bell;
	animation-duration: 2s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}
@keyframes notification_new_bell{
	0%{
		transform: rotate(0deg);
	}
	25%{
		transform: rotate(30deg);
	}
	75%{
		transform: rotate(-30deg);
	}
	100%{
		transform: rotate(0deg);
	}
}
#header .header_right .notification .notification_icon .notification_new_icon{
	display: none;
}
#header .header_right .notification_new .notification_icon .notification_new_icon{
	display: block;
	position: absolute;
	top: 0;
	left: 15px;
	background: #E62E8B;
	height: 8px;
	width: 8px;
	border-radius: 100%;
}
#header .header_right .notification_new .notification_icon .notification_new_icon:before{
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	background: #E62E8B;
	height: 8px;
	width: 8px;
	border-radius: 100%;
	animation-name: notification_new_icon;
	animation-duration: 1.5s;
	animation-iteration-count: infinite;
	animation-timing-function:ease-in-out;
}
@keyframes notification_new_icon{
	0%{
		transform: scale(1);
		opacity:1;
	}
	100%{
		transform: scale(3);
		opacity:0;
	}
}
/* ------------------------------------- */
/* お知らせ通知用　dropdwn */
/* ------------------------------------- */
.dropdwn_notification{
	width: 400px;
	box-sizing: border-box;
	padding: 0;
}
.dropdwn_notification .no_notification{
	text-align: center;
	color: #A8AFBF;
	font-size: 12px;
	padding: 30px 20px;
}
.dropdwn_notification .notification_list{
	text-align: left;
	font-size: 14px;
	color: #333;
	max-height: 440px;
	overflow-y: auto;
}
.dropdwn_notification .notification_list a{
	display: block;
	padding: 15px 20px;
	color: #333;
	text-decoration: none;
}
.dropdwn_notification .notification_list a:hover{
	color: #333;
	text-decoration: none;
	background-color: #F2F4F7;
}
.dropdwn_notification .notification_list dl dt{
	font-size: 12px;
	color: #A8AFBF;
	padding: 5px 20px;
	background-color: #F7F8FA;
	border-bottom: 1px solid #EBEDF2;
}
.notification_list .notification_date{
	text-align: right;
	font-size: 10px;
	color: #A8AFBF;
}
/* ------------------------------------- */
/* header_right_links */
/* ------------------------------------- */
#header .header_right_wrapper .header_right_links{
	color: #333;
	font-size: 14px;
}
#header .header_right_wrapper .header_right_links a{
	color: #333;
	text-decoration: none; 
}
#header .header_right_wrapper .header_right_links a:hover{
	text-decoration: underline;
}
#header .header_right_wrapper .header_right_links li{
	display: inline-block;
	margin-left: 30px
}
#header .header_right_wrapper .header_right_links .header_button_register{
	margin-left: 10px
}
#header .header_right_wrapper .header_right_links .header_button_login a,
#header .header_right_wrapper .header_right_links .header_button_register a{
	display: inline-block;
	width:100px;
	height: 38px;
	line-height: 38px;
	font-size: 12px;
	font-weight: normal;
	text-decoration: none;
	text-align: center;
	border-radius: 100px;
	transition: 0.2s ease-in-out;
}
#header .header_right_wrapper .header_right_links .header_button_login a:hover,
#header .header_right_wrapper .header_right_links .header_button_register a:hover{
	opacity: 0.7;
	filter: alpha(opacity=70);
}
#header .header_right_wrapper .header_right_links .header_button_login a{
	background-color: transparent;
	color: #00388B;
	border: 1px solid #00388b;
}
#header .header_right_wrapper .header_right_links .header_button_register a{
	background-color: #00388B;
	color: #fff;
	border: 1px solid #00388b;
}
/* ------------------------------------- */
/* content */
/* ------------------------------------- */
#content {
	padding-top: 70px;
}
#content_inner {
	width: 100%;
}
/* ------------------------------------- */
/* js無効の場合の枠 */
/* ------------------------------------- */
.no_jsblock{
	padding-top: 70px;
}
.no_jsblock .no_js_text{
	margin: 100px 0 60px;
	font-size: 30px;
	text-align: center;
}
.no_jsblock .no_js_text span{
	font-weight: bold;
}
/* ------------------------------------- */
/* js有効の場合の枠 */
/* ------------------------------------- */
.jsblock{
	display: none;
}
/* ------------------------------------- */
/* side */
/* ------------------------------------- */
#side #side_inner{
	margin: 30px 0 40px;
}
#side .grade{
	background-position: left top;
	background-repeat:no-repeat;
	background-size: 42px 48px;
	position: relative;
	margin-bottom: 10px;
	padding-bottom: 20px;
	border-bottom: 1px solid #DCDFE6;
	padding-left: 50px;
}
.bronze #side .grade{
	background-image:url(/material/members/common/images/icon/grade_bronze.svg);
}
.silver #side .grade{
	background-image:url(/material/members/common/images/icon/grade_silver.svg);
}
.gold #side .grade{
	background-image:url(/material/members/common/images/icon/grade_gold.svg);
}
.platinum #side .grade{
	background-image:url(/material/members/common/images/icon/grade_platinum.svg);
}
.diamond #side .grade{
	background-image:url(/material/members/common/images/icon/grade_diamond.svg);
}
.premium #side .grade{
	background-image:url(/material/members/common/images/icon/grade_premium.svg);
}
#side .grade .question_icon{
	position: absolute;
	top: 0;
	right: 0;
}
#side .grade .user_grade{
	font-size: 12px;
}
#side .grade .user_grade span{
	font-size: 14px;
	font-weight: bold;;
	margin-left: 2px;
}
#side .grade .grade_exp_bar{
	background: #CACFD9;
	width: 100%;
	margin: 10px auto;
	border-radius: 6px;
}
#side .grade .grade_exp_bar .exp_bar{
	background: #6CBB5A;
	height: 10px;
	margin: 10px 0;
	animation-name: exp_bar_anime;
	animation-duration: 1s;
	animation-iteration-count: 1;
	animation-timing-function: ease;
	border-radius: 6px;
}
@keyframes exp_bar_anime {
  0% {
	width: 0px;
  }
}
#side .grade .grade_exp{
	font-size: 12px;
}
#side .grade .grade_exp span{
	font-size: 14px;
	font-weight: bold;
	padding: 0 2px;
}
#side .side_navi{
	padding: 0;
}
#side .side_navi ul{
	padding: 10px 0;
	border-bottom: 1px solid #DCDFE6;
}
#side .side_navi ul:first-of-type{
	padding-top: 0;
}
#side .side_navi ul:last-of-type{
	border-bottom: none;
}
#side .side_navi ul li{
	margin-bottom: 4px;
	line-height: 1.5;
}
#side .side_navi ul li:last-child{
	margin-bottom: 0;
}
#side .side_navi ul li a{
	position: relative;
	display: block;
	width: 100%;
	padding: 10px 0 10px 40px;
	font-size: 14px;
	color: #333;
	vertical-align: middle;
	box-sizing: border-box;
	border-radius: 50px;
}
#side .side_navi ul li a i{
	position: absolute;
	height: 22px;
	width: 22px;
	margin: auto 0;
	top: 0;
	bottom: 0;
	left: 12px;
	font-size: 20px;
	line-height: 1;
	text-align: center;
}
#side .side_navi ul li a:hover{
	background-color: #CEECFB;
	color: #00388B;
}
#side .side_navi ul li .side_navi_act,
#side .side_navi ul li .side_navi_act:hover{
	background-color: #CEECFB;
	color: #00388B;
	font-weight: bold;
}
#side .side_navi ul li .side_navi_act i,
#side .side_navi ul li .side_navi_act:hover i{
	font-weight: normal;
}
#side .side_banner{
	margin-top: 20px;
	text-align: center;
	padding: 0 10px;
}
#side .side_banner img{
	width: 100%;
	border-radius: 16px;
}
#side .side_navi .badge{
	display: inline-block;
	background-color: #E85298;
	position: absolute;
	top: 10px;
	right: 10px;
	color: #fff;
	font-size: 11px;
	line-height: 1.5;
	padding: 2px 7px;
	border-radius: 30px;
	margin-left: 5px;
	vertical-align: middle;
	z-index: 1;
}
/* main */
#main_inner{
	margin: 30px 0 60px;
}
/* footer */
#footer{
	position: absolute;
	bottom: 0;
	background-color: #fff;
	border-top: 1px solid #EBEDF2;
}
#footer .footer_inner{
	padding-top:30px;
	padding-bottom:30px;
	font-size: 11px;
	text-align: center;
}
#footer .links li{
	display: inline-block;
	padding: 0 10px;	
	line-height: 24px;
}
#footer .links li a{
	color:#333333;
	text-decoration:none;
}
#footer .links li a:hover{
	color:#333333;
	text-decoration:underline;
}
#footer .copy{
	margin-top: 20px;
}
#footer .footer_nomenu .copy{
	margin-top: 0;
}
#footer .copy p{
	line-height: 24px;
}
#footer .sns_links{
	float: right;
}
#footer .sns_links ul li{
	display: inline-block;
	text-align: left;
	margin-left: 10px;
}
#footer .sns_links ul li i{
	font-size: 24px;
	color: #B8BECC;
	line-height: 24px;
}
#footer .sv{
	height:5px;
	text-align:right;
	overflow:hidden;
}
#footer .sv img{
	vertical-align: top;
}
.page_title{
	font-size:32px;
	font-weight: 500;
	margin-bottom: 30px;
	position: relative;
}
.page_title a{
	font-weight: normal;
	margin-left: 5px;
	color: #CACFD9;
}
.page_body{
	background-color: #fff;
	padding: 40px 40px 40px;
	border-radius: 16px;
	min-width: 774px;
	box-sizing: border-box;
	border: 1px solid #DCDFE6;
}
.section_title{
	width: 100%;
	font-size:18px;
	font-weight: bold;
	margin-bottom: 20px;
	position: relative;
}
.section_title a{
	display:block;
	position:absolute;
	right: 0;
	top: -5px;
	font-weight: normal;
}
.page_title_summary{
	font-size:14px;
	margin-bottom: 25px;
}
/* prohibitLink */
body.prohibitLink #header .member .service_menu li.reward ,
body.prohibitLink #recommend,
body.prohibitLink .campaign_information_head,
body.prohibitLink #container .pbl{
	display:none;
}
/* ------------------------------------- */
/* dropdwn */
/* ------------------------------------- */
.dropdwn{
	position: relative;
	cursor: pointer;
}
.dropdwn .dropdwn_area{
	background-color: #fff;
	display: none;
	position: absolute;
	top: 100%;
	right: 0;
	text-align: left;
	font-size: 14px;
	box-shadow: 0 8px 32px rgba(126, 136, 156, 0.35);
	z-index: 100;
	cursor: default;
	border-radius: 24px;
	overflow: hidden;
}
.dropdwn .dropdwn_list{
	width: 240px;
}
.dropdwn .dropdwn_list li{
	font-size: 14px;
	color: #333333;
}
.dropdwn .dropdwn_area .dropdwn_list li:first-child,
.dropdwn .dropdwn_area .dropdwn_list li:first-child a{
	border-radius: 24px 24px 0 0;
}
.dropdwn .dropdwn_area .dropdwn_list li:last-child,
.dropdwn .dropdwn_area .dropdwn_list li:last-child a,
.dropdwn .dropdwn_area .dropdwn_list li:last-child .dropdwn_nolink{
	border-radius: 0 0 24px 24px;
}
.dropdwn .dropdwn_area .dropdwn_list li a,
.dropdwn .dropdwn_area .dropdwn_list li .dropdwn_nolink{
	display: block;
	color: #333333;
	padding: 20px;
	text-decoration: none;
	cursor: pointer;
}
.dropdwn .dropdwn_area .dropdwn_list li a:hover,
.dropdwn .dropdwn_area .dropdwn_list li .dropdwn_nolink:hover{
	color: #333333;
	text-decoration: none;
	background-color: #F2F4F7;
}
.dropdwn .dropdwn_area .dropdwn_list .dropdwn_nolink_first{
	background-color: #F7F8FA;
	padding: 20px;
	border-bottom: 1px solid #EBEDF2;
	font-size: 12px;
}
.dropdwn .dropdwn_area .dropdwn_list .dropdwn_nolink_first dl{
	display: table;
	width: 100%;
}
.dropdwn .dropdwn_area .dropdwn_list .dropdwn_nolink_first dt{
	display: table-cell;
	color: #A8AFBF;
	vertical-align: middle;
}
.dropdwn .dropdwn_area .dropdwn_list .dropdwn_nolink_first dd{
	display: table-cell;
	color: #333333;	
	vertical-align: middle;
}
.dropdwn .dropdwn_area .dropdwn_list .dropdwn_nolink_left{
	text-align: left;
}
.dropdwn .dropdwn_area .dropdwn_list .dropdwn_nolink_right{
	text-align: right;
}
.dropdwn .dropdwn_area .dropdwn_list .dropdwn_icon_new{
	display: inline-block;
	background-color: #E85298;
	color: #fff;
	font-size: 10px;
	line-height: 1.5;
	padding: 4px 6px;
	border-radius: 20px;
	margin-left: 5px;
	vertical-align: middle;
}
/* ------------------------------------- */
/* ツールチップアイコン */
/* ------------------------------------- */
.question_icon{
	font-size: 20px;
	color: #CACFD9;
	line-height: 1;
	font-weight: normal;
}
/* ------------------------------------- */
/* ツールチップ上 */
/* ------------------------------------- */
.tooltip_top {
	position: relative;
	display: inline-block;
	cursor: default;
}
.tooltip_text {
	background-color: #545E73;
	position: absolute;
	bottom: 120%;
	left: 50%;
	transform: translate(-50%,0);
	visibility: hidden;
	width: auto;
	min-width: 170px;
	padding: 8px 10px;
	transition: 0.2s ease-in-out;
	text-align: left;
	opacity: 0;
	color: #fff;
	font-size: 12px;
	line-height: 1.75;
	border-radius: 6px;
	z-index: 10;
	box-sizing: border-box;
	font-family:"Noto Sans JP", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.tooltip_text::after {
	position: absolute;
	top: 100%;
	left: 50%;
	margin-left: -5px;
	content: ' ';
	border: 5px solid transparent;
	border-top-color: #545E73;
}
.tooltip_top:hover .tooltip_text {
	visibility: visible;
	opacity: 1;
	transition: 0.2s ease-in-out;
}
.tooltip_text a{
	color: #fff;
	text-decoration: underline;
}
/* ------------------------------------- */
/* ツールチップ下 */
/* ------------------------------------- */
.tooltip_bottom {
	position: relative;
	display: inline-block;
	cursor: default;
}
.tooltip_bottom .tooltip_text {
	top: 120%;
	bottom: auto;
}
.tooltip_bottom .tooltip_text::after {
	top: auto;
	bottom: 100%;
	border-top-color: transparent;
	border-bottom-color: #545E73;
}
.tooltip_bottom:hover .tooltip_text {
	visibility: visible;
	opacity: 1;
	transition: 0.2s ease-in-out;
}
/* ------------------------------------- */
/* モーダル */
/* ------------------------------------- */
.modal_open{
	cursor: pointer;
}
.modal_area{
	display: none;
	position: fixed;
	z-index: 2000;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
}
.modal_wrapper{
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.6);
}
.modal_block{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	max-width: 600px;
	height: auto;
}
.modal_cont{
	background-color: #fff;
	border-radius: 10px;	
	max-height: 100%;	
	border: solid #fff;
	border-width: 60px 20px 40px 20px;
	overflow-y: auto;
	padding: 0 20px;
	box-sizing: border-box;
}
.modal_body{
	position: relative;
}
.close_modal_icon{
	display: block;
	position:absolute;
	top: 20px;
	right: 20px;
	width: 20px;
	height: 20px;
	cursor: pointer;
}
.close_modal_icon span::before,
.close_modal_icon span::after {
	display: block;
	content: "";
	position: absolute;
	top: 0;
	left: 9px;
	width: 2px;
	height: 20px;
	background: #333;
}
.close_modal_icon span::before {
  transform: rotate(-45deg);
}
.close_modal_icon span::after {
  transform: rotate(45deg);
}
/* ------------------------------------- */
/* pickup_info */
/* ------------------------------------- */
.pickup_info img{
	vertical-align: middle;
	margin-right: 8px;
	height: 36px;
}
.pickup_info a{
	display: block;
	padding: 0 15px;
	text-decoration: none;
	text-align: center;
	font-size: 15px;
	line-height: 58px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
/* ------------------------------------- */
/* ヘッダーお知らせ背景色ピンク */
/* ------------------------------------- */
.info_bg_pink{
	background-color: #E85298;
}
.info_bg_pink a{
	color: #fff;
}
/* ------------------------------------- */
/* ヘッダーお知らせ背景ダークブルー */
/* ------------------------------------- */
.info_bg_darkblue{
	background-color: #00388B;
}
.info_bg_darkblue a{
	color: #fff;
}
/* ------------------------------------- */
/* ヘッダーお知らせ背景ブルー */
/* ------------------------------------- */
.info_bg_blue{
	background-color: #0075C2;
}
.info_bg_blue a{
	color: #333;
}
/* ------------------------------------- */
/* ヘッダーお知らせ背景水色 */
/* ------------------------------------- */
.info_bg_skyblue{
	background-color: #9FD9F6;
}
.info_bg_skyblue a{
	color: #333;
}
/* ------------------------------------- */
/* ヘッダーお知らせ背景グリーン */
/* ------------------------------------- */
.info_bg_green{
	background-color: #6CBB5A;
}
.info_bg_green a{
	color: #fff;
}
/* ------------------------------------- */
/* ヘッダーお知らせ背景色レッド */
/* ------------------------------------- */
.info_bg_red{
	background-color: #E8374A;
}
.info_bg_red a{
	color: #fff;
}
/* ------------------------------------- */
/* ヘッダーお知らせ背景色オレンジ */
/* ------------------------------------- */
.info_bg_orange{
	background-color: #F08437;
}
.info_bg_orange a{
	color: #fff;
}
/* ------------------------------------- */
/* ヘッダーお知らせ背景イエロー */
/* ------------------------------------- */
.info_bg_yellow{
	background-color: #FFE53F;
}
.info_bg_yellow a{
	color: #333;
}
/* ------------------------------------- */
/* ヘッダーお知らせ背景グレー */
/* ------------------------------------- */
.info_bg_gray{
	background-color: #CACFD9;
}
.info_bg_gray a{
	color: #333;
}
/* ------------------------------------- */
/* ヘッダーお知らせ背景ブラック */
/* ------------------------------------- */
.info_bg_black{
	background-color: #323947;
}
.info_bg_black a{
	color: #fff;
}
/* ------------------------------------- */
/* message_info */
/* ------------------------------------- */
.notice_area{
	margin-bottom: 40px;
}
/* ------------------------------------- */
/* message_info */
/* ------------------------------------- */
.message_info{
	background-color: #EBEDF2;
	margin-bottom: 5px;
	padding: 10px 40px;
	box-sizing: border-box;
	border-radius: 50px;
}
.message_info li{
	text-align: center;
	font-size: 14px;
	color: #333;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.message_info a{
	color: #333;
	text-decoration: none;
}
.message_info a:hover{
	color: #333;
	text-decoration: underline;
}
/* ------------------------------------- */
/* message_info　スライダー */
/* ------------------------------------- */
.message_info_slider .slick-prev:before {
	font-family: 'Font Awesome 6 Pro';
	content: "\f0d9";
	font-weight: 900;
	vertical-align: middle;
	font-size: 18px;
	line-height: 1;
	color: #333;
}
.message_info_slider .slick-next:before {
	font-family: 'Font Awesome 6 Pro';
	content: "\f0da";
	font-weight: 900;
	vertical-align: middle;
	font-size: 18px;
	line-height: 1;
	color: #333;
}
.message_info_slider .slick-prev:before,
.message_info_slider .slick-next:before{	
	opacity: 1;
	filter: alpha(opacity=100);
}
/* ------------------------------------- */
/* 共通お知らせ枠 */
/* ------------------------------------- */
.common_info{
	margin-bottom: 5px;
}
.common_info li{
	background-color: #fff;
	width: 100%;
	padding: 10px 40px;
	box-sizing: border-box;
	border-radius: 50px;
	text-align: center;
	font-size: 14px;
	color: #333;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	margin-bottom: 5px;
}
.common_info li:last-child{
	margin-bottom: 0;
}
.common_info a{
	color: #333;
	text-decoration: none;
}
.common_info a:hover{
	color: #333;
	text-decoration: underline;
}
.common_info .important_info{
	background-color: #FFE6E7;
	color: #E8374A;
	
}
.common_info .important_info a{
	color: #E8374A;
}
.common_info .important_info a:hover{
	color: #E8374A;
}
/* ------------------------------------- */
/* 手続き中案内枠 */
/* ------------------------------------- */
.payment_process_info p{
	background-color: #FFE53F;
	width: 100%;
	padding: 10px 40px;
	box-sizing: border-box;
	border-radius: 50px;
	text-align: center;
	font-size: 14px;
	color: #333;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	margin-bottom: 5px;
}
.payment_process_info a{
	color: #333;
	text-decoration: none;
}
.payment_process_info a:hover{
	color: #333;
	text-decoration: underline;
}
/* ------------------------------------- */
/* 共通お知らせテキスト枠 */
/* ------------------------------------- */
.common_info_text{
	margin-bottom: 40px;
}
.common_info_text li{
	background-color: #EBEDF2;
	width: 100%;
	padding: 10px 20px;
	box-sizing: border-box;
	border-radius: 8px;
	text-align: left;
	font-size: 14px;
	color: #333;
}
.common_info_text li:last-child{
	margin-bottom: 0;
}
/* ------------------------------------- */
/* 共通お知らせ用通知アイコン */
/* ------------------------------------- */
.new_arrival_icon,
.important_info_icon,
.notice_info_icon,
.maintenance_info_icon,
.campaign_info_icon,
.unpaid_info_icon{
	display: inline-block;
	color: #fff;
	font-size: 10px;
	line-height: 1.5;
	padding: 4px 8px;
	border-radius: 30px;
	margin-right: 5px;
	vertical-align: middle;
}
.new_arrival_icon{
	background-color: #FFE2F0;
	color: #E85298;
}
.important_info_icon{
	background-color: #E8374A;
}
.notice_info_icon{
	background-color: #0075C2;
}
.maintenance_info_icon{
	background-color: #6CBB5A;
}
.campaign_info_icon{
	background-color: #E85298;
}
.unpaid_info_icon{
	background-color: #E85298;
}
/* ------------------------------------- */
/* チャージキャンペーンお知らせ*/
/* ------------------------------------- */
.charge_campaign_info{
	margin-top: 20px;
}
.charge_campaign_info li{
	position: relative;
	background-color: #fff;
	width: 100%;
	border: 1px solid #E85298;
	box-sizing: border-box;
	border-radius: 50px;
	text-align: left;
	font-size: 14px;
	color: #E85298;
	margin-bottom: 10px;
}
.charge_campaign_info li i {
	position: absolute;
	height: 24px;
	width: 24px;
	margin: auto 0;
	top: 0;
	bottom: 0;
	left: 15px;
	font-size: 24px;
	line-height: 1;
}
.charge_campaign_info li a:after{
	font-family: 'Font Awesome 6 Pro';
	content: "\f105";
	font-weight: 900;
	font-size: 20px;
	height: 20px;
	width: 20px;
	margin: auto 0;
	line-height: 1;
	color: #E85298;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 4px;
}
.charge_campaign_info li:last-child{
	margin-bottom: 0;
}
.charge_campaign_info a{
	display: block;
	color: #E85298;
	padding: 7px 20px 7px 45px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.charge_campaign_info a:hover{
	color: #E85298;
	background-color: #fff4f9;
	border-radius: 50px;
}
/* ------------------------------------- */
/* プロモーション枠*/
/* ------------------------------------- */
.promotion_info{
	background-color: #EBEDF2;
	background-repeat: no-repeat;
	background-position: right bottom;
	width: 100%;
	box-sizing: border-box;
	font-size: 14px;
	border-radius: 16px;
	word-break: break-all;
}
.promotion_info a{
	display: block;
	color: #333;
	padding: 30px;
	min-height: 210px;
	box-sizing: border-box;
}
.promotion_info .promotion_ttl{
	font-size: 22px;
	line-height: 1.5;
	font-weight: bold;
	width: 50%;
}
.promotion_info .promotion_try{
	font-size: 14px;
	line-height: 1.5;
	width: 50%;
}
.promotion_info .btn_promotion{
	background-color: #E85298;
	color: #fff;
	display:inline-block;
	padding: 0 20px;
	font-size: 14px;
	line-height: 40px;
	text-align: center;
	text-decoration: none;
	border-radius: 100px;
	transition: 0.2s ease-in-out;
	margin-top: 15px;
}
.promotion_info .btn_promotion:hover{
	opacity: 0.7;
	filter: alpha(opacity=70);
	text-decoration: none;
}
/* ------------------------------------- */
/* プロモーション枠(バナー)*/
/* ------------------------------------- */
.promotion_bnr img{
	width: 100%;
}
/* ------------------------------------- */
/* プロモーション枠(selectshop)*/
/* ------------------------------------- */
.promotion_info.promotion_info_selectshop{
	background-color: #000;
	background-image: url(/material/members/common/images/promotion/PC/img_promo-selectshop.jpg);
}
.promotion_info.promotion_info_selectshop a{
	color: #fff;
}
.promotion_info.promotion_info_selectshop .promotion_ttl{
	position: relative;
}
.promotion_info.promotion_info_selectshop .promotion_ttl:before {
	font-family: 'Font Awesome 6 Pro';
	content: '\f54e';
	font-weight: 400;
	vertical-align: bottom;
	font-size: 20px;
	font-weight: normal;
	line-height: 1.5;
	margin-right: 10px;
}
.promotion_info.promotion_info_selectshop .btn_promotion{
	background-color: #fff;
	color: #333;
}
/* ------------------------------------- */
/* notice_info */
/* ------------------------------------- */
.notice_info{
	background-color: #fff6f6;
	width: 100%;
	margin-bottom: 30px;
	padding: 20px 40px;
	border: solid 1px #E8374A;
	box-sizing: border-box;
	border-radius: 4px;
	text-align: left;
	font-size: 16px;;
	color: #E8374A;
}
.notice_info a{
	color: #E8374A;
	text-decoration: none;
}
.notice_info a:hover{
	color: #E8374A;
	text-decoration: underline;
}
.notice_info i {
	display: inline-block;
	margin-right: 5px;
}