@charset "UTF-8";
/* CSS Document */
html, body, h1, h2, h3, h4, ul, ol, dl, li, dt, dd, p, div, span, strong, b, img, a, table, tr, th, td,
article, header, footer, aside, figure, figcaption, picture, nav, section, address,
form, input, button, textarea, select {
margin: 0;
padding: 0;
border: 0;
background: none;
outline: none;
font-weight: normal;
font-size: 100%;
font-style: normal;
text-decoration: none;
vertical-align: baseline;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
-webkit-font-smoothing: antialiased;
}
ol, ul { list-style: none;list-style-type: none; }
img { vertical-align: bottom; max-width: 100%;}


/* ==================================
	common
================================== */
body {
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
font-family: Meiryo, "Yu Gothic", sans-serif;
font-weight: 400;
color: #333;
line-height: 1.7;
}

a {
color: #333;
-webkit-transition: all .2s;
transition: all .2s;
text-decoration: underline;
}

a:hover {
filter:alpha(opacity=70);
-moz-opacity:0.7;
opacity:0.7;
}

.col {
max-width: calc(1125px + 8%);
padding-left: 4%;
padding-right: 4%;
margin-left: auto;
margin-right: auto;
}

h2,h3 { line-height: 1.3; }


h2.ttl {
width:  100%;
font-weight: bold;
text-align: center;
margin-bottom: 6vh;
position: relative;
}


h2.ttl:before {
position: absolute;
z-index: 0;
top: -0.6em;
bottom: 0;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
text-align: center;
font-size: 460%;
color: rgba(19,63,144,0.04);
}

h2.ttl ~ * {
position: relative;
z-index: 1;
}

@media screen and (max-width: 65rem) {
h2.ttl:before {
font-size: 15vw;
}

}

h3 { line-height: 1.3; }

small { font-size: 70%;}

@media screen and (min-width: 768px) {
html { font-size: 18px;}
.fsL { font-size: 1.563rem; }
.fsM { font-size: 1.25rem; }
.fsS { font-size: 0.8rem; }
.fsL b,.fsM b, h2.ttl { font-size: 1.953rem; }

body > section {
padding-top: 160px;
padding-bottom: 160px;
}
}

@media screen and (max-width: 768px) {
html { font-size: 14px;}
.fsL { font-size: 1.25rem; }
.fsM { font-size: 1.25rem; }
.fsS { font-size: 0.8rem; }
.fsL b,.fsM b, h2.ttl { font-size: 1.563rem; }

body > section {
padding-top: 10vh;
padding-bottom: 10vh;
}
}


@media screen and (min-width: 38.1em) {
.br_pc { display: block; }
.br_sp { display: none; }

}

@media screen and (max-width: 38em) {

}

@media screen and (max-width: 38em) {
.br_pc { display: none; }
.br_sp { display: block; }
}


/* ==================================
	header
================================== */
header {
position: relative;
top: 0;
left: 0;
z-index: 99;
width: 100%;
background: #fff;
display: flex;
flex-wrap: wrap;
align-items: center;
}

header h1 img,
header .tel img {
width: 100%;
}

header h1 {
margin: 10px auto 10px 10px;
}

header h2 {
margin: 0 auto;
position: relative;
font-size: 5vw;
color: #fff;
font-weight: bold;
white-space: nowrap;
text-align: center;
line-height: 1;
background: #133f90;
padding: 0.4em 1em 0.2em;
}

header h2 strong {
font-weight: bold;
color: #ffff00;
}

header h2:before,
header h2:after {
content: "";
position: absolute;
bottom: -1px;
border-style: solid;
}

header h2:before {
left: -1px;
border-width: 2em 0 0 15px;
border-color: transparent transparent transparent #fff;
}

header h2:after {
right: -1px;
border-width: 0 0 2em 15px;
border-color: transparent transparent #fff transparent;
}


header .tel {
margin: 10px 10px 10px auto;
text-align: right;
}

@media screen and (max-width: 767px) {
header h1 {
order: 2;
width: 35vw;
min-width: 120px;
max-width: 180px;
}

header h2 {
order: 1;
}

header .tel {
order: 3;
width: 45vw;
min-width: 134px;
max-width: 268px;
}

}


@media screen and (min-width: 767px) {
header h1 {
flex: 1;
}

header h1 img {
max-width: 180px;
}

header h2 {
position: relative;
width: 18em;
}

header .tel {
flex: 1;
}

header .tel img {
max-width: 268px;
}

}


