@charset "utf-8";

/* =Reset default browser CSS.
Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */
body {
	font-family: "BIZ UDGothic","メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro";
	font-size: 95%;
	line-height: 2;
	color: #fb7b7b;
	background-color: #FFFFFF;
	margin: 0px;
	padding: 0px;

}

h1,h2,h3,h4,h5,p,ul,ol,li,dl,dt,dd,form{
	margin: 0px;
	padding: 0px;
}


:focus {
outline: 0;
}

ol, ul {list-style: none;}



caption, th, td {font-weight: normal;text-align: left;}

blockquote{
background-color:#ddd;
padding:1em 1em 1em 3em;
position:relative;
}
blockquote:before{
content:"";
font-size:600%;
line-height:1em;
font-family:"ＭＳ Ｐゴシック",sans-serif;
color:#999;
position:absolute;
left:0;
top:0;
}

a img {border: 0;}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}

body{
color:#333;
-webkit-text-size-adjust: none;
background:#FAFAFA;
}


/* リンク設定
------------------------------------------------------------*/
a{
margin:0;
padding:0;
text-decoration:none;
outline:0;
vertical-align:baseline;
background:transparent;
font-size:100%;
color:#0000ff;
}

a:hover, a:active{
outline: none;
color:#6f6f6f;
}


/**** Clearfix ****/
nav .panel:after, nav#mainNav:after, .newsTitle:after, .bg:after,.post:after, ul.post li:after,nav#mainNav .inner:after{content:""; display: table;clear: both;}
nav .panel,nav#mainNav,.newsTitle,.bg, .post, ul.post li,nav#mainNav .inner{zoom: 1;}


/* レイアウト
------------------------------------------------------------*/
#wrapper, .inner{
margin:0 auto;
width:1000px;
}

#header{
overflow:hidden;
width:100%;
}

#main{
float:right;
width:760px;
padding:0px 0 0px;
margin: 15px 0;
}



#footer{
clear:both;
} 

/* ヘッダー
*****************************************************/

/* サイト説明文
----------------------------------*/
h1{
font-weight:normal;
text-align:right;
padding:0px 10px 0px 0px;
font-size:12px;
background:#039BE5;
color:#fff;
}


/*--------------------------------------------------------
ヘッダー
--------------------------------------------------------*/

.site-header,
.global-nav,
.main-body,
.site-footer{
	min-width: 1200px;
}

.site-header-in,
.global-nav-in,
.main-image-in,
.main-image-in-text,
.main-image-in-text-cont,
.main-body-in,
.site-footer-in{
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	width: 1200px; /*サイトの横幅。これより小さければレスポンシブ*/
	margin: auto;
}


.site-header{
	background:#039BE5;
	margin-bottom:-3px;
}
.site-header:after{
	content:'';
	display:block;
	height:3px;
	width:100%;
	background:#181944;
	}

.site-header-conts{
	width: 100%;
	padding: 10px 0 10px;
}
.site-header-in{
	position:relative;
}

/*ヘッダーロゴ*/
@media only screen and (max-width: 959px){
.site-title{
	text-align:center;
	margin: 0 auto;
	font-size: 0.25em;
	font-family: RocknRoll One;
}}

@media only screen and (min-width: 600px) {
.site-title{
		text-align:left;
			margin: 0 auto;
	font-size: 0.25em;
	font-family: RocknRoll One;
}}


.site-title a{
	text-decoration: none;
	color:#fff;
	font-size:25px;
}

.site-title a:hover,
.site-title a:active,
.site-title a:focus{
	text-decoration: underline;
}

.normal-screen .site-title{
	font-size: 3em;
}

.normal-screen .lp-catch{
	font-size: 1.5em;
}



/*ヘッダー右側の要素*/
.header-box{
	text-align: right;
	position:absolute;
	right:0;
	top:20px;
}

/*ヘッダーの全画面表示*/
.full-screen{
	background: url(../images/lp-image.jpg) center center no-repeat;
	-webkit-background-size: cover;
	background-size: cover;
	color: #fff;
}

.full-screen .site-header-in{
	display: table;
}

