@charset "utf-8";

/* ////////////////////////////////////////////////////////////
	File Name	common.css
*/

/*============================================================
	RESET
*/
* { -webkit-box-sizing: border-box; box-sizing: border-box; }
html,body { background:#FFFFFF; }
body,div,dl,dt,dd,ul,ol,li,
pre,code,form,fieldset,legend,input,textarea,
p,blockquote,th,td,embed,button { margin:0; padding:0; font-weight: normal; }
h1,h2,h3,h4,h5,h6 { margin:0; padding:0; font-size: 100%; font-weight: normal; }
table { border-collapse:collapse; border-spacing:0; }
fieldset,img { border:0; }
li { list-style:none; }
caption,th { text-align:left; }
q:before,q:after { content:''; }
abbr,acronym { border:0; font-variant:normal; }
sup { vertical-align:text-top; }
sub { vertical-align:text-bottom; }
legend { color:#000000; }
area { outline: 0; }
img { vertical-align: top; }
i, address { font-style: normal; }
strong { font-weight: bold; }

/*============================================================
	BODY
*/
html, body {
	width: 100%;
	background-color: #ffffff;
}
body {
	font-family: "NotoSansCJKjp", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight: 500;
	font-size: 14px;
	line-height: 1.8;
	color: #333333;
	-webkit-font-smoothing: antialiased;
	font-smoothing: antialiased;
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}
a {
	outline: none;
	text-decoration: underline;
	color: #003399;
	cursor: pointer;
}

/*============================================================
	CLEARFIX
*/
.cf:after,
.row:after,
.container:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	height: 0;
}

/*============================================================
	表示 & 非表示
*/
.visible-pc {
	display: block;
}
.visible-sp {
	display: none;
}

/*============================================================
	コンテナ
*/
#container {
	overflow: hidden;
	position: relative;
	margin: 0 auto;
	padding: 138px 0 0 0;
	width: 100%;
	min-width: 1180px;
	background-color: #ffffff;
}
.container {
	position: relative;
	margin: 0 auto;
	padding: 0 15px;
	width: 1040px;
}

/*============================================================
	ヘッダー
*/
#header {
	position: fixed;
	z-index: 999;
	top: 0; left: 0;
	width: 100%; height: 138px;
	min-width: 1180px;
	background-color: #ffffff;
	border-top: 20px solid #003399;
}
#header .container {
	padding: 0;
}
/* 概要 */
#header .description {
	position: absolute;
	top: -20px; left: 0;
	height: 20px;
	font-size: 11px;
	line-height: 20px;
	color: #ffffff;
}
#header .description br {
	display: none;
}
/* ロゴ */
#header .logo {
	position: absolute;
	top: 28px; left: 0;
}
header .logo a,
header .logo span {
	display: block;
	overflow: hidden;
	width: 200px; height: 50px;
	background: transparent url(../images/common/logo_header.png) 50% 50% no-repeat;
	-webkit-background-size: contain;
	background-size: contain;
	text-decoration: none;
	text-indent: -999em;
}
/* ナビ */
#header .nav {
	padding: 38px 0 0 0;
}
#header .nav ul {
	float: right;
}
#header .nav ul li {
	position: relative;
	float: left;
	padding: 0 15px;
	font-weight: bold;
	font-size: 14px;
	line-height: 1.5;
}
#header .nav ul li a,
#header .nav ul li span {
	display: table;
	padding: 10px;
	text-decoration: none;
	color: #333333;
}
#header .nav ul li a:hover {
	color: #003399;
}
#header .nav ul li.current a,
#header .nav ul li.current a:hover
#header .nav ul li span {
	
}
#header .nav ul li .subnav {
	overflow: hidden;
	position: absolute;
	top: 46px; left: 0;
	height: 0;
	white-space:nowrap;
}
#header .nav ul li .subnav ul {
	float: none;
}
#header .nav ul li .subnav ul li {
	float: none;
	padding: 0 0 1px 0;
	text-align: center;
}
#header .nav ul li .subnav ul li a {
	display: block;
	background-color: #003399;
	color: #ffffff;
}
#header .nav ul li .subnav ul li a:hover {
	background-color: #2053bb;
}

