@charset "UTF-8";
@font-face {
	font-display: swap;
	font-family: "Lato-Italic";
	src: url("/fonts/Lato-Italic.ttf") format("truetype");
}

#mv{
	background-image: url(/img/usage/mv-sp.jpg);
}
#mv h2{
	text-shadow: 0 0 20px #fff, 0 0 20px #fff, 0 0 20px #fff, 0 0 20px #fff, 0 0 20px #fff, 0 0 20px #fff, 0 0 40px #fff, 0 0 40px #fff, 0 0 40px #fff;
}
main article#qa h2 img.subtitle {
	display: block;
	margin: 4px auto 0;
	height: 13px;
}
main article.tdetail h2 img.subtitle {
	margin: 4px auto 0;
}
main article{
	line-height: 1.8;
}
main .btn {
	min-width: 200px;
}

#kv{
	position: relative;
	margin-bottom: 0;
	margin-top: 32px;
	padding: 0;
}
#kv>section{
	padding: 0;
}
main #kv h2 {
	position: absolute;
	top: 0;
	left: 4px;
	width: 100%;
	padding-top: 103%;
	text-align: left;
}
main #kv h2 img {
	width: 66%
}
main #kv p {
	margin-bottom: 18%;
}
main #kv p img {
	width: 100%;
}
main #kv section> img {
width: 73.105%;
}






main>.odetail{
	display: block;
	margin: 4px 8px 0;
}
main>.odetail:first-of-type{
	margin-top: 0;
}
main>.odetail span {
	display: block;
	padding: 14px 28px 13px 58px;
	background-color: #038de1;
	color: #fff;
	font-size: 13px;
	font-weight: bold;
	text-align: left;
	background-size: 32px;
	background-position: 8px center;
}
main>.odetail span.arrow-u::after,
main>.odetail span.arrow-d::after {
	border-top-color: #fff;
	border-right-color: #fff;
	right: 14px;
}

#step1,
#step2,
#step3,
#step4{
	padding-bottom: 8px;
	padding-top: 20px;
	margin-right: 8px;
	margin-left: 8px;
	background-color: #eff5f9;
}

main article#qa {
	margin-top: 30px;
}

main .result{
	margin: 0 8px;
	padding: 0;
}
main .result p {
	margin-bottom: 0;
}
main .result p img {
	width: 100%;
}
main h2{position: relative;}

#step1 h2,
#step2 h2,
#step3 h2,
#step4 h2 {
	background-position: top center;
	background-repeat: no-repeat;
}

#step1 h2{
	padding-top: 200px;
	background-image: url(/img/usage/imoto-step1-sp.jpg);
	background-size: 245px;
}
#step2 h2 {
	padding-top: 200px;
	background-image: url(/img/usage/imoto-step2-sp.jpg);
	background-size: 223px;
}
#step3 h2 {
	padding-top: 190px;
	background-image: url(/img/usage/imoto-step3-sp.jpg);
	background-size: 195px;
}
#step4 h2 {
	padding-top: 200px;
	background-image: url(/img/usage/imoto-step4-sp.jpg);
	background-size: 237px;
}

main .caution,
main .intro{
	margin-bottom: 20px;
}
main .intro h3{
	font-size: 16px;
}
main .whitebg{
	background-color: #fff;
	display: block;
	margin: 0 8px 20px;
	padding: 12px;
}
main .whitebg h3{
	color: #038de1;
	margin-top: 20px;
}
main .whitebg h4{
}
main .whitebg p{
	margin-bottom: 20px;
	text-align: left;
}
main .whitebg h5{
	color: #a3a3a3;
}
main .whitebg ul li{
	margin: 0 4px;
}
main .caution h3{
	font-size: 16px;
	margin-bottom: 20px;
	margin-top: 40px;
}
main .caution ul{
	margin: 0 auto;
}
main .caution ul li{
	font-size: 13px;
}
main ul.delivery{
	margin-bottom: 40px;
}
main ul.delivery li,
main ul.delivery li a.btn {
	display: block;
}
main ul.delivery li a.btn {
	text-align: left;
	padding-left: 12px;
}
main ul.delivery li a.btn .icon {
  background-position: 6px center;
	margin-left: 0;
	padding-left: 44px;
}
main ul.delivery li a.btn .icon.airplane {
  background-position: 0 center;
}
main .rentalset {
	margin-top: 40px;
}
main .rentalset h3{
	font-size: 22px;
}
main .rentalset ol {
	background: url(/img/usage/imoto-step2-2-sp.jpg) top center no-repeat;
	margin: 0 auto;
	background-size: 270px;
	padding-top: 400px;
}
main .rentalset ol li h4{
	font-size: 16px;
	text-align: left;
	margin-bottom: 0;
}
main .rentalset ol li h4 span {
		display: inline-block;
		padding: 4px 6px 3px;
		font-size: 10px;
		line-height: 1;
		letter-spacing: 0;
		text-align: center;
		font-weight: bold;
		color: #fff;
		background-color: #868686;
		margin-left: 12px;
}