.full-screen .site-header-conts{
	display: table-cell;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	overflow: hidden;
	width: 100%;
	padding: 1em;
	text-align: center;
	vertical-align: middle;
	text-shadow: 1px 1px 8px #171844;
}

.full-screen .site-title{
	display: block;
	text-align:center;
}

.contact-btn{
	margin-bottom: 0;
}

.full-screen .site-header-conts h1{
	width: auto;
	margin: 0;
}

.full-screen .site-header-conts p{
	font-size: 2em;
}

.full-screen .site-header-conts p a{
	color: #fff;
	text-decoration: none;
}


/*--------------------------------------------------------
グローバルナビ
--------------------------------------------------------*/

.global-nav{
	padding: 0;
	background-color:#007fc7;
	border-bottom:#171844 solid 1px;
	margin-bottom:-3px;
	z-index: 200;
	position: relative;
}

/*グローバルナビの開閉用ボタン*/
.global-nav-panel{
	display: none;
	font-size: 12px;
}

.global-nav-panel span{
	display: block;
	min-height: 20px;
	line-height: 20px;
}

.icon-gn-menu{
	padding-left: 32px;
	background: url(https://power-hikaku.info/images/icon/icon-gn-menu.png) left center no-repeat;
}

.icon-gn-close{
	padding-left: 32px;
	background: url(https://power-hikaku.info/images/icon/icon-gn-close.png) left center no-repeat;
}


	/*Retina（高解像度）ディスプレイ用*/
	@media screen and (-webkit-min-device-pixel-ratio:2),
	(min-resolution: 2dppx){
		.icon-gn-menu{
			background: url(https://power-hikaku.info/images/icon/icon-gn-menu@2x.png) left center no-repeat;
			-webkit-background-size: 20px 20px;
			background-size: 20px 20px;
		}

		.icon-gn-close{
			background: url(https://power-hikaku.info/images/icon/icon-gn-close@2x.png) left center no-repeat;
			-webkit-background-size: 20px 20px;
			background-size: 20px 20px;
		}
	}

.global-nav .show-menu,
.global-nav .show-menu li ul{
	display: block!important;
}

.global-nav-in ul{
	display: table;
	width: 100%;
	margin: 0;
	padding: 0;
	table-layout: fixed; /*メニューの幅を均等に*/
}

.global-nav-in li{
	display: table-cell;
	list-style: none;
	position: relative;
	vertical-align: middle;
	margin: 0;
	text-align: center;
}

.global-nav-in li a{
	display: block;
	min-height: 1.5em; /*メニュー毎に高さが変わるときに調整*/
	padding: 0.6em; /*画像をメニューにする場合は値を0に*/
	color: #fff;
	text-decoration: none;
	border-left:#5393d1 solid 1px;	
	font-size:12px;
}

.global-nav-in li a:hover,
.global-nav-in li a:active,
.global-nav-in li a:focus{
	background-color: #35afea;
	color: #fff;
}

.global-nav-in li ul{
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 10;
	width: 100%;
	border-left: 0;
}

/*ドロップダウンメニューのデザイン*/
.global-nav li ul li{
	display: list-item;
	width: 100%;
	margin: 0;
	padding: 0;
	border-top: 0;
	border-right: 0;
	white-space: normal;
}

.global-nav li ul li a{
	display: block;
	padding: 0.8em 2em;
	background:#039be5;
	color:#fff;
	border-bottom:#67c3ef solid 1px;
}

.global-nav-in li ul ul{
	top: 0;
	left: 100%;
}



/* 959px以下から 1カラム表示
------------------------------------------------------------*/
@media only screen and (max-width: 959px){
  #wrapper, .inner{width:100%;}

	#header{width:96%;padding:0 2%;}
	
	.contact{padding:10px 0 0px;}

 
	#main, #sidebar{clear:both;width:95%;float:none;margin:0 auto;padding:10px 0;	}
	
	.banner{width:100%;margin:0 auto;text-align:center;}
  p.banner img{width:100%;height:auto;}
	section.widget_search{text-align:center;}
	#calendar_wrap table{width:260px;}
	
	#footer li{margin-bottom:10px;}
	
}


/* 幅644px以下から ヘッダー等微調節
------------------------------------------------------------*/
@media only screen and (max-width: 644px){

	#header{text-align:center;background-image:none;}
	#header h2,.contact{float:none;}

	#headerInfo{width:250px;margin:0 auto;}
	img.alignright, img.alignleft{display: block;	margin:5px auto;}
	.alignright,.alignleft{float:none;}
}




/*パンくずリスト
---------------------------------------------------------------------------*/
#pan {  
    margin:-30px 0 -5px 0;  
    text-align:right;  
    font-size: 85%;
}  
#pan li {  
    display:inline;  
    line-height:110%;  
    list-style-type:none;  
}  
#pan li a {  
    padding-right:10px;  
    background:url(https://power-hikaku.info/images/pan.gif) no-repeat right center;  
}  





/*main内*/
---------------------------------------------------------------------------*/

#main p {
	padding: 0.5em 10px 1em;	/*左から上、左右、下の余白の数値*/
}


#main h2 {
	margin: 20px 10px 10px;
	padding: 10px 18px;
	background:#de2500;
	color: #fff;
	font-size: 1.55em;
	box-shadow: 0 2px 6px rgba(0, 0, 0, .25);
}



