@charset "utf-8";


.homeContents{
width:966px;
margin:0 auto;
padding:0 0 1px;
}
@media only screen and (max-width:640px) and (max-device-width:1280px){
.homeContents{
width:auto;
margin:0;
padding:0 0 1px;
}
}

/* headContents */
.homeContents .headContents{
margin-bottom:30px;
}
@media only screen and (max-width:640px) and (max-device-width:1280px){
.homeContents .headContents{
margin-bottom:35px;
}
}


/* PC/SP */
.pc {display: block;}
img.pc {display: inline;}
.sp {display: none;}
img.sp {display: none;}

@media only screen and (max-width:640px){
.pc {display: none;}
img.pc {display: none;}
.sp {display: block;}
img.sp {display: inline;}
}

/* contents */
.contents {
margin-bottom: 2em;
}
.contents img {
max-width: 100%;
width: 100%;
vertical-align: bottom;
}
.contents h2 {
font-size: 24px;
color: #004da1;
font-weight: bold;
line-height: 1.2;
position: relative;
padding-left: 25px;
margin-top: 15px;
margin-bottom: 15px;
}
.contents h2::after {
content: "";
display: block;
width: 5px;
height: 100%;
background: #809fcd;
position: absolute;
left: 0;
top: -2px;
}
.contents h3 {
margin-bottom: 0.5em;
padding: 0.5em;
text-align: center;
font-size: 1.5em;
font-weight: bold;
color: #fff;
background: #555;
}
.contents h4, 
.contents h5 {
margin-bottom: 1em;
font-weight: bold;
}
.t_c {text-align: center;}
.bld {font-weight: bold;}
.sml {font-size: 0.85em;}
.xsml {font-size: 0.75em;}
.red {color: #c00;}
.blu {color: #004ea1;}
.mb0 {margin-bottom: 0em!important;}
.mb01 {margin-bottom: 1em!important;}
.mb02 {margin-bottom: 2em!important;}
.mb03 {margin-bottom: 3em!important;}
.pl01 {padding-left: 1em!important;}

ul.general {
display: -ms-flexbox;
display: flex;
justify-content: space-between;
align-items: top;
margin-bottom: 1em;
max-width: 100%;
}
ul.general li {
width: 100%;
padding: 1em;
box-sizing: border-box;
} 
ul.general h4 {
position: relative;
height: 1em;
padding-left: 15px;
font-size: 1.1em;
}

ul.general h4::before {
content: '';
position: absolute;
display: block;
top: 0;
left: 0;
width: 5px;
height: 1.5em;
background: #004ea1;
}
ul.general p {
margin-bottom: 0.25em;
}

ul.general p.sageru {
margin-top: 2.4em;
margin-bottom: 0.25em;
}

ul.link {
display: -ms-flexbox;
display: flex;
justify-content: space-between;
align-items: center;
margin: 0.5em 0;
}
ul.link li {
width: 100%;
} 
ul.link li img {max-width: 100%;}

@media only screen and (min-width:641px){

.alpha:hover {opacity: 0.7;}

}
@media only screen and (max-width:640px){

.contents h2 {
font-size:20px;
position:relative;
padding-left:20px;
margin:15px 12px 15px 12px;
}
.contents h3 {
font-size: 1.25em;
}

ul.link {
flex-wrap: wrap;
margin: 0.5em 0.25em;
}
ul.link li {
flex-basis: 50%;
max-width: 50%; /* ie */
}

}

/* info */
.info {
height: 125px;
padding-top: 25px;
padding-right: 50px;
text-align: center;
}
.info br {
display: none;
}
.info p {
margin-bottom: 0.25em;
font-weight: bold;
}
.info p:nth-of-type(1){
font-size: 1.2em;
}
.info p:nth-of-type(2){
font-size: 1.3em;
color: #004ea2;
}
.info p:nth-of-type(3){
font-size: 0.9em;
}

@media only screen and (max-width:640px){

.info {
height: auto;
margin: 1em 0 0;
padding-top: 0;
padding-right: 60px;
background:url(/images/oparator_sp.jpg) 100% 100% no-repeat;
background-size: contain;
font-size: 0.85em;
}
.info br {
display: block;
}

}


.info2{
    padding: 0.5em 1em 1em 7em;
    text-indent: -5em;
}
@media only screen and (max-width:640px){
    .info2{
        padding-top: 1em;
        padding-left: 1em;
        text-indent: 0;
    }
    .info2 br{
        display: none;
    }
}


/* contents01 */
.contents01 > div {
position: relative;
padding: 1em 0 0.5em;
}
.contents01 > div a {
position: absolute;
display: block;
top: 50%;
right: 0;
-webkit-transform: translateY(-45%);
transform: translateY(-45%);
}
.contents01 li:nth-child(2){
border-left: solid 1px #e0e0e0;
border-right: solid 1px #e0e0e0;
}
.youtube {
position: relative;
width: 100%;
padding-top: 56.25%;
}
.youtube iframe {
position: absolute;
top: 0;
right: 0;
width: 100% !important;
height: 100% !important;
}
p.em3 {height: 3em;}

@media only screen and (max-width:640px){

.contents01 > div {
text-align: center;
}
.contents01 > div a {
position: static;
top: auto;
right: auto;
-webkit-transform: translateY(0);
transform: translateY(0);
padding: 0 5em;
}
.contents01 ul.general {
display: block;
}
.contents01 li:nth-child(2){
border-left: none;
border-right: none;
}

}

/* contents02 */
.contents02 p {
padding: 1em 0 0;
text-align: center;
}

@media only screen and (max-width:640px){

.contents02 ul.general {
display: block;
}
.contents01 li:nth-child(2){
border-left: none;
border-right: none;
}

}

/* contents03 */
.contents03 h4 {
display: table;
width: 100%;
}
.contents03 h4 > * {
display: table-cell;
padding: 0.5em 1em;
border-top: solid 1px #004ea1;
border-bottom: solid 1px #004ea1;
font-size: 1.1em;
vertical-align: middle;
}
.contents03 h4 span.head {
width: 100px;
text-align: center;
color: #fff;
background: #004ea1;
}
.contents03 div.ex {
display: table;
width: 100%;
margin-bottom: 0.5em;
}
.contents03 div.ex > * {
display: table-cell;
}
.contents03 div.ex > a {
text-align: right;
}
.contents03 ul.lineup {
margin-bottom: 1em;
}
.contents03 ul.lineup li {
padding: 0;
text-align: center;
}
.contents03 ul.lineup li:nth-child(1) {padding-right: 12px;}
.contents03 ul.lineup li:nth-child(2) {padding: 0 6px;}
.contents03 ul.lineup li:nth-child(3) {padding-left: 12px;}

.src {margin-top: 0.25em;}

.share {
float: right;
display: block;
margin: 0 1em 2em 1em;
}
.share img {
width: 324px;
}

@media only screen and (max-width:640px){

.contents03 ul.general {
overflow: hidden;
display: block;
}
.contents03 ul.general li {
padding: 0.5em 1em;
}
.contents03 ul.general li:nth-child(odd) {
width: 50%;
float: left;
}
.contents03 ul.general li:nth-child(even) {
width: 50%;
float: right;
}
.contents03 h4 span.head {
width: 80px;
}
.contents03 div.ex, 
.contents03 p {
padding-left: 1em;
padding-right: 1em;
}
.contents03 div.ex a {
padding-right: 1.5em;
}
.contents03 ul.lineup li {
margin-bottom: 2em;
}
.contents03 ul.lineup li:nth-child(odd) {
width: 100%;
float: none;
}
.contents03 ul.lineup li:nth-child(even) {
width: 100%;
float: none;
}
.contents03 ul.lineup li:nth-child(1) {padding: 0 1em;}
.contents03 ul.lineup li:nth-child(2) {padding: 0 1em;}
.contents03 ul.lineup li:nth-child(3) {padding: 0 1em;}

.contents03 figure {padding: 0 1em;}

.share {
float: none;
margin: 1em 0;
text-align: center;
}
.share img {
width: 324px;
}

}

/* contents04 */
.contents04 table {
position: relative;
width: 100%;
margin-bottom: 1em;
}
.contents04 th {
text-align: center;
font-weight: bold;
}
.contents04 th, .contents04 td {
padding: 0.25em;
vertical-align: middle;
border: solid 1px #ccc;
}
.service_btn {
margin: 2em 0 0;
text-align: center;
}
.contents04 a {
display: inline-block;
marign: 0 auto;
padding: 0.5em 1em;
border: solid 1px #ccc;
font-weight: bold;
text-decoration: none;
color: #004ea2;
}
.contents04 th.line1,
.contents04 td.line2 {
	background:url(../images/bgi_table_border_red.png) no-repeat left top;
	background-size:100%;
}
.contents04 td.line2 {
	background-position:left bottom;
}

.contents04 table::after {
content: '';
position: absolute;
display: block;
top: 70px;
left: 510px;
width: 80px;
height: 80px;
background: url(../images/icn_good.png) no-repeat 0 0;
background-size: contain;
}

@media only screen and (max-width:640px){

.contents04 table {
width: auto;
margin: 0 1em 1em;
}
.contents04 p {
padding: 0 1em;
}
.contents04 table::after {
top:53px;
left:50%;
width: 40px;
height: 40px;
}

}

/* contents05 */
.contents05 li {
position: relative;
}
.contents05 li::after {
content: '';
position: absolute;
display: block;
top: 50%;
right: 0;
width: 21px;
height: 40px;
margin-top: -20px;
-webkit-transform: translateX(50%);
transform: translateX(50%);
background:  url(../images/yajirushi_0312.png) no-repeat 0 0;
background-size: contain;
}
.contents05 li:last-child::after {
content: none;
}

@media only screen and (max-width:640px){

.contents05 ul.general {
flex-wrap: wrap;
}
.contents05 ul.general li {
flex-basis: 50%;
max-width: 50%; /* ie */
padding: 0.5em 1em;
}
.contents05 li::after {
width: 10px;
height: 20px;
margin-top: -10px;
}
.contents05 li:nth-child(2)::after {
content: none;
}

}

/* contents06 */
@media only screen and (max-width:640px){

.contents06 p {
padding: 0 1em;
}
.contents06 ul.general {
margin: 1em 0.5em
}
.contents06 ul.general li {
padding: 0 0.5em
}

}

/* contents07〜 */
ul.model {
display: -ms-flexbox;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
ul.model li {
flex-basis: 50%;
max-width: 50%; /* ie */
width: 100%;
margin-bottom: 1em;
padding: 0;
box-sizing: border-box;
}
ul.model li:nth-child(odd) {
padding-right: 0.5em;
}
ul.model li:nth-child(even) {
padding-left: 0.5em;
}
ul.model li > div {
display: -ms-flexbox;
display: flex;
justify-content: space-between;
padding: 0.15em 0.3em;
background: #b9c2c7;
}

@media only screen and (max-width:640px){

ul.model {
display: block;
margin-bottom: 0;
padding-bottom: 0;
}
ul.model li {
flex-basis: 100%;
max-width: 100%; /* ie */
}
ul.model li:nth-child(odd) {
padding: 0 1em;
}
ul.model li:nth-child(even) {
padding: 0 1em;
}

}

/* contents13 */
.qa ul {overflow: hidden;}
.qa li {width: 48.5%;}
.qa li:nth-child(odd) {float: left;}
.qa li:nth-child(even) {float: right;}

.qa li {
margin-bottom: 1em;
border: solid 4px #1e64bf;
}
.qa dt, .qa dd {padding: 1em 1em 1em 3.5em;}

.qa dt {
font-weight: bold;
background: url(../images/icn_q.png) no-repeat 1em 1em;
}
.qa dd {
border-top: solid 2px #1e64bf;
background: url(../images/icn_a.png) no-repeat 1em 1em;
}
ul.other h4 {
height: auto;
margin-bottom: 0.5em;
padding: 0.5em 0.5em;
text-align: center;
background: #555;
color: #fff;
}
ul.other h4::before  {
content: none;
}

@media screen and (max-width: 960px) {

.qa > div {padding: 1em;}

}
@media screen and (max-width: 640px) {

.qa li {
width: auto;
border: solid 2px #1e64bf;
}
.qa li:nth-child(odd) {float: none;}
.qa li:nth-child(even) {float: none;}
.qa dt, .qa dd {padding: 1em 1em 1em 4em;}
.qa dt {
padding-right: 2em;
background: url(../images/icn_q.png) no-repeat 1em 1em,
	url(../images/bg_qa.png) no-repeat 100% 1em;
}
.qa dt.on {
padding-right: 2em;
background: url(../images/icn_q.png) no-repeat 1em 1em,
	url(../images/bg_qa_o.png) no-repeat 100% 1em;
}
.qa dd {
display: none;
border-top: solid 1px #1e64bf;
}

ul.other {
flex-wrap: wrap;

}
ul.other li {
padding: 0.5em;
flex-basis: 50%;
max-width: 50%; /* ie */
}

}



/* contents14 */
.contents14 .newsListA02 {
height: 200px;
overflow: auto;
padding: 1em;
}
@media only screen and (max-width:640px) and (max-device-width:1280px){
.contents14 ul{

}
}

/* contents15 */
.contents15{
margin-bottom:30px;
}
.contents15 ul{
display:table;
width:100%;
table-layout:fixed;
margin:0 0 30px -41px;
}
.contents15 ul li{
display:table-cell;
width:295px;
padding-left:41px;
}
.contents15 ul li img{
width:100%;
height:auto;
}
.contents15 .tmark{
color:#004da1;
font-size:9px;
vertical-align:middle;
}
.contents15 .tmark a{
/*color:#333333;*/
font-size:12px;
display:inline-block;
margin-left:5px;
position:relative;
top:2px;
}

@media only screen and (max-width:640px) and (max-device-width:1280px){
/* contents15 */
.contents15 ul{
display:block;
width:auto;
margin:0 1em 10px;
}
.contents15 ul li{
display:block;
width:auto;
padding-left:0;
line-height:0;
margin-bottom:10px;
}
.tmark {
padding-left: 1.5em;
}

}

/* ページの先頭へ */
#totop {
position: fixed;
right: 15px;
bottom: 125px;
z-index: 1;
}



/* 矢印ボタン */
.btn_arrow_list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 1em 0;
    padding: 0 10px;
}
.btn_arrow_list li{
    flex:0 1 23.5%;
    margin:0 0 20px 0;
    text-align: center;
    line-height: 1.3;
}
.btn_arrow_list_3col li{
    flex-basis: 32%;
}
.btn_arrow_list a{
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #004da2;
    text-decoration: none;
    font-weight: bold;
    font-size: 18px;
    padding:10px 0;
    height: 100%;
    box-sizing: border-box;
    box-shadow: 0 0 8px rgba(0,0,0,0.5);
}
.btn_arrow_list a::after{
    content: '>';
    line-height: 1;
    position: absolute;
    right:3px;
    top:50%;
    margin-top:-15px;
    font-size: 30px;
    transform: scaleX(0.7);
    font-weight: normal;
    color: #868686;
}
.btn_arrow_list li:last-child a{
    color: #222;
}
.btn_arrow_list a:hover{
    opacity: 0.7;
}
@media only screen and (max-width:640px){
    .btn_arrow_list li{
        flex-basis:48.5%;
    }
    .btn_arrow_list a{
        font-size: 13px;
    }
    .btn_arrow_list a::after{
        font-size: 20px;
        margin-top:-10px;
    }
}

/* みえますねっとが選ばれる理由 */
.point_list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding:15px;
}
.point_list li{
    flex:0 1 31%;
    margin:0 0 20px 0;
}
.point_list_box {
    background-color: #e6e6e6;
    border-radius:10px;
    overflow: hidden;
    text-align: center;
    font-weight: bold;
    font-size: 20px;
    line-height: 1.5;
}
.point_list li:nth-child(3) .point_list_box {
    line-height:1.4;
}
.point_list_title {
    color: #FFF;
    background-color: #004ba6;
    letter-spacing: 0.05em;
    padding:5px 0;
}
.point_list_title .num {
    font-size: 28px;
}
.point_list_body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 7em;
    height: 7em;    /* IE11 bugfix */
}
.point_list_body strong{
    font-size: 24px;
    color: #c3071d;
}
@media only screen and (max-width:640px){
    .point_list {
        display: block;
    }
    .point_list_box {
        font-size: 16px;
    }
    .point_list_title .num {
        font-size: 22px;
    }
    .point_list_body strong{
        font-size: 19px;
    }
}

