@charset "UTF-8";
/* CSS Document */

/* トップページ */
@media (max-width: 1500px){
#hero-area section div p { font-size: 1.8rem;}
header section nav ul { font-size: 1.5rem;}
.index-intro { background: url("../images/index/intro_bg.svg") no-repeat center left, var(--clr-bg); background-size: 60%;}
.index-intro section div h3 { font-size: 3.2rem;}
.index-intro section div ul li { font-size: 2.8rem;}
}
@media (max-width: 1100px){
#hero-area section { width: 100%;}
#hero-area section div { width: 48%;}
#hero-area section div p { font-size: 1.4rem;}
header section nav ul { font-size: 1.3rem;}
header section nav .button a { font-size: 1.3rem;}
main article.belt h2 { font-size: 2.0rem;}
.index-intro { background: url("../images/index/intro_bg.svg") no-repeat center left, var(--clr-bg); background-size: 70%;}
.index-intro section div h3 { font-size: 2.1rem;}
.index-intro section div ul li { font-size: 1.8rem;}
.half .inner h2 { font-size: 2.6rem;}
.half .inner p { font-size: 1.4rem;}
main article.belt h2 { font-size: 1.4rem;}
footer section nav ul { font-size: 1.6rem;}
}
@media (max-width: 900px){
footer section nav ul { font-size: 1.4rem;}
footer section h3 { font-size: 1.6rem;}
footer section .phone { font-size: 2.4rem;}
}
@media (max-width: 767px){
.index-intro { background: var(--clr-bg);}
#hero-area section div { width: 100%;}
}
@media (max-width: 480px){
#hero-area section div p { font-size: 1.4rem; line-height: 1.6em;}
.half .inner h2 { font-size: 2.0rem;}
main article.belt h2 { padding: 0.8em 0;}
main article.belt section div p { font-size: 1.2rem;}
main article.belt strong { font-size: 1.6rem;}
.index-intro section div ul { margin-top: 1.5em;}
main article.about section div p { font-size: 1.3rem; line-height: 1.7em;}
main article section .half + .half { margin-top: 4.4rem;}
.index-intro section div h3 { font-size: 2.0rem;}
}

/* TOP24のメリット */
@media (max-width: 1200px){
main article.merit-intro div ul li div > p { font-size: 2.0rem;}
main article.merit-intro div ul li div span { font-size: 7.5rem;}
}
@media (max-width: 1000px){
section.merit-title.sec-title h1 img { width: 80%;}
main article.merit-intro div ul li div > p { font-size: 1.5rem;}
main article.merit-intro div ul li div span { font-size: 5.5rem;}
main article.merit-intro div ul li p { font-size: 1.5rem;}
}
@media (max-width: 768px){
main article.merit-intro div ul li div > p { font-size: 2.4rem;}
main article.merit-intro div ul li div span { font-size: 9.5rem;}
main article.merit-intro div ul li p { font-size: 1.7rem;}
}
@media (max-width: 640px){
section.merit-title.sec-title h2 { font-size: 2.0rem;}
main article.merit-intro div ul li { width: 100%;}
}
@media (max-width: 480px){
#merit-hero-area {background: #FFF; display: block; margin: 0px auto; padding: 5vw 4%; width: 100%;}
#merit-hero-area img { max-width: 100%;}
section.merit-title.sec-title { background-size: cover; height: 70px;}
section.merit-title.sec-title h1 img { width: 100%;}
section.merit-title.sec-title h2 { font-size: 2.0rem;}
main article.merit-intro div ul li { margin-bottom: 2.0em;}
main article.merit-intro div ul li div > p { font-size: 2.0rem;}
main article.merit-intro div ul li p { font-size: 1.4rem;}
main article.merit-intro div ul li div span { font-size: 5.5rem;}
main article.merit-tproduction { margin: 2.0em auto; max-width: 90%;}
main article.merit-tproduction p { margin-bottom: 2.0em;}
main article.merit-tproduction figure { margin: 2.0em 0 0;}
}


/* 駐車場経営の流れ */
@media (max-width: 1200px){
main article.flow-plan .flow-plan-sec01 .plan-item .plan-item-title span { font-size: 1.8rem;}
}
@media (max-width: 1000px){
main article.flow-plan .flow-plan-sec01 { flex-wrap: wrap;}
main article.flow-plan .flow-plan-sec01 .plan-item { margin-bottom: 2.0em; width: 100%;}
.flow-plan-sec02-box-mini { max-width: 100%;}
}
@media (max-width: 640px){
main article.flow-intro > div .flow-item .num { font-size: 1.8rem;}
main article.flow-intro > div .flow-item .title { font-size: 2.2rem;}
main article.flow-intro > div .flow-item .text01 { font-size: 1.6rem;}
.flow-plan-sec02-title { font-size: 2.0rem;}
.flow-plan-sec02-box-mini .ul01 li { font-size: 1.6rem;}
.flow-plan-sec02-waku-left span { font-size: 1.6rem;}
.flow-plan-sec02-waku-right { font-size: 1.6rem;}
}
@media (max-width: 480px){
#flow-hero-area {background: #FFF; display: block; margin: 0px auto; padding: 5vw 4%; width: 100%;}
#flow-hero-area img { max-width: 100%;}
section.flow-title.sec-title { background-size: cover; height: 70px;}
section.flow-title.sec-title h1, section.flow-title.sec-title h2 { font-size: 2.4rem; line-height: 1.4em;}
main article.flow-intro > div .flow-item { margin-bottom: 3.0em;}
main article.flow-intro > div .flow-item .title { margin: 0.5em 0 1.0em;}
main article.flow-intro > div .flow-item .text01 { font-size: 1.6rem;}
main article.flow-plan { padding: 2.0em 0;}
main article.flow-plan .flow-plan-sec01 { margin-bottom: 2.0em;}
main article.flow-plan .flow-plan-sec01 .plan-item .plan-item-title span { font-size: 2.0rem;}
main article.flow-plan .flow-plan-sec01 .plan-item ul li { font-size: 1.5rem;}
main article.flow-plan .flow-plan-sec01 .plan-item ul li::before { top: 0.2em;}
.flow-plan-sec02-box-mini { margin: 0 auto 3.0em;}
.flow-plan-sec02-box-mini .ul01 li { font-size: 1.4rem;}
.flow-plan-sec02-box-mini .ul01 li::before { top: 0.2em;}
.flow-plan-sec02-box-mini .ol01 li { font-size: 1.4rem;}
.flow-plan-sec02-box-mini .ol01 li::before { font-size: 0.7em; top:0.3em;}
.flow-plan-sec02-waku { flex-wrap: wrap;}
.flow-plan-sec02-waku-left { margin-bottom: 1.0em; width: 100%;}
.flow-plan-sec02-waku-right { width: 100%;}
}

