@charset "utf-8";

/* ------------------------------
   スタイルシート　共通
------------------------------ */
*{
	margin:0;
	padding:0;
	font-family:Roboto,arial,sans-serif,Tahoma, "Droid Sans","メイリオ","Meiryo","Osaka－等幅","MS PGothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN";
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	overflow:hidden;
}

span{
	overflow:hidden!important;
}

header {
	/* Layout Properties */
	/* display: flex; */
	margin: 0 auto;
	top: 0px;
	left: 0px;
	position: fixed;
	/* max-width: 1920px;
	height: 40px; */
	width: 100%;
	height: 70px;
	/* UI Properties */
	background: #FFFFFF 0% 0% no-repeat padding-box;
	opacity: 1;
	/* padding: 15px; */
	z-index: 2;
}

header .header-img {
	/* Layout Properties */
	top: 18px;
	left: 48px;
	width: 130px;
	height: 34px;
/* 	top: calc(18/1024*100vw);
	left: calc(48/1024*100vw);
	width: calc(104/1024*100vw);
	height: calc(27.2/1024*100vw); */
	/* UI Properties */
	background: transparent url('../ximages/header_logo_putmenu.png') 0% 0% no-repeat padding-box;
	opacity: 1;
	position: fixed;
	z-index: 3;
}

header .text_beta {
	/* Layout Properties */
	top: 24px;
	left: 192px;
	width: 75px;
	height: 20px;
	/* top: calc(15/1024*100vw);
	left: calc(178/1024*100vw);
	width: calc(43/1024*100vw);
	height: calc(24/1024*100vw); */
	/* UI Properties */
	text-align: left;
	/* font: normal normal normal 16px/24px Hiragino Kaku Gothic ProN; */
	font: normal normal normal 16px/24px Hiragino Kaku Gothic ProN;	
	letter-spacing: 0px;
	color: #3E3A39;
	opacity: 1;
	position: fixed;
	z-index: 3;
}

header .navigation {
	/* Layout Properties */
	top: 24px;
	/* top: calc(19.2/1024*100vw); */
	/* left: 1497px; */	
	right: 20px;
	width: 520px;
	/* right: calc(20/1024*100vw);
	width: calc(520/1024*100vw); */
	/* width: 373px; */
	height: 20px;
	/* height: calc(24/1024*100vw); */
	opacity: 1;
	position:fixed;
	display: flex;
	flex-direction: column;
	z-index: 4;
}

header .navigation.open {
	transform: translateX(0%);
	width: 100%;
	background-color: #FFFFFF;
	left: 0;
}

header .Toggle {
    display: block;
    position: fixed;    /* bodyに対しての絶対位置指定 */
    width: 30px;
    height: 22px;
    cursor: pointer;
    z-index: 3;
	top:25px;
    right:24px;
}

header .Toggle span {
    display: block;
    position: absolute;
    width: 30px;
    border-bottom: solid 2px #5D3000;
    -webkit-transition: .35s ease-in-out;	/*変化の速度を指定*/
    -moz-transition: .35s ease-in-out;		/*変化の速度を指定*/
    transition: .35s ease-in-out;			/*変化の速度を指定*/
 
}

/*各ボーダー少しずつずらす*/
header .Toggle span:nth-child(1) {
    top:0px;
}
header .Toggle span:nth-child(2) {
    top: 10px;
}
header .Toggle span:nth-child(3) {
    top: 20px;
}
header .Toggle.active span:nth-child(1) {
    top: 10px;
}

