h1{
	color:#333;
	font-size:0.8rem;
	padding-bottom:10px;
	}
.center{
	margin:0 auto;
	text-align:center;
	display:block;
	}
.pi{ color:#F3244E;}
.beige-back{
	background-image: url(../img/beige-back.jpg);
	background-repeat: repeat;
	}
.has-padding{ padding:50px 0;}
.has-padding-30{ padding:30px 0;}
.has-padding-top{ padding:50px 0 0 0;}
.has-padding-top20{ padding:20px 0 0 0;}
.has-padding-top30{ padding:30px 0 0 0;}
.has-padding-btm20{ padding:0 0 20px 0 ;}
.has-padding-btm30{ padding:0 0 30px 0 ;}
.has-padding-btm{ padding:0 0 50px 0 ;}
.has-padding-t50b30{ padding:50px 0 10px 0 ;}
.has-padding-top20btm50{padding:20px 0 50px 0 ;}

/*横並びにした時の余白の為のインナーボックス*/
.border-box{
	border: 3px solid #000;
	background-color:#FFF;
	border-radius:15px;
	margin-top:30px;
}
.border-box p{margin:0;}
.border-box img{padding-bottom:10px;}

.inner {
	padding:15px 15px 1px 15px;
	overflow:hidden;
}


/*横並びボックスの高さを合わせる*/
.row-eq-height {
    display: flex;
    flex-wrap: wrap;
}
/*ページTOP
#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 80%;
}
#page-top a {
    background: #666;
    text-decoration: none;
    color: #fff;
    width: 100px;
    padding: 25px 0;
    text-align: center;
    display: block;
    border-radius: 10px;
}
#page-top a:hover {
    text-decoration: none;
    background: #999;
}
*/




#page-top {
    position: fixed;
    bottom: 0px;
    right: 8px;
}
#page-top a {
	width: 65px;
	padding: 35px 0 10px;
	display: block;
	background-image: url(../img/btn-top-off.png);
	background-repeat: no-repeat;
}
#page-top a:hover {
	background-image: url(../img/btn-top-on.png);
	background-repeat: no-repeat;
}

#side-contact {
    position: fixed;
    bottom:80px;
    right: 8px;
}
#side-contact a {
	width: 65px;
	padding: 35px 0 10px;
	display: block;
	background-image: url(../img/btn-contact-off.png);
	background-repeat: no-repeat;
}
#side-contact a:hover {
	background-image: url(../img/btn-contact-on.png);
	background-repeat: no-repeat;
}


/*細マーカー*/
mark {
    background: linear-gradient(transparent 80%, #FFFF00 60%);
}




/* ==========================================================================
trouble
========================================================================== */
#trouble{}
/*trouble image img-fluid & center */
#trouble img{
	margin:0 auto;
	display:block;
	max-width: 100%;
	height: auto;
	}
#trouble h2{}
#trouble h3{ text-align:center;}
.note{
	background-image: url(../img/brown-back.jpg);
	background-repeat: repeat;
	width:90%;
	margin:0 auto 0;
	padding:30px;
	}
@media screen and (max-width: 767px){
.note{
	width:90%;
	margin:30px auto 0;
	padding:10px 0px;
	}
}

.note ul{
	padding:10px 0 0 0;
	text-align:left;
	}
.note li{
	background-image: url(../img/arrow-red.png),url(../img/note-line.gif);
	background-repeat: no-repeat, repeat-x;
	background-position: 0 3px, center bottom;
	padding:0 0 15px 28px;
	margin:15px 0 0 0;
	color:#333;
	font-weight:800;
	}

/*----ITsupport-------------------------------------------------------------*/
#ITsupport{background-color:#FFF;}
#ITsupport h2{
	text-align: center;
	background-image: url(../img/h2.png);
	background-repeat: repeat-x;
	background-position: center top;
	}
#ITsupport h2 img{
	margin:13px 0 0 0;
	}
