@charset "utf-8";

/*-------------- 消去・編集不可 ---------------------------------------------

License: GNU General Public License
License URI: license.txt
Theme URI: https://templx.com/
Theme Name: template-x3h
Author: TEMPLX
Author URI: https://templx.com/
Description: レスポンシブウェブデザイン(Responsive Web Design)｜TEMPLX

 『こちらのテンプレートは編集、再販、譲渡を許可していますが
 購入後でも著作権は TEMPLX にあります。
 上記、著作権者やURL等の変更、消去を禁止します。』

--------------- 消去・編集不可 --------------------------------------------- */


/* 【content】 --------------- */

.subpage #wrap {
padding-bottom:50px;
}

#main {
width:840px;
float:right;
}

#main h1.title,
#main h2.title {
width:100%;
margin-bottom:50px;
text-align:center;
font-size:30px;
position:relative;
}

#main h1.title:before,
#main h2.title:before {
width:100%;
border-top:1px solid #4c4c4c;
position:absolute;
top:50%;
left:0;
content:"";
}

#main h1.title span,
#main h2.title span {
display:inline-block;
padding:0 20px;
background:#fff;
position:relative;
}

#main-single h1.title {
font-size:18px;
}

.content {
width:100%;
text-align:left;
float:left;
}

/************** category **************/

.archive-description {
width:100%;
margin-bottom:50px;
float:left;
}

#main-archive {
float:left;
}

#main-archive .content-in {
width:100%;
margin-bottom:50px;
padding-bottom:50px;
border-bottom:1px solid #4c4c4c;
float:left;
}

#main-archive h2.post-title {
width:100%;
margin-bottom:10px;
border-bottom:3px dotted #f0f0f0;
float:left;
}

.content-left {
width:30%;
float:left;
position:relative;
text-align:center;
overflow:hidden;
}

.content-right {
width:70%;
float:right;
}

.content-right-in {
width:96%;
float:right;
}

.archive-date {
width:100%;
padding-top:15px;
float:left;
}

.archive-cat {
width:50%;
text-align:left;
font-size:12px;
float:left;
}

.postdate {
width:50%;
text-align:right;
font-size:12px;
float:right;
}

.content-hover {
width:100%;
height:100%;
position:absolute;
top:0;
left:0;
z-index:5;
}

.content-hover a {
width:100%;
height:100%;
float:left;
box-sizing:border-box;
}

.content-hover a span {
width:50px;
height:50px;
background:url(images/icon4.png) no-repeat;
position:absolute;
top:0;
left:0;
}

.pagenavi {
width:100%;
padding-bottom:20px;
float:left;
}

.pagenavi .page-numb {
text-align:left;
}

.pagenavi span.current {
font-weight:bold;
}

.pagenavi .page-numbers {
height:22px;
margin-right:5px;
padding:4px 8px;
border:1px solid #f0f0f0;
text-align:center;
float:left;
border-radius:3px;
-webkit-border-radius:3px;
-moz-border-radius:3px;
}

.pagenavi .page-numbers:hover {
background:#fafafa;
border:1px solid #d3d3d3;
}

.pagenavi span.current {
background:#fafafa;
border:1px solid #4c4c4c;
}

.tag-nav {
width:100%;
margin-bottom:10px;
float:left;
}

.navidate {
margin-bottom:10px;
text-align:right;
float:right;
}

.posttags {
height:auto;
font-size:11px;
float:left;
}

.posttags p {
margin-right:5px;
margin-bottom:2px;
padding:0 5px;
border:1px solid #4c4c4c;
float:left;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
transition:0.6s;
-webkit-transition:0.6s;
-moz-transition:0.6s;
-o-transition:0.6s;
-ms-transition:0.6s;
}

.posttags p span {
width:14px;
height:14px;
margin-top:4px;
background:url(images/icon3.png) no-repeat left center;
float:left;
}

.posttags a {
padding:2px 3px 2px 2px;
float:left;
}

/************** category **************/

/************** page single **************/

#main-page,
#main-single {
width:100%;
float:left;
}

#ps-content {
width:auto;
margin:0 auto;
padding-bottom:20px;
}

#ps-content p {
margin:13px 0;
}

