@charset "utf-8";

/* ===================================================================
Tablet CSS
ウィンドウ幅[641～1023px]の場合に適用
=================================================================== */
@media screen and (max-width: 1023px) {

/* ===================================================================
各ページ共通
=================================================================== */
body {
overflow: hidden;
}

#h_menu,
#sec02 .box,
#sec03 .box {
display: block;
}

#sec01 ul {
max-width: 521px;
}

/*	h_menu
----------------------------------------------------*/
#h_menu h1 {
text-align: center;
}

#h_menu #sns {
padding: 0 2em;
}

/*	sec01
----------------------------------------------------*/
#sec01 h2 {
padding: 0 1em;
}

#sec01 ul li {
padding-right: 1em;
font-size: 20px;
}

/*	sec02,sec03
----------------------------------------------------*/
#sec02 .box > p,
#sec03 .box > p {
text-align: center;
}

#sec02 .box .text,
#sec03 .box .text {
margin: 0;
padding: 0 1em;
}

#sec02 .box .text h3,
#sec03 .box .text h3 {
margin: 2em auto;
}

#sec02 .box .text p,
#sec02 .box .text p.small,
#sec03 .box .text p,
#sec03 .box .text p.small {
text-align: center;
}

/*	sec04
----------------------------------------------------*/
#sec04 {
background-position: 26% top;
}

#sec04 h2 {
padding: 0 1em;
}

#sec04 ul {
width: 80%;
}

#sec04 ul li {
margin: 0 auto 70px;
}

/*	sec05
----------------------------------------------------*/
#sec05,
#sec05 .box {
padding-right: 1em;
padding-left: 1em;
}

/*	sec06
----------------------------------------------------*/
#sec06 .title01 {
position: relative;
width: auto;
height: 16.98vw;
padding: 0;
background-size: contain;
}

#sec06 .title01 p {
position: absolute;
bottom: 3.3vw;
left: 19.8%;
font-size: 1.4vw;
}

#sec06 .title02 {
position: relative;
width: auto;
height: 25.1vw;
padding: 0;
background-size: contain;
}

#sec06 .title02 p {
position: absolute;
bottom: 5vw;
left: 19.7%;
font-size: 1.4vw;
}

#sec06 #effect {
max-width: 850px;
width: 100%;
}

#sec06 #effect #list {
padding: 27px 17em 0 1em;
}

#sec06 #effect #list ul li {
font-size: 1.35vw;
}

/*	sec07
----------------------------------------------------*/
#sec07 .box h2 {
padding: 0 1em;
}

#sec07 .box .text {
margin-right: 1em;
margin-left: 1em;
padding-right: 1em;
padding-left: 1em;
}

#sec07 .use .step {
margin: 0 auto 15px;
}

#sec07 .box h3 {
padding: 0 1em;
}

/*	sec09
----------------------------------------------------*/
#sec09 .box .attention {
margin: 0 auto;
}

/*	sec10
----------------------------------------------------*/
#section10 {
padding: 30px 1em;
}

#section10 h3 {
font-size: 17px;
}

#section10 .check_box {
margin-right: 1em;
}

#section10 .confirmation .last {
margin: 0;
}

#section10 .guide .left,
#section10 .guide .right {
width: 49%;
}

#section10 .guide img.address {
max-width: 396px;
width: 100%;
}

#section10 .guide .card {
display: flex;
}

#section10 .guide img.visa,
#section10 .guide img.jcb,
#section10 .guide img.mc,
#section10 .guide img.dc,
#section10 .guide img.amex {
height: 100%;
}

/*	cta
----------------------------------------------------*/
.cta_wrap {
background-size: contain;
}

.cta,
.cta02 {
display: none;
}


.cta_tab {
display: block!important;
}

.cta_tab > p {
width: 90%;
margin: 0 auto;
padding: 2em 0;
}

.cta_tab div {
display: flex;
align-items: center;
justify-content: center;
padding: 1em 0;
}

.cta_tab div p:first-child {
width: 28%;
}

.cta_tab .btn {
width: 38%;
padding-left: 2em;
}

}