@media screen and (min-width: 767px) {
header h2 { font-size: 3vw; }
}


@media screen and (min-width: 1200px) { 
header h2 { font-size: 1.953em; }
}




.clone-header {
position: fixed;
top: 0;
left: 0;
z-index: -100;
width: 100%;
transition: .3s;
transform: translateY(-100%);
background: #fff;
}

.clone-header h2 {
display: none;
}

.is-show {
z-index: 100;
transform: translateY(0);
}

.buy_btn a {
display: block;
overflow: hidden;
position: relative;
}




/* ==================================
	#topimg
================================== */
#topimg {
padding: 0;
position: relative;
}

#topimg .swiper-container {
text-align: center;
}

#topimg .model {
position: absolute;
z-index: 1;
display: flex;
justify-content: center;
align-items: flex-end;
-webkit-box-reflect: below 3px -webkit-linear-gradient(top,rgba(0,0,0,0),rgba(0,0,0,0) 75%,rgba(0,0,0,0.1));
}

#topimg .model.new {
z-index: 2;
}

#topimg .model li {
padding: 0 0.5vw;
width: 20%;
max-width: calc(280px + 1vw);
}

#topimg .model.new li {
width: 25%;
max-width: calc(300px + 1vw);
}

#topimg .model li img {
width: 100%;
}


@media screen and (max-width: 666px) {
#topimg {
margin-bottom: 5%;
overflow: hidden;
}

#topimg .swiper-container {
background: #fff url(img/bg_top.png) no-repeat bottom center;
background-size: cover;
padding-bottom: 15%;
margin-bottom: 15%;
}

#topimg .model {
width: 120%;
bottom: 16%;
left: -10%;
}

#topimg .model.new {
bottom: 10%;
padding: 0 12vw;
}

.swiper-button-prev,
.swiper-button-next {
display: none;
}

}

@media screen and (min-width: 667px) {
#topimg {
background: #fff url(img/bg_top.png) no-repeat bottom center;
background-size: cover;
padding-bottom: 7%;
margin-bottom: 12%;
}

#topimg .swiper-slide {
padding: 0 2em;
}

#topimg .model {
width: 100%;
bottom: -7%;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}

#topimg .model.new {
bottom: -22%;
padding: 0 10vw;
}

#topimg .model li {
padding: 0 1vw;
max-width: calc(250px + 2vw);
}

#topimg .model.new li {
max-width: calc(270px + 2vw);
}

.swiper-button-prev,
.swiper-button-next {
display: block;
background: none !important;
width: 0 !important;
height: 0 !important;
border-style: solid;
}

.swiper-button-prev {
border-width: 1em 1.5em 1em 0;
border-color: transparent #133f90 transparent transparent;
}

.swiper-button-next {
border-width: 1em 0 1em 1.5em;
border-color: transparent transparent transparent #133f90;
}

}

/* ==================================
	#campaign
================================== */
#campaign {
padding-top: 0;
padding-bottom: 5vh;
}

#campaign > div {
margin: 0 auto;
padding: 6% 0 1%;
background: url(img/camp_bg.png) no-repeat center 45%;
background-size: cover;
border: 1px solid #e6e2cd;
box-shadow: 0 10px 20px rgba(0,0,0,0.1);
position: relative;
}

#campaign h2 {
display: block;
font-size: 0;
width: 100%;
max-width: 900px;
padding-top: 11.111%;
background: url(img/camp_ttl.png) no-repeat top center;
background-size: contain;
position: absolute;
top: 0;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
margin-top: -6%;
}

#campaign .campbox {
width: 80%;
max-width: 360px;
margin: 20px auto;
text-align: center;
display: flex;
flex-wrap: wrap;
flex-direction: column;
align-items: center;
position: relative;
}

#campaign h3 {
width: 100%;
height: 2em;
color: #fff;
font-weight: bold;
padding: 0.4em;
margin-bottom: 1.5em;
position: relative;
}

#campaign h3:after {
content: "";
position: absolute;
bottom: -1em;
left: 50%;
transform: translateX(-50%);
border: 0.5em solid;
border-color: transparent;
}
  
#campaign .business h3 { background: #27a6bd; }
#campaign .personal h3 { background: #a5b51a; }
#campaign .business h3:after { border-top-color: #27a6bd; }
#campaign .personal h3:after { border-top-color: #a5b51a; }