/* POINT 1 様々な目的に対応できる豊富な防犯カメララインアップ */
.homepoint_head {
    color:#FFF;
    background-color: #7d7d7d;
    font-weight: bold;
    padding:5px 0;
}
.homepoint_img {
    margin-bottom: 15px;
}
.homepoint_body {
    min-height:390px;
    padding: 15px;
    text-align: left;
    font-size: 14px;
    background-color: #e6e6e8;
}
@media only screen and (max-width:640px){
    .homepoint_body {
        min-height:auto;
    }
}
.homepoint_body img{
    width: auto;
}
.ttl_square {
    position: relative;
    font-weight: bold;
    padding-left: 1.1em;
}
.ttl_square:before{
    position: absolute;
    left:0;
    top:0.2em;
    content:'';
    width: 0.9em;
    height: 0.9em;
    background-color: #333;
}
.homepoint_notice {
    min-height:2.5em;
    padding:5px 0;
    text-align-last: left;
}
@media only screen and (max-width:640px){
    .homepoint_notice {
        min-height:auto;
    }
}
.homepoint_function_index {
    font-size: 0.9em;
}
@media only screen and (max-width:640px){
    .homepoint_function_index {
        font-size:1em;
    }
}
.homepoint_function_available,
.homepoint_function_unavailable {
    font-weight: bold;
    border: 1px solid #d3d3d5;
    padding: 3px 0;
}
.homepoint_function_available {
    background-color: #d3d3d5;
}
.homepoint_function_unavailable {
    color: #dcdedd;
}
.marker_indent{
    text-indent: -1em;
    padding-left: 1em;
}
.marker_indent li{
    margin:0em 0 !important;
    padding: 0 !important;
}

