@charset "utf-8";
body{
    /* font-family: 'Noto Serif JP', serif; */
    font-weight: 400;
}

/* * {outline: 1px solid magenta;} */
p{margin: 0;}
*,*::before,*::after {
    margin:0;
    padding:0;
    box-sizing:border-box;
    list-style-type:none;
}

html {
    font-size: 14px;
    scroll-behavior: smooth;
}

a{text-decoration: none;}

#LP-html img{
    display: block;
    max-width: 100%;
    height: auto;
}
/* #topicpath_style .trace-box {
    color: #000;
    margin: 0 auto;
    padding: 2px 10px 3px;
    text-align: left;
    width: 80%;
} */

#LP-html span{
    width: 100%;
    font-weight: bold;
}
#LP-html{
    max-width: 1200px;
    width: 100%;
    margin-inline: auto;
    background-color:#030B2C;
    line-height: 1.5;
    margin-top: 1rem;
}
#LP-html h2,#LP-html h3{
    width: 100%;
    text-align: center;
    font-weight: bold;
    margin: 0 auto 3rem;
}
#LP-html h2{
    font-size: 1.5rem;
    color: #000;
    border-bottom: 1px dotted #000;
    padding: 2rem;
}
#LP-html h3{background-color: #b7282e;color: #ffffff;padding: 2px;}
#LP-html .top_text{
    max-width: 550px;
    font-size: 1.4em;
    letter-spacing: .3em;
    text-align: center;
    margin-inline: auto;
    color: #ffffff;
    font-weight: bold;
}
#LP-html .top_text_2{padding: 1rem;    max-width: 575px;margin: 0 auto;}

#LP-html .top_text_2 p{
    color:#ffffff;
    font-size: 0.8em;
    font-weight: normal;
}
#LP-html .top_text_2 span{font-weight: bold}

/* .shipping{
    background-color:rgb(205, 235, 247);
}
.repair{
    background-color:rgb(248, 235, 247);
} */


#LP-html h1,#LP-html .article{
    background-color: #030B2C;
}
#LP-html h1 img,#LP-html h1{
margin: 0 auto !important;}

article{
    padding-bottom: 2rem;
}
#LP-html .top_img{
    max-width: 1200px;
    margin:0 auto;
    background-color: #030B2C;
}

#LP-html section{
    width:90%;
    margin: 0 auto;
    /* border: 20px solid #060D2E; */
	border-top:none;
    text-align: center;
    padding: 3rem 0 4rem;
    background-color: #ffffff;
    margin-bottom: 2em;

}
.chk {
	width:50px;
    margin-inline: auto;
    margin-bottom: 1em;
}
/* p{
    color: #000;
} */


#LP-html ul{
    max-width: 1000px;
    display: flex;
    flex-wrap:wrap;
    margin:2rem auto ;
    padding: 0;
    justify-content: center;
}
.try_list li {
    width: calc(100%/4);
    padding: 5px;
}
.try_list li img:nth-child(1) .how_list li img:nth-child(1){
    width: 500px;
    object-fit: contain;
}
.try_list li img:nth-child(2), .flow_blc li img, .flow_blc2 li img, .flow_blc3 li img  {
    width: 35%;
    margin-inline:auto;
}
.try_list li p {
    font-size: 13px;
	font-weight:400;
    letter-spacing: 0px;
	margin:0 auto;
}
.how_list li {
    width: calc(100%/4);
    padding: 5px;
    margin: 10px;
}
.how_list__item{border: solid 2px;}
.how_list__item p , .flow_list p{align-self: center;padding: 5px;font-weight: bold;}
.how_list__item img:nth-child(1) {
    width: 60%;
    margin:0 auto ;
}
.how_list__item img:nth-child(2) {
    width: 45%;
    margin:2rem auto ;
}
.flow_blc2 ul{width: 100%;justify-content: center;}
.flow_blc ul,.flow_blc3 ul{
    width: 100%;
    gap: 2rem;
justify-content: center;
}
.flow_blc li{
    position: relative;
    width: calc(80%/4 - 1rem*2);
    border: 1px solid #030B2C;
}
.flow_blc3 li{
position: relative;
}
.flow_blc li:after,.flow_blc3 li:after {
    position: absolute;
    content: "▼";
    transform: rotate(30deg);
    right: -1.6rem;
    top: 40%;
    font-size: 20px;
}
.flow_blc li:last-child::after{
    display: none;
}
.flow_blc3 li:last-child::after,.flow_blc3 li:nth-child(4)::after{
    display: none;
}
.flow_blc3{
    margin-bottom: 5rem;}
