@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');
body{ font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; background: url("../images/careloop_zoom_lp_bottom_bg.png") center bottom repeat-x;}

#careloop_zoom_contents{ width: 80%; margin: 0 auto;}

header{ margin: 0 auto; padding: 0; text-align: center;}
h1{ text-align: center; font-size: 0; line-height: 0; margin: 0 auto; padding: 0;}
h1 img{ margin: 0 auto; width: 100%;}
h2{ text-align: center; font-size: 0; line-height: 0; margin: 0 auto; padding: 0;}
h2 img{ margin: 0 auto;}
h3{ text-align: center; font-size: 0; line-height: 0; margin: 0 auto 60px; padding: 0;}
h3 img{ margin: 0 auto;}

.careloop_top_btn{ padding: 80px;}

.careloop_zoom_task{ width: 100%; background: url("../images/careloop_zoom_lp_gray_bg.png") 0 0 repeat; margin: 0 auto 150px; padding: 180px 0 0;}
.careloop_zoom_taskbox{ width: 845px; margin: 0 auto; padding: 0 0 100px;}
.careloop_zoom_lp_task{ display: flex; justify-content: center; flex-wrap: wrap;}
.careloop_zoom_lp_task img{ margin: 0 5px;}
.careloop_zoom_lp_logo01{ display: block; margin: 0 auto 100px;}
.careloop_zoom_lp_taskimg{ display: block; margin: 0 auto 100px;}
.careloop_zoom_lp_logo02{ display: block; margin: 0 auto 100px;}
.careloop_zoom_pointbox{ width: 100%; background: url("../images/careloop_zoom_lp_pink_bg.png") 0 0 repeat; margin: 150px auto; padding: 100px 0;}
.careloop_zoom_point{ width: 845px; border: 10px solid #f6c2d5; border-radius: 21px; background: #fff; margin: 0 auto; padding: 50px 60px 0; text-align: center;}

.careloop_zoom_lp_information{ width: 600px; margin:0 auto; font-size: 24px; line-height: 1.8;}
.careloop_zoom_lp_information h4{ font-size: 28px; margin: 0 0 10px; color: #f4648d;}
.careloop_zoom_lp_schedule{ margin-bottom: 50px;}
.careloop_zoom_lp_timetable{ margin: 0 0 150px; padding: 0; border-collapse: collapse; border-top: 1px solid #ccc;}
.careloop_zoom_lp_timetable td{ vertical-align: top; border-bottom: 1px solid #ccc; padding: 10px;}
.careloop_zoom_lp_time{ min-width: 120px;}

footer{ min-height: 200px; padding: 0 0 150px; font-size: 11px; color:#777; text-align: center;}

.careloop_zoom_kv_pc{ display: block;}
.careloop_zoom_kv_sp{ display: none;}

.careloop_footer_copy{ display: flex; justify-content: center; width: 90%; margin: 0 auto;}
.careloop_footer_copy_link{ margin: 200px auto 0; text-align: center;}
.careloop_footer_copy_link a{ color: #777; text-decoration: none;}
.careloop_footer_copy_link a + a::before { content: "/"; margin: 0 10px;}



@media screen and (min-width: 481px){
	#fixed-image{ display: none;}
}

@media screen and (max-width: 480px){
	#careloop_zoom_contents{ width: 100%;}
	.careloop_zoom_task{ margin-bottom: 50px; padding-top: 50px;}
	.careloop_zoom_lp_task img{ width: 70%;}
	.careloop_zoom_taskbox{ width: 80%; padding-bottom: 50px;}
	h2{ width: 90%;}
	.careloop_zoom_pointbox{ margin-top: 50px; margin-bottom: 100px; padding: 50px 0;}
	.careloop_zoom_point{ width: 85%; padding: 20px 10px 0; border: 7px solid #f6c2d5;}
	h3{ width: 70%; margin-bottom: 30px;}
	.careloop_zoom_lp_logo01{ margin-bottom: 30px;}
	.careloop_zoom_lp_taskimg{ margin-bottom: 30px; width: 65%;}
	.careloop_zoom_lp_logo02{ margin-bottom: 30px;}
	.careloop_zoom_lp_information{ width: 80%; font-size: 18px;}
	.careloop_zoom_lp_information h4{ font-size: 24px;}
	.careloop_zoom_lp_time{ min-width: 100px;}
	footer{ min-height: 100px; padding: 0 0 30px;}
	footer p{ width: 80%; margin: 0 auto;}
	.careloop_zoom_lp_footertxt{ max-width: 200px;}
	.careloop_zoom_kv_pc{ display: none;}
	.careloop_zoom_kv_sp{ display: block;}
	.careloop_footer_copy_link{ margin: 150px auto 0; text-align: center;}
	/*.careloop_top_btn{ width: 80%; padding: 80px 0; margin: 0 auto;}
	.careloop_top_btn p{ text-align: center;}
	.careloop_top_btn p img{ margin: 0 auto;}
	.careloop_top_btn{ height: 0; overflow: hidden; padding: 0;}
	#fixed-image{ position: fixed; bottom: 0; left: 0; right: 0; width: 100%; transition: opacity 3s ease; opacity: 1; padding: 20px 10%; background: #fff;}*/
	#fixed-image {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        transition: opacity 1s ease;
        opacity: 1;
        padding: 20px 10%;
        background: #fff;
    }
    .careloop_top_btn {
        height: 0;
        overflow: hidden;
        padding: 0;
    }
}