/* POINT 2 みえますねっとのご利用方法 */
.howtouse_list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding:15px;
}
.howtouse_list li{
    flex:0 1 22%;
    margin:0 0 20px 0;
}
.howtouse_list li.arrow{
    flex:0 1 4%;
    position: relative;
}
.howtouse_list li.arrow::before{
    content: '';
    position: absolute;
    display: block;
    top: 50%;
    left: 0;
    width: 20px;
    height: 40px;
    margin: -20px 0 0 10px;
    background: url(../images/yajirushi_0312.png) no-repeat 0 0;
    background-size: contain;
}
.howtouse_list li.no_box{
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    font-size: 26px;
    font-weight: bold;
    color: #0250a3;
}
.howtouse_list li::after{
    content:none;
}
.howtouse_list_box {
    background-color: #e6e6e6;
    border-radius:10px;
    overflow: hidden;
    text-align: center;
    font-weight: bold;
    font-size: 20px;
}
.howtouse_list_box a{
    display: block;
    color: #4f4d4d;
    text-decoration: none;
}
.howtouse_list_title {
    color: #FFF;
    background-color: #004ba6;
    letter-spacing: 0.05em;
    padding:5px 0;
}
.howtouse_list_title .num {
    font-size: 28px;
}
.howtouse_list_body{
    padding:10px 0;
}
.howtouse_list_body .link_detail{
    color: #0250a3;
    font-size: 80%;
    margin-top: 3px;
}
@media only screen and (max-width:640px){
    .howtouse_list {
        display: block;
    }
    .howtouse_list li{
        height:50px;
    }
    .howtouse_list li.arrow::before{
        left: 50%;
        width: 20px;
        height: 40px;
        margin: 10px 0 0 -10px;
        transform: rotate(90deg);
    }
    .howtouse_list_box {
        font-size: 16px;
    }
    .howtouse_list_title .num,
    .howtouse_list li.no_box{
        font-size: 22px;
    }
}