.flow_blc li p:nth-child(1),.flow_blc2 li p:nth-child(1),.flow_blc3 li p:nth-child(1){
    background-color: #030B2C;
    color: #ffffff;
    padding: 10px;

}
.flow_blc2 li p:nth-child(2){
    color: #030B2C;
}
.flow_blc2 li{
    width: calc(80%/3 - 1rem*2);
    border: 1px solid #030B2C;
    margin: 10px;
}

.flow_blc3 li{
    width: calc(90%/4 - 1rem*2);
    border: 1px solid #030B2C;
}
.flow_blc3 li p,.flow_blc2 li p{
    padding: 10px;
    font-weight: bold;
}

.flow_blc li p{
    font-weight: bold;
    color: #030B2C;
    padding: 10px 1rem;
    margin: 0;
}

.under_caution,.under_caution2{
    display: block;
    width: fit-content;
    font-size:1rem;
    margin: 0 auto;
    padding: 10px 50px;
    color: #ffffff;
    font-weight: bolder;
    border-radius: 10px
}

.under_caution{
background-color: #030B2C;}

.under_caution2{
color: #b7282e;
text-align: center;
}
.under_caution a{
    color: #ffffff;
}
#LP-html a:link,#LP-html a:visited{
color: #ffffff;
text-decoration: none;
}

/* .detail::after {
    content: "返品、交換、キャンセル、修理について\Aヘルプ＆ガイドをみる";
    white-space: pre;
    color: #ffffff;
    margin: 0 auto;
    font-size: 1rem;
} */
#topicpath_style{
max-width: 1200px;
margin: 1rem auto;
}
#topicpath_style .trace-box a {
    color: #000;
    margin: 0 auto;
    padding: 2px 10px 3px;
    text-align: left;
}

#LP-html .bk_org {
    width: 90%;
	background-color: #ed6d35;
    color: #fff;
    font-size: 1.2rem;
    padding: 5px 0;
    margin: 0 2rem;

}
#LP-html .bk_org span{font-size: 1.4rem;}
#LP-html .easy {
    padding: 10px 50px;
	margin:0 auto 2rem;
	position:relative;
}
#LP-html .easy:after {
    position: absolute;
    content: "▼";
    color: #ed6d35;
    left: 0;
    right: 0;
    bottom: -1.2rem;
}

.caution{
    width: 80%;
    background-color: #f7f7f7;
    margin-inline:auto ;
    padding:2rem;
    margin: 2em auto;

}
.caution ul ,.caution2 ul{display: block;
    position: relative;
}
.caution li,.caution2 li{
width: 100% !important;
text-align: left;
border-left: solid 6px #dd2d2d;/*左側の線*/
margin-bottom: 5px;/*下のバーとの余白*/
line-height: 1.5;
padding: 0.5em;
font-weight: bold
}
.caution2 li{border: none}
.caution p,.caution2 p{font-size: .8em}
.caution2 { width: 80%; margin-inline:auto ;margin: 2em auto;}
.caution2 li::before{content: "■"}
#LP-html .tab__menu{display: none;}

