@charset "utf-8";

@media ( max-width: 767px ) {}/* スマホ（〜767px） */
@media ( min-width: 768px ) and (max-width: 1024px) {}/* タブレット（768px〜1024px） */
@media ( min-width: 1025px ) {}/* PC（1025px〜） */



/*＝＝＝＝＝＝＝＝＝btn_card_simple＝＝＝＝＝＝＝＝＝*/
.btn_card_simple { display: flex; align-items: center; justify-content: center; gap: 40px; flex: 1; padding: 40px; border-radius: 8px; background: #FFF; }
.btn_card_simple_img { display: block; height: 48px; aspect-ratio: 1/1; }
.btn_card_simple_text { display: flex; align-items: center; justify-content: space-between; gap: 0.5em; flex-grow: 1; font-size: 20px; line-height: 1em; }

/*＝＝＝＝＝＝＝＝＝btn_card＝＝＝＝＝＝＝＝＝*/
.btn_card { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 20px; border-radius: 8px; background: #FFF; }
.btn_card_img { display: block; height: 150px; aspect-ratio: 4/3; }
.btn_card_text { display: flex; align-items: center; gap: 0.5em; font-size: 18px; line-height: 1em; }
@media ( min-width: 1025px ) {
    .btn_card { gap: 24px; padding: 40px; border-radius: 16px; }
    .btn_card_text { font-size: 24px; }
}

/*＝＝＝＝＝＝＝＝＝btn_primary＝＝＝＝＝＝＝＝＝*/
.btn { position: relative; display: flex; align-items: center; justify-content: center; width: fit-content; height: 48px; padding: 0 32px; border: 1px solid; border-radius: 1000px; font-weight: bold; overflow: hidden; z-index: 2; transition: color .2s ease-out; }
.btn::before { content: ''; position: absolute; top: 50%; right: 0; left: 0; transform: translateY(-50%) scale(0.1); display: block; width: 100%; height: 0; padding-top: 100%; margin: auto; border-radius: 50%; opacity: 0; z-index: -1; transition: opacity .2s, transform 0s; transition-delay: 0s, .2s; pointer-events: none; }
.btn:hover::before { transform: translateY(-50%) scale(1.1); opacity: 1; transition: opacity .8s, transform .6s ease-in-out; transition-delay: 0s; }
/* type */
.btn_type_arrow::after { content: ''; display: block; width: 18px; }
.btn_type_arrow .btn_arrow { position: absolute; top: 0; bottom: 0; right: 32px; margin: auto; }
/* color */
.btn_color_primary { border-color: #CB4524; background: #CB4524; color: #FFF; }
.btn_color_primary::before { background: #FFF; }
.btn_color_primary:hover { color: #CB4524; }
.btn_color_secondary { border-color: #4C8B4F; background: #4C8B4F; color: #FFF; }
.btn_color_secondary::before { background: #FFF; }
.btn_color_secondary:hover { color: #4C8B4F; }

/*＝＝＝＝＝＝＝＝＝bubble_cloud＝＝＝＝＝＝＝＝＝*/
.bubble_cloud { position: absolute; top: 0; left: 0; }
.bubble_cloud_inner { position: relative; z-index: -1; }
.bubble_cloud_l1,.bubble_cloud_l2 { position: absolute; padding: 0 1em; background: #FFF; border-radius: 1000px; font-size: 14px; line-height: 2.4; font-weight: bold; white-space: nowrap; }
.bubble_cloud_l1 { top: 0; left: 0; }
.bubble_cloud_l2 { top: 2.4em; left: 2em; }
.bg_white .bubble_cloud_l1,.bg_white .bubble_cloud_l2 { background: #F4F4F4; }

/*＝＝＝＝＝＝＝＝＝contact_sec＝＝＝＝＝＝＝＝＝*/
.contact_sec { position: relative; margin-top: 90px; z-index: 1; }
.contact_wrap { position: relative; display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 24px; border: 2px solid #2F2F2F; border-radius: 16px; background: #FFF; }
.contact_wrap .ears_text { position: absolute; top: -0.86em; right: 0; }
.contact_deer_wrap { position: absolute; top: -115px; left: 0; }
.contact_deer_bubble { top: -12px; left: 20px; }
.contact_tel_wrap { display: flex; flex-direction: column; align-items: center; }
.contact_tel_link { display: flex; align-items: center; gap: 0.3em; font-size: 32px; line-height: 1em; font-weight: bold; }
.contact_tel_link img { height: 0.8em; }
.contact_btn_wrap { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.contact_sec .btn_contact { width: min(280px,80vw); height: 68px; }
.contact_sec .btn_contact span { line-height: 1.3em; }
.contact_icon_mail, .contact_icon_match { margin-right: 8px; }
@media ( max-width: 599px ) {
    .contact_sec .btn_contact { padding: 0 20px; font-size: 14px; }
    .contact_sec .btn_contact .contact_icon_match { height: 18px; width: auto; }
    .contact_sec .btn_contact .contact_icon_mail { height: 16px; width: auto; }
}
@media ( min-width: 600px ) and ( max-width: 767px ) {
}
@media ( min-width: 600px ) {
    .contact_deer_bubble { top: 24px; left: 40px; }
    .contact_tel_link { font-size: 40px; }
    .contact_btn_wrap { flex-direction: row; }
    .contact_sec .btn_contact { width: min(270px,40vw); padding: 0; }
    .contact_sec .btn_contact.btn_type_arrow .btn_arrow { right: 20px; }
}
@media ( min-width: 768px ) {
    .contact_wrap { padding: 40px; }
}
@media ( min-width: 1025px ) {
    .contact_wrap { flex-direction: row; justify-content: center; gap: 20px; }
    .contact_btn_wrap { flex-direction: row; }
    .contact_single .contact_deer_wrap { position: relative; top: auto; left: auto; flex-shrink: 0; min-width: 254px; z-index: 1; }
    .contact_single .contact_deer_bubble .bubble_cloud_l1,
    .contact_single .contact_deer_bubble .bubble_cloud_l2 { background: #F4F4F4; }
    .contact_sec:has(.contact_single) { margin-top: 60px; }
}
@media ( min-width: 1200px ) {
    .contact_wrap { gap: 40px; }
    .contact_tel_link { font-size: 48px; }
    .contact_sec .btn_contact { width: 280px; }
}

/*＝＝＝＝＝＝＝＝＝ear＝＝＝＝＝＝＝＝＝*/
.ears_text { position: relative; display: inline-block; font-size: 48px; }
.ears_wrap { position: absolute; top: 8px; right: 46px; display: block; width: fit-content; }
.ears { position: relative; display: block; width: 22px; height: 0px; }
.ear { position: absolute; bottom: 0; width: 10px; }
.ear_left { left: 0px; transform-origin: bottom right; animation: earLeft 6s infinite; }
.ear_right { right: 0px; transform-origin: bottom left; animation: earRight 6s infinite; }
@media ( min-width: 768px ) {
    .ears_text { font-size: 80px; }
    .ears_wrap { top: 12px; right: 80px; transform: scale(1.7); }
}
@keyframes earLeft {
    0%  { transform: rotate(0deg); }
    3%  { transform: rotate(-20deg); }
    6%  { transform: rotate(8deg);}
    9%  { transform: rotate(0deg); }
    16% { transform: rotate(0deg); }
    25% { transform: rotate(-12deg); }
    34% { transform: rotate(0deg); }
    52% { transform: rotate(0deg); }
    /*55% { transform: rotate(-10deg); }
    58% { transform: rotate(4deg);} */
    64% { transform: rotate(0deg); }
    100%{ transform: rotate(0deg); }
}
@keyframes earRight {
    0%  { transform: rotate(0deg); }
    3%  { transform: rotate(20deg); }
    6%  { transform: rotate(-8deg);}
    9%  { transform: rotate(0deg); }
    16% { transform: rotate(0deg); }
    25% { transform: rotate(12deg); }
    34% { transform: rotate(0deg); }
    52% { transform: rotate(0deg); }
    55% { transform: rotate(10deg); }
    58% { transform: rotate(-4deg);}
    64% { transform: rotate(0deg); }
    100%{ transform: rotate(0deg); }
}

/*＝＝＝＝＝＝＝＝＝icon_chip＝＝＝＝＝＝＝＝＝*/
.icon_chip { position: relative; display: flex; align-items: center; justify-content: center; width: 36px; height: 30px; border: 1px solid; border-radius: 1000px; overflow: hidden; z-index: 2; transition: color .1s ease-out; }
.icon_chip::before { content: ''; position: absolute; top: 50%; right: 0; left: 0; transform: translateY(-50%) scale(0.1); display: block; width: 100%; height: 0; padding-top: 100%; margin: auto; border-radius: 50%; opacity: 0; z-index: -1; transition: opacity .1s, transform 0s; transition-delay: 0s, .1s; pointer-events: none; }
.icon_chip svg { width: 10px; }
a:hover .icon_chip::before { transform: translateY(-50%) scale(1.1); opacity: 1; transition: opacity .8s, transform .6s ease-in-out; transition-delay: 0s; }
/* type */
.icon_chip svg.icon_chip_arrow { transform: translateX(2px); }
/* color */
.icon_chip_white_primary { border-color: #CB4524; background: #FFF; color: #CB4524; }
.icon_chip_white_primary::before { background: #CB4524; }
a:hover .icon_chip_white_primary { color: #FFF; }
.icon_chip_primary { border-color: #CB4524; background: #CB4524; color: #FFF; }
.icon_chip_primary::before { background: #FFF; }
a:hover .icon_chip_primary { color: #CB4524 }
.icon_chip_secondary { border-color: #4C8B4F; background: #4C8B4F; color: #FFF; }
.icon_chip_secondary::before { background: #FFF; }
a:hover .icon_chip_secondary { color: #4C8B4F }
@media ( min-width: 1025px ) {
    .icon_chip { width: 48px; height: 40px; }
    .icon_chip svg { width: 12px; }
}

/*＝＝＝＝＝＝＝＝＝contents_links＝＝＝＝＝＝＝＝＝*/
.contents_links_sec { position: relative; }
.contents_links_sec::before { content: ''; position: absolute; top: 84px; right: calc(50% - 50vw); display: block; width: calc(40% + 50vw); height: 200px; border-top-left-radius: 1000px; border-bottom-left-radius: 1000px; background: #ECE5DC; z-index: -1; }
.contents_links_title { display: block; font-size: 48px; margin-left: calc(50% - 50vw); line-height: 1; color: #FFF; margin-bottom: 24px; }
.contents_links_list { display: flex; flex-direction: column; gap: 24px; }
.contents_links_card { display: flex; flex-direction: column; align-items: center; text-align: center; }
.contents_links_img { display: block; width: 200px; margin: 12px auto; }
.contents_links_card p { text-align: justify; }
.contents_links_btn { align-self: center; margin-top: 20px; }
@media ( min-width: 768px ) {
    .contents_links_sec::before { top: 160px; height: 400px; }
    .contents_links_title { font-size: 80px; margin-bottom: 30px; }
    .contents_links_list { gap: 40px; }
    .contents_links_card { flex: 1; min-width: 0; }
}
@media ( min-width: 1025px ) {
    .contents_links_sec::before { top: 180px; height: 600px; }
    .contents_links_title { font-size: 120px; margin-bottom: 40px; }
    .contents_links_list { flex-direction: row; }
    .contents_links_card { justify-content: space-between; }
}

/*＝＝＝＝＝＝＝＝＝speech_bubble＝＝＝＝＝＝＝＝＝*/
.speech_bubble { display: inline-block; position: relative; width: fit-content; padding: 24px 66px 24px 36px; background: #FFF; border-radius: 1000px; }
.speech_bubble::before { content: ''; position: absolute; top: calc(100% - 12px); right: 80px; display: block; width: 24px; aspect-ratio: 1/1; background: #FFF; border-radius: 1000px; }
.speech_bubble::after { content: ''; position: absolute; top: calc(100% + 12px); right: 60px; display: block; width: 12px; aspect-ratio: 1/1; background: #FFF; border-radius: 1000px; }
.speech_bubble_text { font-weight: bold; }
.speech_bubble_btn { position: absolute; bottom: 22px; right: 36px; }
.speech_bubble_deer { position: absolute; top: calc(100% - 20px); right: min(-5vw, calc(600px - 50vw)); pointer-events: none; }
.speech_bubble_outline { border: 1px solid #4C8B4F; }
.speech_bubble_outline::before { border: 1px solid #4C8B4F; border-top-color: transparent; border-left-color: transparent; transform: rotate(45deg); }
.speech_bubble_outline::after { border: 1px solid #4C8B4F; }
@media ( min-width: 1025px ) {
    .speech_bubble { padding: 40px 90px 40px 60px; }
    .speech_bubble::before { top: calc(100% - 36px); right: 20px; }
    .speech_bubble::after { top: calc(100% - 12px); right: 0px; }
    .speech_bubble_btn { bottom: 36px; right: 40px; }
    .speech_bubble_deer { top: calc(100% - 80px); right: -60px; }
    .speech_bubble_outline::before { transform: rotate(4deg); }
}

/*＝＝＝＝＝＝＝＝＝scrollbar_list＝＝＝＝＝＝＝＝＝*/
.scrollbar_list_wrap { position: relative; }
.scrollbar_list { overflow-y: scroll; scrollbar-width: none; }
.scrollbar_list::-webkit-scrollbar { display: none; }
.scrollbar_track { position: absolute; top: 0; right: 0; bottom: 0; width: 8px; border: 1px solid #BCBCBC; }
.scrollbar_thumb { position: absolute; width: 100%; background: #BCBCBC; outline: 1px solid #FFF; outline-offset: -1px; cursor: grab; }
.scrollbar_thumb:active { cursor: grabbing; }