@charset "utf-8";
/* CSS Document */

.width100{/*PCとSPの違いがわかるように*/
	width:100%;
	background:#ff0000;
	padding:10px;
	color:#000000;
	}
.senbiki640{
	min-width:640px;
	background:#00ff00;
	margin:0 auto;
	}


html{
	height: 100%;
	margin: 0;
	padding: 0;
	}

body{
	height: 100%;
	margin:0 auto;
	padding:0;
	font: 24px/1.6 "Hiragino Kaku Gothic Pro",Osaka,"メイリオ","ＭＳ Ｐゴシック","MS PGothic",Verdana,Arial,sans-serif;
	font-size:1em;
	color: #313131;
	}

img{
	outline:none;
	border-style:none;
	}

a{
	color:blue;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
	}
a:visited{
	color:blue;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
	}
a:hover {
	color: #F5A862;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;
	}

/*****全体の幅制御*****/

.all,
header,
nav,
footer,
.page-title,
#mainwrap{
	max-width:960px;
	margin:0 auto;
	}


/*****HEADER*****/
header{
	display: block;
	width:560px;	/*横幅指定*/
	width:auto;	/*横幅指定*/
	margin-left: 20%;
	overflow: hidden;
	margin:0 auto;
	/*border:1px solid #ff0000; 最終的に削除する行■■■■■■■■■■■■■■■■■■■■■■■■■■ */
	}
header h1{
	font-size:120%;	/*フォントサイズの調整*/
	color:#313131;	/*文字色の変更*/
	padding-top: 20px;	/*文字上部に余白*/
	padding-bottom: 20px;	/*文字下部に余白*/
	padding-left: 20px;	/*文字左側に余白*/
	padding-right: 20px;	/*文字右側に余白*/
	margin-top: 20px;	/*ロゴ上部に余白*/
	margin-bottom: 20px;	/*ロゴ下部に余白*/
	letter-spacing: 3px;	/*文字と文字の間隔をあける*/
	font-weight:400;	/*文字の太さの変更*/
	text-align:center;
	
}
header h1 a{
	display:block;
	width:80%;
	height:220px;
	max-height:100%;
	background:url(../images/logo.png)no-repeat;
	background-size:100%;
	margin:0 auto;
	text-indent:-9999px;
	}



header p{
	font-size:100%;
	color:#313131;
	float: left;
}


/*****BRANDING*****/
#branding{
	width:560px;	/*横幅指定*/
	width:auto;	/*横幅指定*/
	margin-left: 20%; /*左端から20%右側に動かす*/
	background-color: #313131; /*背景色の指定*/
	margin-bottom: 20px;
	overflow: hidden; /*おまじない*/
	margin:0 auto;
}
#branding p{
	color: #fff; /*文字色の変更*/
	font-size: 120%; /*フォントサイズの調整*/
	letter-spacing: 10px; /*文字と文字の間隔をあける*/
	line-height: 300px; /*行間の指定（ブランディングの高さを決める）*/
	padding-left: 3%; /*文字の左側に余白をあける*/
}

/*****NAV*****/
nav{
	width:100% ;	/*横幅の指定*/
	border-top: none;	/*上部の線の色を指定*/
	border-bottom: none;	/*下部の線の色を指定*/
	overflow: hidden;	/*おまじない*/
	margin:0 auto 5px;
	/*border:1px solid #ff0000; 最終的に削除する行■■■■■■■■■■■■■■■■■■■■■■■■■■ */
	}
nav ul{
	width:100% ;	/*横幅の指定*/
	margin: auto;	/*中央に配置する*/
	list-style: none; /*リストのスタイルを削除*/
}
nav li{
	width: calc(100% / 2);	/*横幅の指定*/
	border-left: none;	/*線を描く*/
	box-sizing: border-box; /*線の幅をliの横幅に含める*/
	float: left;	/*左から並べる*/
	position:relative;
}
nav li a{
	display:block;
	height:240px;
	/*border:1px solid #ff0000; 最終的に削除する行■■■■■■■■■■■■■■■■■■■■■■■■■■ */
	}
nav li a.businessin{background:url(../images/nav_kigyou_bg280.jpg) no-repeat;
	background-size:100%;}
nav li a.words{background:url(../images/nav_words_bg.jpg) no-repeat;
	background-size:100%;}
nav li a.company{background:url(../images/nav_company_bg.jpg) no-repeat;
	background-size:100%;}
nav li a.access{background:url(../images/nav_access_bg.jpg) no-repeat;
	background-size:100%;}
nav li a.contact{background:url(../images/nav_contact_bg.jpg) no-repeat;
	background-size:100%;}