#ps-content h1,
#ps-content h2,
#ps-content h3,
#ps-content h4,
#ps-content h5,
#ps-content h6,
#ps-content strong,
#ps-content em {
font-weight:bold;
}

#txsingle-thumbnail {
width:100%;
height:auto;
padding-bottom:10px;
text-align:center;
float:left;
}

#txsingle-thumbnail img {
width:auto;
height:auto;
max-width:100%;
}

#ps-content img.alignnone,
#ps-content img.alignleft,
#ps-content img.aligncenter,
#ps-content img.alignright {
width:auto;
height:auto;
max-width:100%;
}

.alignleft {
display:inline;
float:left;
}

.alignright {
display:inline;
float:right;
}

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

blockquote.alignleft,
.wp-caption.alignleft,
img.alignleft {
margin:0.4em 1.6em 1.6em 0;
}

blockquote.alignright,
.wp-caption.alignright,
img.alignright {
margin:0.4em 0 1.6em 1.6em;
}

blockquote.aligncenter,
.wp-caption.aligncenter,
img.aligncenter {
clear:both;
margin-top:0.4em;
margin-bottom:1.6em;
}

.wp-caption.alignleft,
.wp-caption.alignright,
.wp-caption.aligncenter {
margin-bottom:1.2em;
}

#navidate-single {
width:100%;
margin-bottom:10px;
text-align:right;
float:left;
}

#posttags-single {
width:100%;
height:auto;
margin-bottom:15px;
font-size:11px;
float:left;
}

#posttags-single p {
margin-left:5px;
margin-bottom:2px;
padding:0 5px;
border:1px solid #4c4c4c;
float:right;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
transition:0.6s;
-webkit-transition:0.6s;
-moz-transition:0.6s;
-o-transition:0.6s;
-ms-transition:0.6s;
}

#posttags-single p span {
width:14px;
height:14px;
margin-top:4px;
background:url(images/icon3.png) no-repeat left center;
float:left;
}

#posttags-single a {
padding:2px 3px 2px 2px;
float:left;
}

#navi-out {
width:100%;
margin:50px 0 150px;
text-align:center;
float:left;
}

#navinext {
width:50%;
text-align:left;
float:left;
}

#previous {
width:50%;
text-align:right;
float:right;
}

#navinext a,
#previous a {
width:92%;
padding:10px;
border:1px solid #4c4c4c;
text-align:left;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
box-sizing:border-box;
}

#navinext a {
float:left;
}

#previous a {
float:right;
}

#navinext a:hover,
#previous a:hover {
background:#f0f0f0;
border:1px solid #d3d3d3;
}

/************** page single **************/

.h5str{
	font-size:1.5rem;
	margin:0 auto 20px;
}

.breadcrumbs {
width:100%;
height:auto;
margin-bottom:40px;
text-align:left;
float:left;
}

.breadcrumbs p {
float:left;
}

/* -------------------------------------------------------------- */


/* 【contact】 --------------- */
.toi_title{
	width:100%;
	border-bottom:1px solid #4c4c4c;
	font-size:2rem;
	margin:0px auto 40px;
	padding-bottom:20px;
}



.contact-box {
width:100%;
margin:10px 0;
float:left;
}

.contact-box p.left {
	font-size:18px;
	color:#000;
width:36%;
height:50px;
line-height:50px;
padding:0 1% ;
float:left;
}

.contact-box p.left span {
	cursor: pointer;
	font-size:14px;
  margin: 10px 0 0 10px;
  padding: 4px 6px;
  border: none;
  border-radius: 3px;
  color: #fff;
  font-weight: bold;
  background-color: #166ab5;
}

.contact-box p.right {
	width:62%;
	height:50px;
	line-height:50px;
	float:right;
}

#form-textarea {
height:180px;
}

#contact-form input[type="text"],
#contact-form input[type="email"],
#contact-form input[type="date"],
#contact-form input[type="number"],
#contact-form input[type="tel"],
#contact-form input[type="url"],
#contact-form select,
#contact-form textarea {
width:100%;
padding:10px 5px;
background:#f0f0f0;
border:1px solid #fff;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
box-sizing:border-box;
transition:0.6s;
-webkit-transition:0.6s;
-moz-transition:0.6s;
-o-transition:0.6s;
-ms-transition:0.6s;
}