/* モデルを選ぶ */
.model_list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.model_list_item {
    margin-bottom:15px;
    box-sizing: border-box;
    flex:0 1 475px;
    border: 1px solid #c8c8c8;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.model_img {
    flex:0 1 31.71%;
    max-width:31.71%;   /* IE11 bugfix */
    background-color: #e1e2e7;
}
.model_img_wrap{
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: calc(100% - 2.2em);
}
.model_img_wrap img{
    display: block;
    margin:0 auto 0px auto ;
    max-width:70%;
    flex-shrink: 0; /* IE11 bugfix */
}
.model_img_ttl {
    background-color: #b2935d;
    letter-spacing: 0.5em;
    color: #FFF;
    font-weight: bold;
    text-align: center;
    text-indent: 0.5em;
    font-size: 20px;
    /*
    padding:5px 0 3px 0;
    */
    height:2.2em;
    line-height:2.2em;
}
.model_img_ttl-darkbrown{
    background-color: #766f69;
}
.model_detail {
    box-sizing: border-box;
    flex:0 1 68.29%;
    max-width:68.29%;   /* IE11 bugfix */
    padding: 13px;
    font-size: 15px;
    font-weight: bold;
}
.model_detail img{
    margin-bottom:9px;
}
.model_spec {
    font-size: 13px;
    margin-bottom: 4px;
}
.model_links {
    display: flex;
    flex:0 0 100%;
    flex-wrap: wrap;
    justify-content: space-between;
    max-width:100%;   /* IE11 bugfix */
    box-sizing: border-box;
    padding: 10px;
    font-weight: bold;
    background-color: #b9c2c7;
}
.model_links a{
    position: relative;
    display: block;
    flex:0 0 31.5%;
    padding: 20px 0;
    color: #FFF;
    text-decoration: none;
    text-align: center;
    background-color: #004ea2;
    border-radius: 4px;
    font-size: 14px;
    text-indent:-10px;
    box-shadow: 0 0 5px rgba(0,0,0,0.8);
}
.model_links a::after{
    content: '>';
    line-height: 1;
    position: absolute;
    right:3px;
    top:50%;
    margin-top:-9px;
    font-size: 18px;
    transform: scaleX(0.7);
    font-weight: normal;
}
.model_links a:hover{
    opacity: 0.5;
}
@media only screen and (max-width:640px){
    .model_list_item {
        margin-left: auto;
        margin-right: auto;
        flex-basis: 96%;
    }
    .model_detail{
        padding: 5px;
    }
    .model_img_ttl{
        font-size: 16px;
    }
    .model_detail,
    .model_links a{
        font-size: 2.8vw;
    }
    .model_spec{
        font-size: 10px;
    }
    .model_links{
        padding: 5px;
    }
}

