﻿@charset "UTF-8";

@media screen and (max-width: 1300px) {
	/* 会社概要のテーブルレスポンシブ */
    .kigyojoho table {
    	width: 100%;
    }

  	.kigyojoho table td::before,
  	.kigyojoho table td::after {
	    display: none;
	}

	.gaiyou-img{
		width: 100%;
		margin: 0;
		float: none;
	}

	.gaiyou-img img{
		max-width: 250px;
	}

	.right-table{
		width: 100%;
		float: none;
		padding: 0 10px 10px;
	}
}

/*------------------ タブレット向け -------------------*/
@media only screen and (max-width: 1199px){
/* スライド */
	.slider {
		width: 100%;
	}

	.slick-slide{
		width: 100%;
	}

	.slick-arrow,
	.slick-arrow:hover,
	.slick-arrow:focus{
		width: 5%;
		min-width: 50px;
		background-color: transparent;
		/* left: 0; */
	}

	.slick-prev{
		left: 0;
	}

	.slick-next{
		right: 0;
	}

	.slick-prev ::before{
		width: 100%;
		left: 30px;
	}

	.slick-next ::after{
		width: 100%;
		right: 30px;
	}

	/* ページトップボタンの位置 */
	footer #page-top {
		right: 20px;
	}

}

@media only screen and (max-width: 1020px){
	 .detail {
		height: 100%;
	}


	/* 右カラム */
	div.right{
		width: 100%;
		float: left;
	}

	div.right .contents:first-child{
	    margin-top: 0;
	}

	div.right .contents ul li,
	div.right .contents ul li{
		width: calc(100% / 2 - 3px);
	}

	/* ラッパー */
	#wrapper .left-wrap{
		width: 100%;
		float: left;
	}

	div.left{
		width: 20%;
		float: left;
	}

	div#main{
		width: 75%;
		float: right;
	}

	div.left{
		width: 25%;
		float: left;
	}

	div#main{
		width: 100%;
		float: right;
	}
}

/* ヘッダーナビ二段になるところのためのコード */
@media only screen and (max-width: 1159px){
	header nav ul li a{
		padding: 30px 5px;
	}

	header nav ul li:nth-child(7) a{
		padding: 8px 5px;
	}

	header nav ul li:nth-child(5) a{
		padding: 20px 5px;
	}
}

@media only screen and (max-width: 1039px){
	header nav ul li a{
		padding: 40px 5px;
		max-height: 98px;
	}

	header nav ul li:nth-child(5) a{
		padding: 5px;
	}

	header nav ul li:nth-child(7) a{
		padding: 15px 5px;
	}
}

@media only screen and (max-width: 830px){
	/* ラッパー */
	#wrapper{
		padding: 0;
	}

	#wrapper /* .left-wrap */,
	.right{
		width: 100%;
		float: none;
	}

	/* ヘッダー */
	header nav{
		background: none;
		box-shadow: none;
		font-size: 0;
	}

	header nav .toggle{
		display: block;
		position: relative;
		height: 40px;
		background: #0b409c;
	}

	header nav .toggle p{
		display: inline-block;
		position: absolute;
		right: -40px;
		top: 0;
		bottom: 0;
		left: 0;
		margin: auto;
		width: 65px;
		color: #fff;
		height: 1.5em;
		font-size: 16px;
	}

	header nav .toggle span{
		display: inline-block;
		background: #fff;
		padding: 0;
		height: 5px;
		font-weight: bold;
		width: 30px;
		color: #000;
		position: absolute;
		top: 0;
		left: -70px;
		right: 0;
		bottom: 0;
		margin: auto;
	}

	header nav .toggle span:before,
	header nav .toggle span:after{
		content: "";
		position: absolute;
		display: inline-block;
		background: #fff;
		width: 30px;
		height: 5px;
		color: #000;
	}

	header nav .toggle span:before{
		top: 10px;
		left: 0;
		right: 0;
		margin:0 auto;
	}

	header nav .toggle span:after{
		bottom: 10px;
		left: 0;
		right: 0;
		margin:0 auto;
	}

	header nav .toggle + * {
		display:none;
	}

	header nav ul{
		width: 100%;
		margin: 0 auto;
		box-shadow: 0 0 5px #aaa;
		display: none;
	}

	header nav ul li{
		display: inline-block;
		list-style-type: none;
		width: 100%;
		background: #fff;
		text-align: center;
		vertical-align: middle;
		padding: 0;
		border-bottom: 1px solid #ccc;
	}

	header nav ul li:first-child{
		border-bottom: 1px solid #ccc;
	}

	header nav ul li:last-child{
		border-bottom: 2px solid #0b409c;
	}

	header nav ul li a,
	header nav ul li:nth-child(5) a,
	header nav ul li:nth-child(7) a{
		border-left: none;
		width: 100%;
		font-size: 15px;
		color: #000;
		font-weight: bold;
		height: 100%;
		padding: 8px 5px;
	}

	header nav ul li:nth-child(5) a.nowpage,
	header nav ul li:nth-child(7) a.nowpage{
		color: #fff;
	}

	header nav ul li:nth-child(5) a br,
	header nav ul li:nth-child(7) a br{
		display: none;
	}

	/* メインカラム */
	div#main{
		padding: 20px 10px;
	}

	.contents{
		margin: 10px 0;
	}

	div.right {
    	padding: 0 10px;
	}

	div.left .contents:first-child a,
	nav .toggle{
		font-size: 15px;
		font-weight: bold;
		color: #000;
	}

	nav .contents.toggle{
		margin: 0;
	}

	.pankuzu{
		margin: 10px auto 10px;
	}

	footer ul li{
		/* display: block; */
		list-style-type: none;
		text-align: center;
	}

	footer ul li a{
		margin: 0 15px 0 10px;
	}

