﻿@charset "utf-8";

/* --------------------------------------------------------
   base
-------------------------------------------------------- */
html {
	background: #000a5a url(../img/bg.jpg) repeat-x;
}

body {
	color: #333;
	text-align: center;
	border-top: 4px solid #e12e3d;
	background: url(../img/main_bg.jpg) no-repeat 50% 6px;
}

.wrapper {
	font-family: "Noto Sans JP", "ＭＳ Ｐゴシック", sans-serif;
	font-size:  12px;
	text-align: left;
	width: 950px;
	margin-left: auto;
	margin-right: auto;
	background: url(../img/navi_bg.gif) repeat-y;
}

.small_only {
	display: none;
}

@media screen and (max-device-width: 767px) {
	html {
		background: none;
	}
	.wrapper {
		width: 100%;
		float: none;
		background: none;
	}
	.large_only {
		display: none;
	}
	.small_only {
		display: block;
	}
}



/* --------------------------------------------------------
   link
-------------------------------------------------------- */
a { text-decoration: none; }
a:link { color: #3d63a0; }
a:visited { color: #7a99cd; }

a:hover
{
	text-decoration: underline;
	padding-bottom: 1px;
}

a.opct:hover img {
	opacity:0.7;				/* Firefox用 */
	filter:alpha(opacity=70);	/* Internet Explorer用 */
}

a.mkLink {
	background: url(../img/mk_link.gif) no-repeat;
	padding-left: 15px;
}

a.mkLink, a.mkLink:visited {
	color: #606060;
}

a.sWin {
	padding-left: 15px;
	background: url(../img/mk_win.gif) no-repeat;
}

.hover {
	transition: opacity .4s;
	-webkit-transition: opacity .4s;
	-moz-transition: opacity .4s;
	-ms-transition: opacity .4s;
	-o-transition: opacity .4s;
}
.hover:hover {
	opacity: .7;
}


/* --------------------------------------------------------
   top message
-------------------------------------------------------- */
h1.message {
	color: #b3b7d6;
	font-size: 80%;
	font-weight: normal;
	text-align: right;
	margin-bottom: 33px;
}
@media screen and (max-device-width: 767px) {
	h1.message {
		display: none;
	}
}



/* --------------------------------------------------------
   navi
-------------------------------------------------------- */
nav
{
	width: 236px;
	float: left;
}

nav ul
{
	margin-bottom: 20px;
}

nav p
{
	text-align: center;
}

nav #navi1 a:hover img,
nav #navi2 a:hover img,
nav #navi3 a:hover img,
nav #navi4 a:hover img,
nav #navi5 a:hover img,
nav #navi6 a:hover img,
nav #navi7 a:hover img,
nav #navi8 a:hover img,
nav #navi9 a:hover img,
nav #navi10 a:hover img,
nav #navi11 a:hover img,
nav #navi12 a:hover img,
nav #navi13 a:hover img
{
	opacity:0;					/* Firefox用 */
	filter:alpha(opacity=0);	/* Internet Explorer用 */
}

nav #navi1
{
	background: url(../img/navi_01_on.gif) no-repeat;
}

nav #navi2
{
	background: url(../img/navi_02_on.gif) no-repeat;
}

nav #navi3
{
	background: url(../img/navi_03_on.gif) no-repeat;
}

nav #navi4
{
	background: url(../img/navi_04_on.gif) no-repeat;
}

nav #navi5
{
	background: url(../img/navi_05_on.gif) no-repeat;
}

nav #navi6
{
	background: url(../img/navi_06_on.gif) no-repeat;
}

nav #navi7
{
	background: url(../img/navi_07_on.gif) no-repeat;
}

nav #navi8
{
	background: url(../img/navi_08_on.gif) no-repeat;
}

nav #navi9
{
	background: url(../img/navi_09_on.gif) no-repeat;
}

nav #navi10
{
	background: url(../img/navi_10_on.gif) no-repeat;
}

nav #navi11
{
	background: url(../img/navi_11_on.gif) no-repeat;
}

nav #navi12
{
	background: url(../img/navi_12_on.gif) no-repeat;
}
nav #navi13
{
	background: url(../img/navi_13_on.gif) no-repeat;
}
.small_header,
.navi_text {
	display: none;
}
.navi_child_list {
	margin-bottom: 0;
}
@media screen and (max-device-width: 767px) {
	body {
		background: #18458e;
		background: #18458e url(../img/main_bg_s.jpg) no-repeat 50% 58px / 100% auto;
		padding-top: 4px;
	}
	.header {
		background: #f2f3f7;
	}
	.show {
		position: fixed;
	}
	.small_header {
		width: 100%;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 14px 8px;
	}
	.small_header_logo {
		max-width: 172px;
	}
	.small_header_logo img {
		width: 100%;
		height: auto;
	}
	.small_header .menu_btn {
		width: 40px;
		height: 40px;
		position: relative;
		z-index: 999;
	}
	.header .menu_btn_line:nth-of-type(1) {
		top: calc(50% - 4px);
	}
	.header .menu_btn_line:nth-of-type(2) {
		top: calc(50% + 4px);
	}
	.header .menu_btn.show .menu_btn_line:nth-of-type(1) {
		top: 10px;
		transform: translateY(6px) rotate(-15deg);
	}
	.header .menu_btn.show .menu_btn_line:nth-of-type(2) {
		top: 22px;
		transform: translateY(-6px) rotate(15deg);
	}
	.header .menu_btn_line {
		display: inline-block;
		width: 40px;
		height: 3px;
		background: #003585;
		position: absolute;
		transition: .4s;
	}
	/*#navi {
		display: none;
	}*/
	nav {
		width: 100%;
		float: none;
		position: fixed;
		top: 80px;
		left: 0;
		right: 0;
		bottom: 0;
		opacity: 0;
		visibility: hidden;
		background: #f2f3f7;
		transition: opacity .5s, visibility .5s;
	}
	nav.show {
		opacity: 1;
		visibility: visible;
		overflow-y: scroll;
	}
	.navi_item,
	.navi_item_child {
		background: none!important;
	}
	.navi_text {
		display: block;
	}
	.navi_item img {
		display: none;
	}
	.navi_item .navi_text {
		display: block;
		color: #18458e;
		font-size: 30px;
		font-weight: 500;
		padding: 10px 18px 12px;
		border-bottom: 1px solid #b8b5cd;
		position: relative;
	}
	.navi_item .navi_text::after {
		display: inline-block;
		content: "";
		color: #18458e;
		width: 10px;
		height: 15px;
		background: url(../img/icon_arrow.png) no-repeat 50% 50% / cover;
		position: absolute;
		top: calc(50% - 5px);
		right: 16px;
	}
	.navi_item.has_child > a {
		display: none;
	}
	.navi_item.has_child .ac_triger {
		position: relative;
		pointer-events: all;
	}
	.navi_item.has_child > .navi_text::after {
		display: inline-block;
		content: "＋";
		color: #18458e;
		font-weight: bold;
		font-size: 20px;
		line-height: 1;
		width: 20px;
		height: 20px;
		background: none;
		position: absolute;
		top: calc(50% - 10px);
		right: 12px;
	}
	.navi_item_child .navi_text {
		color: #2c2c2c;
		font-size: 18px;
		background: #d2dcf0;
		padding: 14px 18px 16px;
	}
	.navi_item_child .navi_text::after {
		display: none;
	}
	.navi_child {
		display: none;
	}
}



/* --------------------------------------------------------
   main
-------------------------------------------------------- */
#main
{
	float: right;
	width: 670px;
	margin-top: 8px;
}

#main h1,
#main h2,
#main h3,
#main h4,
#main h5,
#main h6,
#main p
{
	line-height: 1.6;
}

#main #btnCnt
{
	text-align: center;
}

@media screen and (max-device-width: 768px) {
	#main h2.page_title {
		color: #e6e6e6;
		font-size: 38px;
		font-weight: bold;
		line-height: 1.2;
		min-height: 140px;
		padding: 36px 2% 20px;
		text-shadow: 2px 2px 2px #333;
	}
	.page_title .mini {
		color: #fff;
		font-size: 16px;
		display: block;
		margin-bottom: 4px;
	}
	.page_title .en {
		display: block;
		text-align: right;
		font-size: 1px;
		margin-top: 2px;
	}
	.page_title .en img {
		width: 224px;
		height: auto;
	}
	#main #btnCnt {
		width: 73.5%;
		margin: 0 auto;
	}
	#main #btnCnt img {
		width: 100%;
		height: auto;
	}
}