#ITsupport h2 span{
	display:block;
	margin:50px 0 10px 0;
	font-size:3rem;
	font-weight:600;
}
#ITsupport h3{
	color: #0084B4;
	font-size: 1.6rem;
	text-align: center;
	font-weight: 600;
	border-bottom-width: 3px;
	border-bottom-style: double;
	border-bottom-color: #333;
	padding-bottom:10px;
	}

/*ITsupport image img-fluid & center */
#ITsupport .inner img{
	margin:0 auto;
	display:block;
	max-width: 100%;
	height: auto;
	}

/*----Network-------------------------------------------------------------*/
#Network{background-color:#DE3882;}
#Network h2{
	text-align: center;
	background-image: url(../img/h2.png);
	background-repeat: repeat-x;
	background-position: center top;
	}
#Network h2 img{
	margin:13px 0 0 0;
	}
#Network h2 span{
	display:block;
	margin:50px 0 0 0;
	font-size:3rem;
	font-weight:600;
	text-shadow: 2px 2px 1px #FFF, -2px 2px 1px #FFF, 2px -2px 1px #FFF, -2px -1px 1px #FFF;

}
#Network h3{
	color: #DF3381;
	font-size: 1.6rem;
	text-align: center;
	font-weight: 600;
	border-bottom-width: 3px;
	border-bottom-style: double;
	border-bottom-color: #333;
	padding-bottom:10px;
	}

/*Network image img-fluid & center */
#Network .inner img{
	margin:0 auto;
	display:block;
	max-width: 100%;
	height: auto;
	}
/*----Softwear-------------------------------------------------------------*/
#Softwear{background-color:#FFD24D;}
#Softwear h2{
	text-align: center;
	background-image: url(../img/h2.png);
	background-repeat: repeat-x;
	background-position: center top;
	}
#Softwear h2 img{
	margin:13px 0 0 0;
	}
#Softwear h2 span{
	display:block;
	margin:50px 0 0 0;
	font-size:3rem;
	font-weight:600;
	text-shadow: 2px 2px 1px #FFF, -2px 2px 1px #FFF, 2px -2px 1px #FFF, -2px -1px 1px #FFF;
}
#Softwear h3{
	color: #8AC300;
	font-size: 1.6rem;
	text-align: center;
	font-weight: 600;
	border-bottom-width: 3px;
	border-bottom-style: double;
	border-bottom-color: #333;
	padding-bottom:10px;
	}

/*Softwear image img-fluid & center */
#Softwear .inner img{
	margin:0 auto;
	display:block;
	max-width: 100%;
	height: auto;
	}
/*----Recovery-------------------------------------------------------------*/
#Recovery{background-color:#FFF;}
#Recovery h2{
	text-align: center;
	background-image: url(../img/h2.png);
	background-repeat: repeat-x;
	background-position: center top;
	}
#Recovery h2 img{
	margin:13px 0 0 0;
	}
#Recovery h2 span{
	display:block;
	margin:50px 0 0 0;
	font-size:3rem;
	font-weight:600;
}
#Recovery h3{
	color: #5301A6;
	font-size: 1.6rem;
	text-align: center;
	font-weight: 600;
	border-bottom-width: 3px;
	border-bottom-style: double;
	border-bottom-color: #333;
	padding-bottom:10px;
	}

/*Recovery image img-fluid & center */
#Recovery .inner img{
	margin:0 auto;
	display:block;
	max-width: 100%;
	height: auto;
	}



@media screen and (max-width: 767px){
#ITsupport h2 span,
#Network h2 span,
#Softwear h2 span,
#Recovery h2 span{
	font-size:1.2rem;
	text-shadow:none;
}
#ITsupport h3,
#Network h3,
#Softwear h3,
#Recovery h3{
	font-size: 1.0rem;
	}
}


/* ==========================================================================
works
========================================================================== */
#works{background-color:#8CC400;}
#works h2{
	text-align: center;
	}
.white-box{
	background-color:#FFF;
	border-radius:15px;
	margin-top:30px;
	width:100%;
	overflow:hidden;
}
.white-box p{margin:0;}
.white-box img{padding-bottom:10px;}

