/*

template project
@jun akagi

*/


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

base

baseではサイト内の基本的な設定を行う
現バージョンでは以下を追加している
・cssリセット
・フォントリセットとマスターの設定
・PC専用/モバイル専用クラス
・Googleマップレスポンシブ化
・flex（safariとiPhoneではキャンセル）、その他flex関連の補助クラス

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

abbr,acronym,address,applet,big,blockquote,body,button,caption,cite,code,dd,del,dfn,div,dl,dt,em,fieldset,font,form,h1,h2,h3,h4,h5,h6,html,iframe,img,ins,kbd,label,legend,li,object,ol,p,pre,q,samp,span,table,tfoot,ul{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;font-size:13px;line-height:1.5;font-weight:400;font-style:normal;color:#333}.jppage abbr,.jppage acronym,.jppage address,.jppage applet,.jppage b,.jppage big,.jppage blockquote,.jppage button,.jppage caption,.jppage center,.jppage cite,.jppage code,.jppage dd,.jppage del,.jppage dfn,.jppage div,.jppage dl,.jppage dt,.jppage em,.jppage fieldset,.jppage font,.jppage form,.jppage h1,.jppage h2,.jppage h3,.jppage h4,.jppage h5,.jppage h6,.jppage i,.jppage iframe,.jppage img,.jppage ins,.jppage kbd,.jppage label,.jppage legend,.jppage li,.jppage object,.jppage ol,.jppage p,.jppage pre,.jppage q,.jppage s,.jppage samp,.jppage small,.jppage span,.jppage strike,.jppage strong,.jppage sub,.jppage sup,.jppage table,.jppage tfoot,.jppage tt,.jppage u,.jppage ul,.jppage var,body.jppage{font-family:メイリオ,MS Pゴシック,Arial,sans-serif}.enpage abbr,.enpage acronym,.enpage address,.enpage applet,.enpage b,.enpage big,.enpage blockquote,.enpage button,.enpage caption,.enpage center,.enpage cite,.enpage code,.enpage dd,.enpage del,.enpage dfn,.enpage div,.enpage dl,.enpage dt,.enpage em,.enpage fieldset,.enpage font,.enpage form,.enpage h1,.enpage h2,.enpage h3,.enpage h4,.enpage h5,.enpage h6,.enpage i,.enpage iframe,.enpage img,.enpage ins,.enpage kbd,.enpage label,.enpage legend,.enpage li,.enpage object,.enpage ol,.enpage p,.enpage pre,.enpage q,.enpage s,.enpage samp,.enpage small,.enpage span,.enpage strike,.enpage strong,.enpage sub,.enpage sup,.enpage table,.enpage tfoot,.enpage tt,.enpage u,.enpage ul,.enpage var,body.enpage{font-family:Helvetica,Arial,sans-serif}a{font-size:100%;vertical-align:baseline;background:transparent;line-height:1.5;font-weight:400;font-style:normal;color:#333}.jppage a{font-family:メイリオ,MS Pゴシック,Arial,sans-serif}.cnpage a{font-family:simsun,sans-serif}.enpage a{font-family:Helvetica,Arial,sans-serif}i{font-family:FontAwesome!important;font-style:normal}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}input,select,textarea{font:100% "MS Pゴシック",Arial,sans-serif}table{font-size:inherit}sup{vertical-align:super;font-size:50%;line-height:1}

/*PC専用/モバイル専用クラス*/


/*ブロック要素にしか対応していないので注意*/

.onlypc {
	display: block;
}

.onlymobile {
	display: none;
}

@media only screen and (max-width: 959px) {
	.onlypc {
		display: none;
	}
	.onlymobile {
		display: block;
	}
}

.dib {
	display: inline-block;
	font-size: inherit;
	color: inherit;
	font-weight: inherit;
}

.displaynone {
	display: none;
}


/*Googleマップレスポンシブ化*/


/*div要素、section要素等のブロック要素に.ggmapを付与し、内部にGoogleマップから吐き出された埋め込み用要素を貼り付ける
このときiframe要素に入っているwidth属性やhight属性は無視される*/

.ggmap,
.youtube {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
	margin-bottom: 30px;
}

.ggmap iframe,
.ggmap object,
.ggmap embed,
.youtube iframe,
.youtube object,
.youtube embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


/*flex*/


/*flexを使用したいボックスにflexクラスを付与すると直下の子要素が横並びになる
flex非対応ブラウザおよびsafariではキャンセルされるようにする*/

.flex,
.flexbasic {
	display: -webkit-box;
	display: -moz-box;
	display: box;
	display: -moz-flex;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: -webkit-flexbox;
	display: flex;
}

.ua-safari .flex,
.no-flexbox .flex,
.ua-safari .flexbasic,
.no-flexbox .flexbasic {
	display: block;
	overflow: hidden;
}

.jcsb {
	justify-content: -webkit-space-between;
	justify-content: -moz-space-between;
	justify-content: space-between;
}

.jcar {
	justify-content: -webkit-space-around;
	justify-content: -moz-space-around;
	justify-content: space-around;
}

.aic {
	align-items: center;
}

.acsb {
	align-content: -webkit-space-between;
	align-content: -moz-space-between;
	align-content: space-between;
}

.fdcu {
	-webkit-flex-direction: column;
	flex-direction: column;
}

.fdrr {
	-webkit-flex-direction: row-reverse;
	flex-direction: row-reverse;
}

.flwp,
.flexbasic {
	flex-wrap: wrap;
}

#main .flexbasic>* {
	float: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#main .flexbasic>.leftend {
	clear: left;
}
#main .flexbasic>.rightend {
	margin-right: 0 !important;
}