.sec header
{
	margin-bottom: 33px;
}

.sec h2
{
	margin-bottom: 24px;
}

.sec #waku
{
	padding-bottom: 43px;
	background: #fff url(../img/waku_btm.gif) no-repeat 0 100%;
}

.sec #waku .pankuzu
{
	font-size: 80%;
	padding: 0 6px 0 14px;
	margin-bottom: 30px;
	background: url(../img/waku_top.gif) no-repeat;
	color: #999;
}

.sec #waku .pankuzu li
{
	float: left;
	padding: 8px 5px 10px 15px;
	line-height: 1.2;
	background: url(../img/pankuzu.gif) no-repeat;
}

.sec #waku .pankuzu .home
{
	background: none;
}

.sec #waku section,
.sec #waku .secBox
{
	margin-left: 32px;
	margin-bottom: 50px;
	width: 603px;
}

.content_title
{
	font-size: 120%;
	background: url(../img/tit_bg.gif) no-repeat;
	padding: 5px 13px 5px 18px;
	margin-bottom: 17px;
}

@media screen and (max-device-width: 768px) {
	.sec #waku section,
	.sec #waku .secBox {
		margin-left: 0;
		margin-bottom: 0;
		width: 100%;
		padding: 0 2%;
	}
	.content_title {
		background: url(../img/tit_bg_s.png) no-repeat top left / 100% auto;
	}
	.content_title.long {
		background: url(../img/tit_bg_long.png) no-repeat top left / 100% auto;
	}
}