.inner {
	padding:15px 15px 1px 15px;
	overflow:hidden;
}

ul.arrow-bk{
	padding:10px 0 17px 0;
	text-align:left;
	border-left:solid 3px #333333;
	}
ul.arrow-bk li{
	background-image: url(../img/arrow-bk.png);
	background-repeat: no-repeat;
	background-position: 0 3px;
	padding:0 0 0 28px;
	margin:17px 0 0 20px;
	color:#333;
	font-weight:400;
	}
.white-box-left{
	float:left;
	width:28%;
	padding:3%;
	}
.white-box-right{
	float:left;
	width:63%;
	padding:3% 3% 3% 0%;
	}
.white-box-left h2{
	border-bottom:double 3px #333333;
	padding:0 0 10px 0;
	}
@media screen and (max-width: 767px){
.white-box{
	background-color:#FFF;
	border-radius:15px;
	margin:30px auto;
	width:94%;
	overflow:hidden;
}
.white-box-left{
	float:none;
	width:100%;
	padding:3% 3% 0 3%;
	}
.white-box-right{
	float:none;
	width:98%;
	padding:0 1% 5% 1%;
	}
ul.arrow-bk{
	padding:0;
	text-align:left;
	border:none;
	}
}

ul.works{
	margin:10px 0 15px ;
	}

