.sec_img_list .list_ttl { padding: 0 6rem 0 3rem; } #generic_about .ttl_area { margin-bottom: 6rem; padding-bottom: 3rem; border-top: 1px solid #07a33e; border-bottom: 1px solid #07a33e; position: relative; } #generic_about .ttl_area::before { content: ''; width: 27em; height: 5px; background-color: #fff; position: absolute; top: -3px; left: 0; } #generic_about .ttl_area .sec_ttl { transform: translateY(-50%); } #generic_about .txt_area { display: flex; } #generic_about .box_txt { width: 80%; height: 8rem; padding: 0 2em; font-size: 2rem; font-weight: 600; background-color: #eff4f0; border-top-left-radius: 40px; border-bottom-left-radius: 40px; display: flex; align-items: center; } #generic_about .box_btn { width: 20%; height: 8rem; padding: 0 2em; font-size: 1.8rem; font-weight: 600; color: #fff; background: #07a33e url(/common/img/icon_arrow_cwr01.png) no-repeat center right 1em/2em; border-top-right-radius: 40px; border-bottom-right-radius: 40px; display: flex; align-items: center; } #generic_about .box_btn:hover { background-color: #42ac96; } #generic_efforts { margin-top: 20rem; } #generic_efforts .efforts_top { position: relative; } #generic_efforts .efforts_top .efforts_img { border-top-right-radius: 50px; border-bottom-right-radius: 50px; box-shadow: 4px 4px 10px 0 rgba(0, 0, 0, 0.2); overflow: hidden; position: absolute; top: -6rem; left: 0; } #generic_efforts .efforts_top .txt_area { width: 80%; margin: 0 0 0 auto; padding: 6rem 2% 11rem 18%; background: url(../img/efforts_bg.jpg) no-repeat right bottom/cover; border-top-left-radius: 50px; border-bottom-left-radius: 50px; } #generic_efforts .efforts_top .efforts_top_list { margin-top: 5rem; display: flex; flex-wrap: wrap; } #generic_efforts .efforts_top .efforts_top_list li { width: 45%; margin: 0 5% 3% 0; } #generic_efforts .efforts_top .efforts_top_list a { display: block; font-size: 1.8rem; font-weight: 600; padding: 1em 2em; background: #fff url(/common/img/icon_arrow_cgr01.png) no-repeat center right 1em/1.5em; border-radius: 30px; box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.4); } #generic_efforts .efforts_top .efforts_top_list a:hover { color: #fff; background-color: #07a33e; } #generic_efforts .efforts_mid { padding: 14rem 0 10rem; } #generic_efforts .efforts_btm { padding: 10rem 0 6rem; background: linear-gradient(90deg, #42c055 0%, #42c055 20%, #7ed384 50%, #42c055 100%); position: relative; } #generic_efforts .efforts_btm::before { content: ''; width: 100%; height: 4rem; background-color: #fff; border-bottom-left-radius: 50px; position: absolute; top: 0; left: 0; } #generic_efforts .efforts_btm .efforts_btm_list { display: flex; justify-content: space-between; } #generic_efforts .efforts_btm .efforts_btm_list li { width: 32%; } #generic_efforts .efforts_btm .efforts_btm_list a { max-height: 12rem; padding: 3rem; background-color: #fff; border-radius: 15px; display: flex; align-items: center; } #generic_efforts .efforts_btm .efforts_btm_list a:hover { background-color: #eff4f0; } #generic_efforts .efforts_btm .efforts_btm_list .other_txt { font-size: 2rem; font-weight: bold; line-height: 1.4; } #generic_efforts .efforts_btm .efforts_btm_list .other_img { margin-right: 1.8rem; } #generic_efforts.lower { margin: 0; } .lower_link_area { margin-top: 10rem; padding-bottom: 0; } @media screen and (min-width: 768px) and (max-width: 1240px) { #generic_about .box_txt { font-size: 1.6vw; } #generic_about .box_btn { font-size: 1.4vw; } #generic_efforts .efforts_top .efforts_img { width: 35%; } #generic_efforts .efforts_top .efforts_top_list a { font-size: 1.4vw; } #generic_efforts .efforts_btm .efforts_btm_list a { padding: 2.4vw; } #generic_efforts .efforts_btm .efforts_btm_list .other_txt { font-size: 1.6vw; } } @media screen and (max-width: 767px) { #headline .headline_ttl span img { max-width: 48.5px; vertical-align: middle; } .sec_img_list .list_ttl { padding: 0 4rem; } .sec_img_list li { margin-top: 3rem; } #generic_about .ttl_area { margin-bottom: 3rem; padding-bottom: 1.5rem; } #generic_about .ttl_area::before { width: 70vw; } #generic_about .txt_area { display: block; } #generic_about .box_txt { width: 100%; height: auto; padding: 1.5em 2em; font-size: 4vw; line-height: 1.8; border-top-left-radius: 20px; border-top-right-radius: 20px; border-bottom-left-radius: 0; display: block; } #generic_about .box_btn { width: 100%; height: auto; padding: 1em 4em 1em 1em; font-size: 3.7vw; text-align: right; border-top-right-radius: 0; border-bottom-right-radius: 20px; border-bottom-left-radius: 20px; display: block; } #generic_efforts { margin-top: 6rem; } #generic_efforts .efforts_top { padding-bottom: 14vw; } #generic_efforts .efforts_top .efforts_img { width: 55%; border-top-right-radius: 25px; border-bottom-right-radius: 25px; top: auto; bottom: 0; left: 0; } #generic_efforts .efforts_top .txt_area { width: calc(100% - 1.8rem); padding: 9vw 0 64vw 1.5rem; background-image: url(../img/efforts_bg_sp.jpg); border-top-left-radius: 25px; border-bottom-left-radius: 25px; } #generic_efforts .efforts_top .efforts_top_list { margin-top: 2.5rem; } #generic_efforts .efforts_top .efforts_top_list li { width: 48%; margin: 0 2% 3% 0; } #generic_efforts .efforts_top .efforts_top_list li.wide { width: 98%; } #generic_efforts .efforts_top .efforts_top_list a { font-size: 3.7vw; padding: 1em; background-size: 1.2em auto; background-position: center right 0.5em; } #generic_efforts .efforts_mid { padding: 20vw 0 12vw; } #generic_efforts .efforts_btm { padding: 20vw 0 12vw; } #generic_efforts .efforts_btm::before { height: 8vw; border-bottom-left-radius: 25px; } #generic_efforts .efforts_btm .efforts_btm_list { display: block; } #generic_efforts .efforts_btm .efforts_btm_list li { width: 100%; margin-top: 1rem; } #generic_efforts .efforts_btm .efforts_btm_list a { padding: 5.3vw 8vw; border-radius: 8px; } #generic_efforts .efforts_btm .efforts_btm_list .other_txt { font-size: 4vw; } #generic_efforts .efforts_btm .efforts_btm_list .other_img { margin-right: 5vw; width: 10%; } .lower_link_area { margin-top: 5rem; } .lower_link_area .lower_link_list li { width: 100%; } } /*# sourceMappingURL=generic.css.map */