/* トグルボタン */
header .nav-toggle {
	display: none;
}
/* ホバー */


/*============================================================
	フッター
*/
/* ナビ */
#footer .nav {
	padding: 35px 0;
	background-color: #333333;
	color: #ffffff;
}
#footer .nav a {
	text-decoration: none;
	color: #ffffff;
}
#footer .nav a:hover {
	text-decoration: underline;
}
#footer .nav nav {
	overflow: hidden;
}
#footer .nav nav ul {
	position: relative;
	float: left;
	padding: 0 15px;
	width: 25%;
}
#footer .nav nav ul:after {
	content: '';
	display: block;
	position: absolute;
	top: 0; left: 0;
	width: 1px; height: 9999px;
	background-color: #717171;
}
#footer .nav nav ul li {
	padding: 2px 0;
	font-weight: bold;
	font-size: 13px;
}
#footer .nav nav ul li ul {
	float: none;
	padding: 0;
	width: auto;
}
#footer .nav nav ul li ul:after {
	display: none;
}
#footer .nav nav ul li ul li {
	font-weight: normal;
}
/* 会社情報 */
#footer .info {
	padding: 40px 0;
	background-color: #eeeeee;
	text-align: center;
	font-size: 13px;
	line-height: 2;
	color: #666666;
}
#footer .info .logo a {
	overflow: hidden;
	display: block;
	margin: 0 auto;
	width: 200px; height: 50px;
	background: transparent url(../images/common/logo_header.png) 50% 50% no-repeat;
	-webkit-background-size: contain;
	background-size: contain;
	text-indent: -999em;
}
#footer .info .h {
	margin-top: 10px;
	font-weight: bold;
	font-size: 14px;
}
/* コピーライト */
#footer .copyright {
	padding: 30px 0;
	text-align: center;
}
#footer .copyright small {
	display: block;
	font-size: 12px;
	line-height: 1.3;
	color: #000000;
}

/*============================================================
	ページの先頭へ
*/
.pagetop {
	display: block;
	position: fixed;
	z-index: 1000;
	margin-bottom: -100px;
	opacity: 0;
	bottom: 20px; right: 20px;
	width: 60px; height: 60px;
	text-decoration: none;
}
.pagetop span {
	overflow: hidden;
	display: block;
	width: 100%; height: 100%;
	background: rgba(0,0,0,0.8) url(../images/common/pagetop.png) 50% 50% no-repeat;
	text-indent: -999em;
	-webkit-transition: opacity 0.4s ease;
	   -moz-transition: opacity 0.4s ease;
	    -ms-transition: opacity 0.4s ease;
	        transition: opacity 0.4s ease;
}
/* ホバー */
.pagetop span:hover {
	opacity: 0.6;
}

/*============================================================
	パン屑
*/
.breadcrumbs {
	padding: 12px 0;
	background-color: #f4f4f4;
	font-size: 13px;
	line-height: 1.5;
	color: #888888;
}
.breadcrumbs a {
	text-decoration: none;
	color: #888888;
}
.breadcrumbs a:hover {
	text-decoration: underline;
}

/*============================================================
	ボタン
*/
a.btn {
	display: block;
	margin: 0 auto;
	padding: 16px 10px;
	max-width: 480px;
	border-bottom: 3px solid transparent;
	text-align: center;
	font-weight: bold;
	font-size: 18px;
	line-height: 1.3;
	text-decoration: none;
	color: #ffffff;
	-webkit-transition: opacity 0.4s ease;
	   -moz-transition: opacity 0.4s ease;
	    -ms-transition: opacity 0.4s ease;
	        transition: opacity 0.4s ease;
}
a.btn:hover {
	opacity: 0.7;
}
a.btn-primary {
	background-color: #003399;
	border-color: #001848;
}