/* よくある質問 */
@media (max-width: 480px){
#qa-hero-area {background: #FFF; display: block; margin: 0px auto; padding: 5vw 4%; width: 100%;}
#qa-hero-area img { max-width: 100%;}
section.qa-title.sec-title { background-size: cover; height: 70px;}
.qa-item:last-child { border-bottom: none;}
.qa-q-box p { font-size: 1.8rem;}
.qa-a-box span { padding: 0em 0.4em;}
.qa-a-box p { font-size: 1.6rem;}
}


/* 運用駐車場のご案内 */
@media (max-width: 1200px){
main article.parking-intro .parking-text01 { font-size: 1.8rem}
.parking-sec-title { font-size: 2.4rem;}
main article.parking-top24 ul li p { font-size: 1.8rem;}
.parking-guide-box-title { font-size: 2.0rem;}
.parking-guide-box ul li { font-size: 1.4rem;}
}
@media (max-width: 1000px){
.parking-guide-box ul li { width: calc(100%/2);}
}
@media (max-width: 640px){
main article.parking-intro { margin: 3.0em auto; width: 90%;}
main article.parking-intro .parking-text01 { font-size: 1.8rem; text-align: left;}
main article.parking-top24 ul { flex-wrap: wrap;}
main article.parking-top24 ul li { margin-bottom: 3.0em; text-align: center; width: 100%;}
}
@media (max-width: 480px){
#parking-hero-area {background: #FFF; display: block; margin: 0px auto; padding: 5vw 4%; width: 100%;}
#parking-hero-area img { max-width: 100%;}
section.parking-title.sec-title { background-size: cover; height: 70px;}
.parking-guide-box-title { font-size: 1.8rem; line-height: 1.4em; margin-bottom: 1em;}
.parking-guide-box ul li { width: calc(100%/1);}
.sp-kic-outer { display: flex; justify-content: center;}
.sp-kunoji { border-top: 3px solid #000; border-right: 3px solid #000; box-sizing: border-box; height: 20px; transform: rotate(135deg); transition: transform 0.3s ease; width: 20px;}
.sp-kunoji.open { transform: rotate(315deg);}
#parking-guide-nagasaki { display: none; overflow: hidden; transition: max-height 1.4s ease;}
#parking-guide-fukuoka { display: none; overflow: hidden; transition: max-height 1.4s ease;}
}


/* お問い合わせ */
@media (max-width: 1200px){
.contact-sec-title { font-size: 2.4rem;}
}
@media (max-width: 640px){
main article.contact-intro { margin: 3.0em auto;}
main article.contact-intro > div { margin: 3.0em auto}
main article.contact-intro .contact-text01 { font-size: 1.8rem; text-align: left;}
main article.contact-intro ul li { font-size: 1.8rem;}
}
@media (max-width: 480px){
#contact-hero-area {background: #FFF; display: block; margin: 0px auto; padding: 5vw 4%; width: 100%;}
#contact-hero-area img { max-width: 100%;}
main article.contact-intro { margin: 2.0em auto;}
main article.contact-intro > div { margin: 2.0em auto}
main article.contact-intro .contact-text01 { font-size: 1.7rem;}
main article.contact-intro ul li { font-size: 1.7rem;}
section.contact-title.sec-title { background-size: cover; height: 70px;}
.contact-sec-title { font-size: 2.0rem;}
main article.contact-tel > div { margin: 2.0em auto;}
.contact-box  { margin-bottom: 1.0rem;}
.contact-box .contact-box-left { font-size: 2.0rem;}
.contact-box-right { font-size: 2.2rem;}
main article.contact-internet > div { margin: 2.0em auto;}
.contact-sec02 p { font-size: 1.6rem; text-align: left;}
.contact-sec03 p { font-size: 1.5rem;}
}


/* お問い合わせフォーム */
@media (max-width: 640px){
#inquiry-form article.contents section p { font-size: 1.4rem;}
#inquiry article.contents.note section p { font-size: 1.4rem;}
#inquiry-form article.contents.note section p { font-size: 1.4rem;}
#inquiry article.contents.note span { font-size: 1.4rem;}
.submit-container input[type="button"] { font-size: 1.4rem;}
.submit-container input[type="submit"] { font-size: 1.4rem;}
}
@media (max-width: 480px){
.backBtn { width: 100%;}
}

@media (max-width: 480px){
.brDisp480{ display: block;}
.brClear480{ display: none;}
}