/* /////////////////////////// */
.tab__menu_pc ul{
display: flex;
width: 100%;
align-items: flex-end;
justify-content: center;
gap: 3rem;
}
.tab__menu-item_pc{
width: 100%;
padding: 8px 5rem;
/* メニューに高さを付ける */
text-align: center;
background-color: #cdcdcd;
cursor: pointer;
transition: all .3s; /* アニメーション */
margin-top: 2rem;
}
.tab__menu-item_pc span{
font-weight: bold;
font-size: 1.4rem;
}
.tab__menu-item_pc:hover{
padding: 8px 5rem;
background-color: #e27140;
color: #f7f7f7;
}
.tab{
display: block;
background-color: #ffffff;
width: 100%;
margin: 0 auto;}
.pagetop {
display: flex;
flex-direction: column;
text-align: center;
cursor: pointer;
position: fixed;
right: 10px;
bottom: 10px;
display: flex;
align-items: center;
justify-content: center;
width: 50px;
height: 50px;
border-radius: 5%;
transition: .3s;
color: #030B2C;
background: #fff;
/*   デフォルトは非表示 */
opacity: 0;}
.pagetop:hover {box-shadow: 0 0 10px #030B2C;}
/* メディアクエリ */
@media only screen and (max-width:768px){
.pagetop,.tab__menu_pc,.top____pc,.flow_blc li::after,.flow_blc3 li::after,.flow_blc li:first-child:before,.flow_blc3 li:first-child:before,.tab__panel-box00,.tab__panel-box002{display: none;}
.tab__menu_pc,.top____pc{display: none;}
#LP-html .top_text{padding: 1rem;font-size: 1.2em;}
.top_img{width: 100%;}
.list li {width: calc(100%/2);padding: 15px;}
.how_list li {width: 100%;}
.how_list__item{display: flex;position: relative;}
.how_list__item img:nth-child(1) {width: 25%;position: absolute;}
.how_list__item img:nth-child(2) {width: 50%;}
.how_list__item p , .flow_list p{align-self: center;padding: 10px;}
.flow_blc li,.flow_blc2 li,.flow_blc3 li{width: 100%;margin: 1rem;}
.flow_blc li::after,.flow_blc3 li::after{display: none;}
.flow_blc li::before, .flow_blc3 li::before {position:absolute ;content: "▼";font-size: 20px;top: -50px;}
.flow_blc li:first-child:before,.flow_blc3 li:first-child:before{display: none;}
.flow_list{
display: grid;
grid-template-columns: 1fr 2fr;
padding: 1rem;}
.flow_blc li img,.flow_blc2 li img,.flow_blc3 li img{
    width: 100%;
    place-items: center;
    }
    .flow_list p{
        text-align: start;
        font-size: 1rem;
    }
/* .flow_blc li img,.flow_blc2 li img,.flow_blc3 li img{object-fit: contain;margin-left: 5%;} */
.under_caution {width: 90%;}
.tab__panel-box001 {display: none;}
.tab__menu {
display: flex;
width: 100%;
align-items: flex-end; /* メニューを下揃え&高さを調整 */
justify-content: center;
min-height: 50px; /* メニュー切替時にタブがズレないように */
padding: 0;
margin: 0 auto;
margin-top: 3rem;
flex-wrap: nowrap;
background-color: #ffffff;
}
/* .tab__panel-box002 {display: none;} */
/* is-showがついている時のスタイル */
.tab__panel-box.is-show {display: block;}
.tab{
display: block;
background-color: #ffffff;
width: 100%;
margin: 0 auto;
}

/* タブパネル */
#LP-html .tab__panel {width: 100%;}
#LP-html .tab__menu {
display: flex;
width: 100%;
align-items: flex-end; /* メニューを下揃え&高さを調整 */
justify-content: center;
min-height: 50px; /* メニュー切替時にタブがズレないように */
padding: 0;
margin: 0 auto;
margin-top: 3rem;
flex-wrap: nowrap;
background-color: #ffffff;
}
#LP-html .tab__menu-item {
list-style: none;
width: 100%;
padding: 8px 5px; /* メニューに高さを付ける */
text-align: center;
background-color: #cdcdcd;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
cursor: pointer;
transition: all .3s; /* アニメーション */
/* border: 2px solid; */
margin-top: 2rem;
}
/* is-activeがついている時のスタイル */
#LP-html .tab__menu-item.is-active {background-color: #ED6D35;color: #ffffff;}
#LP-html .caution,#LP-html .caution2{width: 95%;}
#LP-html .under_caution2{width: 100%;}
.header {
    height: 40px;
}
}



.material-symbols-outlined {
font-variation-settings:
'FILL' 0,
'wght' 400,
'GRAD' 0,
'opsz' 24
}