#navbox{display: none;}

@media only screen and (max-width: 979px) {}

body {
/*
	background: #ffffff url(../../master.jpg) 50% 0 no-repeat;
	padding-bottom: 2000px;
*/
	background: #ffffff;
}

.fixwidth {
	max-width: 980px;
	min-width: 320px;
	margin: auto;
}

@media only screen and (max-width: 979px) {
	.fixwidth	{
		width: ;
	}
}


@media only screen and (min-width: 980px) {
#gNav {}
	#gNav>ul {
		display: table;
		width: 100%;
	}
		#gNav>ul>li {
			display: table-cell;
		}
			#gNav a {
				display: block;
			}

#pNav {}
	#pNav>div {}
.megamenu #pNav {
	position: relative;
}
	.megamenu #pNav>div {
		position: absolute;
		left: 0;
		right: 0;
	}
.pulldown #gNav {}
		.pulldown #gNav>ul>li {
			position: relative;
		}
			.pulldown #gNav>ul>li>ul {
				position: absolute;
				left: 0;
				right: 0;
			}
}
@media only screen and (max-width: 979px) {
#gNav {}
	#gNav>ul {
		display: block;
	}
		#gNav>ul>li {
			display: block;
		}
			#gNav a {
				display: block;
			}

}

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

design

基本的なレイアウト、各種パーツの振る舞い、スタンダートな文章デザインをここで設定する
css作成作業の大部分がこのゾーンでの作業になる

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

#header {
	border-bottom: #ccc 1px solid;
}
#header .fixwidth {}
	#header h1 {
		float: left;
}
		#header #root {
			display: block;
			padding: 21px 22px;
			text-decoration: none;
		}
		#header #root:before {
			content: attr(title);
			display: block;
			margin-bottom: 11px;
			color: #000;
		}
			#header #root img {
				max-width: 387px;
				width: 100%;
				vertical-align: middle;
			}
@media only screen and (max-width: 979px) {
#header {}
#header .fixwidth {}
	#header h1 {}
		#header #root {
			display: block;
			padding: 15px 18px;
		}
		#header #root:before {
			content: none;
		}
			#header #root img {
				max-width: 387px;
				width: 100%;
				vertical-align: middle;
			}
}
	#header .contact {
		position: absolute;
		right: 0;
		top: 0;
		padding: 14px 25px;
		background: #1d1c22;
	}
		#header .contact p {
			margin-bottom: 10px;
		}
			#header .contact img {
				vertical-align: middle;
			}
		#header .contact .btn {
			margin-bottom: 0;
		}
			#header .btn a {
				display: block;
				background: #474747 url(../img/icon_mail.png) 13px 50% no-repeat;
				border: #7e7e7e 1px solid;
				text-decoration: none;
				color: #fff;
				font-weight: bold;
				text-align: center;
				padding: 2px 0 2px 30px;
				font-size: 110%;
				border-radius: 5px;
			}

