﻿/*---------------------------------------------------------------------------*/
/*                 ▼           防犯カメラ ヘッダーメニュー     　　  ▼　　　　　　　　              */
/*---------------------------------------------------------------------------*/

.sc_title{
    position: relative;
    width:400px;
	margin: 0.5em auto;
    text-align: center;
    font-size: 1.5rem;
    margin-bottom: 1.5rem;/*1から変更　20260522亜*/
    font-weight: bold;
    padding:0.5em;
}

.sc_title:after{
    content: '';
    position: absolute;
    bottom: -3px;
    left: 50%;
    transform: translateX(-50%);
    width: 450px;
    height: 8px;
    background-color: #adff2f;/*　サービス別色　*/
    border-radius: 6px;
}

.sc_headmenu{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    vertical-align: auto;
    margin-bottom:1.5em;
}

.float-top{
    float:left;
    width:200px;/*13%;*/
    margin:4px;/* 2% 1%; 1%;*/
    position:relative;
    background: #e6e6e6;/* メニュー　デフォルト　背景色*/
    border-radius: 20px; /* ちょっとだけ角丸 */
    padding:8px;/*10px;*/
    text-align:center;
}

.float-top:hover {
    background: #adff2f;/* メニューボタンマウスオーバー時　背景色*/
    color: #000;
    -webkit-box-shadow: 0 5px 5px rgba(0, 0, 0, .3);
    box-shadow: 0 3px 3px rgba(0, 0, 0, .3);
    opacity: 0.9 ;
    transform: scale(1.02);
}

/* ▼表示領域が767px未満の場合*/
@media screen and (max-width: 767px) {
.float-top{
    width:180px;
}

}/* ▲表示領域が767px未満の場合　*/



/*---------------------------------------------------------------------------*/
/*                      ▼      　　　防犯カメラ 共通CSS     　　　  ▼ 　　　　　　　　　　　　　              */
/*---------------------------------------------------------------------------*/

.sc_img{
    display: block;
    text-align: center;
    margin-bottom:0.5em;
}


.sc_imgauto img{
    width:98%;
    margin-bottom:1em;    
    }


.qa-sc dt {
    margin-bottom: 0.5em;
    color: #333333;
    font-weight: 600;
}

.qa-sc dt::before,
.qa-sc dd::before {
    margin-right: .4em;
}

.qa-sc dt::before {
    content: "Q.";
}

.qa-sc dd {
    margin: 0 0 1em;
    padding: 0.5em 1em;
    background-color: #fefde1;
    color: #333333;
}

.qa-sc dd::before {
    content: "A.";
}

.sc_sttl{
    position: relative;
    width:95%;
	margin: 2em auto 0 auto;
    text-align: center;
    font-size: 1.5rem;
    border-bottom: solid 3px #d5d5d5;
    margin-bottom: 2rem;
    font-weight: bold;
    padding:1em;
}

.sc_sttl:after{
    content: '';
    position: absolute;
    bottom: -3px;
    left: 50%;
    transform: translateX(-50%);
    width: 350px;
    height: 3px;
    background-color: #adff2f;
}

.sc-attn{
	text-align:center;
	background-color:#FFFFCC;
}

.sc-attn a:hover {
  color: #ff6600;
}



/*　▼▼▼　ページトップへ戻るボタン　▼▼▼　*/
html {
    scroll-behavior: smooth;
}
.pagetop {
    height: 45px;
    width: 45px;
    position: fixed;
    right: 30px;
    bottom: 30px;
    background: #fff;
    border: solid 4px #0066cc;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 99;
    opacity: 0;
    transition: opacity 0.3s, visibility 0.3s;
    visibility: hidden;
}

.pagetop__arrow {
    height: 10px;
    width: 10px;
    border-top: 5px solid #0066cc;
    border-right: 5px solid #0066cc;
    transform: translateY(20%) rotate(-45deg);
}

/* 表示状態 */
.pagetop.is-show {
  opacity: 0.4;
  visibility: visible;
}

/*　▲▲▲　ページトップへ戻るボタン　▲▲▲　*/