.sec #waku section p
{
	margin-bottom: 15px;
}

.sec #waku section img.left
{
	margin-right: 22px;
}

.sec #waku section img.right
{
	margin-left: 18px;
}


@media screen and (max-device-width: 768px) {
	#main {
		width: 100%;
		float: none;
	}
	.contant_wrapper {
		width: 100%;
		display: flex;
		flex-direction: column;
	}
	.contant_wrapper.reverse {
		flex-direction: column-reverse;
	}
	.contant_img {
		text-align: center;
	}
	.contant_img img {
		float: none;
		margin: 0;
	}
}


/* --------------------------------------------------------
   list
-------------------------------------------------------- */
ul.def li
{
	background: url(../img/mk_list.gif) no-repeat 0 9px;
	padding: 6px 0 6px 12px;
}



/* --------------------------------------------------------
   table
-------------------------------------------------------- */
table
{
	width: 100%;
	border: #e0e0e0 1px solid;
}

table th,
table td
{
	border: #d0d0d0 1px dotted;
	padding: 8px 10px;
	line-height: 1.6;
}

table th
{
	vertical-align: top;
	background-color: #f0f0f0;
}

table.type2
{
	border: none;
}

table.type2 th
{
	width: 25%;
}
table.type2 td {
	width: 75%;
}

table.type2 th,
table.type2 td
{
	border-left: none;
	border-right: none;
}

table.stripe td
{
	background-color: #fff;
}

table.stripe tr.odd td
{
	background: #f3f3f3;
}



/* --------------------------------------------------------
   form
-------------------------------------------------------- */
form table .hissu
{
	margin-left: 4px;
	vertical-align: middle;
}

form table .width
{
	width: 180px;
}

form table .width2
{
	width: 260px;
}

form table .zip
{
	width: 70px;
}

form table textarea
{
	width: 400px;
}
@media screen and (max-device-width: 767px) {
	form table textarea {
		width: 100%;
	}
}

.error
{
	color: #cc0000;
}

form table .error
{
	margin-bottom: 4px;
}

form #btnSubmit
{
	margin-top: 15px;
	text-align: center;
}

form #btnSubmit input
{
	padding: 5px 15px;
}

/*@media screen and (max-device-width: 767px) {
	form table textarea {
		width: 100%;
	}
}*/


/* --------------------------------------------------------
   footer
-------------------------------------------------------- */
footer
{
	background: #fff url(../img/footer_bg.png) repeat-x;

	/* 最低限の高さを設定 */
	min-height: 146px;
	height: auto !important;
	height: 146px;
}

footer .wrapper
{
	padding-top: 43px;
	background: url(../img/footer_top.png) no-repeat;
}

footer .pageTop
{
	text-align: right;
}

footer .left,
footer .right
{
	margin-top: 9px;
}

footer .copyright img
{
	margin-top: 2px;
}
@media screen and (max-device-width: 767px) {
	footer {
		min-height: auto;
		background: none;
	}
	footer .wrapper {
		background: url(../img/footer_bg_s.png) no-repeat 50% 50% / cover;
		padding: 0 2%;
		margin-top: 45px;
		position: relative;
	}
	footer .pageTop {
		width: 35px;
		height: 25px;
		position: absolute;
		top: -24px;
		right: 0;
	}
	footer .pageTop img {
		width: 100%;
		height: auto;
	}
	footer .sitemap {
		display: none;
	}
	.footer_logo {
		display: block;
		width: 192px;
	}
	.footer_logo img {
		width: 100%;
		height: auto;
	}
	.copyright {
		display: block;
		margin-bottom: 16px;
	}
}



/* --------------------------------------------------------
   common
-------------------------------------------------------- */
h1,
h2,
h3,
h4,
h5,
h6,
p
{
	margin: 0;
}

.txtC {
	text-align: center;
}

.left {
	float: left;
}

.right {
	float: right;
}

.clearfix:after {
	content: url(../img/spacer.gif);
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
	font-size: 0.1em;	/* Firefox用 */
}

.clearfix {
	min-height: 1px;
}

* html .clearfix {
	height: 1px;
}

em {
	font-style: normal;
	font-weight: bold;
}

.radius {
	border: 1px solid #ddd;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

img
{
	vertical-align: bottom;
}

/* IE6 */
* html {
	
}
/* IE7 */
*+html {
	
}



/* --------------------------------------------------------
   margin
-------------------------------------------------------- */
.mb5
{
	margin-bottom: 5px !important;
}

.mb10
{
	margin-bottom: 10px !important;
}

.mb15
{
	margin-bottom: 15px !important;
}

.mb20
{
	margin-bottom: 20px !important;
}

.mb25
{
	margin-bottom: 25px !important;
}

.mb30
{
	margin-bottom: 30px !important;
}

.mb35
{
	margin-bottom: 35px !important;
}