/*============================================================
	インデント
*/
ul.indent-note li {
	padding-left: 1em;
	text-indent: -1em;
	font-size: 13px;
}

/*============================================================
	カラムレイアウト
*/
.row-col3 {
	margin: 0 -12px;
	padding-bottom: 60px;
}
.row-col3:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	height: 0;
}
.row-col3 .col {
	position: relative;
	float: left;
	padding: 0 12px;
	width: 33.333%;
}
.row-col3 .col .h {
	margin: 18px 0 12px 0;
	font-weight: bold;
	font-size: 16px;
	line-height: 1.5;
}
.row-col3 .col p {
	font-size: 13px;
}
.row-col3 .col img {
	width: 100%;
	height:auto;
}

/*============================================================
	見出し
*/
.unit-head {
	padding: 50px 0 30px 0;
	text-align: center;
}
.unit-head .h {
	font-weight: bold;
	font-size: 28px;
	line-height: 1.4;
}
.unit-head .h span {
	color: #003399;
}
.unit-head p {
	margin-top: 10px;
	font-size: 14px;
	line-height: 1.7;
}

/*============================================================
	メイン
*/
.main {
	background-color: transparent;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	-webkit-background-size: cover;
	background-size: cover;
	text-align: center;
}
.main .container {
	display: table;
}
.main .container:after {
	display: none;
}
.main .inner {
	display: table-cell;
	vertical-align: middle;
	height: 336px;
	color: #ffffff;
}
.main .inner * {
	-webkit-text-shadow: 0px 0px 6px #000000;
	   -moz-text-shadow: 0px 0px 6px #000000;
	        text-shadow: 0px 0px 6px #000000;
}
.main .h {
	margin-bottom: 5px;
	font-weight: bold;
	font-size: 36px;
	line-height: 1.3;
}
.main p {
	font-size: 16px;
	line-height: 1.7;
}

/*============================================================
	お問い合わせ
*/
.contact {
	padding: 100px 0;
	background: transparent url(../images/common/contact_bg01.jpg) 50% 50% no-repeat;
	-webkit-background-size: cover;
	background-size: cover;
}
.contact .inner {
	padding: 40px 60px 50px 60px;
	background: #ffffff url(../images/common/contact_bg02.jpg) 100% 0% no-repeat;
}
.contact-sell .inner {
	background-image: url(../images/common/contact_bg03.jpg);
}
.contact .h {
	margin-bottom: 20px;
	font-weight: bold;
	font-size: 28px;
	line-height: 1.4;
}
.contact .h span {
	color: #be001b;
}
.contact p {
	font-size: 16px;
	line-height: 1.8;
	-webkit-text-shadow: 0px 0px 3px #ffffff;
	   -moz-text-shadow: 0px 0px 3px #ffffff;
	        text-shadow: 0px 0px 3px #ffffff;
}
.contact a.btn {
	margin-top: 40px;
	background-color: #be001b;
	border-color: #6c000f;
}

.ttl-contact {
	text-align:center;
	padding-top:24px;
}

.ttl-contact h3 {
	font-weight:bold;
	font-size:120%;
}


/*============================================================
	関連記事一覧
*/
.related {
	background-color: #003399;
	color: #ffffff;
}
.related a {
	display: block;
	color: #ffffff;
}
.related .unit-head {
	padding-bottom: 0;
}
.related ul li {
	margin-top: 30px;
}
.related ul li a {
	display: block;
	text-decoration: none;
	-webkit-transition: opacity 0.4s ease;
	   -moz-transition: opacity 0.4s ease;
	    -ms-transition: opacity 0.4s ease;
	        transition: opacity 0.4s ease;
}
.related ul li a:hover {
	opacity: 0.7;
}
.related ul li .h {
	font-weight: bold;
	font-size: 16px;
	line-height: 1.4;
}