@media only screen and (min-width: 980px) {
	#header #gNav {
		padding: 15px 20px 16px;
		clear: both;
	}
		#header ul {
			border-right: #ccc 1px solid;
		}
			#header li {
				width: 16.6%;
				border-left: #ccc 1px solid;
				padding: 3px 10px;
			}
				#header li a {
					display: block;
					height: 26px;
					line-height: 26px;
					text-align: center;
					font-size: 110%;
					text-decoration: none;
					color: #000;
					border-radius: 5px;
					transition: all 0.2s;
				}
				#header li a:hover,
				#header li a.current {
					background: #333;
					color: #fff;
				}
}
@media only screen and (max-width: 979px) {
	#header .contact {display: none;}
	#header #gNav {
		padding: 15px 20px 16px;
		clear: both;
	}
		#header ul {
			overflow: hidden;
			border-right: #ccc 1px solid;
		}
			#header li {
				width: 33.3%;
				border-left: #ccc 1px solid;
				padding: 3px 10px;
				float: left;
				-webkit-box-sizing: border-box;
				-moz-box-sizing: border-box;
				box-sizing: border-box;
			}
				#header li a {
					display: block;
					height: 26px;
					line-height: 26px;
					text-align: center;
					font-size: 110%;
					text-decoration: none;
					color: #000;
					border-radius: 5px;
					transition: all 0.2s;
				}
				#header li a:hover,
				#header li a.current {
					background: #333;
					color: #fff;
				}
}
@media only screen and (max-width: 500px) {
	#header #gNav {}
		#header ul {}
			#header li {
				width: 50%;
			}
}

#main {
	overflow: hidden;
	padding: 35px 0;
}
	#main>article,
	#main>aside {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	#main>article {
		float: left;
		width: 70%;
	}
	#main>aside {
		float: right;
		width: 30%;
	}

#pagetitle {
	padding: 40px 0 30px;
	background: #eee url(../../img/top/bg_job.png) bottom repeat-x;
	-webkit-background-size: 20%;
	background-size: 20%;
}
	#pagetitle .fixwidth {
		padding: 0 20px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		overflow: hidden;
	}
		#pagetitle h2 {
			font-size: 260%;
			color: #c60000;
			margin-bottom: 0.5em;
		}
		#pagetitle article {
			float: left;
			width: 66.6%;
		}
			#pagetitle article p {
				font-size: 120%;
				line-height: 1.8;
				margin-bottom: 0.5em;
			}
		#pagetitle aside {
			float: right;
			width: 30%;
		}
			#pagetitle .btn {}
				#pagetitle a {
					display: block;
					height: 55px;
					line-height: 55px;
					font-size: 150%;
					color: #fff;
					text-align: center;
					font-weight: bold;
					text-decoration: none;
					background: #c60000;
					padding: 0 46px;
					border-radius: 10px;
					border: #fff 4px solid;
					-webkit-box-shadow: 0 0 21px rgba(0, 0, 0, 0.7);
					box-shadow: 0 0 21px rgba(0, 0, 0, 0.7);
					transition: all 0.2s;
					margin-bottom: 10px;
				}
@media only screen and (max-width: 980px) {
#pagetitle {
	padding: 20px 0 15px;
}
	#pagetitle .fixwidth {
		padding: 0 15px;
	}
		#pagetitle h2 {
			font-size: 200%;
		}
		#pagetitle article {
			float: none;
			width: auto;
			margin-bottom: 18px;
		}
			#pagetitle article p {
				font-size: 100%;
				line-height: 1.5;
			}
		#pagetitle aside {
			float: none;
			width: auto;
		}
			#pagetitle .btn {}
				#pagetitle a {
					display: block;
					height: 35px;
					line-height: 35px;
					font-size: 115%;
					padding: 0;
					-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.7);
					box-shadow: 0 0 10px rgba(0, 0, 0, 0.7);
				}
}

.unit {
	margin-bottom: 32px;
	overflow: hidden;
}
	.unit>article {
		float: left;
		width: 66.6%;
	}
	.unit>aside {
		float: right;
		width: 30%;
	}
		.unit aside figure {
			margin: 0;
		}
			.unit aside figure img {
				vertical-align: bottom;
				width: 100%;
				max-width: auto;
			}

#main h3 {
	font-size: 200%;
	margin-bottom: 18px;
}
#main h4 {
	font-size: 150%;
	margin-bottom: 9px;
}
#main table {
	margin-bottom: 18px;
	border-top: #ccc 1px solid;
	border-left: #ccc 1px solid;
	width: 100%;
}
	#main table th,
	#main table td {
		border-bottom: #ccc 1px solid;
		border-right: #ccc 1px solid;
		font-size: 110%;
		padding: 3px 5px;
	}
	#main table th {
		text-align: left;
		vertical-align: top;
		background: #eee;
	}
	#main table tbody th {
		width: 20%;
		white-space: nowrap;
	}
	#main table thead th {
		text-align: center;
		background: #bbb;
	}

#footer {
	border-top: #e07171 3px solid;
	background: #1d1c22;
	padding: 20px 0;
}
	#fNav {}
		#fNav ul {
			display: table;
			margin: auto;
			width: auto;
		}
			#fNav li {
				display: table-cell;
				border-right: #fff 1px solid;
			}
			#fNav li:last-child {
				border-right: none;
			}
				#fNav a {
					display: block;
					height: 24px;
					line-height: 24px;
					padding: 0 1em;
					color: #fff;
					font-size: 110%;
					text-decoration: none;
				}
