@charset "utf-8";
/* ===== 阿波の磁槍棒（page-jiyaribo.php） ===== */
.jiyaribo{--jsb-navy:#004A97;--jsb-blue:#0077C2;--jsb-red:#E60012;--jsb-gray:#EFEFEF;--jsb-text:#232323;}

/* メイン画像 */
.jiyaribo #sub_image{margin-bottom:0;background-image:url("../image/jiyaribo/main.jpg?202610021100");}
/* コンテンツ枠（テーマの白枠・余白を解除して全幅に） */
.jiyaribo #contents{width:100%;max-width:none;margin:0;padding:0;box-sizing:border-box;background:none;}
.jiyaribo #contents p{margin-bottom:0;}
.jiyaribo #contents img{width:100%;}
.jiyaribo #contents figure{margin:0;}
.jiyaribo #contents .red{color:var(--jsb-red);}
.jiyaribo #contents strong{font-weight:700;}
.jiyaribo #contents .inner{max-width:986px;margin:0 auto;padding:0 20px;box-sizing:border-box;}
.jiyaribo #contents .jsb_section{padding:64px 0;scroll-margin-top:16px;background:#FFFFFF;}
/* 見出し */
.jiyaribo #contents .jsb_heading{margin-bottom:24px;padding-left:12px;border-left:6px solid var(--jsb-navy);font-size:20px;font-weight:700;line-height:1.4;}
.jiyaribo #contents .jsb_sub{margin-bottom:16px;font-size:18px;font-weight:700;color:var(--jsb-blue);line-height:1.5;}
/* ===== ページ内ナビ ===== */
.jiyaribo #contents .jsb_nav{padding:12px 20px;border-bottom:1px solid #DFE1E2;background:#FFFFFF;}
.jiyaribo #contents .jsb_nav ul{max-width:946px;margin:0 auto;display:flex;justify-content:flex-end;flex-wrap:wrap;gap:4px 24px;}
.jiyaribo #contents .jsb_nav li a{display:block;font-size:14px;font-weight:700;}
.jiyaribo #contents .jsb_nav li a i{margin-left:6px;color:var(--jsb-navy);}
.jiyaribo #contents .jsb_nav li a:hover{color:var(--jsb-blue);}
/* ===== リード ===== */
.jiyaribo #contents .jsb_lead{padding-bottom:40px;}
.jiyaribo #contents .jsb_title{margin-bottom:40px;padding-bottom:16px;border-bottom:8px double var(--jsb-navy);font-size:20px;font-weight:400;font-family:"Sawarabi Mincho", serif;line-height:1.7;text-align:center;}
.jiyaribo #contents .jsb_title span{display:block;}
.jiyaribo #contents .jsb_caution{margin:0 auto 40px!important;padding:24px 16px;background:radial-gradient(ellipse 30% 50% at center, rgba(244,163,131,0.6) 0%, rgba(244,163,131,0) 100%);font-size:18px;font-weight:700;color:var(--jsb-red);line-height:1.8;text-align:center;}
/* 動画（アタリ） */
.jiyaribo #contents .movie_box{width:100%;position:relative;aspect-ratio:16 / 9;overflow:hidden;background:#000000;}
.jiyaribo #contents .movie_box video{width:100%;height:100%;position:absolute;top:0;left:0;display:block;object-fit:contain;}
/* ===== 装備品とその仕様 ===== */
.jiyaribo #contents .jsb_spec{padding-top:24px;}
.jiyaribo #contents .jsb_spec .item{margin-bottom:40px;}
.jiyaribo #contents .jsb_spec .spec_box{display:flex;justify-content:space-between;align-items:flex-start;}
.jiyaribo #contents .jsb_spec .spec_photo{width:49%;position:relative;background:#F1F1F1;}
.jiyaribo #contents .jsb_spec .spec_table{width:49%;}
/* バッジ */
.jiyaribo #contents .jsb_spec .badge{width:132px;position:absolute;top:16px;left:16px;z-index:1;}
.jiyaribo #contents .jsb_spec .badge li{margin-bottom:10px;padding:8px 4px;box-sizing:border-box;background:var(--jsb-navy);color:#FFFFFF;line-height:1.2;text-align:center;}
.jiyaribo #contents .jsb_spec .badge li strong{display:block;font-size:13px;color:#F2C200;letter-spacing:2px;}
.jiyaribo #contents .jsb_spec .badge li small{margin-top:4px;display:block;font-size:8px;}
.jiyaribo #contents .jsb_spec .badge li.adopt{padding:18px 4px;}
/* 仕様表 */
.jiyaribo #contents .jsb_spec .spec_table th,
.jiyaribo #contents .jsb_spec .spec_table td{padding:16px;border:1px solid #999999;background:#FFFFFF;line-height:1.9;text-align:left;vertical-align:top;}
.jiyaribo #contents .jsb_spec .spec_table thead th{background:var(--jsb-blue);font-weight:700;color:#FFFFFF;text-align:center;vertical-align:middle;}
.jiyaribo #contents .jsb_spec .spec_table tbody th{width:38%;font-weight:400;}
/* 取扱上の注意事項 */
.jiyaribo #contents .jsb_spec .notice{padding:24px 44px;background:var(--jsb-gray);}
.jiyaribo #contents .jsb_spec .notice h4{margin-bottom:4px;font-size:16px;font-weight:700;color:var(--jsb-navy);}
.jiyaribo #contents .jsb_spec .notice ol{padding-left:1.5em;list-style:decimal;}
.jiyaribo #contents .jsb_spec .notice li{font-size:13px;line-height:1.8;}
/* ===== お問い合わせ ===== */
.jiyaribo #contents .jsb_contact{padding:72px 0 80px;background:var(--jsb-navy) url("../image/jiyaribo/contact_bg.jpg?202610021100") no-repeat center center / cover;color:#FFFFFF;}
.jiyaribo #contents .jsb_contact h3{margin-bottom:40px;font-size:22px;font-weight:700;text-align:center;}
.jiyaribo #contents .jsb_contact h3::after{content:"";width:40px;margin:16px auto 0;display:block;border-bottom:3px solid #FFFFFF;}
.jiyaribo #contents .jsb_contact .contact_box{display:flex;justify-content:space-between;}
.jiyaribo #contents .jsb_contact .contact_box a{width:48.5%;min-height:106px;padding:16px;box-sizing:border-box;display:flex;justify-content:center;align-items:center;border:3px solid #FFFFFF;border-radius:6px;transition:0.3s;}
.jiyaribo #contents .jsb_contact .contact_box a i{margin-right:32px;font-size:48px;font-weight:400;}
.jiyaribo #contents .jsb_contact .tel{background:rgba(0,62,128,0.5);color:#FFFFFF;}
.jiyaribo #contents .jsb_contact .tel i{transform:rotate(-30deg);}
.jiyaribo #contents .jsb_contact .tel .num{font-size:36px;font-weight:700;line-height:1.1;letter-spacing:1px;}
.jiyaribo #contents .jsb_contact .tel .num small{margin-top:6px;display:block;font-size:13px;font-weight:400;letter-spacing:0;text-align:center;}
.jiyaribo #contents .jsb_contact .mail{background:#FFFFFF;font-size:20px;font-weight:700;color:var(--jsb-navy);}
.jiyaribo #contents .jsb_contact .mail:hover{background:var(--jsb-gray);}
/* ===== 最前線に立つ警察官の「命を守る」ために ===== */
.jiyaribo #contents .jsb_background{background:var(--jsb-gray);}
.jiyaribo #contents .jsb_background > .inner > p{font-size:14px;line-height:1.9;}
.jiyaribo #contents .jsb_background .problem_list{margin:24px 0;display:flex;justify-content:space-between;flex-wrap:wrap;}
.jiyaribo #contents .jsb_background .problem_list li{width:24.2%;padding:24px 16px 32px;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;background:#FFFFFF;}
.jiyaribo #contents .jsb_background .problem_list .num{width:120px;margin-bottom:32px;padding:2px 0;display:block;background:var(--jsb-blue);border-radius:20px;font-size:22px;font-weight:700;color:#FFFFFF;text-align:center;}
.jiyaribo #contents .jsb_background .problem_list figure{width:108px;margin-bottom:20px;}
.jiyaribo #contents .jsb_background .problem_list h5{margin-bottom:12px;font-size:18px;font-weight:700;color:var(--jsb-navy);}
.jiyaribo #contents .jsb_background .problem_list p{max-width:160px;font-size:13px;line-height:1.8;}
/* ===== 期待される効果 ===== */
.jiyaribo #contents .jsb_effect .effect_list{margin-bottom:24px;display:flex;justify-content:space-between;flex-wrap:wrap;}
.jiyaribo #contents .jsb_effect .effect_list li{width:24.2%;padding:0 8px;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;}
.jiyaribo #contents .jsb_effect .effect_list figure{width:110px;margin-bottom:12px;}
.jiyaribo #contents .jsb_effect .effect_list h5{margin-bottom:6px;font-size:17px;font-weight:700;color:var(--jsb-navy);text-align:center;}
.jiyaribo #contents .jsb_effect .effect_list p{font-size:13px;line-height:1.8;}
.jiyaribo #contents .jsb_effect .inner > p{font-size:14px;line-height:1.9;}
/* ===== 取扱い要領 ===== */
.jiyaribo #contents .jsb_howto{background:var(--jsb-gray);}
.jiyaribo #contents .jsb_howto .step_list li{margin-bottom:28px;padding:10px 28px;position:relative;display:flex;align-items:center;background:#FFFFFF;}
.jiyaribo #contents .jsb_howto .step_list li:not(:last-child)::after{content:"";width:12px;height:12px;position:absolute;bottom:-22px;left:50%;transform:translateX(-50%) rotate(45deg);border-right:2px solid var(--jsb-blue);border-bottom:2px solid var(--jsb-blue);}
.jiyaribo #contents .jsb_howto .step_list figure{width:116px;flex-shrink:0;}
.jiyaribo #contents .jsb_howto .step_list dl{padding-left:30px;}
.jiyaribo #contents .jsb_howto .step_list dt{margin-bottom:4px;font-size:20px;font-weight:700;color:var(--jsb-navy);}
.jiyaribo #contents .jsb_howto .step_list dd{font-size:13px;line-height:1.8;}
.jiyaribo #footer{display:none;}
/* ===== 1240px以下 ===== */
@media screen and (max-width:1240px){
	.jiyaribo #contents .jsb_contact .tel .num{font-size:30px;}
	.jiyaribo #contents .jsb_contact .contact_box a i{margin-right:20px;font-size:40px;}
	.jiyaribo #contents .jsb_contact .mail{font-size:18px;}
}
/* ===== 900px以下 ===== */
@media screen and (max-width:900px){
	.jiyaribo #contents{margin:0;padding:0;}
	.jiyaribo #contents .jsb_section{padding:48px 0;}
	.jiyaribo #contents .jsb_nav ul{justify-content:center;}
	.jiyaribo #contents .jsb_background .problem_list li{width:49%;margin-bottom:2%;}
	.jiyaribo #contents .jsb_effect .effect_list li{width:49%;margin-bottom:32px;}
}
/* ===== タブレット用 ===== */
@media screen and (max-width:768px){
	.jiyaribo #contents .jsb_spec .spec_box{flex-direction:column;}
	.jiyaribo #contents .jsb_spec .spec_photo{width:100%;margin-bottom:16px;}
	.jiyaribo #contents .jsb_spec .spec_table{width:100%;}
	.jiyaribo #contents .jsb_spec .notice{padding:24px;}
	.jiyaribo #contents .jsb_contact{padding:56px 0;}
	.jiyaribo #contents .jsb_contact .contact_box{flex-direction:column;}
	.jiyaribo #contents .jsb_contact .contact_box a{width:100%;min-height:96px;}
	.jiyaribo #contents .jsb_contact .contact_box a.tel{margin-bottom:16px;}
}
/* ===== スマホ用 ===== */
@media screen and (max-width:667px){
	.jiyaribo #contents .inner{padding:0 16px;}
	.jiyaribo #contents .jsb_section{padding:40px 0;}
	.jiyaribo #contents .jsb_heading{font-size:18px;}
	.jiyaribo #contents .jsb_sub{font-size:16px;}
	.jiyaribo #contents .jsb_nav{padding:8px 16px;}
	.jiyaribo #contents .jsb_nav ul{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;}
	.jiyaribo #contents .jsb_nav li a{font-size:13px;}
	.jiyaribo #contents .jsb_title{margin-bottom:24px;font-size:17px;}
	.jiyaribo #contents .jsb_caution{margin-bottom:24px!important;padding:16px 0;background:radial-gradient(ellipse 50% 50% at center, rgba(244,163,131,0.6) 0%, rgba(244,163,131,0) 100%);font-size:15px;}
	.jiyaribo #contents .jsb_spec .badge{width:104px;top:8px;left:8px;}
	.jiyaribo #contents .jsb_spec .badge li{margin-bottom:6px;}
	.jiyaribo #contents .jsb_spec .badge li strong{font-size:11px;letter-spacing:1px;}
	.jiyaribo #contents .jsb_spec .badge li small{font-size:7px;}
	.jiyaribo #contents .jsb_spec .badge li.adopt{padding:12px 4px;}
	.jiyaribo #contents .jsb_spec .spec_table th,
	.jiyaribo #contents .jsb_spec .spec_table td{padding:10px 12px;font-size:14px;}
	.jiyaribo #contents .jsb_spec .notice{padding:20px 16px;}
	.jiyaribo #contents .jsb_contact h3{margin-bottom:28px;font-size:20px;}
	.jiyaribo #contents .jsb_contact .tel .num{font-size:28px;}
	.jiyaribo #contents .jsb_contact .tel .num small{font-size:12px;}
	.jiyaribo #contents .jsb_contact .contact_box a i{margin-right:16px;font-size:34px;}
	.jiyaribo #contents .jsb_contact .mail{font-size:17px;}
	.jiyaribo #contents .jsb_background .problem_list .num{width:88px;margin-bottom:20px;font-size:18px;}
	.jiyaribo #contents .jsb_background .problem_list figure{width:84px;}
	.jiyaribo #contents .jsb_background .problem_list h5{font-size:16px;}
	.jiyaribo #contents .jsb_effect .effect_list h5{font-size:15px;}
	.jiyaribo #contents .jsb_howto .step_list li{padding:12px 16px;}
	.jiyaribo #contents .jsb_howto .step_list figure{width:96px;}
	.jiyaribo #contents .jsb_howto .step_list dl{padding-left:16px;}
	.jiyaribo #contents .jsb_howto .step_list dt{font-size:17px;}
}
/* ===== スマホ用（小） ===== */
@media screen and (max-width:480px){
	.jiyaribo #contents .jsb_background .problem_list li{width:100%;margin-bottom:12px;padding:20px 16px 24px;}
	.jiyaribo #contents .jsb_background .problem_list p{max-width:none;}
	.jiyaribo #contents .jsb_effect .effect_list li{width:100%;}
	.jiyaribo #contents .jsb_effect .effect_list p{text-align:center;}
	.jiyaribo #contents .jsb_howto .step_list li{flex-direction:column;align-items:flex-start;}
	.jiyaribo #contents .jsb_howto .step_list figure{width:120px;margin:0 auto 10px;}
	.jiyaribo #contents .jsb_howto .step_list dl{padding-left:0;}
}
