@charset "UTF-8";
img{ width: 100%; height: auto; vertical-align: bottom;}
#content .mv{ position: relative;}
#content .mv .main_img{ position: absolute; bottom: 0; left: 0; width: 100%; z-index: 9;}
#content .mv{ height: 680px; width: 100%; background: #c2edf2;}
#content .mv .mv_inner{ position: relative; height: 100%; width: 1200px; margin: auto; padding: 60px 100px; box-sizing: border-box;}
#content .mv .mv_inner .ttl_wrap{ position: absolute; top: 50px; left: 50%; transform: translateX(-50%); z-index: 99; width: 100%;}
#content .mv .mv_inner .ttl_wrap h1{ font-size: 4em; font-weight: 900; text-align: center; line-height: 1.1;}
#content .mv .mv_inner .ttl_wrap h1 .big{ font-size: 2.4em; position: relative; display: inline-block;}
#content .mv .mv_inner .ttl_wrap h1 .y_bg{ background: #ffe650; font-size: 18px; padding: 2px 5px; border-radius: 5px; width: 100%; display: inline-block; max-width: 780px;}
#content .mv .mv_inner .ttl_wrap h1 .mid{ font-size: 1.4em;}
#content .mv .mv_inner .taxi_img{ position: absolute; bottom: 20%; right: 100px; width: 50%; z-index: 99;}
#content .mv .mv_inner ul{ position: absolute; bottom: 22%; left: 100px; width: 24%; z-index: 99;}
#content .mv .mv_inner ul li{ background: #fed501; padding: 20px; box-sizing: border-box; width: 100%; font-size: 3em; font-weight: 900; margin-top: 20px; border-radius: 10px; box-shadow: 0px 0px 10px 3px rgba(0, 0, 0, 0.45);}
.topic_path{ background: #6ba441;}
#main .green_bg{ background: #6ba441;}
#main .green_bg .sec_ttl{ font-size: 3em; line-height: 1.4; color: #fff; font-weight: 700; padding: 50px 0 0;}
#main .green_bg .img_list_wrap{ width: 1200px; margin: auto; padding: 30px 100px 60px; box-sizing: border-box;}
#main .green_bg .img_list_wrap ul{ display: flex; gap: 20px; flex-wrap: wrap;}
#main .green_bg .img_list_wrap ul li{ width: calc((100% - 20px) / 2); border-radius: 10px; overflow: hidden;}
#main .btn_wrap{ width: 1200px; margin: auto; padding: 60px 100px; box-sizing: border-box;}
#main .btn_wrap ul{ display: flex; gap: 20px; flex-wrap: wrap;}
#main .btn_wrap ul li{ width: calc((100% - 20px) / 2);}
#main .btn_wrap ul li a{ display: block; padding: 50px 0; font-size: 2em; text-decoration: none; box-sizing: border-box; color: #000; background: #fed501; border-radius: 10px; font-weight: 900; transition: .3s;}

@media screen and (min-width: 768px) {
    .sph_on{ display: none;}
    #main .btn_wrap ul li a:hover{ background: #ffe650;}
}
@media screen and (max-width: 767px) {
    #content .mv{ height: 580px; min-height: initial; max-height: initial;}
    #content .mv .mv_inner{ width: 100%; padding: 30px 20px;}
    #content .mv .mv_inner .ttl_wrap{ position: initial; top: 0; left: 0; transform: none; width: 100%; margin-top: 20px;}
    #content .mv .mv_inner .ttl_wrap h1{ font-size: 2em;}
    #content .mv .mv_inner .ttl_wrap h1 .big{ font-size: 2.2em;}
	#content .mv .mv_inner .ttl_wrap h1 .y_bg{ font-size: 16px;}
    #content .mv .mv_inner .ttl_wrap h1 .mid{ font-size: 1.8em; margin-top: -20px;}
    #content .mv .mv_inner .taxi_img{ bottom: 10%; left: 50%; width: 60%; transform: translateX(-50%);}
    #content .mv .mv_inner ul{ display: flex; position: initial; bottom: 0; left: 0; width: 100%; margin: 20px auto 0; justify-content:     space-between;}
    #content .mv .mv_inner ul li{ padding: 20px 5px; width: 30%; font-size: 1.6em; border-radius: 10px; margin-top: 0;}
	#main .green_bg .sec_ttl{ font-size: 2em; padding: 10px 0 0;}
    #main .green_bg .img_list_wrap{ width: 100%; padding: 10px 20px 30px;}
    #main .green_bg .img_list_wrap ul{ gap: 10px;}
    #main .green_bg .img_list_wrap ul li{ width: calc((100% - 10px) / 2);}
    #main .btn_wrap{ width: 100%; padding: 30px 20px;}
    #main .btn_wrap ul li{ width: 100%;}
    #main .btn_wrap ul li a{ padding: 30px 0; font-size: 1.6em;}
}
@media screen and (max-width: 599px) {
	#content .mv{ height: 500px;}
}
@media screen and (max-width: 399px) {
	#content .mv{ height: 420px;}
    #main .green_bg .img_list_wrap ul li{ width: 100%;}
}
@media screen and (max-width: 374px) {
    #content .mv .mv_inner ul li{ padding: 15px 10px; width: auto; font-size: 1.4em;}
	#main .green_bg .sec_ttl{ font-size: 1.8em;}
}