#campaign .badge {
position: absolute;
z-index: 10;
top: 28%;
color: #e60012;
font-weight: bold;
background: url(img/camp_badge.png) no-repeat;
background-size: contain;
width: 75px;
height: 92px;
padding-top: 25px;
line-height: 1.2;
}

#campaign .business .badge { left: -14%; }
#campaign .personal .badge { right: -14%; }

#campaign .campbox .text {
width: 100%;
font-size: 1.25rem;
line-height: 1.2;
margin-bottom: 1em;
}

#campaign .campbox .text b {
color: #cc0001;
font-weight: bold;
background: linear-gradient(transparent 60%, #ffff00 60%);
}

#campaign .campbox .text b span {
font-weight: bold;
font-size: 160%;
}

#campaign .campbox .img {
margin-top: auto;
}

#campaign .campbox img {
width: 80%;
filter: drop-shadow(0 5px 10px rgba(0,0,0,0.2));
}

#campaign .campbox .set {
width: 100%;
margin-top: 2em;
font-size: 70%;
text-align: left;
}

#campaign .campbox .set b {
font-weight: bold;
}

#campaign small {
display: block;
text-align: right;
margin-top: 0.5em;
}

@media screen and (min-width: 769px){
#campaign > div {
width: 85%;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
  
#campaign .campbox .text {
font-size: 1rem;
}

/*
#campaign > div:before {
content: "";
display: block;
width: 100%;
height: 15%;
background: rgb(212,178,25);
background: linear-gradient(90deg, rgba(212,178,25,1) 0%, rgba(212,178,25,1) 25%, rgba(229,208,116,1) 50%, rgba(212,178,25,1) 75%, rgba(212,178,25,1) 100%);
position: absolute;
bottom: 0;
left: 0;
}
*/

#campaign .badge {
width: 100px;
height: 122px;
padding-top: 35px;
}

#campaign .business .badge { left: -13%; }
#campaign .personal .badge { right: -13%; }

#campaign .campbox {
width: 42%;
margin: 0;
text-align: center;
padding: 17.5px;
}

#campaign .campbox img {
width: auto;
}

#campaign small {
width: 85%;
margin-left: auto;
margin-right: auto;
}


}





/* ==================================
	.contact
================================== */
.contact {
background: #133f90;
color: #fff;
text-align: center;
padding-top: 6vh;
padding-bottom: 5vh;
position: relative;
}

.contact:before {
content: "";
display: block;
width: 100%;
max-width: 900px;
padding-top: 11.111%;
background: url(img/camp_ttl.png) no-repeat top center;
background-size: contain;
position: absolute;
top: 0;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
margin-top: -4%;
}

#campaign + .contact:before {
display: none;
}

.contact .tel {
margin-top: 1rem;
color: #fff;
text-decoration: none;
font-size: 2.5em;
font-weight: bold;
line-height: 0.8;
display: flex;
align-items: center;
justify-content: center;
}

.contact .tel:before {
content: "";
display: inline-block;
background: url(img/freedial.svg) no-repeat;
width: 1.5em;
height: 0.9em;
}

.contact .tel a {
color: #fff;
text-decoration: none;

font-weight: bold;
}

.contact .btn a {
display: block;
padding: 0.7em 0 0.5em;
border-radius: 6px;
line-height: 1;
color: #fff;
font-weight: bold;
text-decoration: none;
border-bottom: 4px solid;
margin-top: 1.5rem;
}

.contact .btn a:before {
content: "24時間受付";
display: inline-block;
font-weight: normal;
background: rgba(0,0,0,0.2);
border-radius: 4px;
padding: 0.5em;
margin-right: 0.5em;
}

.contact .btn a.line {
background: #1dcd00;
border-bottom-color: #138606;
}

.contact .btn a.mail {
background: #f4900e;
border-bottom-color: #b66700;
}

@media screen and (min-width: 960px) {
.contact .tel {
font-size: 3em;
}

.contact .btn {
width: 77%;
min-width: 960px;
display: flex;
justify-content: space-between;
}

.contact .btn a {
width: calc(50% - 17.5px);
}

}


/* ==================================
	#advantage
================================== */
#advantage h2.ttl:before {
content: "ADVANTAGE";
}
 
#advantage h2.ttl span {
color: #debc1f;
font-weight: bold;
position: relative;
}

#advantage h2 + p {
margin-bottom: 40px;
text-align: center;
}

#advantage ul li {
margin-top: 40px;
display: flex;
align-items: center;
}

#advantage li h3 {
width: 7.6em;
height: 7.6em;
padding-top: 3em;
border: 3px solid #365ca1;
border-radius: 50%;
color: #365ca1;
text-align: center;
position: relative;
}

