/*@font-face{font-family: MazdaTypeMedium; src: url(https://www.mazda.co.jp/assets/fonts/MazdaTypeTT-Medium.woff2) format("woff2"), url(https://www.mazda.co.jp/assets/fonts/MazdaTypeTT-Medium.woff) format("woff"), url(https://www.mazda.co.jp/assets/fonts/MazdaTypeTT-Medium.ttf) format("truetype");} */

main{background: #fff;}
img{max-width:100%; display: block;}
.inner{max-width: 780px; margin: 0 auto; padding: 80px 20px; color: #041428;}
.main-content{background: #fff;}

.main-content h2{font-size: 34px; letter-spacing: .16em; font-weight: 400; text-align: center; margin-bottom: 70px; color:#041428;}
.main-content h2 span{display: block; font-size: 18px; letter-spacing: .1em; font-family: MazdaTypeMedium, sans-serif; font-weight: 400; color: #4a5b6e; padding-bottom: 15px;}
.main-content h3{color: #4a5b6e; font-size: 18px; line-height: 1.8; font-weight: 700; margin-top: 40px;}
.main-content p,
.main-content ul li,
.main-content dt,
.main-content dd{font-weight: 400!important;}

._pc{display: none;}
._sp{display: block;}

.btn-group a, summary{transition: background-color 0.5s ease;}

.btn-group{display: flex; gap: 60px; justify-content: center;}
.btn-group a{display: block; background: #000; color: #fff; text-decoration: none; padding: 10px 0; max-width: 380px; text-align: center; font-size: 16px; letter-spacing: .2em; width: 100%; border-radius: 5px;}
.btn-group a:hover{background-color: #910a2d;}
.btn-group + .note{font-size:14px; line-height: 1.8; text-align: center; margin: 15px 0 60px 0;}

#benefits .inner{max-width: 860px;}
#benefits .quo{display: flex; align-items: center; justify-content: center; gap: 30px; margin-bottom: 80px;}
#benefits .quo .img{width: 270px;}
#benefits .quo .txt{max-width: 590px; font-size: 18px; line-height: 1.8; text-align: left; letter-spacing: .16em;}
#benefits ul{background: #f7f7f7; display: block; padding: 30px 0;}
#benefits ul li{font-size:16px; line-height: 2; list-style: none; text-align: center;}

#conditions{background: #f7f7f7;}
#conditions p{font-size:18px; color:#4a5b6e;}
#conditions ul{font-size:18px; line-height: 1.8; padding-left: 1.5em; color:#4a5b6e; margin-bottom: 40px;}

#conditions .accordion{margin: 60px auto 0 auto; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; max-width:700px;}
#conditions .accordion > button {color:#041428; display: block; width: 100%; padding: 18px 20px; border: none; text-align: left; font-size: 20px; font-weight: 500; letter-spacing: .1em; cursor: pointer; position: relative; transition: background-color 0.5s ease; background: #f7f7f7;}
#conditions .accordion > button:hover {background: #e7e7e7;}
#conditions .accordion > button::after{content: '＋'; font-size: 40px; font-weight: 100; position: absolute; top:0; right: 10px;}
#conditions .accordion > button.is-open::after{content: '－';}
#conditions .accordion > ul {overflow: hidden; max-height: 0; opacity: 0; padding: 0 20px; margin: 0!important; transition: max-height 0.4s ease-out, opacity 0.4s ease, padding 0.4s ease;}
#conditions .accordion > ul.is-open{max-height: 1000px; opacity: 1; padding: 30px 20px 30px; border-top: 1px solid #ccc;}
#conditions .accordion > ul li{padding: 0!important; list-style: none!important; margin-bottom: 20px; font-size:16px;}
#conditions .accordion > ul li:nth-last-child(1){margin-bottom: 0;}

#faq{background: #d8dadd;}
#faq dt{font-size: 18px; font-weight: 500; background: #f7f7f7; padding: 12px 25px; margin-top: 10px;}
#faq dt:before{content:"Q.";}
#faq dd{font-size: 16px; font-weight: 400; line-height: 2; padding: 25px; margin: 0;}
#faq dd:before{content:"A.";}

#summary dt{font-size: 18px; font-weight: 500; background: #f7f7f7; padding: 12px 25px; margin-top: 10px;}
#summary dd{font-size: 16px; font-weight: 400; line-height: 2; padding: 25px; margin: 0;}
#summary dd:last-of-type{padding-bottom: 40px;}
#summary ul{font-size:16px; line-height: 1.5; padding-left: 1.5em; margin-bottom: 20px;}
#summary ul.--non{padding-left: 0;}
#summary ul.--non li{list-style: none;}
#summary .note{margin-bottom: 0;}

@media screen and (max-width: 767px) {
.inner{max-width: 92%; margin: 0 auto; padding: 50px 4%;}

h2 {font-size: 20px; margin-bottom: 50px;}
h2 span{font-size: 10px; padding-bottom: 7px;}
h3{font-size: 14px; line-height: 1.7; margin-top: 30px;}

._pc{display: block;}
._sp{display: none;}

.btn-group{flex-direction: column; gap: 20px;}
.btn-group a{padding: 12px 0; max-width: 100%;}
.btn-group + .note{font-siuze:12px; margin: 15px 0 40px 0;}

#benefits .quo{display: block;margin-bottom: 50px;}
#benefits .quo .img{width: 70%; margin: 0 auto 20px auto;}
#benefits .quo .txt{font-size: 14px;}
#benefits ul{padding: 30px 4%;}
#benefits ul li{font-size:14px; line-height: 1.7; text-align: left;}

#conditions p{font-size:14px; color:#4a5b6e;}
#conditions ul{font-size:14px; line-height: 1.7; margin-bottom: 30px;}

#conditions .accordion{margin: 40px auto 0 auto;}
#conditions .accordion > button {padding: 10px 20px; font-size: 15px; transition: background-color 0s ease;}
#conditions .accordion > button:hover {background: #f7f7f7;}
#conditions .accordion > button::after{font-size: 20px; top:5px; right: 10px;}
#conditions .accordion > ul li{font-size:14px;}

#faq dt{font-size: 15px; padding: 12px 20px; margin-top: 5px;}
#faq dd{font-size: 12px; line-height: 1.5; padding: 20px; margin: 0;}
#faq dd:last-of-type{padding-bottom: 0;}

#summary dt{font-size: 15px; padding: 12px 20px; margin-top: 5px;}
#summary dd{font-size: 12px; line-height: 1.5; padding: 20px; margin: 0;}
#summary ul{font-size:12px; margin-bottom: 20px;}
#summary .note{margin-bottom: 0;}

}