nav li a span{
	width:100%;
	position:absolute;
	bottom:0px;
	text-align:center;
	font-size:27px;
	}


nav li a.businessin span{background-color:rgba(147,124,44,0.5);}
nav li a.words span{background-color:rgba(147,124,44,0.5);}
nav li a.company span{background-color:rgba(0,104,183,0.5);}
nav li a.access span{background-color:rgba(196,52,52,0.5);}
nav li a.contact span{background-color:rgba(106,159,123,0.5);}

nav li a:visited{
	color:#ffffff;
	}

nav div{
	width:560px;
	margin:0 auto;
	}

div a.business{
	display:block;
	width:100%;	/*横幅の指定*/
	height:400px;
	background:url(../images/nav_kigyou_bg.jpg) no-repeat;
	background-size:100%;
	border-left: none;	/*線を描く*/
	box-sizing: border-box; /*線の幅をliの横幅に含める*/
	text-align: center;	/*文字を中央に*/
	position:relative;
}
div a.business span{
	position:absolute;
	top:160px;
	right:120px;
	font-size:42px;
	font-weight:bold;
	}
div a.business,
nav div a.business:visited{
	color:#ffffff;
	}

nav li:last-child{
	border-right: none;	/*li要素の最後の物は右側に線を描く*/
}
nav a{
	display: block;	/*1つのli全体にリンクを有効にする*/
	text-decoration: none;	/*ブラウザ標準のリンク装飾をオフに*/
	color:#313131;	/*文字色の変更*/
	font-size: 110%;	/*フォントサイズの指定*/
	letter-spacing: 5px;	/*文字と文字の間隔をあける*/
	font-weight: 400;	/*文字の太さを調整*/
	line-height: 45px;	/*行間の指定（ナビボタンの高さ指定）*/
}
nav a:hover{
	background-color: orange;	/*背景色の指定*/
	color: #fff;	/*文字色の変更*/
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;	/*ホバー時の動きをなめらかにする*/
}

/*****ARTICLE*****/
section{
	display: block;
	overflow: hidden;
}
article{
	width: calc(50% - 15px);	/*横幅の指定*/
	padding: 2.5%;	/*余白の指定*/
	margin-bottom: 30px;
	/*background-color: #f9f9f9;	背景色の指定*/
	overflow: hidden;	/*おまじない*/
	float: left;	/*フロートする*/
}
article:nth-child(2n){
	margin-left: 30px; /*2の倍数の記事は左側に余白を30px*/
}
article .date{
	font-size: 60%;	/*文字サイズの指定*/
	color: orange;	/*文字色の指定*/
	border: 1px solid orange;	/*線を描く*/
	padding-top:3px;	/*文字上部の余白指定*/
	padding-bottom: 3px;	/*文字下部の余白指定*/
	padding-right: 6px;	/*文字右側の余白指定*/
	padding-left: 6px;	/*文字左側の余白指定*/
	letter-spacing: 5px;	/*文字と文字の間隔をあける*/
	float: left;	/*フロートする*/
}
article h1{
	width: 100%;	/*横幅の指定*/
	font-size: 150%;	/*フォントサイズの指定*/
	color: #313131;	/*文字色の変更*/
	letter-spacing: 3px;	/*文字と文字の間隔をあける*/
	padding-bottom:2px;	/*文字下部の余白指定*/
	padding-top: 10px; /*文字上部の余白指定*/
	border-bottom: 1px solid #bababa;	/*文字の下部に線を描く*/
	margin-bottom: 15px;	/*セクションタイトルの下に余白をつくる*/
	float: left;	/*フロートする*/
}
article p{
	font-size: 100%;	/*フォントサイズの指定*/
	color: #313131;	/*文字色の変更*/
	letter-spacing: 3px;	/*文字と文字の間隔をあける*/
	line-height: 200%;	/*行間をあける*/
	margin-bottom: 10px;	/*文字とボタンの間をあける*/
	float: left;	/*フロートする*/
}
article .btn{
	color: #fff;	/*文字色の変更*/
	border: 1px solid orange;	/*線を描く（ホバー時のずれを防ぐため）*/
	background-color: orange;	/*背景色の指定*/
	padding-top: 10px;	/*文字上部の余白を指定*/
	padding-bottom: 10px;	/*文字下部の余白を指定*/
	padding-right: 30px;	/*文字右側の余白を指定*/
	padding-left: 30px;	/*文字左側の余白を指定*/
	border-radius: 5px;	/*線の角を丸くする*/
	letter-spacing: 5px;	/*文字と文字の間隔をあける*/
	text-decoration: none;	/*ブラウザ標準のリンク装飾をオフに*/
	overflow: hidden;	/*おまじない*/
	float: right;	/*フロートする*/
}
article .btn:hover{
	background-color: #fff;	/*背景色の指定*/
	border: 1px solid orange;	/*線を描く*/
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	transition: all 0.5s;	/*ホバー時の変化をなめらかに*/
	color: orange;	/*文字色の指定*/
	overflow: hidden;	/*おまじない*/
}