#main h3 {
	position:relative;
	margin: 30px 20px 20px;
	padding: 0 0 10px;
	border-bottom: 4px solid #afafaf;
	box-sizing: content-box;
	font-weight: bold;
	font-size: 1.3em;
}



#main h3::after {
	position: absolute;
	z-index: 2;
	left: 0;
	bottom: -4px;
	width: 20%;
	height: 4px;
	background-color:#de2500;
	content: '';
}



#main h5 {
	position:relative;
	margin: 60px 20px 30px;
	padding: 0 0 10px;
	border-bottom: 4px solid #afafaf;
	box-sizing: content-box;
	font-weight: bold;
	font-size: 1.3em;
}


#main h5::after {
	position: absolute;
	z-index: 2;
	left: 0;
	bottom: -4px;
	width: 20%;
	height: 4px;
	background-color:#de2500;
	content: '';
}



#main {
	background-color: #fff;		/*背景色*/
	padding: 5px;
	font-size:15px;

}



/*フッターメニュー
---------------------------------------------------------------------------*/
ul#footermenu {
	clear: both;
	width: 100%;
	font-size: 11px;		/*文字サイズ*/
	text-align: center;		/*センタリング*/
	background-repeat: no-repeat;
	background-position: bottom;
	padding-top: 20px;
	padding-bottom: 10px;
}

ul#footermenu li {
	display: inline;
	padding-right: 5px;
	padding-left: 5px;
}



/*フッター
---------------------------------------------------------------------------*/
#footer {
	font-size: 11px;		/*文字サイズ*/
	letter-spacing: 0.2em;	/*文字間隔*/
	text-align: center;		/*センタリング*/
	color: #FFFFFF;			/*文字色*/

  background: #007fc7;
  border-bottom: 5px solid #192f60;
}

#footer a {
	color: #D4D9E3;
}






div#footMenu2 {
	box-sizing:border-box;
	float:left;
	width:100%;
	padding:30px;
	background:#f2f2f2;
}


div#footMenu2 .wrap2 {
		box-sizing: border-box;

	}



div#footMenu2 .wrap2 {
   float:left;
   width:300px;
   word-break:break-all;
   float:left;
   margin-bottom: 20px;
}

div#footMenu2 h2 {
   font-size:90%;
}

div#footMenu2 ul{
   margin:0;
   padding:0;
   float:left;
}

div#footMenu2 li {
	margin-left:20px;
	font-size:13px;
}


/*ページトップボタン*/
.page-top{
	display: none;
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 99;
	line-height: 1.2;
	margin-bottom: 0;
}



