@charset "UTF-8";

*{
  box-sizing:border-box;
  max-width:100%;
  margin:0;
  padding:0;
}
html {
  font-family: 'Noto Sans JP', "Helvetica Neue", Helvetica, Arial, sans-serif,'游ゴシック体', 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
  -webkit-text-size-adjust: 100%;	
  font-display: swap;
}
body {
  font-size: 14px;
  line-height: 1.8;
  letter-spacing:.25pt;
  font-weight: 500;
  hanging-punctuation: allow-end;
  color: #273343;
  word-break: break-all;
  overflow-x:hidden;
}
body.hidden{
	overflow:hidden;
	height:100%;
}
#wrapper{
	min-height:100vh;
	margin:0;
	padding:0;
}
span{text-indent:0;}
.pink{color:#E92B66;}
.red{color:#ED4C4C;}
.bold{font-weight:600;}
.block{display:block;}
.indent{
	padding-left:1em;
	text-indent:-1em;
}
.min{font-size:12px;}
* + .min{padding-top:0.5em;}
.min + label{margin-top:10px;}
.mt10{margin-top:10px;}
.t-right{text-align:right;}

p + ul.num,
ul.num + p{margin-top:15px;}
ul.num li{position:relative;}
ul.num li{
  position:relative;
  color:#273343;
  padding-left:40px;
  counter-increment: number 1;
}
ul.num li + li{margin-top:15px;}
ul.num li::before{
  position:absolute;
  content:counter(number) ;
  top:50%;
  transform:translateY(-50%);
  left:0;
  display:flex;
  justify-content:center;
  align-items:center;
  width:30px;
  min-height:30px;
  height:100%;
  color:#fff;
  text-align:center;
  line-height:28px;
  background:#273343;
  padding-bottom:2px;
  border-radius:4px;
}
ul.check li{
	position:relative;
	font-size:14px;
	padding-left:20px;
}
ul.check li + li{margin-top:5px;}
ul.check li::before{
	position:absolute;
	content:"";
	top:50%;
	transform:translateY(-50%);
	left:0;
	width:15px;
	height:13px;
	background:url(../img/icon/check_i.svg) center/contain no-repeat;
}
p + ul.check,
ul.check + p{margin-top:15px;}

ul.dot li{
	position:relative;
	font-size:14px;
	padding-left:1em;
}
ul.dot li + li{margin-top:5px;}
ul.dot li::before{
	position:absolute;
	content:"・";
	left:0;
}
p + ul.check,
ul.check + p{margin-top:15px;}

li a,p a{
	color:#0068B7;
	text-decoration:underline;
}
li a:hover,p a:hover{text-decoration:none;}

.pan{
	width:640px;
	font-size:12px;
	padding:10px 0;
	margin:0 auto;
	border-bottom:1px solid #e0e0e0;
	overflow-x: scroll;
	-webkit-overflow-scrolling: touch;
	white-space: nowrap;
	-ms-overflow-style: none;
	scrollbar-width: none;
}
.pan::-webkit-scrollbar{display: none;}

.pan a{
	color:#00B19F;
	text-decoration:underline;
}
.pan a:hover{text-decoration:none;}


/* ログイン画面 */
#wrapper.login{background:#F8F7F4;}

div.login-wrap{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
}
div.login-wrap img.logo{
	display:block;
	width:200px;
	border-radius:clamp(4px,1.199vw,10px);
	overflow:hidden;
	margin:0 auto;
}
div.login-form{
	width:330px;
	padding:25px 15px;
	margin-top:15px;
	background:#fff;
	border:1px solid #e0e0e0;
	border-radius:clamp(4px,1.199vw,10px);
}
div.login-form h1{
	font-size:16px;
	color:#273343;
	background:none;
	padding:0;
}
div.login-form p.heading{
	display:flex;
	align-items:center;
	font-size:14px;
	margin-top:15px;
}
div.login-form p.heading span{
	color:#ccc;
	font-size:10px;
	padding-left:.5em;
}

div.login-form input[type="text"]{
  font-size:16px;
  display: inline-block;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  border-radius: 4px;
  padding: 10px;
  width:100%;
  max-width:100%;
  vertical-align: middle;
  border: none;
  color: #273343;
  background: #fff;
  border:1px solid #e0e0e0;
  margin-top:5px;
}
div.login-form ::placeholder {color:#ccc;}
/* 旧Edge対応 */
div.login-form ::-ms-input-placeholder {color:#ccc;}
/* IE対応 */
div.login-form :-ms-input-placeholder {color:#ccc;}

div.login-form input[type="text"] + p{padding-top:.5em;}

div.login-wrap .button{
	position:relative;
	display:flex;
	justify-content:center;
	align-items:center;
	width:250px;
	height:40px;
	color:#fff;
	background:#DB1A1A;
	border-radius:25px;
	margin-top:25px;
	transition:0.3s ease;
	border:none;
	cursor:pointer;
}
div.login-wrap .button::after{display:none;}
div.login-wrap .button.back{
	font-size:14px;
	background:#273343;
}


div.login-wrap a.forget{
	display:table;
	color:#273343;
	text-decoration:underline;
	text-align:center;
	margin:15px auto 0;
}
div.login-wrap a.forget:hover{text-decoration:none;}


main{min-height:100vh;}
div.area{
	padding-left:15px;
	padding-right:15px;
}
div.area + div.area{margin-top:clamp(30px,5.995vw,50px);}
div.area.col{padding:clamp(30px,5.995vw,50px) 15px;}
div.area.col.st01{background:#F2F7FF;}
div.area.col.st02{background:#F8F7F4;}

/* TOP お問い合わせ */
div.area.col.st03{background:#273343;}
div.area + div.area.col.st03{margin-top:0;}
div.area.col.st03 h2{
	color:#fff;
	text-align:center;
	padding:0;
	border:none;
}
div.area.col.st03 h2 + p{color:#fff;}
div.area.col.st03 p.center{text-align:center;}

div.area div.inner{
	width:640px;
	margin:0 auto;
}

div.area div.inner.arrow{
	position:relative;
	margin-top:50px;
}
div.area div.inner.arrow::before{
	position:absolute;
	content:"";
	display:inline-block;
	top:-30px;
	left:50%;
	transform:translateX(-50%) rotate(90deg);
	width:15px;
	height:12px;
	background:url(../img/icon/arrow-blk.svg) center/contain no-repeat;
}

h1{
	color:#fff;
	font-size:clamp(18px,4.583vw,22px);
	line-height:1;
	text-align:center;
	padding:15px;
	background:#273343;
}
h1.error{background:#ED4C4C;}

h1 + *{margin-top:clamp(30px,5.995vw,50px);}

h2{
	font-size:18px;
	line-height:1.5;
	padding:15px 10px;
	border-top:1px solid #273343;
	border-bottom:1px solid #273343;
}
h2 + *{margin-top:clamp(15px,2.997vw,25px);}
* + h2{margin-top:clamp(30px,5.995vw,50px);}
h2 + p{margin-top:5px;}


h3{
	color:#fff;
	font-size:14px;
	line-height:1;
	padding:15px;
	background:#273343;
	border-radius:4px;
}
h3.error{background:#ED4C4C;}
h3 + *{margin-top:10px;}
* + h3{margin-top:clamp(15px,3.597vw,30px);}

.button{
	position:relative;
	display:flex;
	justify-content:center;
	align-items:center;
	width:250px;
	height:50px;
	color:#fff;
	font-size:clamp(12px,1.678vw,14px);
	background:#273343;
	border-radius:25px;
	margin:30px auto 0;
	transition:0.3s ease;
	border:none;
	cursor:pointer;
}
.button::after{
	position:absolute;
	content:"";
	display:inline-block;
	top:50%;
	right:15px;
	transform:translateY(-50%);
	width:15px;
	height:13px;
	background:url(../img/icon/arrow.svg) center/contain no-repeat;
}
.button:hover{opacity:0.7;}
.button.apply{background:#DB1A19;}

/* 押せない状態 */
.button.invalid{
	background:#999;
	pointer-events: none;
}
/* ログアウト */
nav#nav ul.menu li.logout{padding:30px 0 50px;}
.button.logout{
	width:180px;
	height:35px;
	color:#273343;
	font-size:12px;
	background:#fff;
	border:2px solid #273343;
	margin:0 auto;
}
.button.logout:hover{
	color:#fff;
	background:#273343;
	opacity:1;
}
.button.logout::after{display:none;}


.button.back::after{
	position:absolute;
	content:"";
	display:inline-block;
	top:50%;
	right:auto;
	left:20px;
	transform:translateY(-50%) rotate(180deg);
	width:15px;
	height:13px;
	background:url(../img/icon/arrow.svg) center/contain no-repeat;
}
.button + .button{margin-top:10px;}

ul.attention li{
	padding-left:1em;
	text-indent:-1em;
}

br.br480{display:none;}
br.br834{display:none;}

@media screen and (max-width:834px){
	
.pan{
	width:auto;
	padding:10px 15px;
}

div.area div.inner{width:450px;}

h2{font-size:16px;}

br.br834{display:inline;}
br.br834-non{display:none;}

}

@media screen and (max-width:480px){

br.br480{display:inline;}
br.br480-non{display:none;}

}

/******************** header ヘッダー********************/
header{
  position:relative;
  padding:0;
  background:#fff;
  border-bottom:1px solid #E0E0E0;
  z-index:20;
}
#header{
  position:relative;
  display:flex;
  justify-content:flex-end;
  align-items:center;
  width:834px;
  height:70px;
  margin:0 auto;
  padding-right:90px;
  background:#fff;
}
div#logo{
  width:200px;
  margin:0 auto 0 0;
  padding:0;
  transition:0.3s ease;
}
div#logo img{
  display:inline-block;
  vertical-align: bottom;
}
div#logo a{
  display:block;
  transition:0.3s ease;
}
div#logo a:hover{opacity:0.7;}

div#head-point p{
	font-size:12px;
	text-align:right;
	line-height:1.5;
}
div#head-point p span{
	color:#00B19F;
	font-weight:600;
	padding-right:5px;
}

@media screen and (max-width:834px){

#header{
  height:50px;
  padding-right:60px;
}
div#logo{width:150px;}

div#head-point p{
	font-size:10px;
	letter-spacing:0.5pt;
}

}


/******************** navigation SP ********************/
#mobile-head{display:inline;}

#wrapper::before{
  visibility: hidden;
  opacity:0;
  position:fixed;
  content:"";
  right:0;
  top:0;
  width:100%;
  height:100%;
  background:rgba(0,0,0,0.5);
  z-index:-1;
  transition:0.2s ease-in-out;
}
#wrapper.add_bk::before{
  visibility:inherit;
  opacity:1;
  z-index:11;
}

#nav-toggle {
	display:block;
	position: relative;
	top:1px;
	width: 70px;
	height: 70px;
	cursor: pointer;
	transition:0.3s ease;
	border-left:1px solid #e0e0e0;
	border-right:1px solid #e0e0e0;
}
#nav-toggle div {
  position: absolute;
  top:22px;
  left:18px;
  width:30px;
  height:30px;
}
#nav-toggle span {
display: block;
position: absolute;
height: 3px;
border-radius: 4px;
width: 100%;
background:#111;
left: 50%;
transform: translateX(-50%);
-webkit-transition: .35s ease-in-out;
-moz-transition: .35s ease-in-out;
transition: .35s ease-in-out;
}
#nav-toggle span:nth-child(1) {top: 0;}
#nav-toggle span:nth-child(2) {top: 11px;}
#nav-toggle span:nth-child(3) {top: 22px;}