@media only screen and (max-width: 979px) {
#footer {
	border-top: #e07171 3px solid;
	background: #1d1c22;
	padding: 20px 0;
}
	#fNav {}
		#fNav ul {
			display: block;
			overflow: hidden;
		}
			#fNav li {
				display: block;
				float: left;
				width: 33.3%;
				padding: 5px 15px;
				-webkit-box-sizing: border-box;
				-moz-box-sizing: border-box;
				box-sizing: border-box;
				border: none;
			}
			#fNav li:last-child {
				border-right: none;
			}
				#fNav a {
					display: block;
					height: 35px;
					line-height: 35px;
					padding: 0 1em;
					color: #333;
					background: #fff;
					border-radius: 8px;
					font-size: 110%;
				}
}
@media only screen and (max-width: 640px) {
#footer {
	border-top: #e07171 3px solid;
	background: #1d1c22;
	padding: 20px 0;
}
	#fNav {}
		#fNav ul {
			display: block;
			overflow: hidden;
		}
			#fNav li {
				display: block;
				float: left;
				width: 50%;
				padding: 5px 10px;
				-webkit-box-sizing: border-box;
				-moz-box-sizing: border-box;
				box-sizing: border-box;
				border: none;
			}
			#fNav li:last-child {
				border-right: none;
			}
				#fNav a {
					display: block;
					height: 35px;
					line-height: 35px;
					padding: 0 1em;
					color: #333;
					background: #fff;
					border-radius: 8px;
					font-size: 94%;
				}
}
/*-------------------------------------------------------

unit

designセクションでは吸収しきれない個別スタイルをここで設定する

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

#mainvisual {
	margin: 0;
}
	#mainvisual img {
		width: 100%;
		vertical-align: middle;
	}
.topTeaser {
	padding: 60px 0 0;
}
	.topTeaser h2 {
		font-size: 265%;
		margin-bottom: 5px;
	}
	.topTeaser p {
		font-size: 115%;
		line-height: 1.8;
	}
	section#sealing {}
		section#sealing h2 {}
		section#sealing p {}
			section#sealing .btn {
				margin-top: 26px;
/*				background: url(../../img/top/bg_case.jpg) 50% 0 repeat-x;*/
				height: 100px;
				margin-bottom: 50px;
				position: relative;
			}
				section#sealing a {
					position: absolute;
					top: 50%;
					left: 50%;
					transform: translate(-50%,-50%) scale(1);
					display: block;
					height: 55px;
					line-height: 55px;
					font-size: 150%;
					color: #fff;
					font-weight: bold;
					text-decoration: none;
					background: #c60000;
					padding: 0 46px;
					border-radius: 10px;
					border: #fff 4px solid;
					-webkit-box-shadow: 0 0 21px rgba(0, 0, 0, 0.7);
					box-shadow: 0 0 21px rgba(0, 0, 0, 0.7);
					transition: all 0.2s
				}
				section#sealing a:hover {
					-webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.9);
					box-shadow: 0 2px 5px rgba(0, 0, 0, 0.9);
					transform: translate(-50%,-50%) scale(0.95);
				}
	section#job {
		padding: 45px 0 20px;
		background: #eee url(../../img/top/bg_job.png) bottom repeat-x;
	}
		section#job h2 {}
		section#job p {
			margin-bottom: 11px;
		}
		section#job div {
			padding: 0 70px;
			-webkit-box-sizing: border-box;
			-moz-box-sizing: border-box;
			box-sizing: border-box;
		}
			section#job section {
				width: 362px;
				height: 362px;
				border-radius: 181px;
				-webkit-box-sizing: border-box;
				-moz-box-sizing: border-box;
				box-sizing: border-box;
				/*padding-top: 45px;*/
				padding-top: 110px;
				background: #fff no-repeat bottom;
			}
				section#job .women {
					float: left;
				}
				section#job .license {
					float: right;
				}
				section#job section h3 {
					font-size: 190%;
					color: #c60000;
					width: 280px;
					margin:auto;
				}
				section#job section p {
					width: 280px;
					margin:auto;
					font-size: 105%;
					text-align: left;
				}