#advantage li:nth-child(3) h3 {
padding-top: 3.3em;
}

#advantage li:nth-child(3) h3:before {
content: "";
position: absolute;
top: 14%;
left: 0;
right: 0;
margin: auto;
display: inline-block;
width: 26%;
max-width: 44px;
padding-top: 22%;
background: url(img/ico_crown.png) no-repeat;
background-size: contain;
}

#advantage ul p {
flex: 1;
padding-left: 0.5em;
}

#advantage ul p strong {
font-weight: bold;
background: linear-gradient(transparent 50%, #ffff66 50%);
}


@media screen and (min-width: 1024px) {
#advantage li h3 {
width: 8em;
height: 8em;
padding-top: 2.8em;
}
#advantage li:nth-child(3) h3 {
padding-top: 3.4em;
}

#advantage ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

#advantage ul li {
width: calc(50% - 17.5px);
}

}
@media screen and (min-width: 38.1em) {
#advantage ul p {
padding-left: 1em;
}

#advantage h2.ttl span:before {
display: inline-block;
position: absolute;
top: -0.5em;
left: 2.75em;
content: "";
width: 0.8em;
padding-top: 3%;
background: url(img/ico_crown.png) no-repeat;
background-size: contain;
}
}


/* ==================================
	#plan
================================== */
#plan {
background: #ecf0f6;
}

#plan h2.ttl:before {
content: "PLANNING";
}

#plan section {
background: #fff;
border-top-left-radius: 2.5rem;
border-top-right-radius: 2.5rem;
}

#plan h3 {
width: 100%;
color: #fff;
font-weight: bold;
line-height: 1;
text-align: center;
padding: 1.3em 0 0.8em;
border-top-left-radius: 1.5rem;
border-top-right-radius: 1.5rem;
position: relative;
}

#plan .business h3 {
background: #27a6bd;
border-bottom: 3px solid #2395aa;
}

#plan .personal h3 {
background: #b8ca1d;
border-bottom: 3px solid #a5b51a;
}

#plan h3:before {
content: "";
display: inline-block;
width: 144px;
height: 24px;
background: top center no-repeat;
background-size: contain;
position: absolute;
top: 0;
left: 50%;
-webkit-transform: translateX(-50%) translateY(-40%);
transform: translateX(-50%) translateY(-40%);
}
#plan .business h3:before { background-image: url(img/plan_bus01.png); }
#plan .personal h3:before { background-image: url(img/plan_per01.png); }


#plan section .set {
background:  #f6f6f6;
margin-top: 1em;
padding: 1em;
font-size: 70%;
}

#plan section .set b {
font-weight: bold;
}


@media screen and (min-width: 769px){
#plan h3:before {
width: 216px;
height: 36px;
}
}

#plan .desc {
text-align: center;
}

#plan .desc img {
margin: 1em 0 2em 0;
}

#plan .point li {
text-indent: -1em;
padding-left: 1em;
margin-bottom: 0.5em;
}

#plan .point li:before {
content: "";
display: inline-block;
width: 0.8em;
height: 0.8em;
margin-right: 0.2em;
border-radius: 50%;
}
#plan .business .point li:before { background: #27a6bd; }
#plan .personal .point li:before { background: #a5b51a; }


#plan h4 {
text-align: center;
border: 1px solid;
margin-top: 2em;
padding: 0.2em 1em 0;
}

#plan .business h4{ color: #27a6bd; border-color: #27a6bd; }
#plan .personal h4 { color: #a5b51a; border-color: #a5b51a; }


#plan .model li {
margin-top: 2em;
}

#plan .model b {
display: block;
line-height: 1.2;
}

#plan .model p {
margin-top: 0.5em;
}

@media screen and (max-width: 960px){
#plan section > div {
padding: 4vh 4vw 4vw;
}

#plan .personal {
margin-top: 2em;
}
#plan .model {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

#plan .model li {
width: 47%;
}

#plan .model li div {
margin-top: 1em;
}

#plan .model li div b {
font-weight: bold;
}


}

@media screen and (min-width: 960px){
#plan .col {
display: flex;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

#plan section {
width: calc(50% - 17.5px);
}

#plan section > div {
padding: 40px 25px 25px;
}

#plan .business .point li:last-child { padding-bottom: 2.2em; }

#plan .model li {
display: flex;
align-items: center;
}

#plan .model li img {
width: 200px;
}