#navigation {
display:block;
margin-top: 0;
}
#mobile-head {
width: 70px;
height: 70px;
position: absolute;
right:0;
bottom:0;
transition:0.3s ease;
}

nav#nav {
  visibility:hidden;
  position: fixed;
  top:71px;
  right:0;
  width:0;
  height:calc(100vh - 71px);    
  -webkit-transition: .2s ease-in-out;
  -moz-transition: .2s ease-in-out;
  transition: .2s ease-in-out;
  display: block;
  border-left:1px solid #e0e0e0;
  background:#fff;
  opacity:0;
}
.open nav#nav {
  visibility:inherit;
  width:320px;
  opacity:1;
}

nav#nav ul.menu {
  position:relative;
  display:block;
  margin:0 0 0 auto;
  width:320px;
  max-width:initial;
  height:100%;
  overflow-y: scroll;
  overflow-x:hidden;
  -webkit-overflow-scrolling: touch;
}
nav#nav ul.menu li{
  display:block;
  position:relative;
  padding:0;
}

nav#nav ul.menu li.nav-user-info{
	line-height:1.5;
	padding:20px 15px 20px 80px;
	background:#F2F7FF;
}
nav#nav ul.menu li.nav-user-info::before{
	position:absolute;
	content:"";
	display:inline-block;
	left:30px;
	top:50%;
	transform:translateY(-50%);
	width:35px;
	height:60px;
	background:url(../img/icon/menu/icon00.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav-user-info span{display:block;}
nav#nav ul.menu li.nav-user-info span#nav-id{color:#00B19F;}

nav#nav ul.menu li + li{
  margin-left:0;
  border-top:1px solid #E0E0E0;
}

nav#nav ul.menu > li > a{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  height:50px;
  color:#111;
  font-size: 14px;
  font-weight:500;
  line-height:1;
  letter-spacing:0.5pt;
  text-decoration:none;
  margin:0;
  padding:0;
}
nav#nav ul.menu > li > a span{padding-left:55px;}
nav#nav ul.menu > li > a span span.min{
  font-size:10px;
  padding-left:0;
}

nav#nav ul.menu > li > a span::before{
  position:absolute;
  content:"";
  display:inline-block;
  left:20px;
  top:50%;
  transform:translateY(-50%);
}