ul.works li{
	float:left;
	padding:3px 6px 2px;
	font-size:12px;
	color:#FFF;
	font-weight:600;
	margin:0 10px 0 0 ;
	}
	.pc_sp{background-color:#0085B2;}
	.network_sp{background-color:#DE3882;}
	.soft_sp{background-color:#8AC300;}
	.recovery{background-color:#5500AA;}
	.data_sp{background-color:#aa8400;}
	.hard_sp{background-color:#7e142a;}

.it_case{
	clear: both;
	border-bottom: 1px dotted #333;
}
div.it_case_cat{
padding:3px 6px 2px;
font-size:12px;
display: inline-block;
color:#FFF;
font-weight:600;
margin:0 10px 0 0 ;
}
.article_title h4{
	font-size: 1.2rem
}

.white-box-right h3{
	border-bottom:double 3px #333333;
	padding:0 0 10px 0;
	margin:0 0 10px 0;
	font-size:1.4rem;
	}
.works-border-left{
	padding:0 0 0 10%;
	border-left:solid 3px #333333;
	}
@media screen and (max-width: 767px){
.works-border-left{
	padding:0 0 0 3%;
	border:none;
	}
.white-box-right h3{
	font-size:1rem;
	font-weight:600;
	}
}


/*add*/
.works_back_p{
	background-color: #ffebf4;
	padding: 15px;
	text-align: center;
	font-size: 1.2rem;
  font-weight: 600;
}

.works_case_text_c{
	text-align: center;
	font-size: 1.5rem;
  font-weight: 600;
}
.works_back_p strong{
font-size: 1.6rem;
font-weight: 600;
}
.works_back_p span{
	color: #ff0000;
}
.strg{
font-size: 1.6rem;
font-weight: 600;
}

/* ==========================================================================
price
========================================================================== */
#price{}
#price h2{
	text-align:center;
	font-size:3rem;
	font-weight:600;
	}
table.price {
	border-collapse: collapse;
	width:100%;
	margin-top:20px;
}
table.price th.t_top {
	border-top-width: 2px;
	border-top-style: solid;
	border-top-color: #333;
}
table.price th {
	border-bottom: #333 1px solid;
	text-align: left;
	padding:10px;
	font-weight: 600;
	background-color: #F1F1F1;
}
table.price td.t_top {
	border-top: #333 2px solid;
}
table.price td {
	border-bottom: #333 1px solid;
	text-align: left;
	padding: 10px;
	line-height:140%;
}
table.price td.price {
	text-align:right}

ul.annotation{
	margin:10px 0 0 1rem;
	color:#F3244E;
	text-indent:-1rem;
}
ul.annotation li{
	margin:12px 0 0 0;
	}
ul.annotation li:before{
	content:"※ ";
	}
@media screen and (max-width: 767px){#price h2{font-size:1.8rem;font-weight:600;}}

/* ==========================================================================
contact
========================================================================== */
#contact{}
#contact h2{
	text-align:center;
	font-size:3rem;
	font-weight:600;
	}
@media screen and (max-width: 767px){#contact h2{font-size:1.8rem;font-weight:600;}}



/* ==========================================================================
company
========================================================================== */
#company{}
#company h2{
	text-align:center;
	font-size:3rem;
	font-weight:600;
	}
table.company {
	border-collapse: collapse;
	width:100%;
	margin-top:20px;
}
table.company th.t_top {
	border-top-width: 2px;
	border-top-style: solid;
	border-top-color: #333;
}
table.company th {
	border-bottom: #333 1px solid;
	text-align: left;
	padding:10px;
	font-weight: 600;
	background-color: #F1F1F1;
}
table.company td.t_top {
	border-top: #333 2px solid;
}
table.company td {
	border-bottom: #333 1px solid;
	text-align: left;
	padding: 10px;
	line-height:140%;
}
table.company tr:hover {
	background-color: #F1F1F1;
}
a.staff-txt{
	background-color: #060;
	color:#fff;
	padding: 2px 5px;
  -webkit-border-radius: 9;
  -moz-border-radius: 9;
  border-radius: 9px;
}

a:hover.staff-txt{
	background-color: #89C800;
	color:#fff;
	padding: 2px 5px;
  -webkit-border-radius: 9;
  -moz-border-radius: 9;
  border-radius: 9px;
}

@media screen and (max-width: 767px){#company h2{font-size:1.8rem;font-weight:600;}}




/* ==========================================================================
Footer
========================================================================== */
footer {
	text-align:center;
	background-color: #89C800;
	color: #fff;
	font-size:0.8rem;
	padding:18px 0;
	}
footer a {
    color: #fff; }
footer a:hover {
    color: #fff;
	text-decoration:none;
	}

/* ==========================================================================
viewer
========================================================================== */
.viewer {
	margin: 0 auto 20px;
	width: 100%;
	position: relative;
	overflow: hidden;
}
.viewer ul {
	overflow: hidden;
	position: relative;
}
.viewer ul li {
	top: 0;
	left: 0;
	position: absolute;
}
/*
.viewer ul li img {
	width: 100%;
}
.viewer ul:after {
    content: ".";
    height: 0;
    clear: both;
    display: block;
    visibility: hidden;
}
.viewer ul {
    display: inline-block;
    overflow: hidden;
}
*/
#site-title{
	background-color:#060;
	color:#FFF;
	font-weight: 600;
	font-size:1rem;
	text-align:center;
	}

	/* ==========================================================================
	Case
	========================================================================== */
#single_case h2{
	text-align:center;
	font-size:3rem;
	font-weight:600;
}
h3.single_title{
border-bottom: 1px solid #e1e1e1;
font-weight: bold;
padding-bottom: 0.4em;
margin-bottom: 0.83em;
}
table.itcase {
border-collapse: collapse;
width:100%;
margin-top:20px;
}
table.itcase th.t_top {
border-top-width: 2px;
border-top-style: solid;
border-top-color: #333;
}
table.itcase th {
border-bottom: #333 1px solid;
text-align: left;
width: 25%;
padding:10px;
font-weight: 600;
background-color: #F1F1F1;
}
table.itcase td.t_top {
border-top: #333 2px solid;
}
table.itcase td {
border-bottom: #333 1px solid;
text-align: left;
padding: 10px;
line-height:140%;
}

table.itcase td.case_img{
	text-align: center;
	padding: 10px 0;
}

@media screen and (max-width: 767px){
    table.itcase tbody tr{
        display: block;
        margin-bottom: 1.5em;
    }
    table.itcase tbody th,
    table.itcase tbody td{
        display: list-item;
				list-style: none;
        border: none;
    }

		table.itcase table img{
					max-width: 100%;
					height : auto ;
				}

		table.itcase th.t_top {
			border: none;
		}
		table.itcase th {
		border: none;
		text-align: left;
		padding:10px;
		font-weight: 600;
		width: 100%;
		background-color: #ffd700;
		color: #333;
		}
		table.itcase td.t_top {
		border: none;
		}
		table.itcase td {
		border: none;
		text-align: left;
		padding: 10px;
		line-height:140%;
		width: 100%;
		}
}

/*top */
.bean_list {
	width: 100%;
	margin: 0 auto;
}
.bean_list li{
	width: 97%;
	margin: 0 auto;
	margin-bottom: 20px;
	list-style:none;
	padding-left: 10px;
}
/* ==========================================================================
bean
========================================================================== */
#Single h2{
text-align:center;
font-size:3rem;
font-weight:600;
}
.single_content{
	margin-top: 30px;
}

/* ==========================================================================
archive
========================================================================== */
.article_img{
	float: left;
	margin: 0 15px 10px 0;
}
.article_title h3{
	font-size:1.25rem;
}
.article_day{
	clear: both;
	text-align: right;
	border-bottom: 1px solid #e1e1e1;
	padding: 0 0 10px 0;
	font-weight: bold;
}
.article_list{
	padding: 10px 0 10px 0;
}


/*Mobile Menu Icon*/
.mobile_menu{
	position: absolute;
	right: 2px;
	top: 50px;
	width: 80px;
	height: 26px;
}

a.slide_btm{
line-height: 30px;
  -webkit-border-radius: 10;
  -moz-border-radius: 10;
  border-radius: 10px;
  font-family: Arial;
	font-weight: bold;
  color: #ffffff;
  font-size: 1em;
  background: #339900;
  padding: 10px 20px 10px 20px;
  text-decoration: none;

}

a.slide_btm:hover{
  background: #74e63c;
  text-decoration: none;
}

/************************************
** レスポンシブページネーション
************************************/
/* 共通 */
.pagination {
    text-align: center;
    width: 100%;
    display: block;
		margin-bottom:20px;
		padding-bottom: 20px;
}
.pagination a {
    background: #f6f6f6;
    color: #000;
    text-decoration: none
}
/* スマホ　*/
@media only screen and (max-width: 667px) {
    .pagination .inner {
        width: 90%;
        margin: 0 5%;
        position: relative;
        display: -webkit-box;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        height: 46px
    }
    .pagination .page-of {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 2;
        -webkit-order: 2;
        order: 2;
        position: absolute;
        left: 37%;
        width: 26%;
        font-weight: bold;
        color: #fff;
        background: #2C2D2F;
        height: 46px;
		    line-height: 32px;
        font-size: 1.1rem
    }
    .pagination .m-prev {
        -webkit-box-ordinal-group: 0;
        -ms-flex-order: 0;
        -webkit-order: 0;
        order: 0;
        width: 15%;
        position: absolute;
        left: 0%
    }
    .pagination .pn-prev {
        -webkit-box-ordinal-group: 1;
        -ms-flex-order: 1;
        -webkit-order: 1;
        order: 1;
        width: 22%;
        position: absolute;
        left: 15%
    }
    .pagination .pn-next {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 3;
        -webkit-order: 3;
        order: 3;
        width: 22%;
        position: absolute;
        left: 63%
    }
    .pagination .m-next {
        -webkit-box-ordinal-group: 4;
        -ms-flex-order: 4;
        -webkit-order: 4;
        order: 4;
        width: 15%;
        position: absolute;
        left: 85%
    }
    .pagination .current, .pagination .pn-numbers {
        display: none
    }
    .pagination a {
        line-height: 32px;
        height: 46px;
        font-weight: bold;
        font-size: 1.2rem
    }
}
/* PC */
@media only screen and (min-width: 668px) {
    .pagination .page-of {
        display: block;
        width: 100%;
        font-size: 108%;
        color: #000;
        text-align: center;
        margin-bottom: 1em
    }
    .pagination a, .pagination .current {
        display: inline-block;
        padding: 0 1.5em;
        font-size: 116%;
        font-weight: bold;
        line-height: 50px;
        height: 50px
    }
    .pagination .current {
        background: #2C2D2F;
        color: #fff
    }
    .pagination a:hover {
        background: #2C2D2F;
        color: #fff
    }
  }

/*Single Pagenation*/
.next_prev_page_link{
	    text-align: center;
	    width: 100%;
	    display: block;
			margin-bottom:20px;
			padding-bottom: 20px;
			font-size: 0.9em;
}

.next_prev_page_link a {
    background: #f6f6f6;
    color: #000;
		font-weight: bold;
    text-decoration: none;
		display: block;
		padding: 10px 0;
}
.next_prev_page_link a:hover {
    background: #000;
    color: #f6f6f6;
    text-decoration: none;
}

.next_prev_page_link ul{
    display: table;
    width: 70%;
		margin-left:auto;
		margin-right:auto;
    background: #FFF;
}

.next_prev_page_link li{
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}

h3.recently_title{
	text-align: center;
	border-bottom: 1px solid #e1e1e1;
	font-size: 1.5em;
	font-weight: bold;
	padding-bottom: 0.4em;
	margin-bottom: 0.83em;
}


/* Alignment */

.alignleft {
	float: left;
}

.alignright {
	float: right;
}

.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

blockquote.alignleft,
figure.wp-caption.alignleft,
img.alignleft {
	margin: 7px 24px 7px 0;
}

.wp-caption.alignleft {
	margin: 7px 14px 7px 0;
}

blockquote.alignright,
figure.wp-caption.alignright,
img.alignright {
	margin: 7px 0 7px 24px;
}

.wp-caption.alignright {
	margin: 7px 0 7px 14px;
}

blockquote.aligncenter,
img.aligncenter,
.wp-caption.aligncenter {
	margin-top: 7px;
	margin-bottom: 7px;
}

.site-content blockquote.alignleft,
.site-content blockquote.alignright {
	border-top: 1px solid rgba(0, 0, 0, 0.1);
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	padding-top: 17px;
	width: 50%;
}

.site-content blockquote.alignleft p,
.site-content blockquote.alignright p {
	margin-bottom: 17px;
}

.wp-caption {
	margin-bottom: 24px;
}

.wp-caption img[class*="wp-image-"] {
	display: block;
	margin: 0;
}

.wp-caption {
	color: #767676;
}

.wp-caption-text {
	-webkit-box-sizing: border-box;
	-moz-box-sizing:    border-box;
	box-sizing:         border-box;
	font-size: 12px;
	font-style: italic;
	line-height: 1.5;
	margin: 9px 0;
}

div.wp-caption .wp-caption-text {
	padding-right: 10px;
}

div.wp-caption.alignright img[class*="wp-image-"],
div.wp-caption.alignright .wp-caption-text {
	padding-left: 10px;
	padding-right: 0;
}

.wp-smiley {
	border: 0;
	margin-bottom: 0;
	margin-top: 0;
	padding: 0;
}


b,
strong {
	font-weight: 700;
}

cite,
dfn,
em,
i {
	font-style: italic;
}


blockquote {
	color: #767676;
	font-size: 19px;
	font-style: italic;
	font-weight: 300;
	line-height: 1.2631578947;
	margin-bottom: 24px;
}

blockquote cite,
blockquote small {
	color: #2b2b2b;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.5;
}

blockquote em,
blockquote i,
blockquote cite {
	font-style: normal;
}

blockquote strong,
blockquote b {
	font-weight: 400;
}

small {
	font-size: smaller;
}

big {
	font-size: 125%;
}

sup,
sub {
	font-size: 75%;
	height: 0;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	bottom: 1ex;
}

sub {
	top: .5ex;
}
ol {
	list-style: decimal;
}

/* Separators */

.site-content span + .entry-date:before,
.full-size-link:before,
.parent-post-link:before,
span + .byline:before,
span + .comments-link:before,
span + .edit-link:before,
.widget_twentyfourteen_ephemera .entry-title:after {
	content: "\0020\007c\0020";
}

h3.entry-title {
	clear:both;
}