#plan .model li div {
flex: 1;
margin-left: 1em;
}

#plan .model li div small {
font-size: 0.64em;
}

#plan .model li p {
font-size: 0.8rem;
}


}

/* ==================================
	#flow
================================== */
#flow {
background: #ecf0f6;
}

#flow h2.ttl:before {
content: "FLOW";
}

#flow section {
margin-top: 2em;
}

#flow h3 {
color: #fff;
font-weight: bold;
text-align: center;
line-height: 1;
padding: 0.8em 0 0.7em;
border-radius: 6px;
}

#flow .business h3 { background: #27a6bd; }
#flow .personal h3 { background: #a5b51a; }

#flow ol {
counter-reset: point flow;
}

#flow li {
background: #fff;
border-radius: 6px;
margin-top: 1.3em;
position: relative;
}

#flow li:before {
counter-increment: flow 1;
content: counter(flow);
position: absolute;
left: 1em;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
border-radius: 50%;
color: #fff;
width: 1.8em;
height: 1.8em;
line-height: 2em;
text-align: center;
}

#flow .business li:before { background: #27a6bd; }
#flow .personal li:before { background: #a5b51a; }


#flow li p {
display: block;
padding: 0.7em 0.5em 0.6em;
text-align: center;
position: relative;
}

#flow li p:before,
#flow li p:after {
content: "";
position: absolute;
z-index: 10;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}

#flow li p:before {
top: -1.3em;
display: inline-block;
width: 2em;
height: 1em;
}

#flow .business li p:before { background: #27a6bd; }
#flow .personal li p:before { background: #a5b51a; }

#flow li p:after {
top: -0.3em;
border-style: solid;
border-width: 1em 1.5em 0 1.5em;
}

#flow .business li p:after { border-color: #27a6bd transparent transparent transparent; }
#flow .personal li p:after { border-color: #a5b51a transparent transparent transparent; }

#flow li .pop {
position: absolute;
right: 0.5em;
color: #fff;
font-size: 1rem;
line-height: 1.2;
border-radius: 4px;
padding: 0.4em 0.5em;
}

#flow .business .pop {
top: 60%;
z-index: 10;
background: #218da1;
}

#flow .personal .pop {
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
background: #9dac19;
}

#flow .business .pop:before {
width: 0.5em;
height: 7em;
z-index: -1;
}
#flow .business li .pop:before { background: #218da1; }
#flow .business li .pop:after {
top: 5.5em;
border-width: 0.8em 0.8em 0.8em;
border-color: #218da1 transparent transparent transparent;
}

#flow .personal .pop:before,
#flow .personal .pop:after { display: none; }

@media screen and (min-width: 960px){
#flow .col {
display: flex;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

#flow section {
width: calc(50% - 17.5px);
margin-top: 0;
}

#flow li p {
padding: 0.7em 0.5em 0.6em;
text-align: center;
}

}


/* ==================================
	#faq
================================== */
#faq h2.ttl:before {
content: "Q&A";
}

#faq input[type="checkbox"],
#faq input[type="radio"] {
display: none;
}

#faq .tab_item {
display: inline-block;
cursor: pointer;
width: calc(50% - 17.5px);
color: #fff;
font-weight: bold;
line-height: 1;
text-align: center;
padding: 0.8rem 0 0.7rem;
border-top-left-radius: 6px;
border-top-right-radius: 6px;
margin-top: 0.7rem;
}
#tab-business + .tab_item { background: #27a6bd; float: left; }
#tab-personal + .tab_item { background: #a5b51a; float: right; }

#faq input:checked + .tab_item {
padding-top: 1.5rem;
margin-top: 0;
}


.tab_content {
clear: both;
display: none;
overflow: hidden;
transition: opacity linear 0.1s;
}

#tab-business:checked ~ #faq-business,
#tab-personal:checked ~ #faq-personal {
display: block;
}

#faq .faqlist {
counter-reset: point faq;
}

#faq .faqlist label {
display: block;
padding: 1em;
position: relative;
border-bottom: 1px solid;
cursor: pointer;
display: flex;
align-items: center
}

#faq .faqlist label p {
flex: 1;
}

#faq-business .faqlist label { border-color: #e9f6f8; }
#faq-personal .faqlist label { border-color: #f1f4d2; }

#faq .faqlist label:before {
counter-increment: faq 1;
content: "Q." counter(faq);
display: inline-block;
width: 3em;
font-size: 1.25rem;
font-weight: normal;
text-align: center;
margin-right: 1rem;
border-radius: 6px;