nav#nav ul.menu li.nav_i01 a span::before{
	width:15px;
	height:23px;
	background:url(../img/icon/menu/icon01.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i02 a span::before{
	left:18px;
	width:20px;
	height:15px;
	background:url(../img/icon/menu/icon02.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i03 a span::before{
	left:21px;
	width:15px;
	height:26px;
	background:url(../img/icon/menu/icon03.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i04 a span::before{
	left:18px;
	width:21px;
	height:25px;
	background:url(../img/icon/menu/icon04.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i05 a span::before{
	left:19px;
	width:20px;
	height:20px;
	background:url(../img/icon/menu/icon05.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i06 a span::before{
	width:20px;
	height:20px;
	background:url(../img/icon/menu/icon06.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i07 a span::before{
	left:19px;
	width:20px;
	height:24px;
	background:url(../img/icon/menu/icon07.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i08 a span::before{
	left:18px;
	width:23px;
	height:30px;
	background:url(../img/icon/menu/icon08.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i09 a span::before{
	left:18px;
	width:24px;
	height:26px;
	background:url(../img/icon/menu/icon09.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i10 a span::before{
	width:21px;
	height:29px;
	background:url(../img/icon/menu/icon10.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i11 a span::before{
	left:15px;
	width:29px;
	height:20px;
	background:url(../img/icon/menu/icon11.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i12 a span::before{
	left:15px;
	width:28px;
	height:24px;
	background:url(../img/icon/menu/icon12.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i13 a span::before{
	left:15px;
	width:29px;
	height:20px;
	background:url(../img/icon/menu/icon13.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i14 a span::before{
	left:14px;
	width:28px;
	height:32px;
	background:url(../img/icon/menu/icon14.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i15 a span::before{
	left:14px;
	width:28px;
	height:25px;
	background:url(../img/icon/menu/icon15.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i16 a span::before{
	left:18px;
	width:20px;
	height:25px;
	background:url(../img/icon/menu/icon16.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i17 a span::before{
	left:18px;
	width:20px;
	height:30px;
	background:url(../img/icon/menu/icon17.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i18 a span::before{
	left:17px;
	width:25px;
	height:25px;
	background:url(../img/icon/menu/icon18.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i19 a span::before{
	left:19px;
	width:25px;
	height:25px;
	background:url(../img/icon/menu/icon19.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i20 a span::before{
	left:16px;
	width:25px;
	height:27.2px;
	background:url(../img/icon/menu/icon20.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i21 a span::before{
	left:15px;
	width:25px;
	height:25px;
	background:url(../img/icon/mypage/icon20.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i22 a span::before{
	left:19px;
	width:23.38px;
	height:25px;
	background:url(../img/icon/mypage/icon21.svg) center/contain no-repeat;
}
nav#nav ul.menu li.nav_i23 a span::before{
	left:22px;
	width:15px;
	height:19.38px;
	background:url(../img/icon/menu/icon21.svg) center/contain no-repeat;
}

nav#nav ul.menu li + li.sub_st{
	border-top:none;
	background:#F2F7FF;
}
nav#nav ul.menu li.sub_st + li.sub_st a{border-top:1px solid #e0e0e0;}
nav#nav ul.menu > li.sub_st a{
	position:relative;
	height:auto;
	font-size:12px;
	padding:15px;
}
nav#nav ul.menu > li.sub_st a::after{
	position:absolute;
	content:"";
	display:inline-block;
	width:10px;
	height:7px;
	top:50%;
	transform:translateY(-50%) rotate(0);
	right:13px;
	margin:0;
	background:url(../img/icon/arrow-blk.svg) center/contain no-repeat;
	border:none;
}

/* arrow */
nav#nav ul.menu li a::after {
position: absolute;
content: "";
display:inline-block;
top: 50%;
right: 15px;
width: 6px;
height: 6px;
border-top: 1px solid #111;
border-right: 1px solid #111;
transform:translateY(-50%) rotate(45deg);
}
nav#nav ul.menu li a:hover,
nav#nav ul.menu li.current a{background:#E5F7F5;}

/* ハンバーガー */
.open #nav-toggle span{border-radius:0;}
.open #nav-toggle span:nth-child(1) {
left: 1px;
top: 11px;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
transform: rotate(45deg);
}
.open #nav-toggle span:nth-child(2) {
width: 0;
left: 50%;
}
.open #nav-toggle span:nth-child(3) {
left: 1px;
top: 11px;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
transform: rotate(-45deg);
}

/* +- */
nav#nav li.child > i{
display: inline-block;
position: absolute;
top: 0;
right: 0;
width: 100%;
height:49px;
line-height: 1;
cursor: pointer;
}
nav#nav li.child > i:before,
nav#nav li.child > i:after{
content: "";
display: inline-block;
position: absolute;
top:24px;
right:10px;
width: 12px;
height: 1px;
background: #111;
-webkit-transform-origin: center center;
-moz-transform-origin: center center;
-ms-transform-origin: center center;
-o-transform-origin: center center;
transform-origin: center center;
}
nav#nav li.child > i:after{
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
}
nav#nav li.child.open > i:after{
-webkit-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}


@media screen and (max-width:834px){

#nav-toggle {
	width: 50px;
	height: 50px;
	border-right:none;
}
#nav-toggle div {
  top:12px;
  left:12px;
  width:26px;
  height:26px;
}
#mobile-head {
	width: 50px;
	height: 50px;
}
nav#nav {
	top:51px;
	height:calc(100vh - 51px);  
}

}


/******************** footer ********************/
footer{margin-top:75px;}
footer div.f-nav{
	display:flex;
	justify-content:center;
	background:#E0E0E0;
	padding:15px;
}

footer div.f-nav a{
	color:#273343;
	font-size:12px;
	text-decoration:underline;
}
footer div.f-nav a:hover{text-decoration:none;}
footer div.f-nav a + a{margin-left:3em;}

footer #copyright{
	color:#fff;
	text-align:center;
	padding:15px;
	background:#273343;
}

@media screen and (max-width:834px){

footer{margin-top:clamp(30px,5.995vw,50px);}	
footer div.f-nav a + a{margin-left:1em;}

}

/******************** MyサンシスコンTOP ここから ********************/

/* ユーザID */
div#user-id{
	margin:0 auto;
	padding:0 15px;
	background:#fff;
}
div#user-id p{
	width:640px;
	color:#273343;
	padding:10px 0;
	margin:0 auto;
	text-align:right;
}

div#select-contract{padding:0 15px;}
div#select-contract #contract-id{
	width:100px;
	padding:5px 10px;
	background:#f7f7f7;
	border:1px solid #e0e0e0;
	border-radius:6px;
}


div.main-menu div.box{
	display:flex;
	justify-content:space-between;
	flex-wrap:wrap;
}
div.main-menu div.box + div.box{margin-top:15px;}

div.main-menu div.box div{
	display:flex;
	flex-direction:column;
	width:calc((100% - 180px)/2);
	padding:15px;
	background:#fff;
	border-radius:clamp(4px,1.199vw,10px);
	border:1px solid #e0e0e0;
}
div.main-menu div.box.upper div{width:calc(100% - 165px);}

div.main-menu p{
	font-size:48px;
	font-weight:600;
	line-height:1;
	text-align:center;
	padding-top:35px;
}
div.main-menu p.heading{
	font-size:14px;
	font-weight:500;
	letter-spacing:0.5pt;
	text-align:left;
	padding:0;
}
div.main-menu p span{
	font-size:28px;
	font-weight:500;
	padding-left:5px;
}


/* 契約情報＆メール設定 */
div.main-menu div.box a{
	position:relative;
	display:flex;
	justify-content:center;
	align-items:flex-end;
	width:150px;
	height:150px;
	color:#273343;
	padding-bottom:15px;
	background:#fff;
	border-radius:clamp(4px,1.199vw,10px);
	border:1px solid #e0e0e0;
	transition:0.3s ease;
	box-shadow:0 3px 0 rgba(0,0,0,0.1);
	transform:translateY(0);
}
div.main-menu div.box a:hover,
div.main-menu a.index-purchase:hover{
	color:#00B19F;
	background:#E5F7F5;
	border-color:#00B19F;
	box-shadow:0 0 0 rgba(0,0,0,0.1);
	transform:translateY(3px);
}
div.main-menu div.box a::before{
	position:absolute;
	content:"";
	display:inline-block;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
}
div.main-menu div.box.upper a::before{
	width:35px;
	height:60px;
	background:url(../img/index/icon01.svg) center/contain no-repeat;
	margin-top:-15px;
}
div.main-menu div.box.under a::before{
	width:77px;
	height:55px;
	background:url(../img/index/icon02.svg) center/contain no-repeat;
	margin:-5px auto auto 7px;
}

/* スマホ　アクセ　購入バナー */
div.main-menu a.index-purchase{
	position:relative;
	display:flex;
	align-items:center;
	height:200px;
	color:#273343;
	font-size:clamp(30px,4.796vw,30px);
	line-height:1.5;
	background:#fff;
	border-radius:clamp(4px,1.199vw,10px);
	border:1px solid #e0e0e0;
	margin-top:15px;
	padding-left:280px;
	transition:0.3s ease;
	box-shadow:0 3px 0 rgba(0,0,0,0.1);
}
div.main-menu a.index-purchase span{
	font-size:24px;
	padding-right:10px;
}
div.main-menu a.index-purchase::before {
	position: absolute;
	content: "";
	display:inline-block;
	left:clamp(30px,5.395vw,45px);
	bottom:0;
	width:clamp(150px,23.98vw,200px);
	height:clamp(135px,21.462vw,179px);
	background:url(../img/index/image.png) center/contain no-repeat;
}
div.main-menu a.index-purchase::after {
	position: absolute;
	content: "";
	display:inline-block;
	top: 50%;
	right: 35px;
	width: 15px;
	height: 15px;
	border-top: 2px solid #273343;
	border-right: 2px solid #273343;
	transform:translateY(-50%) rotate(45deg);
	transition:0.3s ease;
}
div.main-menu a.index-purchase:hover::after{right:25px;}


@media screen and (max-width:834px){

/* ユーザID */
div#user-id p{
	width:450px;
	font-size:14px;
}

div.main-menu div.box + div.box{margin-top:5px;}
div.main-menu div.box div{
	width:calc((100% - 110px)/2);
	padding:15px 10px 20px;
}
div.main-menu div.box.upper div{width:calc(100% - 105px);}

div.main-menu p{
	font-size:clamp(24px,6.25vw,30px);
	padding-top:25px;
}
div.main-menu p.heading{font-size:clamp(9px,1.875vw,12px);}
div.main-menu p span{font-size:16px;}

/* 契約情報＆メール設定 */
div.main-menu div.box a{
	width:100px;
	height:100px;
	font-size:12px;
	padding-bottom:10px;
}
div.main-menu div.box.upper a::before{
	width:20px;
	height:35px;
	margin-top:-10px;
}
div.main-menu div.box.under a::before{
	width:40px;
	height:29px;
	margin:-4px 0 0 4px;
}

/* スマホ　アクセ　購入バナー */
div.main-menu a.index-purchase{
	height:100px;
	font-size:16px;
	margin-top:5px;
	padding-left:130px;
}
div.main-menu a.index-purchase span{font-size:14px;}
div.main-menu a.index-purchase::before {
	left:15px;
	width:100px;
	height:90px;
}
div.main-menu a.index-purchase::after {
	right: 20px;
	width: 10px;
	height: 10px;
}
div.main-menu a.index-purchase:hover::after{right:20px;}

}


/* myページメニュー */
div.mypage-menu{
	display:flex;
	flex-wrap:wrap;
}
div.mypage-menu a{
	position:relative;
	display:flex;
	flex-direction:column;
	justify-content:flex-end;
	align-items:center;
	width:calc((100% - 30px)/4);
	height:150px;
	color:#273343;
	margin-right:10px;
	padding:15px 2px;
	background:#fff;
	border:1px solid #e0e0e0;
	border-radius:clamp(4px,1.199vw,10px);
	transition:0.3s ease;
	box-shadow:0 3px 0 rgba(0,0,0,0.1);
	transform:translateY(0);
}
div.mypage-menu a:hover{
	color:#00B19F;
	background:#E5F7F5;
	border-color:#00B19F;
	box-shadow:0 0 0 #00B19F;
	transform:translateY(3px);
}
div.mypage-menu a:nth-child(4n){margin-right:0;}
div.mypage-menu a:nth-child(n + 5){margin-top:10px;}

div.mypage-menu a img{
	position:absolute;
	display:inline-block;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	margin-top:-10px;
}

/* 画像位置調整 */
div.mypage-menu a.myp-icon01 img,
div.mypage-menu a.myp-icon05 img,
div.mypage-menu a.myp-icon07 img,
div.mypage-menu a.myp-icon08 img,
div.mypage-menu a.myp-icon11 img,
div.mypage-menu a.myp-icon14 img,
div.mypage-menu a.myp-icon17 img,
div.mypage-menu a.myp-icon18 img,
div.mypage-menu a.myp-icon21 img{padding-left:5px;}
div.mypage-menu a span{letter-spacing:0.25pt;}


@media screen and (max-width:834px){

/* myページメニュー */
div.mypage-menu{width:450px;}
div.mypage-menu a{
	width:calc((100% - 20px)/3);
	height:clamp(100px,31.25vw,150px);	
	font-size:12px;
	letter-spacing:0;
	margin-right:10px;
}
div.mypage-menu a:nth-child(4n){margin-right:10px;}
div.mypage-menu a:nth-child(n + 4){margin-top:10px;}
div.mypage-menu a:nth-child(3n){margin-right:0;}

}

@media screen and (max-width:480px){

div.mypage-menu a{
	width:calc((100% - 10px)/3);
	padding-bottom:10px;
	margin-right:5px;
}
div.mypage-menu a:nth-child(4n){margin-right:5px;}
div.mypage-menu a:nth-child(n + 4){margin-top:8px;}
div.mypage-menu a:nth-child(3n){margin-right:0;}


div.mypage-menu a img{margin-top:-7px;}
div.mypage-menu a.myp-icon01 img{width:45px;}
div.mypage-menu a.myp-icon02 img{width:25px;}
div.mypage-menu a.myp-icon03 img{width:25px;}
div.mypage-menu a.myp-icon04 img{width:60px;}
div.mypage-menu a.myp-icon05 img{width:45px;}
div.mypage-menu a.myp-icon06 img{width:55px;}
div.mypage-menu a.myp-icon07 img{width:35px;}
div.mypage-menu a.myp-icon08 img{width:60px;}
div.mypage-menu a.myp-icon09 img{width:50px;}
div.mypage-menu a.myp-icon10 img{width:70px;}
div.mypage-menu a.myp-icon11 img{width:60px;}
div.mypage-menu a.myp-icon13 img{width:45px;}
div.mypage-menu a.myp-icon14 img{width:50px;}
div.mypage-menu a.myp-icon15 img{width:50px;}
div.mypage-menu a.myp-icon16 img{width:50px;}
div.mypage-menu a.myp-icon17 img{width:50px;}
div.mypage-menu a.myp-icon18 img{width:50px;}
div.mypage-menu a.myp-icon19 img{width:60px;}
div.mypage-menu a.myp-icon20 img{width:50px;}
div.mypage-menu a.myp-icon21 img{width:45px;}
div.mypage-menu a.myp-icon22 img{width:60px;}

}

/* お知らせ */
ul.news-list li + li{
	margin-top:15px;
	padding-top:15px;
	border-top:1px dashed #e0e0e0;
}
ul.news-list li a{color:#273343;}
ul.news-list li a span{
	position:relative;
	font-size:12px;
	line-height:1;
}
ul.news-list li a span.cate{
	color:#E92B66;
	border:1px solid #E92B66;
	padding:5px 10px;
	border-radius:4px;
	margin-left:5px;
}
ul.news-list li a p{
	text-decoration:underline;
	padding-top:5px;
}
ul.news-list li a:hover p{text-decoration:none;}


/******************** MyサンシスコンTOP ここまで ********************/



/******************** 下層ページ ここから ********************/

/* 現在のご契約状況 */
table.lower-user-data{
	width:100%;
	border:1px solid #e0e0e0;
	border-collapse: separate;
	border-spacing:0;
	border-radius:clamp(4px,1.199vw,10px);
	overflow:hidden;
}
table.lower-user-data + table.lower-user-data{margin-top:15px;}

table.lower-user-data img{
	display:block;
	width:60px;
	margin-top:5px;
}
table.lower-user-data tr th,
table.lower-user-data tr td{
	position:relative;
	padding:15px;
}
table.lower-user-data tr + tr th,
table.lower-user-data tr + tr td{border-top:1px solid #e0e0e0;}
table.lower-user-data th + td{border-left:1px solid #e0e0e0;}

table.lower-user-data tr th{
	color:#273343;
	width:160px;
	background:#f7f7f7;
}
table.lower-user-data tr.update th{
	color:#fff;
	background:#00B19F;
}
table.lower-user-data tr.update td{background:#E5F7F5;}

table.lower-user-data .add{
	color:#E92B66;
	font-weight:900;
	padding-left:.5em;
}
table.lower-user-data tr.total th{
	color:#fff;
	background:#E92B66;
}
table.lower-user-data tr.total td{background:#FFEFEF;}
table.lower-user-data .min{
	display:block;
	color:#999;
	font-size:12px;
}

table.lower-user-data a.btn{
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	right:15px;
	display:flex;
	justify-content:center;
	align-items:center;
	width:50px;
	height:30px;
	border-radius:4px;
	color:#fff;
	letter-spacing:0;
	background:#00B19F;
	border:1px solid #00B19F;
	transition:0.3s ease;
}
table.lower-user-data a.btn:hover{
	color:#00B19F;
	background:#fff;
}

table.lower-user-data + p{margin-top:10px;}

@media screen and (max-width:834px){

table.lower-user-data tr th{font-size:12px;}	
table.lower-user-data tr th{
	width:115px;
	padding:15px 0;
	letter-spacing:0.5pt;
}
table.lower-user-data .add{
	display:block;
	padding-left:0;
}

}

@media screen and (max-width:480px){

table.lower-user-data a.btn{
	position:inherit;
	top:0;
	transform:translateY(0);
	right:0;
	width:auto;
	margin-top:5px;
}	

}

/* オプション */
div.option-data{
	display:flex;
	justify-content:space-between;
	align-items:center;
	padding:50px;
	border:1px solid #e0e0e0;
	border-radius:clamp(4px,1.199vw,10px);
}
div.option-data div.img{width:150px;}
div.option-data div.txt{width:calc(100% - 180px);}
div.option-data p.name{font-size:20px;}
div.option-data p.name .fee{
	display:block;
	font-size:14px;
}
div.option-data p.explanation{
	padding-top:10px;
	margin-top:10px;
	border-top:1px solid #e0e0e0;
}

@media screen and (max-width:834px){

/* オプション */
div.option-data{
	flex-direction:column;
	padding:clamp(15px,3.597vw,30px);
}

div.option-data div.img{width:100px;}
div.option-data div.txt{
	width:100%;
	margin-top:clamp(15px,3.597vw,30px);
}

}


/******************** フォーム関係 ここから ********************/
div.contract-box{
  padding:35px 30px 30px;
  border-radius:clamp(4px,1.199vw,10px);
  border:1px solid #e0e0e0;
}
div.contract-box + div.contract-box{margin-top:30px;}

div.contract-box h3{
	position:relative;
	color:#273343;
	font-size:16px;
	font-weight:600;
	line-height:1.5;
	letter-spacing:0.5pt;
	text-align:center;
	margin:0 auto;
	padding:0;  
	background:none;
}
div.contract-box h3 + p{
  font-size:12px;
  text-align:center;
  margin-top:5px; 
}
div.contract-box p.center{text-align:center;}
div.contract-box * + h3{margin-top:clamp(30px,5.99vw,50px);}

div.contract-box h4{
	position:relative;
	color:#273343;
	font-size:14px;
	font-weight:600;
	line-height:1.5;
	letter-spacing:0.5pt;
	padding:5px;
	border-top:1px solid #273343;
	border-bottom:1px solid #273343;
}
div.contract-box h4 + *{margin-top:10px;}
div.contract-box * + h4{margin-top:30px;}

div.contract-box p.heading{
	position:relative;
	font-weight:600;
	line-height:1.5;
	letter-spacing:0.5pt;
}
div.contract-box * + p.heading{margin-top:20px;}
div.contract-box p.heading + *{margin-top:10px;}
div.contract-box p.heading .required{
	display:inline-block;
	color:#E92B66;
	font-size:10px;
	line-height:1;
	padding:4px;
	border:1px solid #E92B66;
	border-radius:4px;
	margin-left:10px;
}
div.contract-box p.heading .min{
	color:#999;
	font-size:12px;
}

div.contract-box div.flex{
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  width:450px;
  margin:25px auto 0;
}
div.contract-box p.heading + div.flex{margin-top:10px;}

div.contract-box div.flex.w-auto{width:auto;}
div.contract-box div.flex > label{width:100%;}
div.contract-box div.flex.column2 > label{width:calc((100% - 15px)/2);}
div.contract-box div.flex.column2 > label:nth-child(n + 3){margin-top:15px;}

div.contract-box .info-txt{
  display:table;
  position:relative;
  color:#0068B7;
  font-size:12px;
  text-decoration:none;
  line-height:1.3;
  font-weight:500;
  letter-spacing:0.25pt;
  padding-left:25px;
  cursor:pointer;
  margin-top:15px;
}
div.contract-box .info-txt + .info-txt{margin-top:10px;}
div.contract-box .info-txt:hover{text-decoration:underline;}

div.contract-box .info-txt::before{
  position:absolute;
  content:"";
  top:50%;
  transform:translateY(-50%);
  left:0;
  display:inline-block;
  width:20px;
  height:20px;
  background:url(../img/icon/plus_i.svg) center/contain no-repeat;
}
div.contract-box .info-txt.pdf_i::before{
	width:15px;
	height:19px;
	background:url(../img/icon/pdf_i.svg) center/contain no-repeat;
}

div.contract-box .info-txt span.new-i{
	color:#fff;
	font-size:10px;
	line-height:1;
	padding:3px 8px;
	margin-left:5px;
	background:#ED4C4C;
	border-radius:4px;
  }
div.contract-box .info-txt:hover span.new-i{text-decoration:underline;}

@media screen and (max-width:834px){

div.contract-box{padding:30px 15px;}

}

@media screen and (max-width:480px){

div.contract-box div.flex.column2 > label{width:calc((100% - 10px)/2);}
div.contract-box div.flex.column2 > label:nth-child(n + 3){margin-top:10px;}

}

/* text */
div.area input[type="text"],
div.area input[type="email"],
div.area input[type="tel"],
div.area input[type="date"],
div.area input[type="number"],
div.area input[type="time"],
div.area textarea,
div.area select {
  font-size:16px;
  display: inline-block;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  border-radius: 4px;
  padding: 12px;
  width:100%;
  max-width:100%;
  vertical-align: middle;
  border: none;
  color: #273343;
  background: #fff;
  border:1px solid #ccc;
}
div.area textarea{height:150px;}
div.area ::placeholder {color:#ccc;}
/* 旧Edge対応 */
div.area ::-ms-input-placeholder {color:#ccc;}
/* IE対応 */
div.area :-ms-input-placeholder {color:#ccc;}

/* ファイルアップロード ここから */
div.area input[type="file"] {display: none;}
div.area input[type="file"] + span{
  position: relative;
	display:flex;
  justify-content:flex-start;
  align-items:center;
  height:100%;
  min-height:60px;
  padding:15px 15px 15px 45px;
  border:1px solid #273343;
  border-radius:6px;
  color:#273343;
  font-size:14px;
  text-align:left;
  font-weight:600;
  line-height:1.5;
  letter-spacing:0.25pt;
	cursor: pointer;
  box-shadow:0 4px 0 #273343;
  transition:0.2s ease;
  transform:translateY(0);
}
div.area input[type="file"] + span:hover{
  background:#E5F7F5;
  border:1px solid #00B19F;
  box-shadow:none;
  transform:translateY(3px);
}
div.area input[type="file"] + span::before{
  position:absolute;
  content:"";
  top:50%;
  left:20px;
  transform:translateY(-50%);
  display:inline-block;
  width:20px;
  height:20px;
  background:url(../img/icon/memo_i.svg) center/contain no-repeat;
}
div.file-upload{text-align:center;}
div.file-upload + div.file-upload{margin-top:10px;}
div.file-upload div.preview-box{margin:15px auto 0;}
div.file-upload .file_name{
	display:inherit;
	font-size:12px;
}
/* ファイルアップロード ここまで */

div.contract-box div.column-type{
  display:flex;
  justify-content:space-between;
  margin-top:10px;
}

/* お名前 */
div.column-type.column2 div{width:calc((100% - 15px)/2);}
div.contract-box div.column-type.column3 div{width:calc((100% - 30px)/3);}

div.contract-box div.select{position:relative;}
div.contract-box div.select::after{
	position:absolute;
	content:"";
	display:inline-block;
	top:50%;
	right:16px;
	transform:translateY(-50%) rotate(135deg);
	margin-top:-1px;
	width:6px;
	height:6px;
	border-top:2px solid #273343;
	border-right:2px solid #273343;
}
div.contract-box #mbarea{
	display:flex;
	justify-content:space-between;
	align-items:center;
}
div.contract-box #mbarea::after{display:none;}
div.contract-box #mbarea input[type="number"]{width:calc(100% - 2em);}


@media screen and (max-width:480px){

div.contract-box div.column-type.column3 div{width:calc((100% - 10px)/3);}  

}

div.area input + p.min{margin-top:5px;}

/* radioボタン checkboxも同じ ここから */
div.area input[type="hidden"] + span,
div.area input[type="checkbox"] + span{position: relative;}
div.area input[type="radio"],
div.area input[type="checkbox"]{display: none;}
div.area input[type="radio"] + span,
div.area input[type="checkbox"] + span{
  position: relative;
  display:block;
  height:100%;
  min-height:100px;
  padding:50px 10px 15px;
  border:2px solid #efefef;
  border-radius:4px;
  color:#273343;
  font-size:14px;
  text-align:center;
  font-weight:600;
  line-height:1.5;
  letter-spacing:0.25pt;
	cursor: pointer;
  transition:0.2s ease;
}
div.area input[type="radio"] + span:hover,
div.area input[type="checkbox"] + span:hover{
  background:#f7f7f7;
  border-color:#273343;
}
div.area input[type="radio"] + span::before,
div.area input[type="hidden"] + span::before,
div.area input[type="checkbox"] + span::before {
    content: "";
    position: absolute;
    top:17px;
    left:50%;
    transform:translateX(-50%);
    display: block;
    width: 15px;
    height: 15px;
    background: #FFF;
}
div.area input[type="radio"] + span::before,
div.area input[type="checkbox"] + span::before{
	border: 3px solid #ccc;
	border-radius: 30px;
	transition:0.2s ease;
}
div.area input[type="radio"]:checked + span,
div.area input[type="checkbox"]:checked + span{
  border-color:#00B19F;
  background:#E5F7F5;
}
div.area input[type="radio"]:checked + span::before{border-color:#00B19F;}
div.area input[type="checkbox"]:checked + span::before{
  background:#00B19F;
  border-color:#00B19F;
}
div.area input[type="checkbox"]:checked + span::after {
	position: absolute;
	content: "";
	top: 23px;
	left:50%;
	transform:translate(-50%,0);
	margin-left:-5px;
	display: block;
	width: 8px;
	height: 5px;
	border-left: 2px solid #fff;
	border-bottom: 2px solid #fff;
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

@media screen and (max-width:480px){

/* radioボタン */  
div.area input[type="radio"] + span,
div.area input[type="checkbox"] + span{padding:45px 5px 15px;}

div.area input[type="radio"] + span::before,
div.area input[type="hidden"] + span::before,
div.area input[type="checkbox"] + span::before {
    width: 12px;
    height: 12px;
}  
div.area input[type="checkbox"]:checked + span::after {
	top:22px;
	margin-left:-4px;
	width: 6px;
	height: 4px;
}

}

span.account-type-label{
  position:absolute;
  top:-22px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  justify-content:center;
  align-items:center;
  width:200px;
  height:20px;
  font-size:12px;
  font-weight:600;
  line-height:1;
  letter-spacing:0;
  color:#ED4C4C;
}
span.account-type-label::before,
span.account-type-label::after{
  position:absolute;
  content:"";
  display:inline-block;
  left:0;
  width:2px;
  height:15px;
  background:#ED4C4C;
  transform:rotate(-25deg);
}
span.account-type-label::after{
  left:auto;
  right:0;
  transform:rotate(25deg);
}

@media screen and (max-width:480px){

span.account-type-label{
  top:-25px;
  width:110px;
  font-size:10px;
  line-height:1.1;
  text-align:center;
}
span.account-type-label::before,
span.account-type-label::after{height:20px;}

}

/* radioボタン checkboxも同じ ここまで */

/* 横向き チェックボックス ここから */
div.area label.beside input[type="checkbox"] + span,
div.area label.beside input[type="radio"] + span{
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:flex-start;
	min-height:80px;
	padding:15px 5px 15px 55px;
	text-align:left;
}
div.area label.beside input[type="checkbox"] + span::before,
div.area label.beside input[type="radio"] + span::before{
	top: 50%;
	transform:translate(0,-50%);
	left:20px;
}
div.area label.beside input[type="checkbox"]:checked + span::after,
div.area label.beside input[type="radio"]:checked + span::after {
	top: 50%;
	transform:translate(0,-50%);
	left:25px;
	margin-left:0;
	margin-top:-5px;
	display: block;
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
div.area label{
	position:relative;
	display:block;
}
div.area p.apply-message{
	font-size:12px;
	text-align:center;
	margin:clamp(30px,5.995vw,50px) 0 10px;
}

/*  基本データ通信容量 新規スタイル */
div.contract-box div.n-style{width:auto;}
div.n-style label + label{margin-top:15px;}
div.n-style label.beside input[type="checkbox"] + span.txt,
div.n-style label.beside input[type="radio"] + span.txt{
	flex-direction:row;
	justify-content:space-between;
	align-items:center;
	min-height:100px;
	padding:15px 5px 15px 50px;

}
div.n-style label.beside input[type="radio"] + span.txt span.gb,
div.n-style label.beside input[type="radio"] + span.txt span.fee{font-size:16px;}
div.n-style label.beside input[type="radio"] + span.txt span.fee{color:#E92B66;}
div.n-style label.beside input[type="radio"] + span.txt span.plan{
	font-size:12px;
	padding-left:.5em;
}
div.n-style label.beside input[type="radio"] + span.txt span.tax,
div.n-style label.beside input[type="checkbox"] + span span.tax{
	display:inline-block;
	font-size:10px;
	color:#273343;
	font-weight:500;
}

div.cam-label{
  display:none;
  position:absolute;
  top:-10px;
  left:-10px;
  width:auto;
  border-radius:15px;
  background:#ED4C4C;
}
div.cam-label::before{
  position:absolute;
  content:"";
  display:inline-block;
  left:17.5%;
  bottom:-10px;
  border:5px solid transparent;
  border-top:5px solid #ED4C4C;
}

div.cam-label span{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 1rem;
  color:#fff;
  font-size:12px;
  line-height:1;
  font-weight:600;
  height:30px;
}
div.cam-label.on{display:block;}
div.cam-label.blue{background:#0068B7;}
div.cam-label.grn{background:#00B19F;}
div.cam-label.pink{background:#E92B66;}
div.cam-label.gold{background:#D0A900;}
div.cam-label.red{background:#ED4C4C;}

div.cam-label.blue::before{border-top-color:#0068B7;}
div.cam-label.grn::before{border-top-color:#00B19F;}
div.cam-label.pink::before{border-top-color:#E92B66;}
div.cam-label.gold::before{border-top-color:#D0A900;}
div.cam-label.red::before{border-top-color:#ED4C4C;}

/* オプションラベル */
div.special-label{
  position:absolute;
  top:-15px;
  left:-10px;
  width:66%;
  min-width:260px;
  height:30px;
  border-radius:15px;
  background:linear-gradient(90deg, #EDE74C , #4CDAED);
  box-shadow:0 0 3px rgba(0,0,0,0.1);
}
div.special-label::before{
  position:absolute;
  content:"";
  display:inline-block;
  bottom:-15px;
  left:33px;
  border:8px solid transparent;
  border-top:8px solid #EDE74C;
}
div.special-label span{
  display:flex;
  align-items:center;
  justify-content:center;
  color:#111;
  font-size:clamp(12px,0.729vw,14px);
  line-height:1.3;
  font-weight:600;
  letter-spacing:0.25pt;
  height:100%;  
}

/* 人気ラベル */
div.popular-label{
  display:none;
  position:absolute;
  top:2px;
  right:2px;
  min-width:60px;
  border-radius:0 4px 0 4px;  
}
div.popular-label span{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 5px;
  color:#273343;
  font-size:10px;
  letter-spacing:0;
  line-height:1;
  font-weight:500;
  height:20px;
}
div.popular-label.on{display:block;}
div.popular-label.no01{background:#FFF2F2;}
div.popular-label.no02{background:#F2F7FF;}
div.popular-label.no03{background:#F3FFF2;}


@media screen and (max-width:834px){

div.n-style label.beside input[type="checkbox"] + span.txt,
div.n-style label.beside input[type="radio"] + span.txt{min-height:80px;}
div.n-style label.beside input[type="radio"] + span.txt span.plan{
	display:block;
	padding-left:0;
}

div.cam-label span{
	font-size:12px;
	height:25px;
}

}

@media screen and (max-width:480px){
  
div.area label.beside input[type="checkbox"]:checked + span::after {
	margin-top:-4px;
	width: 6px;
	height: 4px;
}
  
}
/* 横向き チェックボックス ここまで */


/* SIMカードを選ぶ ここから */
div.area label.sim input[type="radio"] + span{padding-left:90px;}
div.area label.sim input[type="radio"] + span span::after{
  position:absolute;
  content:"";
  top:50%;
  left:50px;
  transform:translateY(-50%);
  width:30px;
  height:43px;
  background:url(../img/icon/sim-i.png) center/contain no-repeat;
}
/* SIMカードを選ぶ ここまで */

/* 解約 ここから */
div.area label.cancellation input[type="radio"]:checked + span,
div.area label.cancellation input[type="checkbox"]:checked + span{
  border-color:#E92B66;
  background:#FFEFEF;
}
div.area label.cancellation input[type="radio"]:checked + span::before{border-color:#E92B66;}
/* 解約 ここまで */

/* 自動検索・確認メール */
div.contract-box button.sub-btn{
	position:relative;
	width:auto;
	height:40px;
	color:#fff;
	font-size:12px;
	margin-top:10px;
	padding: 0 15px 0 40px;
	border-radius:20px;
	border:1px solid #273343;
	background:#273343;
	cursor:pointer;
	transition:0.3s ease;
}
div.contract-box button.sub-btn:hover{opacity:0.7;}
div.contract-box button.sub-btn::before{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  left:15px;
  content:"";
  display:inline-block;
  width:16px;
  height:16px;
}
div.contract-box button.sub-btn.glass_i::before{background:url(../img/icon/glass_i.svg) center/contain no-repeat;}
div.contract-box button.sub-btn.mail_i::before{
	width:15px;
	height:11px;
	background:url(../img/icon/mail_i.svg) center/contain no-repeat;
	margin-top:1px;
}

/* 確認メール送信済み */
div.contract-box .mail_comp{
	position: relative;
	display:flex;
	justify-content:center;
	align-items:center;
	width:210px;
	height:40px;
	font-weight:600;
	padding: 0 25px 0 45px;
	background:#E5F7F5;
	cursor:auto;
	border-radius:20px;
  }
div.contract-box .mail_comp::before{
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	left:20px;
	content:"";
	display:inline-block;
	width:20px;
	height:20px;  
	background:url(../img/icon/check_i.svg) center/contain no-repeat;
  }


/* 商品を選ぶ ここから */
div.contract-box div.flex.item-select{width:auto;}
div.contract-box div.flex.item-select.center{justify-content:center;}
div.contract-box div.flex.item-select > label{width:calc((100% - 30px)/2);}
div.contract-box div.flex.item-select > label:nth-child(n + 3){margin-top:0;}
div.contract-box div.flex.item-select > label:nth-child(n + 5){margin-top:30px;}

div.contract-box div.flex.item-select.modal-non > label:nth-child(n + 3){margin-top:30px;}

div.contract-box div.flex.item-select input[type="radio"] + span{padding-bottom:55px;}
div.contract-box div.flex.item-select span.img{
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:150px;
  padding:10px;
  background:#fff;
  border-radius:clamp(4px,1.199vw,10px);
}
div.contract-box div.flex.item-select span.img img{
  width:auto;
  max-height:160px;
}
div.contract-box div.flex.item-select span.iteminfo{
  display:table;
  position:relative;
  color:#0068B7;
  font-size:12px;
  text-decoration:none;
  line-height:1.3;
  font-weight:500;
  letter-spacing:0.25pt;
  padding-left:25px;
  cursor:pointer;
  margin:15px auto 0;
}
div.contract-box div.flex.item-select span.iteminfo:hover{text-decoration:underline;}
div.contract-box div.flex.item-select span.iteminfo::before{
  position:absolute;
  content:"";
  top:50%;
  transform:translateY(-50%);
  left:0;
  display:inline-block;
  width:20px;
  height:20px;
  background:url(../img/icon/plus_i.svg) center/contain no-repeat;
}
div.contract-box div.flex.item-select span.name,
div.contract-box div.flex.item-select span.price{
  display:block;
  font-size:14px;
  color:#273343;
  margin-top:10px;
}
div.contract-box div.flex.item-select span.price{
  font-size:16px;
  line-height:1;
  margin-top:5px;
}
div.contract-box div.flex.item-select span.tax{
  color:#666;
  font-size:12px;
}
div.contract-box div.flex.item-select span.campaign-label{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:15px;
  display:flex;
  justify-content:center;
  align-items:center;
  width:180px;
  height:30px;
  color:#fff;
  font-size:12px;
  line-height:1.3;
  padding:0;
  background:#E92B66;
  border-radius:clamp(4px,1.199vw,10px);
}

/* 在庫なし表示 */
label.soldout{pointer-events:none;}
label.soldout span.name::before{
  position:absolute;
  top:0;
  left:0;
  display:inline-block;
  content:"";
  width:100%;
  height:100%;
  background:rgba(39,51,67,0.66);
  border-radius:2px;
  z-index:1;
}
label.soldout span.name::after{
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  content:"在庫なし";
  display:flex;
  justify-content:center;
  align-items:center;
  color:#fff;
  font-size:14px;
  line-height:1;
  width:80px;
  height:30px;
  background:#DB1A1A;
  z-index:2;
}

@media screen and (max-width:834px){

div.contract-box div.flex.item-select > label{width:calc((100% - 15px)/2);}
div.contract-box div.flex.item-select > label:nth-child(n + 5){margin-top:15px;}
div.contract-box div.flex.item-select.modal-non > label:nth-child(n + 3){margin-top:15px;}
div.contract-box div.flex.item-select input[type="radio"] + span{padding-bottom:65px;}

div.contract-box div.flex.item-select span.img{min-height:120px;}
div.contract-box div.flex.item-select span.img img{max-height:100px;}

div.contract-box div.flex.item-select span.name{margin-top:15px;}
div.contract-box div.flex.item-select span.tax{font-size:10px;}

div.contract-box div.flex.item-select span.campaign-label{
	bottom:10px;
	height:40px;
}

}

@media screen and (max-width:480px){

div.contract-box div.flex.item-select > label{width:calc((100% - 10px)/2);}
div.contract-box div.flex.item-select > label:nth-child(n + 5){margin-top:10px;}
div.contract-box div.flex.item-select.modal-non > label:nth-child(n + 3){margin-top:10px;}
div.contract-box div.flex.item-select span.name{font-size:12px;}
div.contract-box div.flex.item-select span.campaign-label{
  width:120px;
  font-weight:500;
}  

}

/* 充電器 */
div.area p.charger-type{
  font-size:10px;
  text-align:center;
}
div.area input[type="radio"] + span span.min{
  display:block;
  font-size:12px;
  font-weight:500;
  margin-top:2px;
}

/* お問い合わせフォーム内　ご案内系 */
div.contract-box.information-type h3.heading{
	font-size:16px;
	text-align:center;
}
div.contract-box.information-type h3{text-align:left;}
div.contract-box.information-type * + h3{margin-top:30px;}

div.contract-box.information-type h3 + p{
	font-size:14px;
	text-align:left;
	margin-top:10px;
}
div.modelchange-wrap{
	background:#F3FFF2;
	border:2px solid #00B19F;
	padding:15px;
	margin:15px auto 0;
	border-radius:4px;
}
div.contract-box.information-type div.modelchange-wrap h3{color:#00B19F;}

div.modelchange-wrap + *{margin-top:15px;}

/* ボタン */
div.contract-box.information-type a.btn{
	position:relative;
	display:flex;
	align-items:center;
	justify-content:center;
	width:200px;
	height:40px;
	color:#fff;
	font-size:14px;
	font-weight:600;
	background:#0068B7;
	border:2px solid #0068B7;
	border-radius:20px;
	transition:0.3s ease;
	margin:15px auto 0;
}
div.contract-box.information-type a.btn:hover{
	color:#0068B7;
	background:#fff;
}
div.contract-box.information-type a.sub-btn{
	position:relative;
	display:flex;
	align-items:center;
	justify-content:center;
	width:150px;
	height:34px;
	color:#fff;
	font-size:14px;
	font-weight:600;
	background:#00B19F;
	border:2px solid #00B19F;
	border-radius:18px;
	margin-top:10px;
	transition:0.3s ease;
}
div.contract-box.information-type a.sub-btn:hover{
	color:#00B19F;
	background:#fff;
}

div.attention-wrap{
	background:#FEFCE8;
	border:1px solid #FEFC8A;
	border-radius:clamp(4px,1.199vw,10px);
	padding:15px;
	margin:15px auto 0;
}
div.attention-wrap p.heading{color:#A16207;}
div.attention-wrap p.heading + p{margin-top:5px;}

div.attention-wrap.type02{
	background:#FEF2F2;
	border-color:#FFE8E8;
}
div.attention-wrap.type02 p.heading{color:#DB1A19;}

table.user-apn{
	width:100%;
	border:1px solid #e0e0e0;
	border-collapse:separate;
	border-spacing:0;
	border-radius:clamp(4px,1.199vw,10px);
	overflow:hidden;
}
table.user-apn + *,
* + table.user-apn{margin-top:15px;}

table.user-apn tr + tr th,
table.user-apn tr + tr td{border-top:1px solid #e0e0e0;}
table.user-apn th{
	font-weight:600;
	width:100px;
	background:#f7f7f7;
}
table.user-apn th,
table.user-apn td{
	font-size:clamp(12px,1.678vw,14px);
	padding:15px 10px;
}
table.user-apn th + td{border-left:1px solid #e0e0e0;}

/******************** フォーム関係 ここまで ********************/

/******************** モーダル　ここから ********************/
.modal_bg {
  position: fixed;
  top: 0;
  left: 0;
  z-index:20;
  display: none;
  width: 100%;
  height: 120%;
  background: rgba(0, 0, 0, .25);
}
.modal_box {
  display: none;
  position: fixed;
  z-index:21;
  width:640px;
  max-width:calc(100% - 30px);
  height:auto;
  max-height:82vh;
  padding: 30px;
  background: #fff;
  overflow-y: scroll;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
  border-radius:clamp(4px,1.199vw,10px);
}
.modal_box span.b-btn{
  display:flex;
  justify-content:center;
  align-items:center;
  color:#fff;
  font-size:12px;
  line-height:1;
  letter-spacing:0;
  width:100px;
  height:30px;
  background:#273343;
  border:1px solid #273343;
  border-radius:15px;
  margin:30px auto 0;
  cursor:pointer;
  transition:0.2s ease;
}
.modal_box span.b-btn:hover{
  color:#273343;
  background:#fff;
  border:1px solid #273343;
}

/* モーダル内　データ容量の目安 */
.modal_box h3{font-size:16px;}
.modal_box h3 + p{margin-top:10px;}
.modal_box p{font-size:12px;}
.modal_box p.left{text-align:left;}

.modal_box p.min{font-size:12px;}
.modal_box p.indent{
  padding-left:1em;
  text-indent:-1em;
}

.modal_box h4{
  color:#273343;
  font-size:14px;
  line-height:1;
  font-weight:600;
  margin-top:30px;
  padding:0 0 10px;
  border-bottom:1px solid #273343;
}
.modal_box h4 + p{margin-top:10px;}

.modal_box span.osusume{
  position:relative;
  top:-1px;
  color:#fff;
  font-size:10px;
  line-height:1;
  font-weight:600;
  padding:3px 6px;
  background:#E92B66;
  border-radius:4px;
  margin-left:5px;
}
.modal_box div.attention{
  text-align:center;
  padding:10px 15px;
  margin-top:10px;
  background:#E5F7F5;
  border-radius:4px;
  pointer-events:none;
  text-decoration:none;
}


/* 商品詳細 */
.modal_box img.iteminfo-img{
  display:block;
  max-height:350px;
  margin:0 auto;
}
.modal_box p.iteminfo-name{
  color:#273343;
  font-size:14px;
  font-weight:600;
  text-align:center;
  line-height:1.5;
  margin-top:15px;
}
.modal_box p.iteminfo-price{
  font-weight:600;
  font-size:18px;
  text-align:center;
}
.modal_box p.iteminfo-price span.pink{color:#E92B66;}
.modal_box p.iteminfo-price span.taxin{
  color:#273343;
  font-size:12px;
}

.modal_box div.spec div{
  display:flex;
  border-bottom:1px solid #e0e0e0;
}
.modal_box div.spec div:nth-child(odd){background:#f7f7f7;}

.modal_box div.spec div p{
  width:calc(100% - 180px);
  font-size:12px;
  line-height:1.3;
  text-align:left;
  letter-spacing:0;
  padding:15px;
}
.modal_box div.spec div p.head{
  font-weight:600;
  width:150px;
}


/* フッター固定 料金欄 + モーダル内 */
div.current-price{
  position:fixed;
  bottom:15px;
  left:50%;
  transform:translateX(-50%);
  width:640px;
  height:60px;
  background:#fff;
  border-radius:6px;
  box-shadow:0 0 10px rgba(0,0,0,0.2);
  z-index:10;
  display:flex;

}
div.current-price.is-hidden{display:none;}
div.current-price div{
  position:relative;
  display:flex;
  justify-content:space-between;
  align-items:center;
  width:calc((100% - 90px)/2);
  padding:0 5px 0 15px;
}
div.current-price div + div::before{
  position:absolute;
  content:"";
  top:0;
  left:0;
  width:1px;
  height:100%;
  background:#efefef;
}
div.current-price span{
  font-size:14px;
  font-weight:600;
  letter-spacing:0.25pt;
}
div.current-price span.tax{
  color:#666;
  font-size:10px;
}
div.current-price p{
  color:#ED4C4C;
  font-weight:600;
  letter-spacing:0.25pt;
}

div.current-price div.modal_open{
  justify-content:center;
  width:90px;
  background:#ED4C4C;
  border-radius:0 6px 6px 0;
  cursor:pointer;
  transition:0.2s ease;
}
div.current-price div.modal_open::before{display:none;}
div.current-price div.modal_open:hover{opacity:0.7;}
div.current-price div.modal_open span{
  position:relative;
  display:inline-block;
  color:#fff;
  padding-left:18px;
  font-weight:500;
}
div.current-price div.modal_open span::before{
  position:absolute;
  content:"";
  left:-10px;
  top:50%;
  transform:translateY(-50%);
  display:inline-block;
  width:20px;
  height:20px;
  background:url(../img/icon/plus_i-wht.svg) center/contain no-repeat;
}

div.cost-details div.total,
div.cost-details div.list{
  display:flex;
  justify-content:space-between;
  align-items:center;
}
div.cost-details div.sub + div.total{margin-top:15px;}
div.cost-details div.total p{
  font-size:16px;
  font-weight:600;
}

div.cost-details div.sub{
  border:1px solid #e0e0e0;
  padding:15px;
  margin-top:15px;
  border-radius:6px;
}
div.cost-details div.list p{font-weight:600;}
div.cost-details div.list + div.list{
  margin-top:10px;
  padding-top:10px;
  border-top:1px dashed #e0e0e0;
}

div.cost-details span.tax{
  color:#666;
  font-size:10px;
}
div.cost-details span.name{
  display:block;
  font-size:10px;
  line-height:1.5;
  font-weight:500;
}


@media screen and (max-width:834px){
  
/* モーダル */
.modal_box {
  padding:30px 15px;
  border-radius:clamp(4px,1.199vw,10px);
}
div.contract-box .modal_box h3{font-size:16px;}
.modal_box div.attention{text-align:left;}

/* 商品詳細 */
.modal_box img.iteminfo-img{max-height:200px;}
.modal_box p.iteminfo-price{font-size:16px;}

/* フッター固定 料金欄 + モーダル内 */
div.current-price{
  width:480px;
  max-width:calc(100% - 30px);
  height:60px;
}
div.current-price div{
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
  width:calc((100% - 80px)/2);
  padding:5px 15px 0;
}
div.current-price span{
  font-size:12px;
  line-height:1;
}
div.current-price div.modal_open{
  align-items:center;
  width:80px;
  padding:0;
}
div.current-price div.modal_open span{padding:0 0 0 25px;}
div.current-price div.modal_open span::before{left:0;}

}

@media screen and (max-width:480px){

/* フッター固定 料金欄 + モーダル内 */
div.current-price div{
  width:calc((100% - 60px)/2);
  padding:5px 5px 0 10px;
}
div.current-price div.modal_open{width:60px;}
div.current-price div.modal_open span{padding:0 0 0 20px;}
div.current-price div.modal_open span::before{
  width:15px;
  height:15px;
}

div.cost-details div.total p{font-size:14px;}
div.cost-details div.list p{font-size:12px;}	

}

/******************** モーダル　ここまで ********************/


/* 解約前にご一読 */
div.please-read{
	display:flex;
	justify-content:space-between;
	align-items:center;
}
div.please-read + div.please-read{margin-top:30px;}

div.please-read a{
	position:relative;
	display:flex;
	flex-direction:column;
	justify-content:flex-end;
	align-items:center;
	width:150px;
	height:150px;
	color:#273343;
	padding-bottom:10px;
	border:1px solid #e0e0e0;
	border-radius:clamp(4px,1.199vw,10px);
	transition:0.3s ease;
}
div.please-read a img{
	position:absolute;
	content:"";
	display:inline-block;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	margin-top:-10px;
}
div.please-read a:hover{
	color:#00B19F;
	background:#E5F7F5;
}
div.please-read p{
	font-size:16px;
	width:calc(100% - 180px);
}

@media screen and (max-width:834px){

div.please-read{flex-direction:column;}
div.please-read a{
	flex-direction:row;
	justify-content:flex-start;
	align-items:center;
	width:100%;
	height:90px;
	padding:0 0 0 100px;
	margin-top:15px;
}
div.please-read a img{
	top:50%;
	left:25px;
	transform:translate(0,-50%);
	margin-top:0;
}
div.please-read a.myp-icon04 img{width:60px;}
div.please-read a.myp-icon10 img{
	width:65px;
	left:20px;
}

div.please-read p{
	font-size:14px;
	width:100%;
}	

}

/* wifi追加購入 */
div.wifi-spec{
	padding:clamp(30px,5.99vw,50px);
	border:1px solid #e0e0e0;
	border-radius:clamp(4px,1.199vw,10px);
}

div.wifi-spec div.img{text-align:center;}
div.wifi-spec div.img p{
	font-size:clamp(16px,2.398vw,20px);
	padding-top:10px;
}
div.wifi-spec div.img p .fee{
	color:#E92B66;
	font-weight:900;
	padding-left:5px;
}
div.wifi-spec div.img p .tax{
	color:#666;
	font-size:12px;
}

div.wifi-spec div.txt{margin-top:clamp(30px,5.99vw,50px);}
div.wifi-spec div.txt p{font-size:16px;}
div.wifi-spec div.txt p.heading{
	font-size:18px;
	padding-bottom:5px;
	border-bottom:1px solid #273343;
}
div.wifi-spec div.txt p.heading + *{margin-top:10px;}
div.wifi-spec div.txt * + p.heading{margin-top:15px;}


@media screen and (max-width:834px){

div.wifi-spec div.txt p{font-size:14px;}
div.wifi-spec div.txt p.heading{font-size:16px;}

}

/* お支払い方法の種類 */
div.payment-kinds{
	padding:30px clamp(15px,3.597vw,30px);
	border:1px solid #e0e0e0;
	border-radius:clamp(4px,1.199vw,10px);
	margin-top:15px;
	background:#f7f7f7;
}
div.payment-kinds h3.open{
	position:relative;
	color:#273343;
	font-size:16px;
	padding:0 30px 25px 0;
	border-bottom:1px solid #273343;
	background:none;
	border-radius:0;
	cursor:pointer;
}
div.payment-kinds div.detail-box + h3.open{margin-top:30px;}
div.payment-kinds h3.open div.accordion_icon,
div.payment-kinds h3.open div.accordion_icon span {
  display: inline-block;
  transition: .3s ease;
  box-sizing: border-box;
}
div.payment-kinds h3.open div.accordion_icon {
  position: absolute;
  top:-5px;
  right:0;
  width: 24px;
  height: 24px;

}
div.payment-kinds h3.open div.accordion_icon span {
  position: absolute;
  left: 25%;
  width: 50%;
  height: 2px;
  background: #273343;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -ms-border-radius: 4px;
  -moz-border-radius: 4px;
  -o-border-radius: 4px;
}
div.payment-kinds h3.open div.accordion_icon span:nth-of-type(1) {
  top: 12.5px;
  transform: rotate(0);
  -webkit-transform: rotate(0);
  -moz-transform: rotate(0);
  -ms-transform: rotate(0);
  -o-transform: rotate(0)
}
div.payment-kinds h3.open div.accordion_icon span:nth-of-type(2) {
  top: 12.5px;
  transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg)
}
div.payment-kinds h3.open div.accordion_icon.active span:nth-of-type(1) {display: none;}
div.payment-kinds h3.open div.accordion_icon.active span:nth-of-type(2) {
  top: 12.5px;
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg)
}
div.payment-kinds div.detail-box{display:none;}
div.payment-kinds p + p{margin-top:10px;}
div.payment-kinds div.detail-box p.attention{
  position:relative;
  color:#E92B66;
  font-weight:600;
  padding-left:40px;
}
div.payment-kinds div.detail-box p.attention::before{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  margin-top:-2px;
  left:0;
  content:"";
  display:inline-block;
  width:30px;
  height:30px;
  background:url(../img/icon/attention_i.svg) center/contain no-repeat;
}


ul.sitemap-li{
	display:flex;
	flex-wrap:wrap;
}
ul.sitemap-li li{
	position:relative;
	width:calc((100% - 30px)/3);
	margin-right:15px;
}
ul.sitemap-li li::after{
	position:absolute;
	content:"";
	top:50%;
	right:12px;
	transform:translateY(-50%) rotate(45deg);
	border-top:1px solid #273343;
	border-right:1px solid #273343;
	width:5px;
	height:5px;
}
ul.sitemap-li li:nth-child(3n){margin-right:0;}
ul.sitemap-li li:nth-child(n + 4){margin-top:15px;}
ul.sitemap-li li a{
	display:flex;
	color:#273343;
	padding:10px;
	border:1px solid #ccc;
	border-radius:4px;
	transition:0.3s ease;
	text-decoration:none;
}
ul.sitemap-li li a:hover{background:#E5F7F5;}

@media screen and (max-width:834px){

ul.sitemap-li{flex-direction: column;}
ul.sitemap-li li{
	width:auto;
	margin-right:0;
}
ul.sitemap-li li:nth-child(n + 2){margin-top:10px;}	

}


/* 増量オプション　モーダル */
div.modal_box.option-type{padding:30px 15px;}
div.modal_box.option-type span{text-indent:0;}
div.modal_box.option-type .red{color:#DB1A19;}

table.option-table{
	width:100%;
	border:1px solid #e0e0e0;
	border-radius:clamp(4px,1.199vw,10px);
	border-collapse:separate;
	overflow:hidden;
}
table.option-table + *,
* + table.option-table{margin-top:15px;}

table.option-table tr th,
table.option-table tr td{
	padding:15px 5px;
	font-size:14px;
	font-weight:600;
	line-height:1.5;
	letter-spacing:0.25pt;
	text-align:center;
}

table.option-table span.large,
table.option-table span.middle{font-size:20px;}
table.option-table span.del{text-decoration:line-through;}
table.option-table span.tax{font-size:12px;}
table.option-table span.catch{
	display:block;
	color:#DB1A19;
}

/*縦線*/
table.option-table tr + tr td{border-top:1px solid #e0e0e0;}
/*横線*/
table.option-table tr th + th,
table.option-table tr th + td,
table.option-table tr td + td{border-left:1px solid #e0e0e0;}

/*背景色*/
table.option-table tr:first-child th{background:#f7f7f7;}
table.option-table tr td:nth-child(1){background:#F2F7FE;}
table.option-table tr td:nth-child(3){background:#FFEFEF;}
/*幅*/
table.option-table tr td:nth-child(1){width:80px;}
table.option-table tr td:nth-child(2){width:120px;}
table.option-table tr td:nth-child(3){width:100px;}


@media screen and (max-width:834px){

div.modal_box.option-type{padding:30px 10px;}

table.option-table tr th,
table.option-table tr td{
	padding:15px 2px;
	font-size:12px;
}
table.option-table span.large{font-size:16px;}
table.option-table span.middle{font-size:12px;}
table.option-table span.catch{font-size:10px;}
table.option-table span.tax{font-size:8px;}

/*幅*/
table.option-table tr td:nth-child(1){width:70px;}
table.option-table tr td:nth-child(2){width:90px;}
table.option-table tr td:nth-child(3){width:70px;}


}

/* お問い合わせ */
div.contact-wrap{
	display:flex;
	justify-content:flex-start;
	flex-wrap:wrap;
}

p + div.contact-wrap{margin-top:15px;}

div.contact-wrap a{
	position:relative;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:flex-end;
	width:calc((100% - 20px)/3);
	height:200px;
	text-align:center;
	background:#fff;
	border:1px solid #e0e0e0;
	border-radius:clamp(4px,1.199vw,10px);
	box-shadow:0 3px 0 rgba(0,0,0,0.1);
	transform:translateY(0);
	transition:0.3s ease;
	margin-right:10px;
	padding-bottom:30px;
}
div.contact-wrap a:nth-child(3n){margin-right:0;}
div.contact-wrap a:nth-child(n + 4){margin-top:13px;}
div.contact-wrap a:hover{
	color:#0068B7;
	background:#f7f7f7;
	transform:translateY(3px);
	box-shadow:0 0 0 rgba(0,0,0,0.1);
}
div.contact-wrap a.height{padding-bottom:20px;}
div.contact-wrap a img{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	margin-top:-15px;
}
div.contact-wrap a span.txt{
	display:inline-block;
	color:#273343;
	font-size:16px;
	font-weight:500;
	line-height:1.1;
	padding-top:10px;	
}
div.contact-wrap a span.min{
	display:block;
	line-height:1;
}

@media screen and (max-width:834px){

div.contact-wrap a{
	width:calc((100% - 10px)/3);
	height:120px;
	margin-right:5px;
	padding-bottom:20px;
}
div.contact-wrap a.height{padding-bottom:12px;}
div.contact-wrap a:nth-child(n + 4){margin-top:8px;}
div.contact-wrap a img{
	width:50px;
	height:50px;
	margin-top:-15px;
}
div.contact-wrap a span.txt{font-size:12px;}
div.contact-wrap a span.min{font-size:10px;}

}

/* 故障・操作方法 */
div.question-wrap{
	border:1px solid #e0e0e0;
	border-radius:clamp(4px,1.199vw,10px);
	margin:30px auto 0;
}
div.question-wrap + div.question-wrap{margin-top:15px;}

div.question-wrap h3.open{
	position:relative;
	color:#273343;
	font-size:clamp(14px,1.918vw,16px);
	line-height:1.5;
	padding:15px 30px 15px 55px;
	margin:0;
	background:none;
	cursor:pointer;
	transition:0.3s ease;
}
div.question-wrap h3.open::before{
	position:absolute;
	content:"Ｑ";
	top:50%;
	left:15px;
	transform:translateY(-50%);
	display:flex;
	align-items:center;
	justify-content:center;
	color:#fff;
	font-size:14px;
	line-height:1;
	width:30px;
	height:28px;
	padding-bottom:2px;
	border-radius:15px;
	background:#273343;
}
div.question-wrap h3.open div.accordion_icon,
div.question-wrap h3.open div.accordion_icon span {
  display: inline-block;
  transition: .3s ease;
  box-sizing: border-box;
}
div.question-wrap h3.open div.accordion_icon {
	position: absolute;
	top:50%;
	transform:translateY(-50%);
	right:10px;
	width: 24px;
	height: 24px;
	margin-top:-3px;
}
div.question-wrap h3.open div.accordion_icon span {
  position: absolute;
  left: 25%;
  width: 50%;
  height: 2px;
  background: #273343;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -ms-border-radius: 4px;
  -moz-border-radius: 4px;
  -o-border-radius: 4px;
}
div.question-wrap h3.open div.accordion_icon span:nth-of-type(1) {
  top: 12.5px;
  transform: rotate(0);
  -webkit-transform: rotate(0);
  -moz-transform: rotate(0);
  -ms-transform: rotate(0);
  -o-transform: rotate(0)
}
div.question-wrap h3.open div.accordion_icon span:nth-of-type(2) {
  top: 12.5px;
  transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg)
}
div.question-wrap h3.open div.accordion_icon.active span:nth-of-type(1) {display: none;}
div.question-wrap h3.open div.accordion_icon.active span:nth-of-type(2) {
  top: 12.5px;
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg)
}
div.question-wrap:hover h3.open{background:#f7f7f7;}

div.answer{
	display:none;
	padding:15px;
	margin:0 auto;
	border-top:1px dashed #e0e0e0;
}
div.answer div.step-box{
	background:#F2F7FF;
	border:1px solid #E5F7F5;
	border-radius:clamp(4px,1.199vw,10px);
	padding:15px;
	margin-top:15px;
}
div.answer div.step-box + *{margin-top:15px;}

div.answer div.step-box p.heading{
	color:#3b82f6;
	font-weight:600;
}
div.answer div.step-box p.heading + *{margin-top:5px;}

div.answer div.step-box.type02{
	background:#f7f7f7;
	border-color:#efefef;
}
div.answer div.step-box.type02 p.heading{color:#273343;}

div.question-wrap a.min-btn{
	color:#273343;
	display:flex;
	align-items:center;
	justify-content:center;
	color:#fff;
	line-height:1;
	width:150px;
	height:30px;
	background:#3b82f6;
	border-radius:15px;
	transition:0.3s ease;
}
div.question-wrap * + a.min-btn{margin-top:10px;}
div.question-wrap a.min-btn:hover{opacity:0.7;}

div.question-wrap + div.contract-box{margin-top:15px;}