/* サムネイルつき矢印リスト */
---------------------------------------------------------------------------*/
.list3 ul{
 border-bottom: 1px solid #ccc;
 weight: 100%
 }

 .list3 ul li{
 border-top: 1px solid #ccc;
 height: 100px;
 margin: 18px 5px 13px 5px;
 }

 .list3 ul li a{
 color: #666;
 display: block;
 height: 98px;
 margin: 2px 0 2px 0;
  overflow: hidden;
  text-overflow: ellipsis;
 text-decoration: none;
 vertical-align: top;
 font-size: 14px;
 }

 .list3 ul li img{
 float: left;
 height: 98px;
 weight: 98px
 }

 .list3 ul li a strong{
 color: #000;
 font-weight: bold;
 padding-top: 17px;
 }

 .list3 h3{
 color: #000;
 font-weight: bold;
 font-size: 17px;
 color: #1111cc;
 }




/* 文章強調
----------------------------------------------------------- */
span.imp {
	text-align: justify;
	font-size: 110%;
	line-height: 160%;
	font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro";
	font-weight: bold;
	text-decoration: underline;
}


span.imp2 {
	text-align: justify;
	font-size: 110%;
	line-height: 160%;
	font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro";
	font-weight: bold;
}


span.tibi{
	font-size: 78%;
	color:#C0C0C0;
}




span.vsma {
	text-align: center;
	font-size: 9px;
	line-height: 120%;
	color: #FFFFFF;
}

span.sma {
	text-align: center;
	font-size: 16px;
	line-height: 105%;
	color: #FFFFFF;
	font-weight: bold;
}




span.int {
	font-size: 9px;
	line-height: 105%;
}


span.ys {
border-bottom: 3px solid #00FFFF ;
font-size: 120%;
}

span.yr {
border-bottom: 3px solid #FF0072 ;
font-size: 120%;
}