/* 防犯カメラ比較表 */
.tbl_hikaku {
    width: 100% !important;
    border: 1px solid #FFF;
    margin-bottom: 20px;
    text-align: center;
    font-size: 13px;
    font-weight: bold;
}
.tbl_hikaku .head{
    text-align: left;
    font-weight: bold;
    font-size: 15px;
}
.tbl_hikaku th,
.tbl_hikaku td{
    padding: 0.5em 0.5em;
    border: 1px solid #FFF;
    vertical-align: middle;
}
.tbl_hikaku thead th{
    background-color: #3366cc;
    color: #FFF;
    font-size: 15px;
    font-weight: bold;
}
.tbl_hikaku tbody th,
.tbl_hikaku tbody td{
    background-color: #d2deef;
}
.tbl_hikaku tbody tr:nth-child(2n) th,
.tbl_hikaku tbody tr:nth-child(2n) td{
    background-color: #eaeff7;
}
.tbl_hikaku a{
    display: block;
    text-decoration: none;
    color: #333;
}
.tbl_hikaku .img_product{
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 5px auto;
    max-width: 85px;
    min-height: 110px;
    height: 110px; /* IE11 bugfix */
}
.tbl_hikaku .img_product img{
    flex-shrink: 0; /* IE11 bugfix */
}
.dl_spec{
    max-width:8em;
    margin:0 auto;
}
.dl_spec dt{
    clear:both;
    float: left;
    width: 3.5em;
    text-align: left;
}
.dl_spec dd{
    margin-left: 3.6em;
    text-align: right;
}
.ta_l{
    text-align: left;
}
.tbl_hikaku_sp{
    display: none;
}
@media only screen and (max-width:640px){
    .tbl_hikaku {
        font-size: 12px;
    }
    .tbl_hikaku .head,
    .tbl_hikaku thead th{
        font-size: 13px;
    }
    .tbl_hikaku_pc{
        display: none;
    }
    .tbl_hikaku_sp{
        display:table;
    }
}

