/*
Theme Name: koyo_theme
*/


@charset "utf-8";

div,p,li,header,footer{
	box-sizing: border-box;
	}
img{
	border : 0px;
	vertical-align: bottom;
	}

/* リンク */
a:link { color: #1a1a1a; text-decoration : none;} 
a:visited { color: #1a1a1a; text-decoration : none;} 
a:hover { color: #1a1a1a; text-decoration : none;} 
a:active { color: #1a1a1a; text-decoration : none;} 
a:focus{ outline:none;}

.ce{
	text-align : center;
	}
.rr{
	text-align : right;
	}
.ll{
	text-align : left;
	}

p:empty:before {
    content: initial!important;
	}
	
sup{
	vertical-align: baseline;
	position:relative;
	top:-2px
	}

form{
	margin : 0;
	}
input,select,button{
	margin : 0 0 10px 0;
	}
table{
	line-height : 1.8em;
	text-align: left;
	border-collapse: collapse;
	width: 100%;
	}
.nowrap{
	white-space : nowrap;
	}
ul,ol,li,dl,dt,dd,td,tr{
	margin : 0;
	padding : 0;
	list-style: none;
	}



body{
	margin : 0 auto;
	padding : 0;
	font-size : 18px;
	color : #000;
	font-family: 'Noto Sans JP', sans-serif , "Hiragino Kaku Gothic Pro","ヒラギノ角ゴシック Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	line-height: 2.4;
	}

header{
	padding: 10px 0 15px 0;
	background: #000;
	color: #fff;
	line-height: 1;
	}
header .content{
	width: 1200px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: top;
	}
header h1{
	margin: 5px 0 10px 0;
	line-height: 0;
	font-size: 12px;
	font-weight: normal;
	}
header h2{
	font-size: 30px;
	margin: 0;
	}
header h2 span{
	font-size: 20px;
	margin: 0 5px 0 0;
	}
header .tel p:first-child{
	background: url('/img/tel.png') no-repeat left 4px;
	background-size: 20px;
	font-size: 28px;
	font-weight: bold;
	padding: 0 0 0 22px;
	text-align: right;
	margin: 0;
	line-height: 1.1;
	}
header .tel p:last-child{
	font-size: 12px;
	font-weight: normal;
	display: block;
	margin: 0;
	text-align: right;
	}
footer{
	border-top: solid 1px #d6d6d6;
	font-size: 14px;
	text-align: center;
	padding: 10px 0;
	}
	
#fix_tel{
	display: none;
	}


#kv{
	width: 1200px;
	margin: 50px auto;
	position: relative;
	text-align: center;
	}
#kv h1{
	font-size: 36px;
	position: absolute;
	margin: 0;
	top: 42%;
	left: 50%;
	transform: translate(-50%,-50%);
	color: #fff;
	}
#kv h2{
	font-size: 60px;
	position: absolute;
	margin: 0;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	color: #fff;
	}
#kv h2 span{
	font-size: 46px;
	margin: 0 10px 0 0;
	}





section{
	padding: 40px 0 120px 0;
	}
section .content{
	width: 950px;
	margin: 0 auto;
	position: relative;
	}
section h3{
	font-size: 48px;
	border-bottom: solid 1px #000;
	line-height: 1.4;
	}
section h4{
	margin: 0;
	line-height: 1;
	font-size: 90px;
	color: #e5e5e5;
	position: absolute;
	transform: rotate(90deg);
	transform-origin:left bottom;
	top: 0;
	}
section .content .wrapper{
	padding: 0 0 0 150px;
	}

section#company{
	background: url('/img/bg01.png') no-repeat right top;
	}
section#company table{
	width: 100%;
	}
section#company table th{
	font-weight: bold;
	text-align: left;
	vertical-align: top;
	width: 100px;
	padding: 0 0 20px 0;
	}
section#company table td{
	text-align: left;
	vertical-align: top;
	padding: 0 0 20px 0;
	}
	
section#service{
	background: #f1f1f1 url('/img/bg02.png') no-repeat left top;
	}
	
section#recruit{
	background: url('/img/bg03.png') no-repeat right 60px bottom;
	}
section#recruit .text{
	font-weight: bold;
	font-size: 28px;
	line-height: 1.4;
	}
	
section#client{
	background: #f1f1f1 url('/img/bg04.png') no-repeat left top -1300px;
	}
section#client li{
	padding: 0 0 15px 0;
	margin: 0 0 15px 0;
	border-bottom: solid 1px #d6d6d6;
	}
	
section#contact{
	background: url('/img/bg05.png') no-repeat right bottom;
	padding: 0 0 300px 0;
	}





/********************************************************************************************************************************************************************************/
@media screen and (min-width: 950px) {
/********************************************************************************************************************************************************************************/

a[href^="tel:"] { pointer-events: none; color:#000;}












/********************************************************************************************************************************************************************************/
}
@media screen and (max-width: 949px) {
/********************************************************************************************************************************************************************************/


	.pc{
		display : none;
		}

img{
	max-width: 100%;
	}

body{
	font-size : 14px;
	}

header{
	padding: 10px;
	}
header img{
	width: 40%;
	}






header{
	padding: 5px 10px;
	}
header .content{
	width: 100%;
	display: block;
	}
header h1{
	margin: 0;
	line-height: 1.4;
	font-size: 10px;
	}
header h2{
	font-size: 20px;
	}
header h2 span{
	font-size: 16px;
	}
header .tel{
	display: none;
	}

footer{
	font-size: 10px;
	padding: 5px 0;
	margin: 0 0 35px 0;
	}
	
#fix_tel{
	display: block;
	position: fixed;
	bottom: 0;
	background: #000;
	width: 100%;
	}
#fix_tel a{
	display: block;
	color: #fff;
	text-align: center;
	}
#fix_tel a span{
	background: url('/img/tel.png') no-repeat left 8px;
	background-size: 16px;
	padding: 10px 0 10px 20px;
	}












#kv{
	width: 100%;
	padding: 0 10px;
	}
#kv h1{
	font-size: 20px;
	}
#kv h2{
	font-size: 28px;
	top: 55%;
	white-space: nowrap;
	}
#kv h2 span{
	font-size: 20px;
	}


section{
	padding: 40px 0 60px 0;
	}
section .content{
	width: 100%;
	padding: 0 10px;
	}
section h3{
	font-size: 24px;
	text-shadow    : 
       2px  2px 1px #fff,
      -2px  2px 1px #fff,
       2px -2px 1px #fff,
      -2px -2px 1px #fff,
       2px  0px 1px #fff,
       0px  2px 1px #fff,
      -2px  0px 1px #fff,
       0px -2px 1px #fff; 
	}
section h4{
	font-size: 40px;
	top: 10px;
	}
section .content .wrapper{
	padding: 0 0 0 50px;
	}



section#company table th{
	width: 70px;
	}



section#company{
	background-size: 70px;
	}
section#service{
	background-size: 40px;
	}
section#recruit{
	background: url('/img/bg03.png') no-repeat right 20px bottom;
	background-size: 30px;
	}
section#recruit .text{
	font-size: 22px;
	}

section#client{
	background: #f1f1f1 url('/img/bg04.png') no-repeat left top -200px;
	background-size: 50px;
	}

section#contact{
	background-size: 150px;
	padding: 0 0 200px 0;
	}









/********************************************************************************************************************************************************************************/
}
/********************************************************************************************************************************************************************************/