main .rentalset ol{
	font-size: 100%;
	text-align: left;
}
main .rentalset ol li{
	margin: 1em 0 1em 40px;
	display: list-item;
	text-align: left;
	position: relative;
	list-style: none;
}
main .rentalset ol li::before {
	display: block;
	content: '';
	position: absolute;
	top: -2px;
	left: -40px;
	width: 28px;
	height: 28px;
	background-image: url(/img/usage/ol-1.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 24px;
}
main .rentalset ol li:nth-child(2)::before {
	background-image: url(/img/usage/ol-2.png);
}
main .rentalset ol li:nth-child(3)::before {
	background-image: url(/img/usage/ol-3.png);
}
main .rentalset ol li:nth-child(4)::before {
	background-image: url(/img/usage/ol-4.png);
}
main .rentalset ol li:nth-child(5)::before {
	background-image: url(/img/usage/ol-5.png);
}



main .order ul li {
	position: relative;
	text-align: left;
	min-height: 110px;
	width: 100%;
	margin: 0;
}

main .order ul li h4,
main .howto ul li h4 {
	position: relative;
	overflow: hidden;
	text-align: left;
	height: 25px;
	margin-bottom: 12px;
	background-size: auto 25px;
	background: #efefef ;
}
main .order ul li h4 img,
main .howto ul li h4 img {
	position: absolute;
	left: 0;
	top: 50%;
	height: 35px;
	margin-top: -17px;
}
main .order ul li::after {
	position: absolute;
	top: 4px;
	right: 0;
	content: " ";
	display: inline-block;
	width: 80px;
	height: 89px;
	vertical-align: middle;
	vertical-align: middle;
	background-size: contain;
	background-position: center top;
	background-repeat: no-repeat;
}
main .order ul li:first-of-type::after {
	background-image: url(/img/usage/sp-order-step1gra.png) ;
}

main .order ul li:nth-of-type(2)::after {
	background-image: url(/img/usage/sp-order-step2gra.png);
}

main .order ul li:nth-of-type(3)::after {
	background-image: url(/img/usage/sp-order-step3gra.png);
}


main .order ul li p{
	padding-right: 90px;
	font-size: 12px;
	line-height: 1.6;
}

#step4 ul.sublist2{
	margin: 20px 12px;
    position: relative;
  }
  #step4 ul.sublist2 h4{
	text-align: left;
	font-size: 13px;
    margin-bottom: 4px;
    color: #038de1;
  }
  #step4 ul.sublist2 li{
	text-align: left;
    margin-bottom: 16px;
    display: block;
  }





main #step3 .chart {
	margin: 0 8px 20px;
	padding: 0;
}
main .howto {
	background-color: rgba(255,255,255,0.94);
	border: 4px solid rgba(3,141,225,0.19);
	padding: 12px;
	display: inline-block;
	position: relative;
	margin: 0 0 20px;
}
main .howto ul li {
	position: relative;
	text-align: left;
	min-height: 110px;
	width: 100%;
	margin: 0;
}


main .howto ul li::after {
	position: absolute;
	top: 4px;
	right: 0;
	content: " ";
	display: inline-block;
	width: 90px;
	height: 100px;
	vertical-align: middle;
	vertical-align: middle;
	background-size: contain;
	background-position: center top;
	background-repeat: no-repeat;
}
main .howto ul li:first-of-type::after {
	background-image: url(/img/about/point-step1gra.png) ;
}

main .howto ul li:nth-of-type(2)::after {
	background-image: url(/img/usage/point-step2gra.png);
}


main .howto ul li p{
	padding-right: 90px;
	font-size: 12px;
	line-height: 1.6;
}

#step3 .manga {
	margin: 0;
	padding: 0;
}
#step3 .manga img {
	width: 100%;
}
#step3 .support {
	/* background: #fff url(/img/usage/support-message-sp.jpg) center top no-repeat; */
	padding-top: 5%;
	background-size: contain;
	margin-bottom: 0;
	margin-top: 20px;
	border-bottom: 1px solid #dce5eb;
}

#step3 .support p:nth-of-type(2){
	padding-bottom: 16px;
	margin-bottom: 16px;
	border-bottom: 1px solid #2b94e4;
}
#step3 .support p:nth-of-type(2) a img{
	width: 201px;
	margin: 8px 0;
}
#step3 .support p:nth-of-type(2) a,
#step3 .support p:nth-of-type(3) a,
#step3 .support p:nth-of-type(4)>span {
	display: block;
	text-align: center;
	font-size: 11px;
	color: #0e0e0e;
	text-decoration: none;
	font-weight: bold;
}
#step3 .support p:nth-of-type(3) a img{
	width: 165px;
	margin: 8px 0;
}
#step3 .tech p,
#step3 .support p{
	text-align: center;
}
#step3 .tech span,
#step3 .support span{
	font-weight: bold;
}
#step3 .tech h3,
#step3 .support h3 {
	margin-bottom: 8px;
}
#step3 .tech .attention {
	display:inline-block;
	padding: 18px;
	margin-bottom: 25px;
	font-size: 12px;
	width: auto;
	border: 3px solid #319f2d;
	border-radius: 8px;
}

#step4 .after h3{
	font-size: 18px;
	color: #038de1;
	margin-bottom: 16px;
}
#step4 .after p{
	margin-bottom: 30px;
	text-align: left;
}

/* img to text */
.com-subtitle.is-en{
  display: block;
  font-family: Lato-Italic;
}
.mv-head .is-en {
  font-size: 14px;
  letter-spacing: 0.2em;
  margin: -1px auto 0;
}
.mv-head .is-adjust_position {
  font-size: 30px;
  margin: 0 -0.4em;
  vertical-align: middle;
}
.com-section-head .is-en {
  color: #038de1;
	font-size: 12px;
	letter-spacing: 0.25em;
	margin: 3px auto 0;
}