@charset "utf-8";
/* CSS Document */
/*----------------------------------------------------------
agreement
----------------------------------------------------------*/
.title{
color: var(--color_brown01);
font-size: 2.0rem;
font-weight: bold;
text-align: center;
margin: 0 0 50px;
padding: 25px 0;
position: relative;
}
.title::before{
content: "";
width: 100%;
height: 4px;
background: url("/assets/images/common/titleTypeA01_border_01.webp") top center / auto 100% repeat-x;
position: absolute;
left: 0;
top: 0;
}
.title::after{
content: "";
width: 100%;
height: 4px;
background: url("/assets/images/common/titleTypeA01_border_01.webp") top center / auto 100% repeat-x;
position: absolute;
left: 0;
bottom: 0;
}
@media (max-width: 768px){
.title{
font-size: 1.6rem;
margin: 0 0 3.0rem;
padding: 2.0rem 0;
}
.title::before,
.title::after{
height: 0.3rem;
}
}

.lead{
font-size: 1.6rem;
text-align: center;
line-height: 2.0;
margin: 0 0 50px;
}
@media (max-width: 768px){
.lead{
font-size: 1.4rem;
margin: 0 0 3.0rem;
}
}

.block_agreement01 .box01 + .box01{
margin-top: 40px;
}
.block_agreement01 .box01 .title01{
font-size: 1.8rem;
font-weight: bold;
margin: 0 0 20px;
padding: 0 20px 10px;
position: relative;
}
.block_agreement01 .box01 .title01::before{
content: "";
width: 100%;
height: 4px;
background: url("/assets/images/common/titleTypeA01_border_01.webp") top center / auto 100% repeat-x;
position: absolute;
left: 0;
bottom: 0;
}
.block_agreement01 .box01 .title02{
font-size: 1.8rem;
font-weight: bold;
margin: 0 20px 10px;
}
.block_agreement01 .box01 [class^="text"]{
margin: 0 0 0 20px;
font-size: 1.6rem;
line-height: 2.0;
}
.block_agreement01 .box01 [class^="text"] a{
color: var(--color_blue01);
text-decoration: underline;
display: inline;
}
.block_agreement01 .box01 [class^="text"] + [class^="text"]{
margin-top: 30px;
}
.block_agreement01 .box01 .text02{
display: flex;
}
.block_agreement01 .box01 .text02 .num{
margin: 0 10px 0 0;
display: inline-block;
}
.block_agreement01 .box01 .list01{
margin: 0 0 0 20px;
}
.block_agreement01 .box01 .list01 li{
font-size: 1.6rem;
line-height: 2.0;
padding: 0 0 0 20px;
position: relative;
}
.block_agreement01 .box01 .list01 li::before{
content: "・";
position: absolute;
left: 0;
top: 0;
}
.block_agreement01 .box01 .list02{
background: var(--color_beige03);
padding: 40px 60px;
}
.block_agreement01 .box01 .list02 > li{
font-size: 1.6rem;
margin: 0 0 20px;
}
.block_agreement01 .box01 .list02 > li:last-child{
margin-bottom: 0;
}
.block_agreement01 .box01 .list02 > li span{
font-weight: bold;
margin: 0 40px 0 0;
display: inline-block;
}
.block_agreement01 .box01 .list02 > li a{
color: var(--color_blue01);
text-decoration: underline;
}
@media (max-width: 768px){
.block_agreement01 .box01 + .box01{
margin-top: 3.0rem;
}
.block_agreement01 .box01 .title01{
font-size: 1.4rem;
margin: 0 0 1.5rem;
padding: 0 1.0rem 0.8rem;
}
.block_agreement01 .box01 .title01::before{
height: 0.3rem;
}
.block_agreement01 .box01 .title02{
font-size: 1.4rem;
margin: 0 0 1.0rem;
}
.block_agreement01 .box01 [class^="text"]{
margin: 0;
font-size: 1.4rem;
}
.block_agreement01 .box01 [class^="text"] + [class^="text"]{
margin-top: 3.0rem;
}
.block_agreement01 .box01 .text02 .num{
margin: 0 1.0rem 0 0;
}
.block_agreement01 .box01 .list01{
margin: 0;
}
.block_agreement01 .box01 .list01 li{
font-size: 1.4rem;
padding: 0 0 0 1.8rem;
}
.block_agreement01 .box01 .list02{
padding: 2.0rem;
}
.block_agreement01 .box01 .list02 > li{
font-size: 1.4rem;
margin: 0 0 1.5rem;
}
.block_agreement01 .box01 .list02 > li span{
margin: 0 0 0.5rem;
display: block;
}
.block_agreement01 .box01 .list02 > li a{
color: var(--color_blue01);
text-decoration: underline;
}
}