/*============================================================
	ページ送り
*/
.pagination {
	display: table;
	margin: 0 auto;
}
.pagination span,
.pagination a {
	display: block;
	float: left;
	margin: 0 5px;
	width: 34px;
	border: 2px solid #113476;
	text-align: center;
	font-size: 18px;
	line-height: 30px;
	text-decoration: none;
	color: #113476;
	-webkit-transition: background-color 0.4s ease;
	   -moz-transition: background-color 0.4s ease;
	    -ms-transition: background-color 0.4s ease;
	        transition: background-color 0.4s ease;
}
.pagination a:hover {
	background-color: #d0ddf5;
}
.pagination .current,
.pagination .current:hover {
	background-color: #113476;
	color: #ffffff;
}

/*============================================================
	シェアボタン
*/
.share {
	padding: 46px 0;
	border-top: 1px solid #cccccc;
}
.share ul {
	display: table;
	margin: 0 auto;
}
.share ul li {
	display: table-cell;
	vertical-align: top;
	padding: 0 3px;
	text-align: center;
	font-size: 13px;
	line-height: 1.5;
}
.share ul li a {
	display: block;
	padding: 10px 0;
	width: 196px;
	background-color: #000000;
	border-radius: 5px;
	text-decoration: none;
	color: #ffffff;
	-webkit-transition: opacity 0.4s ease;
	   -moz-transition: opacity 0.4s ease;
	    -ms-transition: opacity 0.4s ease;
	        transition: opacity 0.4s ease;
}
.share ul li a:hover {
	opacity: 0.7;
}
.share ul li a span {
	position: relative;
	display: inline-block;
	padding-left: 26px;
}
.share ul li a span:before {
	content: '';
	display: block;
	position: absolute;
	top: 50%; left: 0;
	margin-top: -11px;
	width: 20px; height: 20px;
	background-color: transparent;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	-webkit-background-size: contain;
	background-size: contain;
}
.share ul li a.twitter {
	background-color: #6eabeb;
}
.share ul li a.twitter span:before {
	background-image: url(../images/common/icon_twitter.png);
}
.share ul li a.facebook {
	background-color: #3f5896;
}
.share ul li a.facebook span:before {
	background-image: url(../images/common/icon_facebook.png);
}
.share ul li a.hatena {
	background-color: #4a7ccd;
}
.share ul li a.hatena span:before {
	background-image: url(../images/common/icon_hatena.png);
}
.share ul li a.linkedin {
	background-color: #4c7ab4;
}
.share ul li a.linkedin span:before {
	background-image: url(../images/common/icon_linkedin.png);
}



/*============================================================
	フォーム
*/
form {
	width:80%;
	margin:18px auto 60px auto;
}

input.tx {
width:100%;
margin:5px 0 14px 0;
background:#FFF;
border:solid 3px #CCC;
padding:12px 14px;
font-size:14px;
}

 input.large {
width:90%;
}

 input.medium {
width:70%;
}

 input.small {
width:50%;
}

 input.s-small {
width:30%;
}

 input.ss-small {
width:10%;
}

 input.radiobtn {
width:14px;
background:none;
border:none;
}

 textarea {
width:100%;
height:200px;
margin:8px 0;
background:#FFF;
border:solid 3px #CCC;
padding:1px;
font-size:14px;
}

.wpcf7-not-valid-tip {
	margin-bottom:30px;
}


