'use client'

import Image from 'next/image'

export default function SuitableCheckData() {
  return (
    <>
      <div className={`compliance-check-bx act`}>
        <div className="check-name-wrap">
          <div className="check-form-box ch-bld">
            <input type="checkbox" id="ch01" />
            <label htmlFor="ch01">アースティ４０</label>
          </div>
          <div className="check-name-btn">
            <button className="bx-btn"></button>
          </div>
        </div>
        <ul className="reference-list check">
          <li className="reference-item">
            <div className="check-item-wrap">
              <div className="check-form-box light">
                <input type="checkbox" id="ch02" />
                <label htmlFor="ch02">屋根技研支持瓦屋根技研支持瓦屋根技研支持瓦屋根技研支持瓦屋根技研支持瓦屋根技研支持瓦</label>
              </div>
              <div className="compliance-icon-wrap">
                <div className="compliance-icon">
                  <Image src={'/assets/images/sub/compliance_x_icon.svg'} width={22} height={22} alt=""></Image>
                </div>
              </div>
            </div>
          </li>
          <li className="reference-item">
            <div className="check-item-wrap">
              <div className="check-form-box light">
                <input type="checkbox" id="ch03" />
                <label htmlFor="ch03">屋根技研 支持金具</label>
              </div>
              <div className="compliance-icon-wrap">
                <div className="compliance-icon">
                  <Image src={'/assets/images/sub/compliance_x_icon.svg'} width={22} height={22} alt=""></Image>
                </div>
                <div className="compliance-icon">
                  <Image src={'/assets/images/sub/compliance_tip_icon.svg'} width={22} height={22} alt=""></Image>
                </div>
              </div>
            </div>
          </li>
          <li className="reference-item">
            <div className="check-item-wrap">
              <div className="check-form-box light">
                <input type="checkbox" id="ch04" />
                <label htmlFor="ch04">屋根技研支持瓦屋根技研支持瓦屋根技研支持瓦屋根技研支持瓦屋根技研支持瓦屋根技研支持瓦</label>
              </div>
              <div className="compliance-icon-wrap">
                <div className="compliance-icon">
                  <Image src={'/assets/images/sub/compliance_quest_icon.svg'} width={22} height={22} alt=""></Image>
                </div>
                <div className="compliance-icon">
                  <Image src={'/assets/images/sub/compliance_tip_icon.svg'} width={22} height={22} alt=""></Image>
                </div>
              </div>
            </div>
          </li>
          <li className="reference-item">
            <div className="check-item-wrap">
              <div className="check-form-box light">
                <input type="checkbox" id="ch05" />
                <label htmlFor="ch05">ダイドハント支持瓦Ⅱ</label>
              </div>
              <div className="compliance-icon-wrap">
                <div className="compliance-icon">
                  <Image src={'/assets/images/sub/compliance_check_icon.svg'} width={22} height={22} alt=""></Image>
                </div>
              </div>
            </div>
          </li>
        </ul>
      </div>
    </>
  )
}