/* トップページ記事類 */
	.saishinkiji dl dd{
		font-size: 14px;
		line-height: 1.8em;
		margin: 5px 0 15px;
	}

	.saikintopics ul li span {
		width: 100%;
	}
	.saikintopics ul li p {
		width: 100%;
		float: none;
		padding-left: 0;
	}
}

@media only screen and (max-width: 650px){
}

@media screen and (max-width: 716px) {
	/* トップに戻るボタン */
	footer #page-top{
		right: 10px;
		width: 43px;
	}

	footer #page-top a{
		padding: 16px 10px;
		width: 40px;
	}
}

@media screen and (max-width: 600px) {
	/* テーブルレスポンシブ1 */
	.table-type01 thead,
	.adpaper thead {
		display: none;
	}

	.table-type01 tr {
		border-bottom: 15px solid #fff;
		display: block;
	}
	.table-type01 td {
		border-bottom: 1px solid #fff;
		display: flex;
		padding:0px;
		width:100%;
	}

	.table-type01 td:last-child{
		border-bottom: 1px solid #0b409c;
	}

	.table-type01 td div{
		width:100%;
		padding: 5px;
	}

	.table-type01 td::before {
		content: attr(aria-label);
		background-color: #0b409c;
		display:block;
		float:left;
		width:20%;
		min-width: 80px;
		color:#fff;
		padding: 5px;
		font-weight: bold;
	}

	/*採用ページ*/
	.saiyou table tr th,
	.saiyou table tr td {
	    width: 100%;
	    display: block;
	}

		.saiyou table tr td {
	    padding-top: 0;
	}

	/* 記事付きの消えるtd */
	.table-type01 td.res-td{
		display: flex;
	}

	/* 記事付きの増減ボタン関係 */
	.table-type01 td div .spinner_area {
	    width: 85px;
	    padding: 0;
	}

	/* テーブルレスポンシブ2 */
	.table-type02 tr{
		border-bottom: 0;
	}

	.table-type02 th,
    .table-type02 td{
	    width: 100%;
	    display: block;
	    border-top: none;
    }

/* 右サイドメニューの並び変わる */
	.kakonotopics ul li,
	.tokusyurensai ul li {
	    list-style: none;
	    padding: 5px 0;
	    display: block;
	    border-left:none;
	    width: 100%;
	}

	div.right .contents ul li,
	div.right .contents ul li {
	    width: 100%;
	}

	.contact-item input,
	.contact-item select{
		width: 100%;
	}

	.contact-item input[type="checkbox"]{
		width: auto;
	}

	/* カスタム検索レスポンシブ */
	.l-c-wrap {
		width: 90%;
	}

	.l-c-wrap .calender{
		font-size: 14px;
	}

	.news_text{
		width: 100%;
	}

	.news_text p{
		text-align: left;
			font-size: 12px;
	}

	.res-search-wrap,
	.res-search-wrap .searchbox,
	.res-search-wrap .searchbox input{
		width: 100%;
	}

	.search-wrap,
	.searchbox label{
		display: none;
	}

	.res-search-wrap{
		display: block;
		position: relative;
	}

	.res-search-wrap .res-search-btn{
		display: block;
		background: #aaa;
		padding: 5px;
		float: right;
		position: absolute;
		top: -40px;
		right: 0;
	}

	.res-search-wrap .res-search-btn img{
		width: 25px;
		vertical-align: middle;
	}

	/* 過去記事一覧の青ボタン */
	.prenex-wrap {
		float: none;
		text-align: center;
	}

	.prenex-wrap .blue-btn{
		width: 49%;
		padding: 7px;
	}
}

@media screen and (max-width: 479px) {
	/* 社長ポートレート */
	.aisatu .syatyo,
	.hajimeni .syatyo {
	    float: none;
	    margin: 0 auto 20px;
	}

	/* 震災復興記事の画像 */
	.image-left-top {
		width: 100%;
	    float: none;
	    margin-right: 0;
	    text-align: center;
	}

	.image-left-top img{
		width: 100%;
	}
}