/*　以下　不要かも　*/

.pl_in_t{
	width:90%;
	margin:auto;
}

.pl_in_twwari{
	width:98%;
	margin:auto;
}

.pl_in_t td{
	text-align:center;
}

.pl_in_twwari td{
	text-align:center;
}

/* ----- ▼　TOP画像用　▼ ----- */
@media screen and (max-width:1300px) {
.sc_img img{
    width:99%;
}

}



.construction_img{
    display: block;
    text-align: center;
}

.construction_img img{
    width:auto;
}

.cost_title{
    position: relative;
    width:1200px;
	margin: 0 auto;
    text-align: center;
    font-size: 1.5rem;
    border-bottom: solid 3px #d5d5d5;
    margin-bottom: 3rem;
    font-weight: bold;
}

.cost_title:after{
    content: '';
    position: absolute;
    bottom: -3px;
    left: 50%;
    transform: translateX(-50%);
    width: 350px;
    height: 3px;
    background-color: #0000cd;
}

.cost_table{
    text-align: center;
    margin-bottom: 2rem;
}

.cost_table table{
    margin: 0 auto;
    font-size: 1.1rem;
    margin-bottom: 2rem;
}

.cost_table_left{
    width: 600px;
}

.cost_table_right{
    width: 300px;
}

.table_subject{
    margin: 0 auto;
    width: 600px;
    text-align: left;
}

.linenup_title{
    position: relative;
    width:1200px;
	margin: 0 auto;
    text-align: center;
    font-size: 1.5rem;
    border-bottom: solid 3px #d5d5d5;
    margin-bottom: 2rem;
    font-weight: bold;
}

.linenup_title:after{
    content: '';
    position: absolute;
    bottom: -3px;
    left: 50%;
    transform: translateX(-50%);
    width: 350px;
    height: 3px;
    background-color: #0000cd;
}

.linenup_container{
    display: grid;
    grid-template-columns:1fr 1fr;
    grid-template-rows: 1fr 100px;
    margin: 0 auto;
    text-align: center;
}

.linenup_item1 {
    grid-column-start: 1;
    grid-column-end: 2;
    grid-row-start: 1;
    grid-row-end: 2;
}

.linenup_item1 img{
    width:400px;
    text-align: center;
}

.linenup_item2 {
    grid-column-start: 2;
    grid-column-end: 3;
    grid-row-start: 1;
    grid-row-end: 2;
}

.linenup_item2 img{
    width:400px;
    text-align: center;
}

.linenup_item3 {
    grid-column-start: 1;
    grid-column-end: 3;
    grid-row-start: 2;
    grid-row-end: 3;
    height:100px;
}

.linenup_item3 img{
    width:450px;
    text-align: center;
}

.in_precautionsbox{
    text-align: center;
    margin: 0.5em auto;
}

.in_precautions{
   	display: inline-block;
    text-align: left;
    font-size: 0.9rem;
    color: #212121;
    margin-bottom:2em;
    
}

/*　in-topに　若杉追加分　*/
.back_pic{
    background-image: url('../../images/in/インターネットよくある質問_背景.jpg');
    background-repeat: repeat;
/*    background-size:  cover;*/
    padding:1em;
}

.back_pic h1{/*　20251016 亜追加　*/
	font-size:150%;
	padding:1em auto 3px auto;
	text-align:center;
	margin:5px;
}


/* --矢印-- */
.in_arrow_r_a {
    position: relative;
    vertical-align: middle;
    display: inline-block;
    padding-left:30px;
  }

.in_arrow_r_a:before {
    content: '';
    width: 20px;/*18*/
    height: 20px;/*18*/
    background: #ffffff;
    border-radius: 50%;
    position: absolute;
    top: -5px;/*-3*/
    left: 0;/*0*/
    bottom: 0;
    margin: auto;
}

.in_arrow_r_a:after {
    content: '';
    width: 6px;
    height: 6px;
    border: 0;
    border-top: solid 2px #777777;
    border-right: solid 2px #777777;
    transform: rotate(45deg);
    position: absolute;
    top: -3px;
    left: 5px;
    bottom: 0;
    margin: auto;
}