@media only screen and (max-width: 890px) {
		section#job div {
			padding: 0 0;
		}
			section#job section {
				width: 50%;
				height: auto;
				border-radius: 15px;
				padding: 20px 20px 234px;
				background: #fff no-repeat bottom;
				margin: 0 10px;
			}
				section#job .women {
					float: left;
				}
				section#job .license {
					float: right;
				}
				section#job section h3 {
					width: auto;
				}
				section#job section p {
					width: auto;
				}
}
@media only screen and (max-width: 640px) {
		section#job div {
			display: block;
			overflow: hidden;
			padding: 0 10px;
		}
			section#job section {
				width: 100%;
				height: auto;
				min-height: 120px;
				border-radius: 15px;
				padding: 20px 33% 20px 20px;
				background: #fff no-repeat bottom;
				margin: 0;
				float: none;
				-webkit-background-size: 30%;
				background-size: 30%;
				background-position: 100% 100%;
				margin-bottom: 18px;
			}
				section#job .women,
				section#job .license {
				}
				section#job section h3 {
					text-align: left;
				}
				section#job section p {
					width: auto;
				}
}

@media only screen and (max-width: 529px) {
	
				section#sealing a {
					font-size: 90%;
				}
}

@media only screen and (max-width: 980px) {
	#main {
		padding: 20px 10px;
	}
	#main article,
	#main aside {
		float: none;
		width: 100%;
	}
}
#main #news {
	padding: 0 22px;
}
	#main #news h2 {
		font-size: 180%;
		margin-bottom: 6px;
		color: #c60000;
	}
	#main dl {
		border-top: #ccc 1px dotted;
	}
		#main dt {
			padding: 8px 6px;
			float: left;
			color: #c60000;
			font-weight: bold;
			width: 90px;
		}
		#main dd {
			padding: 8px 0 8px 102px;
			border-bottom: #ccc 1px dotted;
			color: #333;
			font-size: 100%;
		}
#main #info {
	padding: 14px 12px;
}
	#main #info h2 {
		margin-bottom: 10px;
	}
		#main img {
			vertical-align: middle;
		}
@media only screen and (max-width: 890px) {
	#top #main article,
	#top #main aside {
		float: none;
		width: 100%;
		padding: 0 10px;
		margin-bottom: 18px;
	}
}
	#main p {
		font-size: 105%;
		line-height: 1.7;
		margin-bottom: 6px;
	}
	#main ul.normal {
		padding-left: 2em;
	}
	#main ul.normal li {
		list-style: disc
	}
	#main .normal li {
		font-size: 105%;
		line-height: 1.7;
		margin-bottom: 6px;
	}
	#main .btn {
		display: inline-block;
	}
		#main .btn a {
			display: block;
			color: #fff;
			text-decoration: none;
			height: 30px;
			line-height: 30px;
			padding: 0 30px;
			border-radius: 5px;
			font-size: 130%;
			background: #333;
		}

.campanyList {}
	.campanyList li {
		border: #ccc 1px solid;
		background: #eee;
		padding: 10px;
		text-align: center;
		border-radius: 10px;
	}

.materialList {}
	.materialList li {
		border: #ccc 1px solid;
		padding: 10px;
	}
		.materialList li h4 {
			font-size: 110% !important;
		}
		.materialList li figure {
			margin: 0 0 9px;
			border: #eee 1px solid;
			padding: 5px;
		}
			.materialList li figure img {
				width: 100%;
			}
		.materialList li p {
			text-align: right;
			font-size: 94% !important;
			margin-bottom: 0 !important;
			padding-right: 6px;
		}
			.materialList li p.stock:before {
				content: "1本単価：";
			}
			.materialList li p.lot:before {
				content: "数量：";
			}

.case {}
	.case li {
		padding-bottom: 18px;
		margin-bottom: 18px;
		border-bottom: #ccc 1px solid;
	}
	.case li:last-child {
		padding-bottom: 0;
		margin-bottom: 0;
		border-bottom-width: 0;
	}
		.case figure {
			margin: 0;
			overflow: hidden;
		}
			.case img {
				float: left;
				max-width: 320px;
			}
			.case figcaption {
				float: right;
				width: calc(100% - 330px);
				border-left: #004097 3px solid;
			}
				.case h4 {
					background: #004097;
					color: #fff;
					font-size: 150%;
					padding: 5px 15px;
					margin-bottom: 10px;
				}
				.case p {
					padding: -0px 15px;
				}

