@charset "utf-8";
/* ===================================================================

 file name  :responsive.css
 style info :共通のレスポンシブスタイル指定（ストラクチャ、ヘッダー、フッター）

=================================================================== */

/* ==========================================================================
   smartPhone
   ========================================================================== */
@media screen and (max-width: 640px){


	/* ---------------------------------------------------------------------------
	
			structure
				ストラクチャ：基本設定、リンクカラーなど
	
	--------------------------------------------------------------------------- */
	body {
		font-family:"FOT-筑紫ゴシック Pr5 R";
	}

img{
	width:100%;
	height:auto;
}




	/* ---------------------------------------------------------------------------
			#wrapper
				全体
	--------------------------------------------------------------------------- */
	#wrapper {
		padding:0 !important;
		min-width:100%;
		overflow:hidden;
	}

	
	/* ---------------------------------------------------------------------------
			#header	
				ヘッダー
	--------------------------------------------------------------------------- */
	#header {
		padding:12px 0 0;
		z-index:99999;
		position:absolute;
	}
	#header.fixed{
		min-width:100%;
		position:relative;
		margin:0;
		top:auto !important;
		left:auto;
	}
	#logo {
		width:113px;
		margin:0 0 10px;
		padding:0 0 0 15px;
		float:none;
	}
	#header.fixed #logo {
		margin:0 0 10px;
		padding:0 0 0 15px;
	}
	
	#header .navs {
		display:none;
		position:absolute;
		width:100%;
		background:#fff;
	}
	#header.fixed #logo img{
		width:100%;
	}
	
	#header .sns{
		position:absolute;
		top:18%;
		right:18%;
	}
	
	#header .sns li{
		float:left;
	}
	
	#header .sns .facebook{
		margin-right:10px;
	}

	.dialogIsOpen #header .navs {
		display:block;
	}
	#gnav {
		width:100%;
		float:none;
		margin:0;
		border:none;
	}
	#gnav > ul {
		overflow:hidden;
		font-size:109%;
	}
	#gnav > ul > li {
		width:100%;
		float:none;
		border-top:solid 1px #ccc;
	}
	#gnav > ul > li > a{
		font-family: "FOT-筑紫ゴシック Pro E";
	}
	#gnav > ul > li > a {
		height:auto;
		padding:0 15px;
		border-left:none;
		line-height:4;
		position:relative;
	}
	
	#gnav > ul > li > a:after {
		content:"";
		display:block;
		width:8px !important;
		height:8px !important;
		border-top:solid 2px #9f9f9f;
		border-right:solid 2px #9f9f9f;
		position:absolute;
		top:50%;
		right:19px;
		margin:-4px 0 0;
		-webkit-transform:rotate(45deg);
		transform:rotate(45deg) !important;
		-webkit-transition:all ease 0.3s;
		-moz-transition:all ease 0.3s;
		transition:all ease 0.3s;
		opacity:1;
	}
	
	#gnav > ul > li.open > a:after {
		-webkit-transform:rotate(135deg) !important;
		transform:rotate(135deg) !important;
	}
	#gnav > ul > li:hover > a:after {
		-webkit-transform:rotate(45deg);
		transform:rotate(45deg);
		right:19px;
		margin:-4px 0 0;
	}
	
	#gnav > ul > li > a span:before,
	#gnav > ul > li > a span:after {
		content: none;
	}
	
	#gnav > ul > li > .dropDown {
		width:100%;
		min-width:100%;
		background:#f2f2f2;
		position:static;
		border-top:none;
		max-height:100%;
	}
	#gnav > ul > li:hover .dropDown  {
		max-height:100%;
	}
	#gnav > ul > li > .dropDown dl {
		padding:0;
		max-width:100%;
		min-width:100%;
		max-height:0;
		-webkit-transition:all ease 0.3s;
		-moz-transition:all ease 0.3s;
		transition:all ease 0.3s;
	}
	#gnav > ul > li.open > .dropDown dl {
		max-height:800px;
	}
	#gnav > ul > li > .dropDown dl dt {
		display:none;
		padding:0;
	}
	#gnav > ul > li > .dropDown dl dd {
		width:100%;
		float:none;
		border-left:none;
	}
	
	/* 日本エスコンについて */
	#gnav > ul > li > .dropDown dl dd ul.img-type {
		width:100%;
		float:none;
		border-left:none;
	}
	#gnav > ul > li > .dropDown dl dd ul.img-type li {
		width:100%;
		float:none;
		margin:0;
		border-top:solid 1px #ccc;
	}
	#gnav > ul > li > .dropDown dl dd ul.img-type li a {
		display:block;
		line-height:1.5;
		padding:1.2em 27px;
	}
	#gnav > ul > li > .dropDown dl dd ul.img-type li:nth-child(1),
	#gnav > ul > li > .dropDown dl dd ul.img-type li:nth-child(2),
	#gnav > ul > li > .dropDown dl dd ul.img-type li:nth-child(3),
	#gnav > ul > li > .dropDown dl dd ul.img-type li:nth-child(4){
		margin-bottom:0;
	}
	#gnav > ul > li > .dropDown dl dd ul.img-type li .btn-img {
		display:none;
	}
	#gnav > ul > li > .dropDown dl dd ul.img-type li .btn-txt {
		margin:0;
	}
	#gnav > ul > li > .dropDown dl dd ul.img-type li .btn-txt:after {
		content:none;
	}
	#gnav > ul > li > .dropDown dl dd ul.img-type li .btn-txt:hover {
		color:#000;
	}

	/* 事業内容 */
	#gnav > ul > li > .dropDown dl dd ul.txt-type01 {
		width:100%;
		float:none;
		margin:0;
	}
	#gnav > ul > li > .dropDown dl dd ul.txt-type01 li {
		border-top:solid 1px #ccc;
	}
	#gnav > ul > li > .dropDown dl dd ul.txt-type01 a {
		display:block;
		line-height:1.5;
		padding:1.2em 27px;
		font-family: "FOT-筑紫ゴシック Pr5 R";
	}
	#gnav > ul > li > .dropDown dl dd ul.txt-type01:first-child {
		padding:0;
	}
	#gnav > ul > li > .dropDown dl dd ul.txt-type01 a:after {
		content:none;
	}
	
	/* IR・投資家情報 */
	#gnav > ul > li:nth-child(4) > .dropDown dl dd {
		padding:0;
	}
	#gnav > ul > li > .dropDown dl dd ul.txt-type02 {
		width:100%;
		float:none;
	}
	#gnav > ul > li > .dropDown dl dd ul.txt-type02 > li {
		border-top:solid 1px #ccc;
	}
	#gnav > ul > li > .dropDown dl dd ul.txt-type02 > li > a {
		display:block;
		line-height:1.5;
		padding:1.2em 27px;
		font-family: "FOT-筑紫ゴシック Pr5 R";
	}
	#gnav > ul > li > .dropDown dl dd ul.txt-type02 > li > a:after {
		content:none;
	}
	#gnav > ul > li > .dropDown dl dd ul.txt-type02 > li > ul {
		display:none;
	}
	#gnav > ul > li > .dropDown dl dd ul.btn-type {
		width:100%;
		position:static;
	}
	#gnav > ul > li > .dropDown dl dd ul.btn-type li {
		width:100%;
		float:none;
		border-top:solid 1px #ccc;
	}
	#gnav > ul > li > .dropDown dl dd ul.btn-type li + li {
		float:none;
	}
	#gnav > ul > li > .dropDown dl dd ul.btn-type li.btn-eft a,
	#gnav > ul > li > .dropDown dl dd ul.btn-type li.btn-eft a {
		display:block;
		line-height:1.5;
		padding:1.2em 27px;
		border:none;
		text-align:left;
		font-size:100%;
		background:#f2f2f2;
		font-family: "FOT-筑紫ゴシック Pr5 R";
}
	#gnav > ul > li > .dropDown dl dd ul.btn-type li.btn-eft a:before,
	#gnav > ul > li > .dropDown dl dd ul.btn-type li.btn-eft a:after {
		content:none;
	}

	/* 採用情報 */
	#gnav ul li#gnavRecruit a {
		position:relative;
	}
	#gnav ul li#gnavRecruit a:before {
		content:"";
		display:block;
		width:5px;
		height:5px;
		border:solid 1px #858585;
		position:absolute;
		left:100px;
		top:22px;
	}
	#gnav ul li#gnavRecruit a:hover:after,
	#gnav ul li#gnavRecruit a:after {
		content:"";
		display:block;
		width:4px !important;
		height:4px !important;
		position:absolute;
		left:104px;
		right:auto;
		top:20px !important;
		transform:none !important;
		margin:0;
		opacity:1;
	}
	
	/*検索*/
	#gnav #search{
		border-top:solid 1px #ccc;
		background:#eee;
		padding:1.3em 15px;
		position:static;
		width:auto;
		overflow:hidden;
	}
	#gnav #search div.searchTxWrap {
		width:78%;
		height:auto;
		position: static;
		float:left;
	}
	#gnav #search input.searchTx {
		width: 100%;
		padding:0.2em 0.8em;
		height:32px;
		font-size:16px;
		-webkit-box-sizing:border-box;
		box-sizing:border-box;
		-webkit-appearance:none !important;
		border-radius:0 !important;
	}
	#gnav #search input.searchBtn {
		width:20%;
		height:31px;
		position: static;
		right: 0;
		float:right;
		text-indent:0;
		background:#8c8c8c;
		border:none;
		color:#fff;
		font-size:14px;
		-webkit-appearance:none !important;
		border-radius:0 !important;
	}
	
	
	
	
	
	#header.fixed #hnav {
		display:block;
	}
	#hnav {
		width:100%;
		position:static;
		font-size:109%;
		border:none;
	}
	#hnav li {
		float:none;
	}
	#hnav li a {
		height:auto;
		line-height:4;
		text-align:left;
		font-family: "FOT-筑紫ゴシック Pro E";
		position:relative;
	}
	#hnav li.btn-en{
		width:100%;
		font-style:normal;
	}
	#hnav li.btn-en a{
		width:auto;
		padding:0 15px;
		color:#fff;
	}

	#hnav li.btn-green a {
		width:auto;
		padding:0 15px;
		background:#89b345;
		color:#fff;
	}
	#hnav li.btn-green a:after {
		content:none;
	}
	#hnav li.btn-green a span {
		display:inline-block;
		position:relative;
	}
	#hnav li.btn-green a span:before {
		width:5px;
		height:5px;
		right:-20px;
		top:22px;
	}
	#hnav li.btn-green a span:after {
		width:4px;
		height:4px;
		right:-22px;
		top:20px;
	}
	#hnav li.btn-contact {
		margin:0;
	}
	#hnav li.btn-contact a {
		padding:0 15px;
		background:#767676;
		color:#fff;
	}
	#hnav li a:after {
		content:"";
		display:block;
		width:8px;
		height:8px;
		border-top:solid 2px #fff;
		border-right:solid 2px #fff;
		position:absolute;
		top:50%;
		right:19px;
		margin:-4px 0 0;
		transform:rotate(45deg);
		-webkit-transition:all ease 0.3s;
		-moz-transition:all ease 0.3s;
		transition:all ease 0.3s;
	}

	#header .btn-top {
		display:none;
	}
	#menuBtn {
		position:absolute;
		top:15px;
		right:15px;
		display:block;
	}
	#menuBtn .menu-trigger,
	#menuBtn .menu-trigger span {
		display: inline-block;
		transition: all .4s;
		box-sizing: border-box;
	}
	#menuBtn .menu-trigger {
		position: relative;
		width: 27px;
		height: 19px;
	}
	#menuBtn .menu-trigger span {
		position: absolute;
		left: 0;
		width: 100%;
		height: 3px;
		background-color: #000;
	}
	#menuBtn .menu-trigger span:nth-of-type(1) {
		top: 0;
	}
	#menuBtn .menu-trigger span:nth-of-type(2) {
		top: 8px;
	}
	#menuBtn .menu-trigger span:nth-of-type(3) {
		bottom: 0;
	}
	
	.dialogIsOpen #menuBtn .menu-trigger span:nth-of-type(1) {
		-webkit-transform: translateY(10px) rotate(-45deg);
		transform: translateY(8px) rotate(-45deg);
	}
	.dialogIsOpen #menuBtn .menu-trigger span:nth-of-type(2) {
		opacity: 0;
	}
	.dialogIsOpen #menuBtn .menu-trigger span:nth-of-type(3) {
		-webkit-transform: translateY(-10px) rotate(45deg);
		transform: translateY(-8px) rotate(45deg);
	}
	
	#overlay {
		width:100%;
		height:100vh;
		background:rgba(0,0,0,0.7);
		position:fixed;
		top:0;
		z-index:-1;
		opacity:0;
		-webkit-transition:all ease 0.3s;
		-moz-transition:all ease 0.3s;
		transition:all ease 0.3s;
	}
	.dialogIsOpen #overlay {
		z-index:999;
		opacity:1;
	}
	
	
	/* ---------------------------------------------------------------------------
			.content-wrap		
				
	--------------------------------------------------------------------------- */
	.content-wrap {
		margin:0;
		background-size:40px 40px;
		border-right:none;
	}
	
	
	/* ---------------------------------------------------------------------------
			#content		
				コンテンツ
	--------------------------------------------------------------------------- */
	#pagehead {
		position:relative;
	}
	#pagehead figure {
		margin:0 0 50px;
	}
	#pagehead figure img {
		width:100%;
	}
	#pagehead .head-txt {
		width:100% !important;
		position:relative;
		top:auto;
		right:auto;
	}
	#pagehead .head-txt:before {
		width:73px;
		height:3px;
		position:absolute;
		top:-20px;
		left:0;
		right:0;
		margin:0 auto;
	}
	
	#pagehead .head-txt h1 {
		text-align:center;
	}
	#pagehead .head-txt h1 img {
		width:auto !important;
		height:29px !important;
	}
	#pagehead .head-txt h1 .cap {
		width:100% !important;
		margin:10px 0 30px;
		font-size:109%;
		text-align:center;
		letter-spacing:3px;
		font-family: "FOT-筑紫ゴシック Pro E";
	}
	#pagehead .head-txt h1 .cap .spc {
		margin:0 0.5em 0 -0.3em;
	}
	#pagehead .head-txt p {
		display:none;
	}
	#content .pankuzu {
		display:none;
	}
	/* ---------------------------------------------------------------------------
			#main
				メイン
	--------------------------------------------------------------------------- */
	#main .main-inner {
		max-width:100%;
		min-width:100%;
		margin:0;
		padding:28px 15px 30px;
		overflow:visible;
	}

	#main {
		padding:0;
	}
	#main p {
		font-size:109%;
		line-height:2.3;
	}


	/* ---------------------------------------------------------------------------
			#footer
				フッター
	--------------------------------------------------------------------------- */
	#pagetop {
		width:49px;
		position:static;
		margin:0 0 0 auto;
	}
	#sitemap {
		margin:0 0 26px;
		padding:0;
		background:#f2f2f2;
		border-bottom:solid 1px #ccc;
	}
	#sitemap ul {
		width:100%;
		margin:0 auto;
		padding:0;
	}
	#sitemap ul li {
		width:100%;
		float:none;
		margin:0;
	}
	#sitemap ul li a  {
		display:block;
		padding:0 15px;
		line-height:4;
		position:relative;
}
	#sitemap ul li dl + dl {
		margin:0;
	}
	#sitemap ul li dl dt {
		margin:0;
		padding:0;
		font-size:109%;
		border-top:solid 1px #ccc;
		border-bottom:none;
		font-family: "FOT-筑紫ゴシック Pro E";
		letter-spacing:2px;
	}
	#sitemap ul li dl dt a {
		display:block;
	}
	#sitemap ul li dl dt a:after {
		content:"";
		display:block;
		width:8px !important;
		height:8px !important;
		border-top:solid 2px #9f9f9f !important;
		border-right:solid 2px #9f9f9f !important;
		position:absolute;
		top:50% !important;
		right:19px !important;
		margin:-4px;
		transform:rotate(45deg);
		-webkit-transition:all ease 0.3s;
		-moz-transition:all ease 0.3s;
		transition:all ease 0.3s;
	}
	#sitemap ul li dl dt.open a:after {
		transform:rotate(135deg);
	}
	#sitemap ul li dl dd {
		margin:0;
		-webkit-transition:all ease 0.3s;
		-moz-transition:all ease 0.3s;
		transition:all ease 0.3s;
		max-height:0;
		overflow:hidden;
	}
	#sitemap ul li dl dt.open + dd {
		max-height:700px;
	}
	#sitemap ul li dl dd li {
		line-height:1.8;
		background:#fff;
		border-top:solid 1px #ccc;
	}
	#sitemap ul li dl dd a {
		line-height:1.5;
		padding:1.2em 27px;
		position:relative;
	}
	#sitemap ul li dl dd a:hover {
		text-decoration:none;
	}
	
	#sitemap ul li dl a .blank02:before {
		content:"";
		display:block;
		width:6px;
		height:6px;
		border:solid 1px #6f6f6f;
		position:absolute;
		left:120px;
		top:22px;
	}
	#sitemap ul li dl a .blank02:after {
		content:"";
		display:block;
		width:4px;
		height:4px;
		border-top:solid 1px #6f6f6f;
		border-right:solid 1px #6f6f6f;
		position:absolute;
		left:125px;
		top:20px;
	}
	#sitemap ul li dl dd {
		margin:0 -2em 0 0;
		font-size:109%;
		line-height:1.8;
	}
	#sitemap ul li dl dd ul li {
		padding:0;
	}
	#sitemap ul li dl dd a:hover {
		text-decoration:underline;
	}
	
	
	#fnav {
		margin:0 0 15px;
	}
	#fnav li {
		display:inline;
		line-height:2;
		font-size:84%;
	}
	#fnav li:before {
		content:" | "
	}
	#fnav li:nth-child(2):after {
		content:"";
		display:block;
	}
	#fnav li:nth-child(3):before {
		content:none;
	}
	#fnav li a:hover {
		text-decoration:underline;
	}
	
	#footer .sns{
		margin:0 auto 15px;
		width:70px;
	}
	
	#footer .sns li{
		float:left;
	}
	
	#footer .sns .facebook{
		margin-right:10px;
	}
	
	#footer .f-logo {
		width:178px;
		margin:0 auto 24px;
	}
	
	#footer .foot-info {
		width:100%;
		margin:0 auto;
		padding:0;
	}
	#footer .foot-info address .add {
		width:100%;
		float:none;
		margin:0;
		font-size:84%;
		letter-spacing:1px;
	}
	#footer .foot-info .jpx {
		width:182px;
		float:none;
		margin:20px auto 0;
		font-size:75%;
		overflow:hidden;
	}
	#footer .foot-info .jpx dt {
		width:41px;
		float:left;
		margin:0 9px 0 0;
	}
	#footer .foot-info .jpx dd {
		margin:3px 0 0;
		letter-spacing:1px;
	}
	
	#coryright {
		margin:30px 0 0;
		padding:0 0 20px;
		text-align:center;
	}
	#coryright small {
		font-size:75%;
	}
	
	
}