display: flex;
align-items: center;
justify-content: center;
}

#faq-business label:before { background: #e9f6f8; color: #27a6bd;  }
#faq-personal label:before { background: #f1f4d2; color: #a5b51a; }

#faq .faqlist label:after {
content: "";
display: inline-block;
margin-left: auto;
width: 0.5em;
height: 0.5em;
margin-left: 1em;
border-right: 2px solid;
border-bottom: 2px solid;
transform: rotate(45deg);
transition: all .1s ease-out;
}

#faq-business .faqlist label:after { border-color: #27a6bd; }
#faq-personal .faqlist label:after { border-color: #a5b51a; }


#faq-business { border-top: 5px solid #27a6bd; }
#faq-personal { border-top: 5px solid #a5b51a; }

#faq .faqlist label ~ div {
line-height: 0;
opacity: 0;
visibility: hidden;
transition:
line-height .3s ease-out,
opacity     .1s linear,
visibility  .1s linear;
}

#faq .faqlist input[type=checkbox]:checked + label + div {
padding: 0 1em 1em 1em;
border-bottom: 1px solid #fff;

line-height: 1.7;
opacity: 1;
visibility: visible;
transition:

line-height .3s ease-out,
opacity     .1s linear,
visibility  .1s linear;
}

#faq .faqlist input[type=checkbox]:checked + label {
font-weight: bold;
}

#faq .faqlist input[type=checkbox]:checked + label:after {
transform: rotate(-135deg);
transition: all .1s ease-out;
}


#faq-business .faqlist input[type=checkbox]:checked + label {
color: #27a6bd;
background: #e9f6f8;
}

#faq-business .faqlist input[type=checkbox]:checked + label + div {
background: #e9f6f8;
}

#faq-personal .faqlist input[type=checkbox]:checked + label {
color: #a5b51a;
background: #f1f4d2;
}
#faq-personal .faqlist input[type=checkbox]:checked + label + div {
background: #f1f4d2;
}

#faq-business input[type=checkbox]:checked + label:before { background: #27a6bd; color: #fff; }
#faq-personal input[type=checkbox]:checked + label:before { background: #a5b51a; color: #fff; }

@media screen and (max-width: 62em){
#faq .tab_item {
font-size: 0;
width: calc(50% - 5px);
}

#faq .tab_item:before {
font-size: 1rem;
}
}

@media screen and (max-width: 62em){
#tab-business + .tab_item:before { content: "月額レンタルに関するご質問"; }
#tab-personal + .tab_item:before { content: "1日/短期レンタルに関するご質問"; }
}

@media screen and (max-width: 30em){
#tab-business + .tab_item:before { content: "月額レンタル"; }
#tab-personal + .tab_item:before { content: "1日/短期レンタル"; }
}


@media screen and (min-width: 960px){
#faq .faqlist input[type=checkbox]:checked + label + div {
padding: 0 1em 1em 5.8em;
}

}


/* ==================================
	etc
================================== */
#etc {
padding-top: 0;
}

#etc h2 {
color: #133f90;
font-weight: bold;
text-align: center;	
padding: 1em 0 0.8em;
border-top: 3px solid #133f90;
border-bottom: 3px solid #133f90;
margin-bottom: 1.5em;
position: relative;
}

#etc h2:before {
content: "";
display: inline-block;
width: 100px;
height: 31px;
background: url(img/etc_more.png) top center no-repeat;
background-size: contain;
position: absolute;
top: -21px;
left: 1%;
}


#etc ul {
margin: 0 auto;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

#etc ul li {
width: 100%;
background: #ececec;
text-align: center;
/* padding: 12% 0; */
}

#etc ul li+li {
margin-top: 40px;
}

@media screen and (min-width: 768px){
#etc h2:before {
width: 150px;
height: 46px;
top: -30px;
left: 0.5%;
}

#etc ul {
width: 85%;
}

}

@media screen and (min-width: 1125px){
#etc h2:before {
left: 4%;
}

}


@media screen and (min-width: 600px){
#etc ul li {
margin-top: 0 !important;
width: calc(50% - 17.5px);
}

}


/* ==================================
	fotter
================================== */
footer {
padding: 10vh 0 0;
text-align: center;
}

footer address {
padding: 5vh 0;
}
/* ==================================
	onions追加
================================== */

.centercomment {
	width:  100%;
	font-weight: bold;
	text-align: center;
	margin-bottom: 6vh;
	position: relative;
	}