#case .accordion {}
#case .accordion dt {
	background: #004097;
	color: #fff;
	font-size: 150%;
	padding: 5px 15px 5px 35px;
	margin-bottom: 10px;
	float: none;
	width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	position: relative;
	cursor: pointer;
}
#case .accordion dt:before {
	content: "";
	position: absolute;
	top: 50%;
	left: 10px;
	width: 0;
	height: 0;
	border: transparent 8px solid;
	border-bottom: none;
	border-top: #fff 15px solid;
	transform: translateY(-50%) rotate(180deg);
	transition: transform 0.2s;
}
#case .accordion dt.active:before,
#case .accordion dt:hover:before {
	transform: translateY(-50%) rotate(0);
}
#case .accordion dt.active:before {
	transform: translateY(-50%) rotate(0);
}
#case .accordion dd {
	padding: 0;
	margin-bottom: 0;
	overflow: hidden;
	border: none;
	transition: all 0.2s;
}
#case .accordion dd td,
#case .accordion dd th {
	padding: 0 3px;
	margin: 0;
	line-height: 0;
	border-width: 0;
	overflow: hidden;
	vertical-align: top;
	transition: all 0.2s;
}
#case .accordion dd table {
	border-width: 0;
	transition: all 0.2s;
}
#case .accordion dd.active {
	margin-bottom: 10px;
}
#case .accordion dd.active td,
#case .accordion dd.active th {
	padding: 3px;
	line-height: 1.5;
	border-width: 1px;
	overflow: hidden;
	transition: all 0.2s;
}
#case .accordion dd.active table {
	border-width: 1px;
	transition: all 0.2s;
}


#contactform tbody th {
	width: 20%;
}

#contactform input[type=text] {
	width: 40%;
	min-width: 200px;
}
#contactform input,
#contactform textarea {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#contactform input.short {
	width: 20%;
	min-width: 100px;
}


#contactform input.long,
#contactform textarea {
	width: 100%;
}

span.required,
th.required:after {
	font-size: 75%;
	background: #f00;
	padding: 0.125em 0.3em 0;
	vertical-align: middle;
	border-radius: 3px;
	color: #fff;
	display: inline-block;
}
th.required:after {
	content: "必須";
	margin-left: 1em;
}
.enpage th.required:after {
	content: "Required";
}

#contactform label {
	display: inline-block;
	cursor: pointer;
	margin-right: 10px;
}

#contactform textarea {
	height: 10em;
}

#contactform .caption {
	display: block;
	font-size: 75%;
}
#contactform .caption a {
	font-size:inherit;
}

#contactform .error {
  background-color: #FFAAAA;
}
#contactform .error_text {
  color: #F00;
  font-weight: bold;
}
#contactform input[type=submit] {
	display: inline-block;
	height: 55px;
	line-height: 45px;
	font-size: 130%;
	color: #fff;
	text-decoration: none;
	background: #c60000;
	padding: 0 46px;
	border-radius: 10px;
	border: #fff 4px solid;
	-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.7);
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.7);
	transition: all 0.2s
}
#contactform input[type=submit]:hover {
	-webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.9);
	box-shadow: 0 0 2px rgba(0, 0, 0, 0.9);
	transform:  scale(0.95);
	cursor: pointer;
}

@media only screen and (max-width: 479px) {
	#contactform,
	#contactform table,
	#contactform tbody,
	#contactform tr,
	#contactform th,
	#contactform td {
		border: none;
		display: block;
		border: none !important;
	}
	#contactform th,
	#contactform td {
		width: 100% !important;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	#contactform td {
		margin-bottom: 18px;
	}
	#contactform br {
		display: none;
	}
	#contactform .annotation {
		display: block;
		font-size: 94%;
		line-height: 1.5;
	}
	#contactform .indent {
		margin-left: 2em;
	}
	#contactform .dindent {
		margin-left: 4em;
	}
	#contact input[type=text] {
		width: 60%;
		height: 2em;
	}
	#contact input.long {
		width: 100%;
	}
	#contact input.short {
		width: 40%;
	}
	#contactform label {
		display: block;
	}
}

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

state

:hover、:active、:focusなどの擬似要素や
.currentなどのページの状態によって部分的に変化を起こす際にここで設定

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

.current {
	cursor: default;
}


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

cosmetic

その他、局所的に使用するスタイル
あるいは、汎用性の高いスタイル設定を記述

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

.borderbox {
	text-align: center;
	border: #004097 1px solid;
	padding: 10px;
	border-radius: 10px;
	font-size: 180% !important;
}

.linklist {
	margin-bottom: 18px;
}
	.linklist li {
		padding-left: 25px;
		margin-bottom: 5px;
		position: relative;
	}
	.linklist li:before,
	.linklist li:after {
		position: absolute;
		content: "";
		width: 0;
		height: 0;
		top: 50%;
		transform: translateY(-50%);
		border: transparent 5px solid;
		border-right: none;
		border-left: #004097 5px solid;
		transition: all  0.2s;
	}
	.linklist li:before {
		left: 5px;
	}
	.linklist li:after {
		left: 10px;
	}
	.linklist li:hover:before {
		left: 8px;
	}
	.linklist li:hover:after {
		left: 13px;
	}
		.linklist a {
/*			display: block;*/
			color: #004097;
		}