header .Toggle.active span:nth-child(1) {
    top: 10px;
/* 1番目のspanをマイナス45度に */
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

/* 2番目と3番目のspanを45度に */
header .Toggle.active span:nth-child(2),
header .Toggle.active span:nth-child(3) {
    top: 10px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
}

header nav ul {
	margin: 0;
	padding: 0;
	padding-left: 2%;
}

header nav ul li {
		/* Layout Properties */
	list-style: none;
	display: inline-block;
	padding-top: 0;
	padding-bottom: 0;
	padding-left: 1em;
	padding-right: 1em;
	width: auto;
}

header nav ul li a{
	list-style: none;
	display: inline-block;
	padding-left: 1em;
	padding-right: 1em;
	/* li Properties */
	text-align: right;
	/* font: normal normal normal 16px/24px Hiragino Kaku Gothic ProN; */
	font: normal normal normal 16px/24px Hiragino Kaku Gothic ProN;
	letter-spacing: 0px;
	color: #3E3A39;
}

header nav li:not(:last-child) {
    /* UI Properties */
	border-right:2px solid #ddd;
}

header .sregi-btn {
	/* Layout Properties */
	display: block;
	margin: 1em;
	/* padding: 1em;	 */
	width: calc(100vw/375*340);;
	left: 2%;
    /* UI Properties */
	border-radius: 10px;
	background-color: #ff8811;	
	color: #FFFFFF;
	font-weight: bold;
	text-align: center;
}

footer {
	/* Layout Properties */
	/* top: 4943px; */
	left: 0px;
	/* width: 1920px; */
	width: 100%;
	height: 125px;
	/* UI Properties */
	background: #FFFFFF 0% 0% no-repeat padding-box;
	opacity: 1;
	position: absolute;
}

footer .navigation {
	color: #3E3A39;
	text-align: center;
	/* font: normal normal normal 16px/24px Hiragino Kaku Gothic ProN; */
	font: normal normal normal 16px/24px Hiragino Kaku Gothic ProN;
	letter-spacing: 0px;
	opacity: 1;
}

footer nav ul li {
	list-style: none;
	display: inline-block;
	padding-left: 1em;
	padding-right: 1em;
}

footer nav ul li a{
	color: #5d3000;
}

footer nav li:not(:last-child) {
	border-right:2px solid #3E3A39;
}

body {
	-webkit-text-size-adjust: 100%;
	padding:0;
    /* A-142 (レスポンシブ）開始 */
	/* margin:0; */
	margin-top: 70px;
    /* A-142 (レスポンシブ）開始 */
	background:#ffffff;
}

a {
	outline:0;
	text-decoration: none;
}

input[type="text"]:focus {
  outline: 0;
}
textarea:focus {
  outline: 0;
}

option:disabled{
	color:#cccccc;
}

.debugpane{
	position:absolute;
/*	width:480px;
	height:173px;*/
	display:block;
	float:left;
	left:0px;
	background:red;
	filter:alpha(opacity=10);
	-moz-opacity: 0.1;
	opacity: 0.1;
	z-index:-1;
}

/* ------------------------------
   スタイルシート　共通
------------------------------ */


img{
	border:0;
	/* 画像下の余計な余白を消す */
	vertical-align: bottom;
	font-size:0px;
	line-height:0px;
}

div.space{
	display:inline-block;
	border:0px;
	padding:0px;
	margin:0px;
	overflow:hidden;

}

div.chk{
	display:inline-block;
	text-align:right;
/*	font-size: 40px;
	line-height:40px;
	height:80px;
	*/

	cursor:pointer;
	z-index:0;
/*	text-indent:90px;*/
/*	padding-top:20px;*/
}

div.nbtn3 div,div.nbtn5 div,div.nbtn6 div,div.nbtn7 div{
float:left;
	display:table;
	width:100%;
	height:100%;
	text-align:center;
/*	white-space: nowrap;*/
/*	word-wrap: break-word;*/
/*	background:red;*/
	vertical-align: middle;

	cursor:pointer;
	z-index:0;
	position:relative;
}

div.nbtn5 p,div.nbtn6 p,div.nbtn7 p,div.nbtn3  p{
	display:table-cell;
	vertical-align: middle;
/*	background:blue;*/
}


div.nbtn{
	display:inline-block;
	text-align:center;
	text-decoration:none;
	border:0px solid #888;
	white-space: nowrap;
	word-wrap: break-word;
	cursor:pointer;
	z-index:0;
	vertical-align:middle;
}

div.nbtn2{
	display:inline-block;
	text-align:center;
	text-decoration:none;
	border:0px solid #888;
	white-space: nowrap;
	word-wrap: break-word;
	cursor:pointer;
	z-index:0;
	vertical-align:middle;
}


div.nbtn2_n{
	color: white!important;
	background: -webkit-gradient(linear,left top, left bottom, from(#F9911F), to(#Fa7C1D));
	background: -webkit-linear-gradient(top, #F9911F, #Fa7C1D);
	background: -moz-linear-gradient(top, #F9911F, #Fa7C1D);
	background: -mz-linear-gradient(top, #F9911F, #Fa7C1D);
	background: -o-linear-gradient(top, #F9911F, #Fa7C1D);
	background: linear-gradient(to bottom, #F9911F, #Fa7C1D);
}

input.boxround{
	border-color:#CCCCCC;
	border-style:solid;
	white-space: nowrap;
	word-wrap: break-word;
}

div.login_text_bar{
	display:inline-block;

/*	width:848px;*/
	font-size: 0px;
	line-height:0px;
	background:white;
	/*
	height:134px;
	*/
}

div.login_text_bar div.login_text_in{
 	display:inline-block;

/*	width:848px;*/
	font-size: 0px;
	line-height:0px;
	background:#FFFFFF;
	/*
	height:46px;
	*/
}

div.login_text_bar div.login_text_in_bar{
	display:inline-block;
/*	width:848px;*/
	float:left;
	font-size: 0px;
	line-height:0px;
	background:#CDCAC7;
	/*
	height:4px;
	*/
}

.err{
/*
	font-size:44px;
	height:44px;
	*/
	color:#FF0000;
}

/* A-189（noscript 対応）レイアウト調整 */
.error_message,
.unsupported_message {
	display: none;
}

.noscript {
	text-align: center;
	margin: 10px auto;
	font-size: 1.5rem;
}
/* A-189（noscript 対応）レイアウト調整終了 */

div.line{
	background:#E7E7E7;
}

div.menu_list{
	display:inline-block;
}


.ui-sortable-helper {
    background-color: red;
    color: #003399;
}

div.text_headline_main {
	/* UI Properties */
	text-align: left;
	font: normal normal normal 30px/45px Hiragino Kaku Gothic ProN;
	letter-spacing: 0px;
	color: #333333;
	opacity: 1;
	font-weight: bold;
}

h1 {
	font-size: 30px;
	text-align: center;
}

div.text_headline_sub, div.text_headline_sub_large, div.text_headline_sub_large2 {  /* A-151対応 */
	/* UI Properties */
	text-align: center;
	font: normal normal normal 30px/45px Hiragino Kaku Gothic ProN;
	letter-spacing: 0px;
	color: #333333;
	opacity: 1;
	font-weight: bold;
}

div.text_headline_sub_smal {  /* A-200対応 */
	/* UI Properties */
	text-align: center;
	font: normal normal normal 24px/40px Hiragino Kaku Gothic ProN;
	letter-spacing: 0px;
	color: #333333;
	opacity: 1;
	font-weight: bold;
}

.text_headline_sub_img01 {
    /* Layout Properties */
    width: 100%;
    height: 0;
    /* UI Properties */
    background: transparent url('../ximages/top_0yen_cost.webp') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size: contain;
    opacity: 1;
    padding-top: 46%;
}

div.text_headline_sub_img {
	/* Layout Properties */
	height: auto;
	/* UI Properties */
	text-align: center;
	font: normal normal normal 30px/45px Hiragino Kaku Gothic ProN;
	letter-spacing: 0px;
	color: #333333;
	opacity: 1;
	font-weight: bold;
}

div.single {
	width: 46%;
	margin: 0 27%;
	display: block;
}

div.single-pc {
 	width: 46%;
	margin: 0 27%;
	display: block;
}

div.single-sp {
 	width: 100%;
	margin: 0 27%;
	display: none;
}

div.text_context {
    font: normal normal normal 16px/24px Hiragino Kaku Gothic ProN;
    letter-spacing: 0px;
    color: #333333;
    opacity: 1;
}

div.text_context a {
    text-align: center;
	font: normal normal normal 16px/24px Hiragino Kaku Gothic ProN;
	letter-spacing: 0px;
	color: #FF8811;
    opacity: 1;
}

div.text_annotation {
	font: normal normal normal 14px/21px Hiragino Kaku Gothic ProN;
	letter-spacing: 0px;
	color: #333333;
	opacity: 1;
	padding-left: 1em;
	text-indent: -1em;
}

div.text_company {
	color: #5d3000;
	text-align: center;
	font: normal normal normal max(11px,calc(13/1024*100vw))/max(11px,calc(15/1024*100vw)) 'Myriad Pro', 'Hiragino Kaku Gothic ProN';
	letter-spacing: 0px;
	opacity: 1;
}

/* A-142（レスポンシブ対応） 開始*/
.aimenu-img-PC{
	width: 100%;
	height: auto;
	/* background: transparent url('../ximages/top_header_img.png') no-repeat center center;*/
}
.aimenu-img-SP{
	width: 100%;
	height: auto;
	display: none;
}

/* No.198対応　開始 */
.R25-img-PC{
	width: 100%;
	height: auto;
}
.R25-img-SP{
	width: 100%;
	height: auto;
	display: none;
}
/* No.198対応　終了 */

.pm-hd-img-PC{
	width: 100%;
	height: auto;
	/* background: transparent url('../ximages/top_header_img.png') no-repeat center center;*/
}
.pm-hd-img-SP{
	width: 100%;
	height: auto;
	display: none;
}

.pm-sreg-btn{
	/* Layout Properties */
	width: min(500px,calc(100vw/1920*700));
	height: 60px;
	/* padding: 1% 0; */
	margin-left: 56.4%;
	margin-top: 27.8%;
	position: absolute;
	/* UI Properties */
	font: normal bold normal 28px/60px Hiragino Kaku Gothic ProN;
	background: #ff8811;
	color: #ffffff;
	font-weight: bold;
	border-radius: 10px;
}

div.nbtn2{
	/* Layout Properties */
	width: 21.8% !important;	
	height: 60px !important;	
	display: block;
	margin: 0 39.1% 0;
	/* UI Properties */
	font: normal bold normal 28px/60px Hiragino Kaku Gothic ProN !important;
} 

div.headline_apeal_block{
	width: 56%;
	padding: 20px;
	margin: auto;
}

div.headline-ap1{
	/* Layout Properties */
	display: flex;
	flex-flow: row;
	width: 78.7%;
	margin: 0 21.3% 0;
}

div.headline-ap1-img{
	/* Layout Properties */
	width: 15%;		
}

div.headline-ap1-txt{
	/* Layout Properties */
	width: 52%;		
	padding: 20px;
	/* UI Properties */
	text-align: left;
}


div.headline-ap2{
	/* Layout Properties */
	display: flex;
	flex-flow: row;
	width: 78.7%;
	margin: 0 21.3% 0;
}

div.headline-ap2-img{
	/* Layout Properties */
	width: 15%;	
}

div.headline-ap2-txt{
	/* Layout Properties */
	width: 45%;		
	padding: 20px;
	/* UI Properties */
	text-align: left;
}

div.headline-ap3{
	/* Layout Properties */
	display: flex;
	flex-flow: row;
	width: 78.7%;
	margin: 0 21.3% 0;
}

div.headline-ap3-img{
	/* Layout Properties */
	width: 15%;		
}

div.headline-ap3-txt{
	/* Layout Properties */
	width: 52%;		
	padding: 20px;
	/* UI Properties */
	text-align: left;
}

/* A_No.200 プリペイドのみの利用ができることの追加 開始 */
div.headline-ap4{
	/* Layout Properties */
	display: flex;
	flex-flow: row;
	width: 78.7%;
	margin: 0 21.3% 0;
}

div.headline-ap4-img{
	/* Layout Properties */
	width: 15%;	
}

div.headline-ap4-txt{
	/* Layout Properties */
	width: 45%;		
	padding: 20px;
	/* UI Properties */
	text-align: left;
}
/* A_No.200 プリペイドのみの利用ができることの追加 終了 */

div.text_headline_apeal{
	/* UI Properties */
	text-align: left;
	font: normal normal normal 30px/45px Hiragino Kaku Gothic ProN;
	font-size: min(21px,calc(18/1024*100vw));
	font-weight: bold;
	letter-spacing: 0px;
	color: #333333;
	opacity: 1;
}

div.putmenu_prepaid_img_block{
	/* Layout Properties */
	width: 80%;	
	margin: 0 10% 0;
	display: block;
}

div.putmenu_step_img_block{
	/* Layout Properties */
	width: 50%;	
	margin: 0 25% 0;
	display: block;
}

div.carousel{
	width: 100%;
	display: none;
	flex-flow: row;
}

div.wrapper{
	position: relative;
	overflow: hidden;
}

div.slider_btn{
    /* Layout Properties */
	position: absolute;
	left: 0;
	transform: translateY(-50%);
    /* UI Properties */
	overflow: hidden;
}

div.prev_btn{
	float: left;
}

div.next_btn{
	float: right;
}

div.slider_btn div{
    /* Layout Properties */
	padding: 10px;
    /* UI Properties */
	background-color: rgba(255,255,255,0.5);
	font-size: 2rem;
	cursor: pointer;
}

div.putmenu_prepaid_logo_image{
	display: none;
}

div.pager{
    /* Layout Properties */
	height: 50px;
	line-height: 50px;
    /* UI Properties */
	font-size: 0;
	text-align: center;
	display: none;
}

div.pager div{
    /* Layout Properties */
	display: inline-block;
	margin: 0 2%;
    /* UI Properties */
	font-size: 1.5rem;
	cursor: pointer;
	color: #FF8700;
	opacity: 0.4;
}

div.pager div.current{
    /* UI Properties */
	font-size: 2rem;
	color: #FF8700;
	opacity: 1;
}

div.btn_block{
    /* Layout Properties */
	display: block;
    /* UI Properties */
	
}

div.txt_box{
    /* Layout Properties */
    width: 60%;
	margin: 0 20% 0;

}

div.headline_basic_block{
	/* Layout Properties */
	width: 54.6%;	
	margin: 0 22.7% 0;
}

div.headline_notifi_block{
	/* Layout Properties */
	width: 35.4%;	
	margin: 0 32.3% 0;
}

/* A-142対応で漏れがあった要素を追加 */
div.basic_area{
	/* Layout Properties */
	width: 80%;	
	margin: 0 10% 0;
}

div.plan_apeal{
	/* Layout Properties */
	width: 60%;	
	margin: 0 20% 0;
}

/* A-142対応で漏れがあった要素を追加 */
div.comparison{
	/* Layout Properties */
	width: 34%;	
	margin: 0 32% 0;
}

div.sys_diagram_img{
	/* Layout Properties */
	width: 100%;	
}

div.operation_flow_img{
	/* Layout Properties */
	width: 100%;	
}

div.putmenu_app_img{
	/* Layout Properties */
	width: 100%;	
}

div.regist_btn{
	/* Layout Properties */
	/* width: 20%;	 */
	width: 0;	
	margin: 0;
}
	
div.tmp_regist_scroll{
	/* Layout Properties */
	width: 70px;
	top: 364px !important;
	right: -9px;
	/* UI Properties */
}

div.tmp_regist_scroll div{
	/* Layout Properties */
	height: 360px;
	/* UI Properties */
	font-size: 19px;
	line-height: 65px;
}

.putmenu_prepaid_image {
    /* Layout Properties */
    width: 100%;
    height: 0;
    /* UI Properties */
    background: transparent url('../ximages/putmenu_prepaid_pressrelease_image_240514c.webp') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size:contain;
    opacity: 1;
    padding-top: 51.2%;
}

.putmenu_step_image {
    /* Layout Properties */
    width: 100%;
    height: 0;
    /* UI Properties */
    background: transparent url('../ximages/top_step_img.webp') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size:contain;
    opacity: 1;
    padding-top: 40.2%;
}

.top_basic_img_graph {
    /* Layout Properties */
    width: 100%;
    height: 0;
    /* UI Properties */
    background: transparent url('../ximages/top_basic_img_graph.webp?t=1') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size:cover;
    opacity: 1;
    padding-top: 51.2%;
}

.top_basic_img_push_notifi {
    /* Layout Properties */
    width: 100%; 
    height: 0;
    /* UI Properties */
    background: transparent url('../ximages/top_basic_img_push_notifi.webp') 0% 0% no-repeat padding-box;
    opacity: 1;
    background-position: center;
    background-size:cover;
    opacity: 1;
    padding-top: 51.2%;
}

.top_catchcopy_img01 {
    /* Layout Properties */
    width: 100%;
    height: 0;
    /* UI Properties */
    background: transparent url('../ximages/top_catchcopy_img01.webp') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size:cover;
    opacity: 1;
    padding-top: 100%;
}

.top_catchcopy_img02 {
    /* Layout Properties */
    width: 100%;
    height: 0;
    /* UI Properties */
    background: transparent url('../ximages/top_catchcopy_img02.webp') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size:cover;
    opacity: 1;
    padding-top: 100%;
}

.top_catchcopy_img03 {
    /* Layout Properties */
    width: 100%;
    height: 0;
    /* UI Properties */
    background: transparent url('../ximages/top_catchcopy_img03.webp') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size:cover;
    opacity: 1;
    padding-top: 100%;
}

.top_catchcopy_img04 {
    /* Layout Properties */
    width: 100%;
    height: calc(284/1920*100vw);
    /* UI Properties */
    background: transparent url('../ximages/top_catchcopy_img04.webp') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size: 100% auto;
    opacity: 1;
    padding-top: 0;
}

.putmenu_prepaid_image {
    /* Layout Properties */
    width: 100%;
    height: calc(1338*0.512/1920*100vw);
    /* UI Properties */
    background: transparent url('../ximages/putmenu_prepaid_pressrelease_image_240514c.webp') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size: contain;
    opacity: 1;
    padding-top: 0;
}

/* A-130対応 */
.loader_putmenu_img {
    /* Layout Properties */
    width: 100%;
    height: 0;
    /* UI Properties */
    background: transparent url('../ximages/putmenu_logo.svg') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size:cover;
    opacity: 1;
    padding-top: 23.6%;
}

.loading_img {
    /* Layout Properties */
    width: 100%;
    height: 0;
    /* UI Properties */
    background: transparent url('../ximages/loading.gif') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size:cover;
    opacity: 1;
    padding-top: 100%;
}

.putmenu_prepaid_logo_image {
    /* Layout Properties */
    width: 80%;
    height: auto;
    /* UI Properties */
    background: transparent url('../ximages/putmenu_prepaid_logo.webp') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size:contain;
    opacity: 1;
	margin: 10% 10% 0;
    padding-top: 10%;
}

.putmenu_prepaid_image_slider_1 {
    /* Layout Properties */
    width: 100%;
    height: 500px;
    /* UI Properties */
    background: transparent url('../ximages/putmenu_prepaid_image_01@2x.webp') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size:contain;
    opacity: 1;
    /* padding-top: 51.2%; */
}

.putmenu_prepaid_image_slider_2 {
    /* Layout Properties */
    width: 100%;
    height: 500px;
    /* UI Properties */
    background: transparent url('../ximages/putmenu_prepaid_image_02@2x.webp') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size:contain;
    opacity: 1;
    /* padding-top: 51.2%; */
}

.putmenu_prepaid_image_slider_3 {
    /* Layout Properties */
    width: 100%;
    height: 500px;
    /* UI Properties */
    background: transparent url('../ximages/putmenu_prepaid_image_03@2x.webp') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size:contain;
    opacity: 1;
    /* padding-top: 51.2%; */
}

.putmenu_prepaid_image_slider_4 {
    /* Layout Properties */
    width: 100%;
    height: 500px;
    /* UI Properties */
    background: transparent url('../ximages/putmenu_prepaid_image_04@2x.webp') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size:contain;
    opacity: 1;
    /* padding-top: 51.2%; */
}
/* plan.php用*/
.top_basic_img_graph {
    /* Layout Properties */
    width: 100%;
    height: 0;
    /* UI Properties */
    background: transparent url('../ximages/top_basic_img_graph.webp?t=1') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size:cover;
    opacity: 1;
    padding-top: 51.2%;
}

.top_basic_img_push_notifi {
    /* Layout Properties */
    width: 100%; 
    height: 0;
    /* UI Properties */
    background: transparent url('../ximages/top_basic_img_push_notifi.webp') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size:cover;
    opacity: 1;
    padding-top: 51.2%;
}

.basic_system_img {
    /* Layout Properties */
    width: 100%; 
    height: 0;
    /* UI Properties */
    background: transparent url('../ximages/basic_system_img.png') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size:cover;
    opacity: 1;
    padding-top: 89.9%;
}

.sys_diagram_block{
    /* Layout Properties */
    width: 60%; 
	margin: 0 20% 0;
}

.operation_flow_block{
    /* Layout Properties */
    width: 60%; 
	margin: 0 20% 0;
}

.basic_operation_flow_img {
    /* Layout Properties */
    width: 100%; 
    height: 0;
    /* UI Properties */
    background: transparent url('../ximages/basic_operation_flow_img.png') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size:cover;
    opacity: 1;
    padding-top: 80.4%;
}

.basic_dedicated_app_block{
    /* Layout Properties */
    width: 60%; 
	margin: 0 20% 0;
}

.basic_dedicated_app_img {
    /* Layout Properties */
    width: 100%; 
    height: 0;
    /* UI Properties */
    background: transparent url('../ximages/basic_dedicated_app_img.png') 0% 0% no-repeat padding-box;
    background-position: center;
    background-size:cover;
    opacity: 1;
    padding-top: 48.0%;
}
/* plan.php用*/

@media screen and (min-width:1024px) {
	/*　PC向け　*/
	header .Toggle{
		/* Layout Properties */
		display: none;
	}

	header .sregi-btn {
		/* Layout Properties */
		display: none;
		margin: 0px;
	}

	header nav ul li {
		/* Layout Properties */
		list-style: none;
		display: inline-block;
		padding-top: 0;
		padding-bottom: 0;
		padding-left: 1em;
		padding-right: 1em;
		width: auto;
	}

	header nav ul li a{
		/* Layout Properties */
		list-style: none;
		display: inline-block;
		padding-left: 1em;
		padding-right: 1em;
		/* Ui Properties */
		text-align: right;
		/* font: normal normal normal 16px/24px Hiragino Kaku Gothic ProN; */
		letter-spacing: 0px;
		color: #3E3A39;
	}

	header nav li:not(:last-child) {
		/* Ui Properties */
		border-right:2px solid #ddd;
	}

	.aimenu-img-PC{
		/* Layout Properties */
		display: block;
	}

	.aimenu-img-SP{
		/* Layout Properties */
		display: none;
	}

	/* No.198対応　開始 */
	.R25-img-PC{
		/* Layout Properties */
		display: block;
	}
	.R25-img-SP{
		/* Layout Properties */
		display: none;
	}
	/* No.198対応　終了 */

	.pm-hd-img-PC{
		/* Layout Properties */
		display: block;
	}

	.pm-hd-img-SP{
		/* Layout Properties */
		display: none;
	}
	
	div.headline_block{
		/* Layout Properties */
		width: 72%;
		/* A-142対応で調整 */
		/* margin: 14% 0 0 14%; */
		margin: 0 0 0 14%;
		padding: 2%;
	}

	div.email{
		/* Layout Properties */
		width: 60%;		
	}

	div.prepaid-youtube {
		width: 80%;
		margin: 0 40% 0;
	}

	div.headline-blk{
		/* Layout Properties */
		width: 72%;
		margin: 0 14% 0;
	}

	div.headline-grp{
		/* Layout Properties */
		display: flex;
		flex-flow: row;
	}

	div.center-spc{
		/* Layout Properties */
		width: 8%;
	}

	div.center-spc-small{
		/* Layout Properties */
		width: 4%;
	}

	div.headline-block{
		/* Layout Properties */
		width: 46%;
		display: flex;
		flex-flow: column;
	}

	div.headline-block-small{
		/* Layout Properties */
		width: 48%;
		display: flex;
		flex-flow: column;
	}

	div.text_headline_sub, div.text_headline_sub_large, div.text_headline_sub_large2 { /* A-151対応 */
		/* Layout Properties */
		height: calc(30/1024*100vw);  /* A-151対応 */
		line-height: calc(28/1024*100vw);
		/* UI Properties */
		/* font-size: calc(19/1024*100vw); */
		font-size: calc(18/1024*100vw);
	}

	div.text_headline_sub_smal {  /* A-200対応 */
		height: calc(30/1024*100vw);  /* A-151対応 */
		/* UI Properties */
		/* font-size: calc(19/1024*100vw); */
		font-size: calc(14/1024*100vw);
		line-height: calc(22/1024*100vw);
	}

	/* A-151対応 */
	div.text_headline_sub_large, div.text_headline_sub_large2 {
		height: calc(60/1024*100vw);
	}
	/* A-151対応 ここまで */
	
	/* A_No.200 プリペイドのみの利用ができることの追加 開始 */
	div.single-pc {
		width: 46%;
		margin: 0 27%;
		display: block;
	}

	div.single-sp {
		 width: 100%;
		margin: 0 27%;
		display: none;
	}
	/* A_No.200 プリペイドのみの利用ができることの追加 終了 */

	div.putmenu_prepaid_logo_image{
		/* Layout Properties */
		display: none;
	}
	
	div.pager{
		/* Layout Properties */
		display: none;
	}

	/*-- A-162 start --------*/
	.movie_contents{
		width: 100%;
		height: auto;
		aspect-ratio: 16 / 9;
	}
	.text_br{
    display: none;
	}
	/*-- A-162 end ----------*/	
	
	.prepaid_block{
		background: #f6f5f5;
	}
}

@media screen and (max-width:1024px) {
	/*　タブレット(横)向け　*/		
	header .Toggle{
		/* Layout Properties */
		display: none;
	}

	header .sregi-btn {
		/* Layout Properties */
		display: none;
		margin: 0px;
	}

	header nav ul li {
		/* Layout Properties */
		list-style: none;
		display: inline-block;
		padding: 0 1em 0;
		width: auto;
	}

	header nav ul li a{
		/* Layout Properties */
		list-style: none;
		display: inline-block;
		padding-left: 1em;
		padding-right: 1em;
		/* Ui Properties */
		text-align: right;
		/* font: normal normal normal 16px/24px Hiragino Kaku Gothic ProN; */
		font: normal normal normal 16px/24px Hiragino Kaku Gothic ProN;
		letter-spacing: 0px;
		color: #3E3A39;
	}
	header nav li:not(:last-child) {
		/* Ui Properties */
		border-right:2px solid #ddd;
	}

	.aimenu-img-PC{
		/* Layout Properties */
		display: block;
	}

	.aimenu-img-SP{
		/* Layout Properties */
		display: none;
	}

	/* No.198対応　開始 */
	.R25-img-PC{
		/* Layout Properties */
		display: block;
	}
	.R25-img-SP{
		/* Layout Properties */
		display: none;
	}
	/* No.198対応　終了 */

	.pm-hd-img-PC{
		/* Layout Properties */
		display: block;
	}

	.pm-hd-img-SP{
		/* Layout Properties */
		display: none;
	}

	.pm-sreg-btn{
		/* Layout Properties */
		width: calc(100vw/1920*700);
		height: calc(100vw/1920*80);
		/* li Properties */
		font-size: calc(100vw/1024*22);
		line-height: calc(100vw/1920*80);
		border-radius: calc(100vw/1024*10);
	}

	div.headline_block{
		width: 72%;
		/* A-142対応で調整 */
		/* margin: 14% 0 0 14%; */
		margin: 0 0 0 14%;
		padding: 2%;
	}

	div.nbtn2{
		/* Layout Properties */
		width: 40% !important;	
		height: calc(100vw/1024*60) !important;	
		display: block;
		margin: 0 30% 0;
		/* UI Properties */
		font-size: calc(100vw/1024*28) !important;	
		line-height: calc(100vw/1024*60) !important;	
	} 

	div.email{
		/* Layout Properties */
		width: 60%;		
	}

	div.prepaid-youtube {
		width: 80%;
		margin: 0 40% 0;
	}

	div.headline-blk{
		/* Layout Properties */
		width: 72%;
		margin: 0 14% 0;
	}

	div.headline-grp{
		/* Layout Properties */
		display: flex;
		flex-flow: row;
	}

	div.side-spc{
		/* Layout Properties */
		width: 14%;
	}

	div.center-spc{
		/* Layout Properties */
		width: 8%;
	}

	div.center-spc-small{
		/* Layout Properties */
		width: 4%;
	}

	div.headline-block{
		/* Layout Properties */
		width: 46%;
		display: flex;
		flex-flow: column;
	}

	div.headline-block-small{
		/* Layout Properties */
		width: 48%;
		display: flex;
		flex-flow: column;
	}

	div.text_headline_sub, div.text_headline_sub_large, div.text_headline_sub_large2 { /* A-151対応 */
		/* Layout Properties */
		height: calc(30/1024*100vw); /* A-151対応 */
		line-height: calc(28/1024*100vw);
		/* UI Properties */
		font-size: calc(19/1024*100vw);
	}

	div.text_headline_sub_smal {  /* A-200対応 */
		height: calc(30/1024*100vw);
		/* UI Properties */
		font-size: calc(14/1024*100vw);
		line-height: calc(22/1024*100vw);
	}

	/* A-151対応 */
	div.text_headline_sub_large, div.text_headline_sub_large2 {
		height: calc(60/1024*100vw);
	}
	/* A-151対応 ここまで */
	
	/* A_No.200 プリペイドのみの利用ができることの追加 開始 */
	div.single-pc {
		width: 46%;
		margin: 0 27%;
		display: block;
	}

	div.single-sp {
		 width: 100%;
		margin: 0 27%;
		display: none;
	}
	/* A_No.200 プリペイドのみの利用ができることの追加 終了 */

	div.headline-ap1{
		/* Layout Properties */
		display: flex;
		flex-flow: row;
		width: calc(100vw/900*1100);
		margin: 0 calc(100vw/900*60) 0;
	}

	div.headline-ap1-img{
		/* Layout Properties */
		width: 15%;		
	}

	div.headline-ap2{
		/* Layout Properties */
		display: flex;
		flex-flow: row;
		width: calc(100vw/900*1280);
		margin: 0 calc(100vw/900*60) 0;
	}

	div.headline-ap2-img{
		/* Layout Properties */
		width: 15%;		
	}

	div.headline-ap3{
		/* Layout Properties */
		display: flex;
		flex-flow: row;
		width: calc(100vw/900*1100);
		margin: 0 calc(100vw/900*60) 0;
	}

	div.headline-ap3-img{
		/* Layout Properties */
		width: 15%;		
	}

	/* A_No.200 プリペイドのみの利用ができることの追加 開始 */
	div.headline-ap4{
		/* Layout Properties */
		display: flex;
		flex-flow: row;
		width: calc(100vw/900*1280);
		margin: 0 calc(100vw/900*60) 0;
	}

	div.headline-ap4-img{
		/* Layout Properties */
		width: 15%;		
	}
	/* A_No.200 プリペイドのみの利用ができることの追加 終了 */

	div.headline-ap1-txt{
		/* Layout Properties */
		width: 52%;		
		padding: 20px;
		/* UI Properties */
		text-align: left;
	}
	
	div.headline-ap2-txt{
		/* Layout Properties */
		width: 43%;		
		padding: 20px;
		/* UI Properties */
		text-align: left;
	}

	div.headline-ap3-txt{
		/* Layout Properties */
		width: 52%;		
		padding: 20px;
		/* UI Properties */
		text-align: left;
	}

	/* A_No.200 プリペイドのみの利用ができることの追加 開始 */
	div.headline-ap4-txt{
		/* Layout Properties */
		width: 43%;		
		padding: 20px;
		/* UI Properties */
		text-align: left;
	}
	/* A_No.200 プリペイドのみの利用ができることの追加 終了 */

	div.putmenu_prepaid_logo_image{
		/* Layout Properties */
		display: none;
	}
	
	div.pager{
		/* Layout Properties */
		display: none;
	}

	div.sys_diagram{
		/* Layout Properties */
		width: 80%;	
		margin: 0 10% 0;
	}

	/* A-142対応により追加 */
	div.sys_diagram_block{
		/* Layout Properties */
		width: 84%; 
		margin: 0 8% 0;
	}

	div.operation_flow{
		/* Layout Properties */
		width: 80%;	
		margin: 0 10% 0;
	}

	/* A-142対応により追加 */
	div.operation_flow_block{
		/* Layout Properties */
		width: 84%; 
		margin: 0 8% 0;
	}

	div.putmenu_app{
		/* Layout Properties */
		width: 80%;	
		margin: 0 10% 0;
	}

	/* A-142対応により追加 */
	div.basic_dedicated_app_block {
		/* Layout Properties */
		width: 84%; 
		margin: 0 8% 0;
	}
	
	div.tmp_regist_scroll{
		/* Layout Properties */
		height: calc(100vw/900*250);
		width: calc(100vw/900*60);
		top: calc(100vw/900*250) !important;
		right: calc(100vw/900*20);
		/* UI Properties */
	}
	
	div.tmp_regist_scroll div{
		/* Layout Properties */
		height: calc(100vw/900*250);
		/* UI Properties */
		font-size: calc(100vw/900*14);
		line-height: calc(100vw/900*60);
	}

	/*-- A-162 start --------*/
	.movie_contents{
		width: 100%;
		height: auto;
		aspect-ratio: 16 / 9;
	}

	.text_br{
    display: none;
	}
	/*-- A-162 end ----------*/	
}

/* A-151対応 ここから */
@media screen and (max-width: 1024px) and (max-height: 499px) and (orientation: landscape) {
	div.tmp_regist_scroll {
		height: calc(100vw/900*250);
		width: calc(100vw/900*60);
		top: 70px !important;
		right: calc(100vw/900*(-5));
		z-index: 1;
	}
}
/* A-151対応 ここまで */

/* @media screen and (max-width: 930px) and (-webkit-device-pixel-ratio: 3) { */
    /* モバイル向けスタイル（デバイスピクセル比：3） */
@media screen and (max-width: 899px) {
	/* モバイル(横)&タブレット(縦)向けスタイル */	
	header .navigation {
		/* Layout Properties */
		height: auto;
		top: 69px;
		z-index: 3;
		/* UI Properties */
		/* font-size: calc(16/500*100vw);
		line-height: calc(24/500*100vw); */
		text-align: center;
		transform: translateX(120%);
	}

	header .Toggle {
		/* Layout Properties */
		display: block;
	}

	header nav ul li {
		/* Layout Properties */
		padding: 1em;
		border-right: none !important;
		border-bottom: 1px solid #5c574E;
		background-color: #ffffff;
		width: 90%;
	}

	header nav ul li a{
		/* Layout Properties */
		/* li Properties */
		color: #3E3A39;
		text-align: left;
	}

	header .sregi-btn {
		/* Layout Properties */
		display: block;
		margin: 1em auto 1em;
	}

	.aimenu-img-PC{
		/* Layout Properties */
		display: block;
	}

	.aimenu-img-SP{
		/* Layout Properties */
		display: none;
	}

	/* No.198対応　開始 */
	.R25-img-PC{
		/* Layout Properties */
		display: block;
	}
	.R25-img-SP{
		/* Layout Properties */
		display: none;
	}
	/* No.198対応　終了 */


	.pm-hd-img-PC{
		/* Layout Properties */
		display: block;
	}

	.pm-hd-img-SP{
		/* Layout Properties */
		display: none;
	}

	.pm-sreg-btn{
		/* Layout Properties */
		width: calc(100vw/1920*700);
		height: calc(100vw/1920*80);
		/* li Properties */
		font-size: calc(100vw/900*20);
		line-height: calc(100vw/1920*80);
		border-radius: calc(100vw/900*10);
	}
	
	div.headline_block{
		/* Layout Properties */
		/* A-142対応で調整 */
		width: 80%;
		/* margin: 14% 0 0 14%; */
		margin: 0 0 0 10%;
		padding: 2%;
	}

	div.headline_apeal_block{
		/* Layout Properties */
		width: 90%;
		margin: 0% 5% 0%;
	}

	div.nbtn2{
		/* Layout Properties */
		width: 40% !important;	
		height: calc(100vw/900*60) !important;	
		display: block;
		margin: 0 30% 0;
		/* UI Properties */
		font-size: calc(100vw/900*28) !important;	
		line-height: calc(100vw/900*60) !important;
	} 

	div.email{
		/* Layout Properties */
		width: 60%;		
	}

	div.text_headline_apeal{
		/* UI Properties */
		/* A-142対応で調整 */
		font-size: calc(100vw/500*10);
		line-height: calc(100vw/500*24);
	}

	div.text_headline_main{
		/* Layout Properties */
		/* UI Properties */
		font-size: calc(100vw/500*24);
		line-height: calc(100vw/500*35);
		text-align: center;
	}

	h1 {
		font-size: calc(100vw/500*24);
	}

	div.text_context {
		/* Layout Properties */
		width: 90%;
		/* UI Properties */
		font-size: calc(100vw/500*16);
		line-height: calc(100vw/500*24);
	}

	div.text_context a{
		/* Layout Properties */
		/* UI Properties */
		font-size: calc(100vw/500*16);
		line-height: calc(100vw/500*24);
	}
	
	div.text_context span{
		/* Layout Properties */
		/* UI Properties */
		font-size: calc(100vw/500*14);
		line-height: calc(100vw/500*21);
	}

	div.text_annotation {
		font-size: calc(100vw/500*14);
		line-height: calc(100vw/500*21);
	}

	div.prepaid-youtube {
		width: 90%;
		margin: 0 26% 0;
	}

	div.headline-blk{
		/* Layout Properties */
		width: 90%;
		margin: 0 5% 0;
	}

	div.headline-grp{
		/* Layout Properties */
		display: flex;
		flex-flow: row;
	}
	div.center-spc{
		/* Layout Properties */
		width: 8%;
	}

	div.center-spc-small{
		/* Layout Properties */
		width: 4%;
	}

	div.headline-block{
		/* Layout Properties */
		width: 100%;
		display: flex;
		flex-flow: column;
	}

	div.headline-block-small{
		/* Layout Properties */
		width: 100%;
		display: flex;
		flex-flow: column;
	}

	div.text_headline_sub, div.text_headline_sub_large, div.text_headline_sub_large2 {  /* A-151対応 */
		/* Layout Properties */
		height: calc(30vw/500*72);  /* A-151対応 */
		/* UI Properties */
		font-size: calc(100vw/500*18);
		line-height: calc(100vw/500*24);
	}

	div.text_headline_sub_smal {  /* A-200対応 */
		height: calc(30/1024*100vw);
		/* UI Properties */
		font-size: calc(14/500*100vw);
		line-height: calc(22/500*100vw);
	}
	/* A-151対応 */
	div.text_headline_sub_large, div.text_headline_sub_large2 {
		height: calc(100vw/500*72);
	}
	/* A-151対応 ここまで */
	
	/* A_No.200 プリペイドのみの利用ができることの追加 開始 */
	.text_headline_sub_img01 {
		/* Layout Properties */
		/* UI Properties */
		background: transparent url('../ximages/top_0yen_cost_sp@3x.webp') 0% 0% no-repeat padding-box;
		background-position: center;
		background-size: contain;
	}

	div.single {
		width: 100%;
		margin: 0%;
		display: block;
	}

	div.single-pc {
		width: 100%;
		margin: 0 27%;
		display: none;
	}

	div.single-sp {
		width: 100%;
		margin: 0;
		display: block;
	}
	/* A_No.200 プリペイドのみの利用ができることの追加 終了 */

	div.headline-ap1{
		/* Layout Properties */
		display: flex;
		flex-flow: row;
		width: calc(100vw/500*600);
		margin: 0 calc(100vw/500*30) 0;
	}

	div.headline-ap1-img{
		/* Layout Properties */
		width: 15%;		
	}

	div.headline-ap2{
		/* Layout Properties */
		display: flex;
		flex-flow: row;
		width: calc(100vw/500*700);
		margin: 0 calc(100vw/500*30) 0;
	}

	div.headline-ap2-img{
		/* Layout Properties */
		width: 15%;		
	}

	div.headline-ap3{
		/* Layout Properties */
		display: flex;
		flex-flow: row;
		width: calc(100vw/500*600);
		margin: 0 calc(100vw/500*30) 0;
	}

	div.headline-ap3-img{
		/* Layout Properties */
		width: 15%;		
	}

	/* A_No.200 プリペイドのみの利用ができることの追加 開始 */
	div.headline-ap4{
		/* Layout Properties */
		display: flex;
		flex-flow: row;
		width: calc(100vw/500*700);
		margin: 0 calc(100vw/500*30) 0;
	}

	div.headline-ap4-img{
		/* Layout Properties */
		width: 15%;		
	}
	/* A_No.200 プリペイドのみの利用ができることの追加 終了 */

	div.headline-ap1-txt{
		/* Layout Properties */
		width: 48;		
		padding: 20px;
		/* UI Properties */
		text-align: left;
	}
	
	div.headline-ap2-txt{
		/* Layout Properties */
		width: 43%;		
		padding: 20px;
		/* UI Properties */
		text-align: left;
	}

	div.headline-ap3-txt{
		/* Layout Properties */
		width: 48%;		
		padding: 20px;
		/* UI Properties */
		text-align: left;
	}

	/* A_No.200 プリペイドのみの利用ができることの追加 開始 */
	div.headline-ap4-txt{
		/* Layout Properties */
		width: 43%;		
		padding: 20px;
		/* UI Properties */
		text-align: left;
	}
	/* A_No.200 プリペイドのみの利用ができることの追加 終了 */

	div.putmenu_prepaid_logo_image{
		/* Layout Properties */
		display: none;
	}
	
	div.pager{
		/* Layout Properties */
		display: none;
	}
	
	div.basic_area{
		/* Layout Properties */
		width: 80%;	
		margin: 10%
	}

	div.plan_apeal{
		/* Layout Properties */
		width: 80%;	
		margin: 0 10% 0;
	}

	div.comparison{
		/* Layout Properties */
		width: 80%;	
		margin: 0 10% 0;
	}

	div.headline_basic_block{
		/* Layout Properties */
		width: 80%;	
		margin: 0 10% 0;
	}

	.putmenu_step_image {
		/* Layout Properties */
		height: calc(100vw/500*200);
		/* UI Properties */
		background: transparent url('../ximages/top_step_img_sp@2x.webp') 0% 0% no-repeat padding-box;
		background-size:100% auto;
		padding-top: 0;
	}

	.top_basic_img_graph {
		/* Layout Properties */
		height: calc(100vw/500*260*0.9);
		/* UI Properties */
		background: transparent url('../ximages/top_basic_img_graph_sp@2x.webp') 50% 50% no-repeat padding-box;
		background-size: 80% auto;
		padding: 0;
	}

	div.headline_notifi_block{
		/* Layout Properties */
		width: 70%;	
		margin: 0 15% 0;
	}

	div.top_basic_img_push_notifi{
		/* Layout Properties */
		height: calc(100vw/500*200*0.9);
		/* margin: 0 15% 0; */
		/* UI Properties */
		background: transparent url('../ximages/top_basic_img_push_notifi_sp@2x.webp') 50% 50% no-repeat padding-box;
		background-size: 80% auto;
		padding: 0;
	}
	
	div.tmp_regist_scroll{
		/* Layout Properties */
		height: calc(100vw/500*200);
		width: calc(100vw/500*44);
		top: calc(100vw/500*220) !important;
		right: calc(100vw/500*(-9));
		/* UI Properties */
	}
	
	div.tmp_regist_scroll div{
		/* Layout Properties */
		height: calc(100vw/500*200);
		/* UI Properties */
		font-size: calc(100vw/500*11);
		line-height: calc(100vw/500*40);
	}

	.text_br{
    display: none;
	}
}

/* A-151対応 ここから */
@media screen and (max-width: 899px) and (max-height: 499px) and (orientation: landscape) {
	div.tmp_regist_scroll {
		height: calc(100vw/500*150);
		width: calc(100vw/500*36);
		top: 70px !important;
		right: calc(100vw/500*(-9));
		z-index: 1;
	}

	div.tmp_regist_scroll div {
		height: calc(100vw/500*150);
		font-size: calc(100vw/500*8);
		line-height: calc(100vw/500*30);
	}
}
/* A-151対応 ここまで */

/* @media screen and (max-width: 485px) and (-webkit-device-pixel-ratio: 2) { */
    /* モバイル向けスタイル（デバイスピクセル比：2） */
@media screen and (max-width: 499px) {
    /* モバイル(縦)向けスタイル */
	header .header-img {
		/* Layout Properties */
		/* width: calc(175/500*100vw);
		height: calc(50/500*100vw);
		top: calc(30/500*100vw);
		left: calc(20/500*100vw); */
		width: 130px;
		height: 34px;
		top: 18px;
		left: 18px;
		/* UI Properties */
		background: transparent url('../ximages/header_logo_putmenu_sp.png') 0% 0% no-repeat padding-box;
		background-size: 100% auto;
	}

	header .text_beta {
		/* Layout Properties */
		/* width: calc(130/500*100vw);
		height: calc(24/500*100vw);
		top: calc(44/500*100vw);
		left: calc(220/500*100vw); */
		width: 50px;
		height: 24px;
		top: 24px;
		left: 165px;
		/* UI Properties */
	}

	header .navigation {
		/* Layout Properties */
		height: auto;
		top: 69px;
		z-index: 3;
		/* UI Properties */
		/* font-size: calc(16/500*100vw);
		line-height: calc(24/500*100vw); */
		text-align: left;
		transform: translateX(120%);
	}
	
	header .Toggle {
		/* Layout Properties */
		display: block;
	}

	header nav ul li {
			/* Layout Properties */
		padding: 1em;
		border-right: none;
		border-bottom: 1px solid #5c574E;
		background-color: #ffffff;
		width: 90%;
	}

	header nav ul li a{
		/* Layout Properties */
		/* height: calc(24/500*100vw); */
		/* UI Properties */
/* 		font-size: calc(18/500*100vw);
		line-height: calc(24/500*100vw); */
		text-align: left;
		color: #3E3A39;
	}

	header .sregi-btn {
		/* Layout Properties */
		width: calc(100vw/375*340);
		height: calc(100vw/375*60);
		display: block;
		margin: 1em auto 1em;
		/* UI Properties */
		font-size: calc(100vw/375*18);
		line-height: calc(100vw/375*60);
	}

	.aimenu-img-PC{
		/* Layout Properties */
		display: none;
	}
	
	.aimenu-img-SP{
		/* Layout Properties */
		display: block;
	}

	/* No.198対応　開始 */
	.R25-img-PC{
		/* Layout Properties */
		display: none;
	}
	.R25-img-SP{
		/* Layout Properties */
		display: block;
	}
	/* No.198対応　終了 */


	.pm-hd-img-PC{
		/* Layout Properties */
		display: none;
	}
	
	.pm-hd-img-SP{
		/* Layout Properties */
		display: block;
	}

	.pm-sreg-btn{
		/* Layout Properties */
		width: calc(100vw/375*340);
		height: calc(100vw/375*60);
		right: 0;
		left: 0;
		margin: calc(100vw/375*515) auto auto;
		/* UI Properties */
		font-size: calc(100vw/375*18);
		line-height: calc(100vw/375*60);
		border-radius: calc(100vw/375*9);	
	}

	div.headline_block{
		/* Layout Properties */
		width: 90%;
		margin: 0% 5% 0%;
		padding: 5% 5% 5%;
	}

	div.headline_apeal_block{
		/* Layout Properties */
		width: 90%;
		margin: 0% 5% 0%;
	}

	div.nbtn2{
		/* Layout Properties */
		width: calc(100vw/375*340) !important;	
		height: calc(100vw/375*60) !important;	
		display: block;
		margin: 0 5% 0;
		/* UI Properties */
		font-size: calc(100vw/375*18) !important;
		line-height: calc(100vw/375*60) !important;
		border-radius: calc(100vw/375*9) !important;	
	} 

	div.email{
		/* Layout Properties */
		width: 90%;		
	}

	div.text_headline_apeal{
		/* UI Properties */
		font-size: calc(100vw/375*15);
		line-height: calc(100vw/375*24);
	}

	div.text_headline_main{
		/* Layout Properties */
		/* UI Properties */
		font-size: calc(100vw/375*24);
		line-height: calc(100vw/375*35);
		text-align: center;
	}

	h1 {
		font-size: calc(100vw/375*24);
	}

	div.text_context {
		/* Layout Properties */
		width: 90%;
		/* UI Properties */
		font-size: calc(100vw/375*16);
		line-height: calc(100vw/375*24);
	}

	div.text_context a{
		/* Layout Properties */
		/* UI Properties */
		font-size: calc(100vw/375*16);
		line-height: calc(100vw/375*24);
	}

	div.text_context span{
		/* Layout Properties */
		/* UI Properties */
		font-size: calc(100vw/375*14);
		line-height: calc(100vw/375*21);
	}

	div.text_annotation {
		font-size: calc(100vw/375*14);
		line-height: calc(100vw/375*21);
	}	

	div.txt_box{
		/* Layout Properties */
		width: 90%;
		margin: 0 5% 0;
	
	}

	div.prepaid-youtube {
		width: 90%;
		margin: 0 5% 0;
	}

	div.headline-blk{
		/* Layout Properties */
		width: 90%;
		margin: 0 5% 0;
	}

	div.headline-grp{
		/* Layout Properties */
		display: flex;
		flex-flow: column;
	}

	div.side-spc{
		/* Layout Properties */
		width: 5%;
	}

	div.center-spc{
		/* Layout Properties */
		width: 8%;
		display: none;
	}

	div.center-spc-small{
		/* Layout Properties */
		width: 4%;
		display: none;
	}

	div.headline-block{
		/* Layout Properties */
		width: 100%;
		display: flex;
		flex-flow: column;
	}

	div.headline-block-small{
		/* Layout Properties */
		width: 100%;
		display: flex;
		flex-flow: column;
	}

	div.text_headline_sub, div.text_headline_sub_large, div.text_headline_sub_large2 {  /* A-151対応 */
		/* Layout Properties */
		height: calc(45vw/375*55); /* A-151対応 */
		padding-top: calc(30vw/375*40); /* A-151対応 */
		/* UI Properties */
		font-size: calc(100vw/375*18);
		line-height: calc(100vw/375*30);
	}

	div.text_headline_sub_smal {  /* A-200対応 */
		height: calc(45vw/375*55); /* A-151対応 */
		padding-top: calc(30vw/375*40); /* A-151対応 */
		/* UI Properties */
		font-size: calc(14/375*100vw);
		line-height: calc(28/375*100vw);
	}

	/* A-151対応 */
	div.text_headline_sub_large {
		height: calc(100vw/375*55);
	}
	/* A-151対応 ここまで */
	
	/* A_No.200 プリペイドのみの利用ができることの追加 開始 */
	.text_headline_sub_img01 {
		/* Layout Properties */
		/* UI Properties */
		background: transparent url('../ximages/top_0yen_cost_sp@3x.webp') 0% 0% no-repeat padding-box;
		background-position: center;
		background-size: contain;
	}

	div.single {
		width: 100%;
		margin: 0%;
		display: block;
	}

	div.single-pc {
		width: 100%;
		margin: 0 27%;
		display: none;
	}

	div.single-sp {
		width: 100%;
		margin: 0;
		display: block;
	}
	/* A_No.200 プリペイドのみの利用ができることの追加 終了 */

	div.headline-ap1{
		/* Layout Properties */
		width: 90%;
		margin: 0 5% 0;
		display: flex;
		flex-flow: column;
	}

	div.headline-ap2{
		/* Layout Properties */
		width: 90%;
		margin: 0 5% 0;
		display: flex;
		flex-flow: column;
		flex-direction: column-reverse;
	}

	div.headline-ap3{
		/* Layout Properties */
		width: 90%;
		margin: 0 5% 0;
		display: flex;
		flex-flow: column;
	}

	/* A_No.200 プリペイドのみの利用ができることの追加 開始 */
	div.headline-ap4{
		/* Layout Properties */
		width: 90%;
		margin: 0 5% 0;
		display: flex;
		flex-flow: column;
		flex-direction: column-reverse;
	}
	/* A_No.200 プリペイドのみの利用ができることの追加 終了 */

	.top_catchcopy_img01 {
		/* UI Properties */
		background: transparent url('../ximages/top_catchcopy_img01_sp.webp') 50% 50% / 65% no-repeat padding-box;
		padding-top: calc(360 / 500 *100vw);
	}

	.top_catchcopy_img02 {
		/* UI Properties */
		background: transparent url('../ximages/top_catchcopy_img02_sp.webp') 50% 50% / 65% no-repeat padding-box;
		padding-top: calc(360 / 500 *100vw);
	}

	.top_catchcopy_img03 {
		/* UI Properties */
		background: transparent url('../ximages/top_catchcopy_img03_sp.webp') 50% 50% / 65% no-repeat padding-box;
		padding-top: calc(360 / 500 *100vw);
	}

	.top_catchcopy_img04 {
		/* UI Properties */
		background: transparent url('../ximages/top_catchcopy_img04_sp@3x.webp') 50% 50% / 65% no-repeat padding-box;
		padding-top: calc(360 / 500 *100vw);
	}

	div.headline-ap1-img{
		/* Layout Properties */
		width: 100%;	
	}

	div.headline-ap2-img{
		/* Layout Properties */
		width: 100%;	
	}

	div.headline-ap3-img{
		/* Layout Properties */
		width: 100%;	
	}

	/* A_No.200 プリペイドのみの利用ができることの追加 開始 */
	div.headline-ap4-img{
		/* Layout Properties */
		width: 100%;	
	}
	/* A_No.200 プリペイドのみの利用ができることの追加 終了 */

	div.headline-ap1-txt{
		/* Layout Properties */
		width: 90%;		
		padding: 0px;
		margin: 0 5% 0 !important;
		text-align: center;
	}
	
	div.headline-ap2-txt{
		/* Layout Properties */
		width: 90%;		
		padding: 0px;
		margin: 0 5% 0 !important;
		text-align: center;
	}

	div.headline-ap3-txt{
		/* Layout Properties */
		width: 90%;		
		padding: 0px;
		margin: 0 5% 0 !important;
		text-align: center;
	}
	
	/* A_No.200 プリペイドのみの利用ができることの追加 開始 */
	div.headline-ap4-txt{
		/* Layout Properties */
		width: 90%;		
		padding: 0px;
		margin: 0 5% 0 !important;
		text-align: center;
	}
	/* A_No.200 プリペイドのみの利用ができることの追加 終了 */

	div.putmenu_prepaid_img_block{
		/* Layout Properties */
		display: none;
	}

	div.putmenu_prepaid_logo_image{
		/* Layout Properties */
		display: block;
	}

	div.carousel{
		/* Layout Properties */
		display: flex;
	}

	/* A-151対応 */
	.carousel .text_context {
		padding: 10px 0;
	}
	/* A-151対応 ここまで */

	div.pager{
		/* Layout Properties */
		display: block;
	}
	
	div.basic_area{
		/* Layout Properties */
		width: 80%;	
		margin: 10%
	}

	div.plan_apeal{
		/* Layout Properties */
		width: 80%;	
		margin: 0 10% 0;
	}

	div.comparison{
		/* Layout Properties */
		width: 80%;	
		margin: 0 10% 0;
	}

	div.headline_basic_block{
		/* Layout Properties */
		width: 90%;	
		margin: 0 5% 0;
	}
	
	div.headline_notifi_block{
		/* Layout Properties */
		width: 90%;	
		margin: 0 5% 0;
	}

	div.putmenu_step_img_block{
		/* Layout Properties */
		width: 100%;
		margin: 0 0;	
	}

	.putmenu_step_image {
		/* Layout Properties */
		/* height: calc(228px/0.9); */
		/* UI Properties */
		background: transparent url('../ximages/top_step_img_sp@2x.webp') 0% 0% no-repeat padding-box;
		background-size:100% auto;
		padding: 0;
	}

	.top_basic_img_graph {
		/* Layout Properties */
		height: calc(228px/0.9);
		/* UI Properties */
		background: transparent url('../ximages/top_basic_img_graph_sp@2x.webp') 50% 50% no-repeat padding-box;
		background-size: 100% auto;
		padding: 0;
	}

	div.top_basic_img_push_notifi{
		/* Layout Properties */
		height: calc(160px/0.9);
		/* margin: 0 15% 0; */
		/* UI Properties */
		background: transparent url('../ximages/top_basic_img_push_notifi_sp@2x.webp') 50% 50% no-repeat padding-box;
		background-size: 100% auto;
		padding: 0;
	}

	div.sys_diagram{
		/* Layout Properties */
		width: 80%;	
		margin: 0 10% 0;
	}

	/* A-142対応により追加 */
	div.sys_diagram_block{
		/* Layout Properties */
		width: 92%; 
		margin: 0 4% 0;
	}

	div.operation_flow{
		/* Layout Properties */
		width: 80%;	
		margin: 0 10% 0;
	}

	/* A-142対応により追加 */
	div.operation_flow_block{
		/* Layout Properties */
		width: 92%; 
		margin: 0 4% 0;
	}

	div.putmenu_app{
		/* Layout Properties */
		width: 80%;	
		margin: 0 10% 0;
	}

	/* A-142対応により追加 */
	div.basic_dedicated_app_block {
		/* Layout Properties */
		width: 92%; 
		margin: 0 4% 0;
	}

	div.regist_btn{
		/* Layout Properties */
		/* width: 15%; */	
		width: 0;	
		margin: 0;
	}

	div.tmp_regist_scroll{
		/* Layout Properties */
		height: calc(100vw/320*180);
		width: calc(100vw/320*34);
		top: calc(70vw/320*320) !important; /* A-151対応 */
		right: calc(100vw/320*(-9));
		/* UI Properties */
	}

	div.tmp_regist_scroll div{
		/* Layout Properties */
		height: calc(100vw/320*180);
		/* UI Properties */
		font-size: calc(9/320*100vw);
		line-height: calc(30/320*100vw);
	}
	
	input.boxround{
		/* Layout Properties */
		/* UI Properties */
		font-size: calc(100vw/375*16) !important; 
	}

	.text_br{
    display: block;
	}
}
/* 
@media screen and (max-width: 485px) and (-webkit-device-pixel-ratio: 1) {*/
    /* モバイル向けスタイル（デバイスピクセル比：1） */ 
@media screen and (max-width: 321px) {
	/* モバイル向けスタイル（低解像度3） */@2x
	footer .navigation {
		/* Layout Properties */
		/* UI Properties */
		font-size: calc(16/320*100vw);
		line-height: calc(24/320*100vw);
	}

	header nav ul li a{
		/* Layout Properties */
		height: calc(100vw/320*24);
		/* UI Properties */
	}
	
	div.text_headline_apeal{
		/* UI Properties */
		font-size: calc(18/320*100vw);
		line-height: calc(35/320*100vw);
	}

	div.text_headline_main{
		/* Layout Properties */
		/* UI Properties */
		font-size: calc(20/320*100vw);
		line-height: calc(30/320*100vw);
		text-align: center;
	}

	h1 {
		font-size: calc(20/320*100vw);
	}

	div.text_context {
		/* Layout Properties */
		width: 90%;
		/* UI Properties */
		font-size: 16px;
		line-height: 24px;
	}

	div.text_context a{
		/* Layout Properties */
		/* UI Properties */
		font-size: 12px;
		line-height: 16px;
	}

	div.text_annotation {
		/* UI Properties */
		font-size: 14px;
		line-height: 21px;
	}

	div.text_headline_sub{
		/* Layout Properties */
		/* UI Properties */
		font-size: 16px;
	}

	div.headline-ap1{
		/* Layout Properties */
		width: 90%;
		margin: 0 5% 0;
		display: flex;
		flex-flow: column;
	}

	div.headline-ap2{
		/* Layout Properties */
		width: 90%;
		margin: 0 5% 0;
		display: flex;
		flex-flow: column;
		flex-direction: column-reverse;
	}

	div.headline-ap3{
		/* Layout Properties */
		width: 90%;
		margin: 0 5% 0;
		display: flex;
		flex-flow: column;
	}

	/* A_No.200 プリペイドのみの利用ができることの追加 開始 */
	div.headline-ap4{
		/* Layout Properties */
		width: 90%;
		margin: 0 5% 0;
		display: flex;
		flex-flow: column;
		flex-direction: column-reverse;
	}
	/* A_No.200 プリペイドのみの利用ができることの追加 終了 */

	.top_catchcopy_img01 {
		/* UI Properties */
		background: transparent url('../ximages/top_catchcopy_img01_sp.webp') 50% 50% / 75% no-repeat padding-box;
		padding-top: calc(280/320*100vw);
	}

	.top_catchcopy_img02 {
		/* UI Properties */
		background: transparent url('../ximages/top_catchcopy_img02_sp.webp') 50% 50% / 75% no-repeat padding-box;
		padding-top: calc(280/320*100vw);
	}

	.top_catchcopy_img03 {
		/* UI Properties */
		background: transparent url('../ximages/top_catchcopy_img03_sp.webp') 50% 50% / 75% no-repeat padding-box;
		padding-top: calc(280/320*100vw);
	}

	/* A_No.200 プリペイドのみの利用ができることの追加 開始 */
	.top_catchcopy_img04 {
		/* UI Properties */
		background: transparent url('../ximages/top_catchcopy_img04_sp@3x.webp') 50% 50% / 75% no-repeat padding-box;
		padding-top: calc(280/320*100vw);
	}
	/* A_No.200 プリペイドのみの利用ができることの追加 終了 */

	div.headline-ap1-img{
		/* Layout Properties */
		width: 100%;	
	}

	div.headline-ap2-img{
		/* Layout Properties */
		width: 100%;	
	}

	div.headline-ap3-img{
		/* Layout Properties */
		width: 100%;		
	}

	/* A_No.200 プリペイドのみの利用ができることの追加 開始 */
	div.headline-ap4-img{
		/* Layout Properties */
		width: 100%;		
	}
	/* A_No.200 プリペイドのみの利用ができることの追加 終了 */

	div.headline-ap1-txt{
		/* Layout Properties */
		width: 90%;		
		padding: 0px;
		margin: 0 5% 0 !important;
		text-align: center;
	}
	
	div.headline-ap2-txt{
		/* Layout Properties */
		width: 90%;		
		padding: 0px;
		margin: 0 5% 0 !important;
		text-align: center;
	}

	div.headline-ap3-txt{
		/* Layout Properties */
		width: 90%;		
		padding: 0px;
		margin: 0 5% 0 !important;
		text-align: center;
	}
	
	/* A_No.200 プリペイドのみの利用ができることの追加 開始 */
	div.headline-ap4-txt{
		/* Layout Properties */
		width: 90%;		
		padding: 0px;
		margin: 0 5% 0 !important;
		text-align: center;
	}
	/* A_No.200 プリペイドのみの利用ができることの追加 終了 */

	div.putmenu_prepaid_img_block{
		/* Layout Properties */
		display: none;
	}

	div.putmenu_prepaid_logo_image{
		/* Layout Properties */
		display: block;
	}

	div.carousel{
		/* Layout Properties */
		display: flex;
	}

	/* A-151対応 */
	.carousel .text_context {
		padding: 10px 0;
	}
	/* A-151対応 ここまで */
	
	div.pager{
		/* Layout Properties */
		display: block;
	}
	
	div.basic_area{
		/* Layout Properties */
		width: 86%;	
		margin: 0 7% 0;
	}

	div.plan_apeal{
		/* Layout Properties */
		width: 86%;	
		margin: 0 7% 0;
	}

	div.comparison{
		/* Layout Properties */
		width: 86%;	
		margin: 0 7% 0;
	}

	div.putmenu_step_img_block{
		/* Layout Properties */
		width: 100%;
		margin: 0 0;	
	}

	.putmenu_step_image {
		/* Layout Properties */
		/* height: calc(228*0.86/320*100vw); */
		/* UI Properties */
		background: transparent url('../ximages/top_step_img_sp@2x.webp') 0% 0% no-repeat padding-box;
		background-size:100% auto;
		padding: 0;
	}

	.top_basic_img_graph {
		/* Layout Properties */
		height: calc(228*0.86/320*100vw);
		/* UI Properties */
		background: transparent url('../ximages/top_basic_img_graph_sp@2x.webp') 50% 50% no-repeat padding-box;
		background-size: 100% auto;
		padding: 0;
	}

	div.top_basic_img_push_notifi{
		/* Layout Properties */
		height: calc(228*0.86/320*100vw);
		/* margin: 0 15% 0; */
		/* UI Properties */
		background: transparent url('../ximages/top_basic_img_push_notifi_sp@2x.webp') 50% 50% no-repeat padding-box;
		background-size: 100% auto;
		padding: 0;
	}

	div.sys_diagram{
		/* Layout Properties */
		width: 80%;	
		margin: 0 10% 0;
	}

	div.operation_flow{
		/* Layout Properties */
		width: 80%;	
		margin: 0 10% 0;
	}

	div.putmenu_app{
		/* Layout Properties */
		width: 86%;	
		margin: 0 7% 0;
	}

	div.putmenu_app_img{
		/* Layout Properties */
		width: 100%;	
		/* margin: 0 15% 0; */
	}

	input.boxround{
		/* Layout Properties */
		/* UI Properties */
		font-size: 16px !important; 
	}

	.text_br{
    display: block;
	}
}
/* A-142（レスポンシブ対応） 終了*/