#mainwrap{
	padding:20px;
	}

.page-title{
	height: auto;
	box-shadow: none;
    border-bottom: 1px solid #e3e3e3;
    background: #fff;
    position: relative;
	}

.page-title h1{
	background: #f2f2f2;
	margin:0 0 20px 0;
	padding: 20px 0px 17px 20px;
    font-size: 24px;
    margin-bottom: 0;
	}

div#mainwrap .twocol-wrap {
    width: 100%;
    margin: 0 auto;
    padding: 10px;
    border: 1px solid #cecece;
    border-radius: 2px;
    background: rgba(246,250,250,0.5);
    box-shadow: inset 0px 1px 0px rgba(255,255,255,0.8);
    }

.twocol-wrap p,
.uni-wrap-marg p,
.uni-wrap p {
    line-height: 2.2em;
    font-size: 1em;
    margin-bottom: 15px;
	}
h2.normal {
    font-size: 24px;
    margin-bottom: 0px;
    height: 47px;
    line-height: 1em;
    }

ul.normal li {
    padding: 2px 0 3px 20px;
    list-style: square;
    background: url(../images/blet.dot.png) 5px 8px no-repeat;
	}

.twocol-wrap section{
	padding:20px 0;
	}

.twocol-wrap dl dt {
    float: left;
    clear: both;
	}
.twocol-wrap dl dd {
    margin: 0 0 10px 180px;
    }

dd {
    display: block;
    margin-inline-start: 40px;
	}

ul.businessin li{list-style:none;}

ul.businessin li{
	padding:50px 0 50px 120px;
	}

ul.businessin li.bus01{
	background:url(../images/business_pic01.jpg) no-repeat left;

	}

ul.businessin li.bus02{
	background:url(../images/business_pic02.jpg) no-repeat left;
	}

input[type="submit"],
input[type="text"],
input[type="password"],
input[type="email"],
input[type="button"],
textarea{
	width:100%;
    height: 50px;
    padding: 0;
    text-indent: 10px;
    border: 2px solid #cecece;
    }

form dl dd.comment textarea {
    height: 120px;
	}

form button.btn{
	width:100%;
    height: 70px;
	padding:10px;
	color: #fff;
	font-weight: bold;
	background: #94c325;
	text-indent: 10px;
    border: 2px solid #cecece;
    }

form .privacy ul,
form .privacy ol{
	}

form .privacy ul li,
form .privacy ol li{
	margin-left:30px;
	padding: 2px 0 3px 0px;
	background:none;
	}

.form dl dt{
	float: none;
    clear: both;
    display:block;
    background: #f2f2f2;
    border: 1px solid #cecece;
    margin: 10px 0;
    padding: 5px 10px;
	}

.form dl dd{
	margin: 0 0 0 0px;
	margin-inline-start: 0px;
	}

footer{
	font-size: 100%;	/*フォントサイズの指定*/
	width: 100%;	/*横幅指定*/
	margin:0 auto;
	text-align: center;	/*文字の中央寄せ*/
	padding-top: 10px;	/*文字上部の余白指定*/
	padding-bottom: 10px;	/*文字下部の余白指定*/
	background-color: #ffffff;	/*背景色の指定*/
}
footer address{
	margin-top:20px;
	color: #000;	/*文字色の指定*/
	letter-spacing: 3px;	/*文字と文字の間隔をあける*/
	font-style: normal; /*文字の斜体を取り消す*/
}

footer div.{
	width:560px;
	}

footer div.left{
	float:left;
	width:270px;
	background:#ff0000;
	}

footer div.right{
	float:right;
	width:270px;
	background:#ff0000;
	}

/*****COMMON*****/

.none{
	display:none;
	}

.footcompany{
	font-size:21px;
	}

.footmenu{
	font-size:21px;
	}

.footmenu ul{
	padding: 0.5em 1em 0.5em 2.3em;
	position: relative;
	}

.footmenu ul li {
	text-align:left;
	line-height: 1.1;
	padding: 0.5em 0;
	list-style-type: square;
	}
/*
.footmenu ul li:before {
  font-family: "Font Awesome 5 Free";
  content: "\f138";　アイコンの種類
  position: absolute;
  left : 1em;　左端からのアイコンまでの距離
  color: skyblue;　アイコン色*/
	}
*/