.linklist a i {
		margin-left: 5px;
	}

.icon .fa {
	margin-left: 5px;
}


.px8 {
	font-size:62% !important;
}/**/
.px9 {
	font-size:68% !important;
}
.px10 {
	font-size:74% !important;
}/**/
.px11 {
	font-size:83.3% !important;
}
.px12 {
	font-size:93% !important;
}
.px13 {
	font-size:100% !important;
}/**/
.px14 {
	font-size:105% !important;
}
.px15 {
	font-size:115% !important;
}/**/
.px16 {
	font-size:123% !important;
}
.px17 {
	font-size:136% !important;
}/**/
.px18 {
	font-size:145% !important;
}
.px19 {
	font-size:154% !important;
}
.px20 {
	font-size:160% !important;
}
.px21 {
	font-size:162% !important;
}
.px22 {
	font-size:170% !important;
}
.px23 {
	font-size:177% !important;
}
.px24 {
	font-size:185% !important;
}


.red {color: red;}
strong {font-weight: bold;}

a.btn {}

.clear {
	clear: both;
}

.txtAlignC {
	text-align: center;
}

.txtAlignL {
	text-align: left;
}
.txtAlignR {
	text-align: right;
}

.vAlignMiddle {
	vertical-align: middle;
	margin: 0 5px;
}

.floatContentsR {
	float: right;
	margin: 0 0 10px 10px;
}

.floatContentsL {
	float: left;
	margin: 0 10px 10px 0;
}

.floatContentsR,
.floatContentsL {
	max-width: 49%;
	max-width: calc(50% - 10px);
}

.floatContentsR img,
.floatContentsL img {
	width: 100%;
}

@media only screen and (max-width: 959px) {
	.floatContentsR {
		margin: 0 0 10px 5px;
	}
	.floatContentsL {
		margin: 0 5px 10px 0;
	}
	.floatContentsR,
	.floatContentsL {
		w200px max-width: 49%;
		max-width: calc(50% - 5px);
	}
}

@media only screen and (max-width: 479px) {
	.floatContentsR,
	.floatContentsL {
		margin: 0 0 0 0;
	}
	.floatContentsR,
	.floatContentsL {
		max-width: 100%;
	}
	.floatContentsR img,
	.floatContentsL img {
		vertical-align: bottom;
	}
}
.tableWidth2em {
	overflow: hidden;
}
	.tableWidth2em dt {
		float: left;
		width: 2em;
	}
	.tableWidth2em dd {
		margin-left: 2.5em;
		margin-bottom: 0.5em;
	}
em {
	color: #c00;
}

/*slick.css*/
.slick-slider{box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:rgba(0,0,0,0)}.slick-list,.slick-slider{position:relative;display:block}.slick-list{overflow:hidden;margin:0;padding:0}.slick-list:focus{outline:0}.slick-list.dragging{cursor:pointer;cursor:hand}.slick-slider .slick-list,.slick-slider .slick-track{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.slick-track{position:relative;top:0;left:0;display:block}.slick-track:after,.slick-track:before{display:table;content:''}.slick-track:after{clear:both}.slick-loading .slick-track{visibility:hidden}.slick-slide{display:none;float:left;height:100%;min-height:1px}[dir='rtl'] .slick-slide{float:right}.slick-slide img{display:block}.slick-slide img.slick-loading{display:none}.slick-slide.dragging img{pointer-events:none}.slick-initialized .slick-slide{display:block}.slick-loading .slick-slide{visibility:hidden}.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}.slick-arrow.slick-hidden{display:none}

/*slick-theme.css*/
@charset 'UTF-8';.slick-loading .slick-list
{
    background: #fff url('ajax-loader.gif') center center no-repeat;
}

