@charset "utf-8";
/* au携帯電話をお持ちでない方 --------------------------------- */
#other #contents { max-width: 720px; }

#contents h2.ttl_r1 {
  position: relative; 
  margin: 0 auto 20px;
  padding: 0.5em 0.8em; 
  color: white !important;
  border-left: none !important;
  background: #eb5505;
  background-image: repeating-linear-gradient(-45deg,#eb6605, #eb6605 6px,#eb5505 0, #eb5505 12px) !important; 
}
#contents h2.ttl_r1::before {
  position: absolute;
  content: '';
  top: 100%;
  left: 0px;
  border: none;
  border-bottom: solid 10px transparent;
  border-right: solid 15px rgb(227, 166, 134);
}

/* テキストエリア（デフォルトでliにdisc付けない） */
.area_txt2 {
  margin-bottom: 20px;
  padding: 5px 10px;
}

/* メリット　*/
.area_merit {
  display: block;
	margin: 20px auto;
	list-style: none;
}
.area_merit li {
	display: block; 
  width: auto; 
	margin: 10px auto;
	vertical-align: top;
}
.area_merit li img {
  width: 70%; 
  max-width: 100%; 
  padding-bottom: 20px;
}

/* アプリのダウンロード　*/
dl.app_info { 
  display: block; 
  width: 100%; 
  height: auto;
	margin: 20px 0;
}
.app_info dt { 
  float: left; 
  width: 70%; 
	margin: 0 2% 0 0; 
  text-align: left;
}
.app_info.fr_r dt {
  float: right;
  margin: 0 0 0 2%;
}
.app_info dd {
  width: 28%; 
	margin: 0;
  float: right;
  text-align: left;
}
.app_info dt img, 
.app_info dd img {
	width: auto;
	max-width: 100%; 
  margin: 0 auto;
}
.app_info dd strong {
	color: #eb5505;
	font-weight: normal;
}
.app_info dd .line_space {
	margin-bottom: 10px;
}
dl.app_info:after {
	content: "."; 
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

/* お支払い方法　*/
.area_method {
  display: block; 
	margin: 0 auto 20px;
	list-style: none; 
}
.area_method li {
  display: block; 
  width: 100%; 
  margin: 0; 
  padding: 0;  
  vertical-align: top; 
}
.area_method li img {
  width: 100%; 
  max-width: 100%; 
}
.area_method:after {
	content: "."; 
	display: block;
	clear: both;
	height: 0; 
	visibility: hidden;
}

/* 背景色　*/
.bg_00 {
  color: #ffffff !important;
  background-color: #eb5505; 
  background-image: repeating-linear-gradient(-45deg,#eb6605, #eb6605 6px,#eb5505 0, #eb5505 12px); 
}

/* タブ --------------------------------- */
/*タブ切り替え全体のスタイル*/
.tabs {
  margin-top: 50px;
  padding-bottom: 40px;
  background-color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  width: 100%;
  margin: 0 auto;
}
/*タブのスタイル*/
.tab_item {
	display : -webkit-box;	/* old Android	*/
	display : -webkit-flex;	/* Safari etc	*/
	display : -ms-flexbox;	/* IE10		*/
	display	: flex;
	
	justify-content	: center;
	
	-webkit-align-items: center;	/* Safari etc	*/
	-ms-align-items    : center;	/* IE10		*/
	align-items        : center;
	
	width		: calc(100%/3);
	height		: 50px;
	float		: left;
	
	border-bottom	: 3px solid #EB5505;
	background-color: #d9d9d9;
	
	line-height	: 1.4;
	text-align	: center;
	color		: #565656;
	font-weight	: bold;
	
	transition	: all 0.2s ease;
}
.tab_item:hover {
	opacity: 0.75;
}
/*ラジオボタンを全て消す*/
input[name="tab_item"] {
	display: none;
}
/*タブ切り替えの中身のスタイル*/
.tab_content {
	display: none;
	padding: 10px 10px 0;
	clear: both;
	overflow: hidden;
}
/*選択されているタブのコンテンツのみを表示*/
#start:checked ~ #start_content, 
#charge:checked ~ #charge_content, 
#method:checked ~ #method_content {
	display: block;
}
/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
	background-color: #EB5505;
	color: #fff;
}

/* PC */
@media (min-width : 501px )
{
	.sp		{ display:none; }
}

/* SP */
@media (min-width : 1px ) and (max-width : 500px )
{
	.pc		{ display:none; }
}