.in_question{
    display:flex;
    flex-wrap:wrap;
    width:800px;
    text-align: center;
    margin:4rem auto;
/*    margin: auto;
    margin-top:4rem;
    margin-bottom: 4rem;*/
}

.in_question_btn{
    width:200px;
    height:70px;
    margin:0.5rem 1rem;
    padding:0.5rem 2rem;
    border: 1px solid #000;
    background-color: #EEE;
    border-radius: 10px;
    font-size:0.8rem;
    position: relative;
}

.in_question_btn:hover{
    background-color: #DDD;
}

.in_question_btn a{
	display: block;
}

#shorui{
	margin:1em;
}

.in_ykn {
	width:400px;
    padding: 0.5em 1.5em;
    margin: 2em auto;
    color: #04a1b5;/*#00BCD4;*/
    background: #e4fcff;/*背景色*/
    border-top: solid 6px #1dc1d6;
    border-bottom: solid 6px #1dc1d6;
    box-shadow: 0 3px 4px rgba(0, 0, 0, 0.32);/*影*/
}
.in_ykn p {
    margin: 0; 
    padding: 0;
}

.spl_red{
	color:red;
	font-weight:200;
}

/*----------------注意事項*/
.pl_tv_c{
	font-size:14px;
/*	line-height:140%;*/
	margin:1em 0px 1.5em 1.5em;
	padding:5px;
}
.pl_tv_c ul{
	margin:5px;
}

.pl_title2{
 border-left:10px solid #ffa07a;
 border-bottom:1px dotted #ffa07a;
 font-weight:bold;
 margin:1em 0 0 0;
 padding:0.3em ;
}

.dhcp_h1 {
	width:300px;
	margin-left:1em;
	margin-top:0.5em;
	padding: 0.2em;
	background:#3CB371;
	color:white;
	border-radius: 4px;
}
.dhcp_n {
	margin-left:1.5em;
	line-height:130%;
}

/*----------------注意事項*/


/*オプション申込用ボタン　▼*/
.sp_procedure_btn{ 
    width:300px;
    padding:0.5rem;
    border: 1px solid #000;
    background-color: #ffc0cb;
    border-radius: 5rem;
    box-shadow: 5px 5px 0 #4c6b75;
}

.sp_procedure_btn:hover{ 
    background-color:#ffe4e1;
}

.sp_cntr{
	text-align:center;
	padding-bottom:1em;
}
/*オプション申込用ボタン▲*/




/* ----- ▼　スマホ用　▼ @media (max-width: 767px) {
/* -----    　　　　　　　　 ▼表示領域が767px未満の場合  ---------------------------　*/
@media screen and (max-width:767px) {

.sc_img img{ width:98%; }
.sc_sttl{width:99%;}
.sc_sttl:after{width: 80%;}

ul{	width:99%;}
li{	width:96%;}


/*　▼▼▼　ページトップへ戻るボタン　▼▼▼　*/
.pagetop {
    right: 30px;
    top: 30px;
}

/*　▲▲▲　ページトップへ戻るボタン　▲▲▲　*/





.pl_in_twwari th{
	padding:3px;
	margin:0;

}
.in_spl_tbl1{
	padding:2px;
	margin:0;
	font-size:9px;/*8px*/
}

.pl_in_t{ width:98%; }
.pl_in_t img{ width:98%; }

.construction_img img{ width:98%; }

.linenup_container{ display:none; }

.in_precautions{margin:3px;}

.in_question{
	width:100%;
    padding:3px;
    text-align:center;
    margin:0 auto;
}

.in_question_btn{
    width:150px;
    height:60px;
    margin:5px;
    padding:3px;
    font-size:0.7rem;
}
.in_arrow_r_a {
    padding-left:10px;
    left: -20px;
  }

.pl_title2{
 margin:2px;
 padding:0.3em ;
}

.dhcp_h1 {
	width:96%;
	margin-left:0.5em;
}
.dhcp_n {
	margin-left:1em;
}


}