strong.yb {
background: linear-gradient(transparent 40%, #00FFFF 40%);
font-size: 105%;
}


strong.ys {
background: linear-gradient(transparent 60%, #00FFFF 60%);
font-size: 105%;
}









/* テーブル比較表
----------------------------------------------------------- */


table.hikaku {
  width: auto;
  border-spacing: 0;
}
table.hikaku th {
  color: #fff;
  background: #258;
  background:-moz-linear-gradient(rgba(34,85,136,0.7), rgba(34,85,136,0.9) 50%);
  background:-webkit-gradient(linear, 100% 0%, 100% 50%, from(rgba(34,85,136,0.7)), to(rgba(34,85,136,0.9)));
  font-weight: bold;
  border-left:1px solid #258;
  border-top:1px solid #258;
  border-bottom:1px solid #258;

  text-align: center;
  text-shadow:0 -1px 0 rgba(34,85,136,0.9);
  box-shadow: 0px 1px 1px rgba(255,255,255,0.3) inset;
}

table.hikaku th:first-child {
  border-radius: 5px 0 0 0;	
}

table.hikaku th:last-child {
  border-radius:0 5px 0 0;
  border-right:1px solid #258;
  box-shadow: 2px 2px 1px rgba(0,0,0,0.1),0px 1px 1px rgba(255,255,255,0.3) inset;
}

table.hikaku tr td {
  padding: 3px 10px;
  border-bottom: 1px solid #84b2e0;
  border-left: 1px solid #84b2e0;
  text-align: center;
}
table.hikaku tr td:last-child {
  border-right: 1px solid #84b2e0;
  box-shadow: 2px 2px 1px rgba(0,0,0,0.1);
}
table.hikaku tr {
  background: #fff;
}
table.hikaku tr:nth-child(2n+1) {
  background: #f1f6fc;
}
table.hikaku tr:last-child td {
  box-shadow: 2px 2px 1px rgba(0,0,0,0.1);
}
table.hikaku tr:last-child td:first-child {
  border-radius: 0 0 0 5px;
}
table.hikaku tr:last-child td:last-child {
  border-radius: 0 0 5px 0;
}
/*table.hikaku tr:hover {
  background: #bbd4ee;
  cursor:pointer;
}


/* TABLEスクロール設定
----------------------------------------------------------- */
div .table-parent {
  width: 730px;
  overflow: hidden;
}

div .left-index {
  width: 155px;
  float: left;
  margin:0px;
}

div .right-scroll {
  width: 575px;
  float: left;
  overflow-y: hidden;
  overflow-x: scroll;
  margin:0px;
}

/* for jQuery
----------------------------------------------------------- */
tr.closetab {
  background: #91969c;
}

tr.closetab td {
  font-size: 60%;
	padding: 2px;
}

tr.closetab td:hover {
  cursor:pointer;
	text-decoration: underline;
}

p.open-all {
	text-align: right; 
  	font-size: 80%;
	visibility: hidden;
}

p.open-all:hover {
	text-decoration: underline;
	cursor: pointer;
	color: #AAA; 
}



/* ========================================  menuL 左サイドメニュー */
#menuL {
	float: left;
	clear: left;
	width: 220px;
	padding: 0;
	margin: 10px 0;
	color: #FFF;
}



.menuInfo { /* サイドボックス内のメッセージボックス */
	color:#333;
	margin:10px 0 0;
	padding:1px 0;
}



.menuInfo p {
	padding: 0 0 0 10px;
	margin: 1em 10px 1em 5px;
}


.subinfo {　/* サイドボックのメニュー */
	margin:0 0 10px;
	background-image: url(https://securitysoft.asia/images/submenuback002.png);
}

.subinfosearch {
	margin:20px 0;
}



.subinfo .label { /* サイドボックのメニュー:ラベル */
	padding:6px 0px 6px 10px;
	color: #19448e;
	font-size:15px;
	background: #fff;
	background-repeat: repeat-x;
	background-position: left top;
	height: 27px;
	border-radius: 2px;
	font-weight: bold;
	border-bottom:#039BE5 solid 2px;
	border-left:#039BE5 solid 7px;
}


.subinfo ul{ /* サイドボックのメニュー:リスト */
	margin: 0 0 17px;
}


.subinfo li {
	padding: 0px;
	margin: 5px 0px 0px;
	font-size: 13px;
	color: #666666;
	list-style-type: none;
}


.subinfo li a{
	padding: 5px 10px;
	border-bottom: 1px solid #E5E5E5;
	border-left: 7px solid #E5E5E5;
	text-decoration: none;
	display: block;
}


.subinfo li a:hover{
	border-left: 7px solid #0095d9;
	color: #0095d9;
	background-color: #F3F3F3;
}



.subinfo .label_admin { /* サイドボックのメニュー:ラベル */
	padding:3px 0px 0px 15px;
	color: #19448e;
	font-size:12px;
	margin: 0px;
	height: 18px;
	font-weight: bold;
	border-bottom:solid 1px #19448e;
}


.subinfo p{
	padding:0px 0px 0px 15px;
	font-size:12px;
}


/* サンプル7
----------------------------------------------------------- */

.sample7 th	{
	background: #CAE5F1 url(https://power-hikaku.info/images/i/th.jpg) repeat-x;
	border-top: 2px solid #1D5C79;
	border-bottom: 1px solid #FFF;
	text-align:center;
}
.sample7 td	{
	background: #F4FAFC url(https://power-hikaku.info/images/i/td.jpg) repeat-x;
	border-bottom: 1px solid #FFF;

}



/* レスポンシブテーブル
----------------------------------------------------------- */

@media only screen and (min-width:421px){
    #demo #words{
        display: table-row-group;
    }
    #demo dl{
        display: table-row;
        margin: 0;
    }
        #demo dl dt,
        #demo dl dd{
            display: table-cell;
            padding: 5px;
            border-left: 1px solid #ccc;
            border-top: 1px solid #ccc;
        }
    .....
}


/*----------------------------------------------------
    .smartphone/free/soft用レスポンシブテーブル demo01
----------------------------------------------------*/
.demo01 th  { width: 30%; text-align: center; }
 
@media only screen and (max-width:480px){
    .demo01 { margin: 0 -10px; }
    .demo01 th,
    .demo01 td{
        width: 100%;
        display: block;
        border-top: none;
    }
    .demo01 tr:first-child th   { border-top: 1px solid #ddd;	text-align: center; }

.demo01 td{
	text-align:center;
}


/*----------------------------------------------------
    画像幅レスポンシブ
----------------------------------------------------*/

p.resizeimg img {
	max-width:99%;
@media only screen and (max-width: 500px){
	width: 99%;
}
}

p.imgbig img { width: 99%; }}