/* 機能一覧、利用料金、簡単導入ガイド */
.btn_gray_list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 1em 0;
    padding: 0 10px;
    text-align: center;
}
.btn_gray_list li{
    flex:0 1 32%;
    margin:0 0 30px 0;
}
.btn_gray_title{
    margin-bottom: 0.5em !important;
    padding: 0.5em 0;
    background-color: #555;
    color: #FFF;
    font-size: 18px;
    font-weight: bold;
}
.btn_gray_list a{
    display: block;
    color: #333;
    text-decoration: none;
    font-weight: bold;
    font-size: 23px;
    padding:15px 0;
    box-sizing: border-box;
    background-color: #e6e6e7;
    border-radius: 8px;
}
.btn_gray_list a:hover{
    opacity: 0.7;
}
.btn_gray_list .txt_small{
    font-size: 16px;
}
.btn_gray_list strong{
    color: #c3071d;
}
.btn_gray_list .txt_link{
    margin-top:5px;
    font-size: 14px;
    color: #004da1;
    text-decoration: underline !important;
}
@media only screen and (max-width:640px){
    .btn_gray_title{
        font-size: 15px;
    }
    .btn_gray_list{
        display: block;
    }
}


.tbl_spec{
    margin: 0 auto 50px auto ;
    font-size: 14px;
    width: 100%;
    word-break: break-all;
}
.tbl_spec,
.tbl_spec th,
.tbl_spec td{
    border: 1px solid #DDD;
}
.tbl_spec th,
.tbl_spec td{
    padding: 1.0em;
}
.tbl_spec th{
    vertical-align: middle;
    font-weight: bold;
    background-color: #edf1f3;
}
@media only screen and (max-width:640px){
    .tbl_spec{
        width: 94%;
        font-size: 12px;
        margin-bottom: 40px;
    }
    .tbl_spec th,
    .tbl_spec td{
        padding: 0.5em;
    }
}