@charset "UTF-8";

/*-------------------------
__check_modal
-------------------------*/

#check_modal{width: 100vw;height: 100vh;height: 100svh;height: 100dvh;display: none;justify-content: center;align-items: center;position: fixed;top: 0;left: 0;z-index: 9999;}
#check_modal [hidden]{display: none;}
#check_modal .check_modal_overlay{width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.5);    position: fixed;top: 0;left: 0;z-index: -1;}
#check_modal .check_modal_content,
#check_modal .check_result{width: 100%;max-width: 700px;max-height: calc(100vh - var(--base_padding) * 2);max-height: calc(100svh - var(--base_padding) * 2);max-height: calc(100dvh - var(--base_padding) * 2);margin: var(--base_padding);background-color: #fff;padding: calc(var(--base_padding) * 0.75) var(--base_padding) var(--base_padding);box-sizing: border-box;border-radius: 20px;overflow-x: hidden;overflow-y: scroll;position: relative;}
#check_modal .check_modal_close{width: 24px;height: 24px;background-color: var(--text);border: none;border-radius: 50%;cursor: pointer;position: absolute;top: 12px;right: 12px;}
#check_modal .check_modal_close::before,
#check_modal .check_modal_close::after{content: "";width: 16px;height: 3px;background-color: #fff;position: absolute;top: 50%;left: 50%;}
#check_modal .check_modal_close::before{transform: translate(-50%, -50%) rotate(45deg);}
#check_modal .check_modal_close::after{transform: translate(-50%, -50%) rotate(-45deg);}
#check_modal .check_modal_content .check_modal_ttl_1{padding-bottom: 16px;}
#check_modal .check_modal_content .check_modal_lead{font-size: 1.6em;line-height: 1.5em;padding-right: 1.5em;display: inline;position: relative;}
#check_modal .check_modal_content .check_modal_lead::before{content: "";width: 1em;height: 1em;background-color: var(--pink);border-radius: 0.125em;position: absolute;right: 0;bottom: 0.15em;}
#check_modal .check_modal_content .check_modal_lead::after{content: "";width: 0.583em;height: 0.292em;border-style: solid;border-color: #fff;border-width: 0 0 0.146em 0.146em;transform: rotate(-45deg);position: absolute;right: 0.15em;bottom: 0.55em;}
#check_modal .check_modal_content .check_form .check_form_list{padding-top: calc(var(--base_padding) / 2);display: flex;flex-wrap: wrap;gap: calc(var(--base_padding) / 2);}
#check_modal .check_modal_content .check_form .check_form_list li{width: calc((100% - var(--base_padding) / 2) / 2);}
#check_modal .check_modal_content .check_form .check_form_list li label{height: 100%;font-size: 1.4em;line-height: 1.5em;text-align: left;border: solid 2px var(--bgc2);border-radius: 0.5em;padding: 0.5em 0.5em 0.5em 3em;box-sizing: border-box;cursor: pointer;transition: border .3s;display: block;position: relative;}
#check_modal .check_modal_content .check_form .check_form_list li label::before{content: "";width: 24px;height: 24px;background-color: var(--bgc1);border-radius: 3px;transition: all .3s;position: absolute;left: 9px;top: 9px;}
#check_modal .check_modal_content .check_form .check_form_list li label::after{content: "";width: 1em;height: 0.5em;border-style: solid;border-color: #fff;border-width: 0 0 0.25em 0.25em;transform: rotate(-45deg) scale(0);opacity: 0;transition: all .3s;position: absolute;top: 12px;left: 12px;}
#check_modal .check_modal_content .check_form .check_form_list li label input[type="checkbox"]{display: none;}
#check_modal .check_modal_content .check_form .check_form_list li label:has(input[type="checkbox"]:checked)::before{background-color: var(--pink);}
#check_modal .check_modal_content .check_form .check_form_list li label:has(input[type="checkbox"]:checked)::after{transform: rotate(-45deg) scale(1);opacity: 1;}
#check_modal .check_modal_content .check_form .check_form_list li label span{display: block;padding: 0.25em 0;}
#check_modal .check_modal_content .check_form .check_form_submit{padding-top: var(--base_padding);}
/* 
#check_modal .check_modal_content .check_form .check_form_submit .btn{width: 182px;font-size: 14px;pointer-events: none;}
#check_modal .check_modal_content .check_form .check_form_submit .btn,
#check_modal .check_modal_content .check_form .check_form_submit .btn::after{background-color: #ccc;}
#check_modal .check_modal_content .check_form .check_form_submit .btn.active{pointer-events:visible;background-color: var(--purple1);}
#check_modal .check_modal_content .check_form .check_form_submit .btn.active::after{background-color: var(--purple1);}
*/
#check_modal .check_modal_content .check_form .check_form_submit .btn{width: 182px;font-size: 14px;}
#check_modal .check_modal_content .check_form .check_form_submit .btn,
#check_modal .check_modal_content .check_form .check_form_submit .btn::after{background-color: var(--purple1)}
#check_modal .check_result .check_result_img{padding-top: 20px;}
#check_modal .check_result .check_result_message{font-size: 1.6em;line-height: 2em;padding-top: 20px;}
#check_modal .check_result .check_result_action{padding-top: 20px;}
#check_modal .check_result .check_result_action .btn{width: 182px;font-size: 14px;}
#check_modal .check_result .check_result_action .btn::after{width: 1em;height: 1em;clip-path: inherit;background-color: transparent;background-image: url(/images/external_icon.svg);background-repeat: no-repeat;background-size: contain;left: 1.5em;top: 1.5em;}
#check_modal .check_result_low .check_result_action .btn{background-color: var(--pink);}
#check_modal .check_result_low .check_result_action .btn::after{background-image: url(/images/external_icon_2.svg);}
#check_modal .check_result_zero .check_result_action .btn{background-color: var(--orange);}
#check_modal .check_result_zero .check_result_action .btn::after{background-image: url(/images/external_icon_3.svg);}

@media screen and (min-width: 768px) {
  #check_modal .check_modal_content .check_form .check_form_list li label:hover{border: solid 2px var(--pink);}
  #check_modal .check_modal_content .check_form .check_form_submit .btn:hover,
  #check_modal .check_modal_content .check_form .check_form_submit .btn:hover::after{background-color: var(--purple3);}
}
@media screen and (max-width: 767px) {
  #check_modal .check_modal_content, 
  #check_modal .check_result{padding: calc(var(--base_padding) * 1.5) var(--base_padding);}
  #check_modal .check_modal_content .check_modal_ttl_1 img{width: auto;height: min(22px, 5vw);}
  #check_modal .check_modal_content .check_modal_lead{font-size: 1.4em;text-align: left;}
  #check_modal .check_modal_content .check_form .check_form_list li{width: 100%;}
  #check_modal .check_result .check_result_header .check_modal_ttl_2{padding-top: 20px;}
  #check_modal .check_result .check_result_header .check_modal_ttl_2 img {width: 100%;max-width:406px;height: auto;}
  #check_modal .check_result .check_result_img{padding-top: 15px;}
  #check_modal .check_result .check_result_message{font-size: 1.4em;text-align: left;padding-top: 1em;}
  #check_modal .check_result .check_result_message br{display: none;}
  #check_modal .check_result .check_result_action{padding: 15px 0;}
}