/* ////////////////////////////////////////////////////////////
	ブレイクポイント
*/
@media screen and (max-width: 680px) {

	/*============================================================
		BODY
	*/
	body {
		font-weight: normal;
		font-size: 11px;
		line-height: 1.6;
	}

	/*============================================================
		表示 & 非表示
	*/
	.visible-pc {
		display: none;
	}
	.visible-sp {
		display: block;
	}

	/*============================================================
		コンテナ
	*/
	#container {
		padding-top: 45px;
		width: 100%;
		/*width: 320px;*/
		min-width: 1px;
	}
	.container {
		padding-left: 10px;
		padding-right: 10px;
		width: 100%;
	}

	/*============================================================
		ヘッダー
	*/
	#header {
		height: 45px;
		min-width: 1px;
		border: 0;
	}
	/* 概要 */
	#header .description {
		top: 14px; left: 120px;
		height: auto;
		font-size: 11px;
		line-height: 1.4;
		color: #212121;
		white-space: nowrap;
		-webkit-transform-origin: 0% 0%;
		        transform-origin: 0% 0%;
		-webkit-transform: scale(0.6);
	            transform: scale(0.6);
	}
	#header .description br {
		display: block;
	}
	/* ロゴ */
	#header .logo {
		top: 7px; left: 7px;
	}
	#header .logo a,
	#header .logo span {
		width: 106px; height: 26px;
	}
	/* ナビ */
	#header .nav {
		overflow: hidden;
		position: absolute;
		top: 45px; left: 0;
		padding: 0;
		width: 100%; height: 0;
	}
	#header .nav ul {
		float: none;
	}
	#header .nav ul li {
		float: none;
		padding: 0;
		border-bottom: 1px solid #ffffff;
		text-align: center;
		font-size: 12px;
		line-height: 1.5;
	}
	#header .nav ul li:last-child {
		border-bottom: 0;
	}
	#header .nav ul li a,
	#header .nav ul li span {
		position: relative;
		display: block;
		padding: 10px;
		background-color: rgba(0,51,153,0.9);
		color: #ffffff;
	}
	#header .nav ul li a:hover {
		color: #ffffff;
	}
	#header .nav ul li a.opener i {
		display: block;
		position: absolute;
		top: 50%; right: 12px;
		margin-top: -5px;
		width: 13px; height: 9px;
		background: transparent url(../images/common/nav_arrow_sp.png) 0 0 no-repeat;
		-webkit-background-size: cover;
		background-size: cover;
	}
	#header .nav ul li .subnav {
		position: static;
		height: 0;
	}
	#header .nav ul li .subnav ul {
		border-top: 1px solid #ffffff;
	}
	#header .nav ul li .subnav ul li {
		padding: 0;
	}
	#header .nav ul li .subnav ul li a,
	#header .nav ul li .subnav ul li a:hover {
		background-color: rgba(0,158,226,0.9);
		color: #ffffff;
	}
	/* トグルボタン */
	#header .nav-toggle {
		position: absolute;
		top: 0; right: 0;
		display: block;
		width: 46px; height: 45px;
	}
	#header .nav-toggle a {
		overflow: hidden;
		position: absolute;
		top: 0; left: 0;
		display: block;
		width: 100%; height: 100%;
		background: #003399 url(../images/common/nav_toggle.png) 0 0 no-repeat;
		-webkit-background-size: 46px 90px;
		background-size: 46px 90px;
		text-indent: -999em;
	}
	.nav-opened #header .nav-toggle a {
		background-position: 0 -45px;
	}

	/*============================================================
		フッター
	*/
	/* ナビ */
	#footer .nav {
		padding: 5px 0;
	}
	#footer .nav nav ul {
		float: none;
		padding: 10px 0;
		width: 100%;
		border-bottom: 1px solid #717171;
	}
	#footer .nav nav ul:after {
		display: none;
	}
	#footer .nav nav ul:last-child {
		border-bottom: 0;
	}
	#footer .nav nav ul li {
		display: inline;
		font-size: 11px;
		line-height: 1.5;
	}
	#footer .nav nav ul li:after {
		content: '/';
		display: inline;
		padding-left: 0.5em;
	}
	#footer .nav nav ul li:last-child:after {
		display: none;
	}
	#footer .nav nav ul li ul {
		padding: 2px 0 0 0;
		border-bottom: 0;
	}
	#footer .nav nav ul li ul li {
		display: inline;
		font-size: 10px;
		line-height: 2;
	}
	/* 会社情報 */
	#footer .info {
		padding: 10px 0;
		font-size: 10px;
		line-height: 1.5;
	}
	#footer .info .logo a {
		width: 120px; height: 30px;
	}
	#footer .info .h {
		margin-bottom: 5px;
		font-size: 10px;
	}
	/* コピーライト */
	#footer .copyright {
		padding: 15px 0;
	}
	#footer .copyright small {
		font-size: 10px;
		line-height: 1.3;
	}

	/*============================================================
		ページの先頭へ
	*/
	.pagetop {
		bottom: 5px; right: 5px;
		width: 32px; height: 32px;
	}
	.pagetop span {
		-webkit-background-size: 13px 10px;
		background-size: 13px 10px;
	}

	/*============================================================
		パン屑
	*/
	.breadcrumbs {
		padding: 6px 0;
		font-size: 10px;
		line-height: 1.5;
	}

	/*============================================================
		ボタン
	*/
	a.btn {
		padding: 12px 5px;
		max-width: 100%;
		font-size: 12px;
		line-height: 1.5;
		border-width: 2px;
	}

	/*============================================================
		インデント
	*/
	ul.indent-note li {
		font-size: 10px;
	}

	/*============================================================
		カラムレイアウト
	*/
	.row-col3 {
		margin: 0;
		padding-bottom: 0;
	}
	.row-col3 .col {
		float: none;
		padding: 0;
		margin-bottom: 20px;
		width: 100%;
	}
	.row-col3 .col .h {
		margin: 12px 0 8px 0;
		font-size: 14px;
		line-height: 1.5;
	}
	.row-col3 .col p {
		font-size: 10px;
	}

	/*============================================================
		見出し
	*/
	.unit-head {
		padding: 20px 0 15px 0;
	}
	.unit-head .h {
		font-size: 15px;
		line-height: 1.4;
	}
	.unit-head p {
		margin-top: 5px;
		font-size: 10px;
		line-height: 1.7;
	}

	/*============================================================
		メイン
	*/
	.main .inner {
		height: 168px;
	}
	.main .inner * {
		-webkit-text-shadow: 0px 0px 4px #000000;
		   -moz-text-shadow: 0px 0px 4px #000000;
		        text-shadow: 0px 0px 4px #000000;
	}
	.main .h {
		margin-bottom: 5px;
		font-size: 18px;
		line-height: 1.3;
	}
	.main p {
		font-size: 10px;
		line-height: 1.7;
	}

	/*============================================================
		お問い合わせ
	*/
	.contact {
		padding: 20px 0;
	}
	.contact .inner {
		padding: 10px;
		background-image: none;
	}
	.contact-sell .inner {
		background-image: none;
	}
	.contact .h {
		margin-bottom: 0;
		padding: 5px 0 10px 0;
		text-align: center;
		font-size: 15px;
		line-height: 1.4;
	}
	.contact p {
		font-size: 10px;
		line-height: 1.8;
	}
	.contact p br {
		display: none;
	}
	.contact a.btn {
		margin-top: 15px;
	}

	/*============================================================
		関連記事一覧
	*/
	.related ul li {
		margin-top: 15px;
	}

	/*============================================================
		ページ送り
	*/
	.pagination span,
	.pagination a {
		margin: 0 3px;
		width: 26px;
		border-width: 1px;
		font-size: 15px;
		line-height: 24px;
	}

	/*============================================================
		シェアボタン
	*/
	.share {
		padding: 15px 0;
	}
	.share ul {
		display: block;
		margin: 0 -3px;
	}
	.share ul li {
		display: block;
		float: left;
		padding: 3px;
		width: 50%;
		font-size: 11px;
		line-height: 1.5;
	}
	.share ul li a {
		padding: 6px 0;
		width: 100%;
		border-radius: 3px;
	}

}