/* Icons */
@font-face
{
    font-family: 'slick';
    font-weight: normal;
    font-style: normal;

    src: url('fonts/slick.eot');
    src: url('fonts/slick.eot?#iefix') format('embedded-opentype'), url('fonts/slick.woff') format('woff'), url('fonts/slick.ttf') format('truetype'), url('fonts/slick.svg#slick') format('svg');
}
/* Arrows */
.slick-prev,
.slick-next {
		position: absolute;
		display: block;
		z-index: 100;
		top: 50%;
		transform: translateY(-90%);
		cursor: pointer;
		background: rgba(255, 255, 255, 1);
  font-size: 1%;
		width: 37px;
		height: 37px;
		border-radius: 19px;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus
{
    color: transparent;
    outline: none;
/*    background: transparent;*/
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before
{
    opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before
{
    opacity: .25;
}

.slick-prev:before,
.slick-next:before {
	text-decoration: none;
	display: block;
	width: 0;
	height: 0;
	line-height: 1;
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	border: transparent 9px solid;
	transition: all 0.2s;
}

.slick-prev
{
    left: 30px;
}
[dir='rtl'] .slick-prev
{
    right: 30px;
    left: auto;
}
.slick-prev:before
{
/*    content: url(../../jp/img2016/mainVisual/arrow_left.png);*/
	border-right: #004097 13px solid;
	border-left: none;
	transform: translate(-60%,-50%);
}
[dir='rtl'] .slick-prev:before
{
/*    content:  url(../../jp/img2016/mainVisual/arrow_right.png);*/
	border-left: #004097 13px solid;
	border-right: none;
	transform: translate(-60%,-50%);
}

.slick-next
{
    right: 30px;
}
[dir='rtl'] .slick-next
{
    right: auto;
    left: 30px;
}
.slick-next:before
{
/*    content: url(../../jp/img2016/mainVisual/arrow_right.png);*/
	border-left: #004097 15px solid;
	border-right: none;
	transform: translate(-40%,-50%);
}
[dir='rtl'] .slick-next:before
{
/*    content: url(../../jp/img2016/mainVisual/arrow_left.png);*/
	border-right: #004097 15px solid;
	border-left: none;
	transform: translate(-40%,-50%);
}

/* Dots */
.slick-dotted.slick-slider
{
    margin-bottom: 30px;
}

.slick-dots
{
/*    position: absolute;*/
/*    bottom: 0px;*/

    display: block;

/*    width: 100%;*/
    width: auto;
    padding: 0;
    margin: 0 auto;
	overflow: hidden;

    list-style: none;

    text-align: center;
}
.slick-dots li
{
    position: relative;

    display: inline-block;

    width: 12px;
    height: 12px;
    margin: 13px 8px 0;
    padding: 0;

    cursor: pointer;
}
.slick-dots li button
{
    font-size: 0;
    line-height: 0;

    display: block;

    width: 14px;
    height: 14px;
    padding: 0px;

    cursor: pointer;

    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
    outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
    opacity: 1;
}
.slick-dots li button:before
{
    font-family: 'slick';
    font-size: 14px;
    line-height: 15px;

    position: absolute;
    top: 0;
    left: 0;

    width: 12px;
    height: 12px;

    content: '•';
    text-align: center;

/*    opacity: .25;*/
    color: #cbcbcb;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before
{
    opacity: 1;
    color: #004097;
}


/* Foundation v2.1.4 http://foundation.zurb.com */
/* Artfully masterminded by ZURB  */

/* -------------------------------------------------- 
   Table of Contents
-----------------------------------------------------
:: Shared Styles
:: Page Name 1
:: Page Name 2
*/


/* -----------------------------------------
   Shared Styles
----------------------------------------- */

/* Mobile */

	#main #article table.scroll,
	#main #article table.responsive
{ margin-bottom: 0; }
	
	#main #article .pinned { position: absolute; left: 0; top: 0; background: #fff;
		width: 17%;
		overflow: hidden;
/*		overflow-x: scroll;*/
		border-right: 1px solid #ccc;
/*		border-left: 1px solid #ccc;*/
	}
	#main #article .pinned table { border-right: none;
/*		border-left: none;*/
		width: 100%; }
	#main #article .pinned table th, .pinned table td { white-space: nowrap; }
	#main #article .pinned td:last-child { border-bottom: 0; }
	
	#main #article div.table-wrapper { position: relative; margin-bottom: 20px; overflow: hidden; border-right: 1px solid #ccc; }
	#main #article div.table-wrapper div.scrollable { margin-left: 17%; }
	#main #article div.table-wrapper div.scrollable { overflow: scroll; overflow-y: hidden; }	
	
	#main #article table.responsive td, table.responsive th {
/*		position: relative;*/
		white-space: nowrap; overflow: hidden; }
	#main #article div.scrollable table.responsive th:first-child,
	#main #article div.scrollable table.responsive td:first-child,
	#main #article div.scrollable table.scroll th:first-child,
	#main #article div.scrollable table.scroll td:first-child  { display: none; }
	#main #article .pinned table.responsive th:first-child,
	#main #article .pinned table.responsive td:first-child,
	#main #article .pinned table.scroll th:first-child,
	#main #article .pinned table.scroll td:first-child  { display: table-cell; }
#main #article table.markettable .dummy {
/*
	padding: 0;
	display: none !important;
*/
}
	