#contact-form input[type="text"]:hover,
#contact-form input[type="email"]:hover,
#contact-form input[type="date"]:hover,
#contact-form input[type="number"]:hover,
#contact-form input[type="tel"]:hover,
#contact-form input[type="url"]:hover,
#contact-form select:hover,
#contact-form textarea:hover {
background:#fafafa;
border:1px solid #d3d3d3;
}

#contact-form select {
	width:60%;
		text-align:left;
}
#contact-form3{
		text-align:center;
}

#contact-form input[type="range"] {
padding:10px 5px;
background:none!important;
border:0!important;
}

#contact-form input:placeholder-shown {
color:#cdcdcd;
}

#contact-form input::-moz-input-placeholder {
color:#cdcdcd;
}

#contact-form input::-webkit-input-placeholder {
color:#cdcdcd;
}

#contact-form input:-ms-input-placeholder {
color:#cdcdcd;
}
#contact-form p {
	font-size:1.3rem;
	text-align:left;
	margin:20px auto 50px;
}
#contact-form3 p {
	font-size:1.3rem;
	text-align:center;
	margin:20px auto 50px;
}

.contact-but {
width:100%;
margin-top:20px;
text-align:center;
}

.contact-form-but {
width:100%;
text-align:center;

}

.contact-but button,
.contact-but input[type="button"],
.contact-form-but input[type="button"] {
	width:260px;
	margin:10px auto 2px;
	text-align:center;
	padding:16px 0;
  background-color: #166ab5;
border:1px solid #4c4c4c;
font-size:16px;
font-weight:bold;
color:#fff;
cursor:pointer;
outline:none;
border-radius:3px;
-webkit-border-radius:8px;
-moz-border-radius:8px;
transition:0.6s;
-webkit-transition:0.6s;
-moz-transition:0.6s;
-o-transition:0.6s;
-ms-transition:0.6s;
}

.contact-but button:hover,
.contact-but input[type="button"]:hover,
.contact-form-but input[type="button"]:hover {
background:#4c4c4c;
border:1px solid #d3d3d3;
color:#fff;
}

.contact-but p.top {
width:100%;
margin-bottom:20px;
text-align:center;
float:left;
}

.contact-but p.left,
.contact-but p.right {
width:50%;
text-align:center;
float:left;
}

p.form-error {
margin:10px 0;
color:red;
}

/* -------------------------------------------------------------- */


/* 【company】 --------------- */

.company {
width:100%;
text-align:center;
float:left;
}

table.returned {
width:100%;
text-align:center;
border-collapse:collapse;
float:left;
}

table.returned-in {
width:100%;
margin:0 auto;
border-collapse:collapse;
}

table.returned-in tr,
table.returned-in td {
vertical-align:middle!important;
}

.returned td.returned-left {
width:32%;
height:80px;
padding:10px 0;
text-align:center;
border-bottom:1px solid #4c4c4c;
font-weight:bold;
}

.returned td.returned-right {
width:65%;
height:auto;
padding:10px 0 10px 3%;
border-bottom:1px solid #4c4c4c;
text-align:left;
}

/* -------------------------------------------------------------- */


/**************************************************
***************************************************
横幅1200px以下
***************************************************
**************************************************/

@media screen and (max-width:1200px) {

#wrap-sub-in,
#main {
width:100%;
}
.contact-box th {
		margin:10px 0;
}
.contact-box2 {
		margin-top:180px;
}
.subpage #wrap {
padding:20px 0;
}

.contact-box p.left {
width:98%;
height:auto;
line-height:normal;
margin-bottom:5px;
padding:5px 1%;
}

.contact-box p.right {
width:100%;
height:auto;
margin-bottom:20px;
line-height:normal;
}

.contact-but p.left,
.contact-but p.right {
width:100%;
}

}

/**************************************************
***************************************************
800px以下の場合
***************************************************
**************************************************/

@media screen and (max-width:800px){

#wrap-sub {
padding:40px 0 20px;
}

.txcategory-thumbnail img,
.txcategory-noimage img {
width:100%;
height:auto;
}

.archive-cat,
.postdate {
width:100%;
}

}