@charset "utf-8";

/* -----------------------------------------
 * 1. reset
 * 2. header
 * 3. gnav(gloval nav)
 * 4. breadcrumbs
 * 5. contents
 * 6. footer
 * 7. @mediaQueries
 * ----------------------------------------*/


/* -----------------------------------------
 * 1. reset
 * ----------------------------------------*/

body, h1, h2, h3, h4, h5, h6, p, ul, ol, dl, dd{
	margin: 0; padding: 0; font-weight:normal; font-size: 100%; _min-width: 1080px;
	font-family: 'ヒラギノ角ゴPro W3','Hiragino kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif}

img{ border: none; vertical-align: bottom; max-width: 100%}

li{list-style-type: none}

figure{ text-align:center}

body{ -webkit-text-size-adjust: 100%; color: #333; font-size: 62.5%}

/* clearfix */
.cf{ zoom:1}
.cf:before, .cf:after{ content: ""; display: table}
.cf:after{ clear: both}

/* link */
a:link, a:visited{ color: #144171; text-decoration: none}
a:hover, a:active{ text-decoration: underline}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, video{ display:block}

.text-left{text-align: left; float: left;}
.text-center{text-align: center; margin: 0 auto;}
.text-right{text-align: right; float: right;}

.clear{clear:both;}

.list-inline li{display: inline;}

dl.yoko{
	width:100%;
	}

dl.yoko dt{
	float:left;
}

dl.yoko dd{
	margin-left:100px;
}


/* 中タイトル */

#main .mdl_ttl {
	font-size: 1.9em;
	padding: 8px 0 0 5px;
	margin: 0 0 15px 0;
	font-weight: bold;
	position: relative;
	/*border-top: 3px solid #666; 黒線*/
}
#main .mdl_ttl span {
	position: absolute;
	display: block;
	width: 130px;
	height: 3px;
	/*background: #C00; 赤線*/
	top: -3px;
	left: 0;
	_display: none;/* forIE */
}
#main .sub_ttl {
	font-weight: bold;
	font-size: 1.4em;
	margin: 25px 20px 10px 0;
	position: relative;
	padding: 0 0 0 15px;
}
#main .sub_ttl:before {
	content: "";
	display: block;
	width: 3px;
	height: 25px;
	position: absolute;
	left: 0;
	_left: -15px;/* forIE */
	background: #E7878B;
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#FFE68382', endColorstr='#FFCC0000');
	-ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#FFE68382, endcolorstr=#FFCC0000))";
 	background: -moz-linear-gradient(top, #E68382, #C00 100%);
	background: -webkit-gradient(linear, left top, left bottom, from(#E68382), color-stop(1.0, #C00));
	background: linear-gradient(to bottom, #E68382, #C00);
}

h3.midashi{
	font-weight:bold;
	font-size:1.2em;
	margin:20px 0 10px 0;
}

h4.midashi2{
	font-weight:bold;
	font-size:1.1em;
	margin:20px 0 5px 0;
}

ul.list{
	margin:0 0 10px 10px;
	padding-left:20px;
}

ul.list li{
	list-style-type:disc;
}

/* -----------------------------------------
 * 2. header
 * ----------------------------------------*/

#head {
    border-top: 10px solid #2b80d5;
    padding: 5px 0;
    width: 100%;
}

#cover{display:none;}

#header {
		width:980px;
		margin: 0 auto 16px;
		position:relative;
		text-align:left;
}

#tagline {
	padding: 12px 0 10px;
	width: 980px;
	margin: 0 auto;
	font-size:9px;
	letter-spacing: 0.1em;
}

#header p {
	margin: 0 10px;
}

#header ul {
	position: absolute;
	right: 5px;
	/*top: -25px;*/
	top: 0px;
}

#header ul li {
	float: left;
	font-size: 1.1em;
}

#header ul li .tri {
	padding: 0 5px 0 20px;
	font-size: 0.8em;
	color: #444;
}

#header ul li a {
	color: #333;
}

#header ul li a span {
	display: none;
}

/* -----------------------------------------
 * 3. gnav
 * ----------------------------------------*/

#gnav{
	border-top: 0px solid #DDD;     /*ナビの上の線の設定ここ*/
	margin: 0 0 10px;
}

#gnav .inner {
	width: 1080px;
	margin: 0 auto;
}

#gnav ul {
	padding: 0 40px 0 50px;
	background: url(../img/gnav_bd1.gif) no-repeat 49px 4px;    /*ナビの青線ここ*/
}

#gnav ul li {
	float: left;
	/*width: 196px; ナビ5個の時*/
	width: 16.6%;
}
#gnav ul li a {
	display: block;
	padding: 4px 0 3px;
	color: #222;
	text-align: center;
	font-size: 1.2em;
	text-shadow: 1px 0 1px #FFF;
}
#gnav ul li a:hover {
	background:#f7fafd;
	background-size: 100% 100%;
	text-decoration: none;
	color: #154272;
}
#gnav ul li.on {
	border-bottom: 1px solid #DDD;
}
#gnav ul li.on a {
	background: #FFF;
 	/*background: -moz-linear-gradient(top, #F4F4F4, #FFF 20%, #FFF 100%);
	background: -webkit-gradient(linear, left top, left bottom, from(#F4F4F4), color-stop(0.2, #FFF), color-stop(1.0, #FFF));*/
	padding: 4px 0 2px;
}
#gnav ul li a span {
	display: block;
	padding: 11px 0 7px;
	background: url(../img/gnav_bd1.gif) no-repeat right center;
}


/* -----------------------------------------
 * 4. breadcrumbs
 * ----------------------------------------*/

 #contents2 {
	margin: 0 auto 0;
	position: relative;
	width: 100%;
	background-color:#2b80d5;
}
.bread {
	position: relative;
	width: 980px;
	max-width: 100%;
	margin: 10px auto 10px;
	color: #FFF;
}

.bread li {
	float: left;
	padding: 0 10px 0 0;
	/*font-size: 1.1em;*/
	font-size: 1.5em;
}

.bread li a {
	padding: 0 10px 0 0;
	color: #FFF;
}

/* -----------------------------------------
 * 5. contents
 * ----------------------------------------*/

#contents {
	margin: 20px auto 70px;
	position: relative;
	width: 980px;
}
#contents.wide #main {
  float: none;
  width: auto;
}

/* main */
#main {
	padding: 0 20px 10px 0;
	float: left;
	width: 730px;
}

/* sidenav */
#snav {
	width: 230px;
	float: right;
}
#snav #snav_ttl {
	color: #FFF;
	font-size: 1.6em;
	background: #444;
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#FF666666', endColorstr='#FF333333');
	-ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startcolorstr=#FF666666, endcolorstr=#FF333333))";
 	background: -moz-linear-gradient(top, #666, #333 80%, #333 100%);
	background: -webkit-gradient(linear, left top, left bottom, from(#666), color-stop(0.8, #333), color-stop(1.0, #333));
	padding: 15px 10px;
}
#snav ul {
	margin: 0 0 20px;
}

#snav ul li {
	background: #EEE;
	font-size: 1.4em;
	border-bottom: 1px solid #DFDFDF;
}
#snav ul li.ttl {
	background: #777;
	color: #FFF;
	border-bottom: none;
	padding: 13px 25px 10px 10px;
}
#snav ul li.ttl.on {
	background: #444;
}
#snav ul li a {
	color: #333;
	display: block;
	padding: 13px 25px 10px 10px;
	position: relative;
	text-decoration: none;
	font-size: 0.9em;
}
#snav ul li a:hover {
	background: #E2E7EA;
	color: #134072;
}
#snav ul li.on a {
	background: #FFF;
 	background: -moz-linear-gradient(top, #F5F5F5, #FFF 50%, #FFF 100%);
	background: -webkit-gradient(linear, left top, left bottom, from(#F5F5F5), color-stop(0.5, #FFF), color-stop(1.0, #FFF));
}
#snav ul li a span {
	background: url(../img/icon_pc.png) no-repeat -69px -71px;
	background: url(../img/icon_pc.png) no-repeat -69px -71px\9;/* forIE */
	background-size: 79px auto;
	display: block;
	width: 5px;
	height: 8px;
	position: absolute;
	right: 15px;
	top: 50%;
	_top: 20px;/* forIE6 */
	margin: -3px 0 0;
}
#snav .bnr_l,
#snav .bnr_s {
	margin: 0 0 10px;
}
#snav img {
	_width: 100%;
}

/* -----------------------------------------
 * 6. footer
 * ----------------------------------------*/

#footer {
	margin: 25px 0 0;
	border-top: 1px solid #DDD;
	padding: 1px 0 0;
	background: #EEE\9;
	*width: 100%;/* forIE */
	*zoom:1;/* forIE */
}
#footer .bg {
	background: #dceaf8;
 	background: -moz-linear-gradient(top, #dceaf8, #f7fafd 100%);
	background: -webkit-gradient(linear, left top, left bottom, from(#dceaf8), color-stop(1.0, #f7fafd));
	background: -o-linear-gradient(top, #dceaf8, #f7fafd 100%);
	background: linear-gradient(top, #dceaf8, #f7fafd 100%);
	width: 1080px\9;
	margin: 0 auto\9;
}
#footer .bg .inner {
	margin: 0 auto;
	width: 980px;
	position: relative;
	padding: 20px 0;
}

/*page top*/
#footer .go_top  a{
		background-color:#236ab1;
		padding:30px 0px 0px 0px;
		width:30px;
		height:0px;
		color:#FFF;
		font-size:10px;
		line-height:1.2;
		display:block;
		overflow:hidden;
		text-align:center;
		margin: 0;
		position: fixed;
		bottom: 20px;
		right: 20px;
		z-index:5000;
		background-image:url(../img/btn_top.gif);
		background-repeat:no-repeat;
		background-position:0 0;
}


#footer .go_top  a:hover {
		background-color:#95bfea;
}


#footer .block p {
	font-weight: bold;
	font-size: 1.2em;
	margin: 0 0 10px;
}
#footer .block p a {
	color: #333;
}
#footer .block p span {
	color: #D72C47;
	font-size: 0.5em;
	padding: 0 5px 0 0;
}
#footer .block p span.plus,
#footer .block p span.minus {
	display: none;
}
#footer .block p a span {
	display: none;
}
#footer ul {
	margin: 0 auto;
	width: auto;
}
#footer ul li {
	margin: 0 10px 10px 0;
	display: inline;
}
#footer ul li a {
	color: #333;
	font-size: 1.2em;
}
#footer ul li a span {
	display: none;
}
#footer .copy {
	background: #ADADAD;
	color: #666;
	font-size: 1.1em;
	_min-width: 1080px;/* forIE */
}
#footer .copy p {
	text-align: right;
	width: 980px;
	max-width: 100%;
	margin: 0 auto;
	padding: 10px 0;
	background: #666\9;
	_min-width: 1080px;/* forIE */
}
#footer .copy p a {
	float: left;
	color: #666;
	text-decoration: none;
}


/* -----------------------------------------
 * 7. mediaQueries
 * ----------------------------------------*/

@media screen and (max-width:1080px){
	#tagline {
		padding: 12px 10px 10px;
		width: auto;
	}
	#header {
		width: auto;
		margin: 0 0 16px;
	}
	#gnav .inner {
		width: auto;
	}
	#gnav ul {
		padding: 0;
		background: none;
	}
	#gnav ul li a {
		font-size: 1.4em;
	}
	.bread {
		margin: 10px 0;
	}

	.bread li:first-child{
		content: "";
		margin-left: 10px;
	}

	/* contents */
	#contents {
		width: 750px;
	}
	#main {
		padding: 0 10px 50px;
		float: none;
		width: auto;
	}
	/* sidenavi */
	#snav {
		width: 580px;
		margin: 0 auto;
		float: none;
	}
	#snav .bnr_box {
		text-align: center;
	}
	#footer .bg {
		width: 100%\9;
	}
	#footer .bg .inner {
		margin: 0 10px;
		width: auto;
	}
	#footer .copy p {
		width: auto;
		margin: 0 10px;
	}
}

@media screen and (max-width:780px){
	body .off {
		display: none !important;
	}
	#gnav .inner {
		background: none;
	}
	#gnav ul li {
		width: 33.3%;
		background: #FFF;
	}
	#gnav ul li a {
		font-weight: normal;
	}
	#gnav ul li.last a span span {
		left: 10%;
	}
	#contents {
		width: auto;
	}
	#footer .block {
		float: none;
		width: 20%;
	}

	#footer .bg .inner {
		margin: 0;
		padding: 0
	}
	#footer .block_wrap {
		float: none;
		width: 100%;
		position: relative;
		top: -1px;
	}
	#footer .block p {
		border-bottom: 1px solid #C1C1C1;
		border-top: 1px solid #FFF;
		margin: 0;
		font-size: 1.5em;
	}
	#footer .block .ttl,
	#footer .block p a,
	#footer ul li a {
		position: relative;
		padding: 15px 10px;
		display: block;
	}
	#footer .block p span {
		display: none;
	}
	#footer .block p a span,
	#footer .block p span.plus,
	#footer .block p span.minus,
	#footer ul li a span {
		display: block;
		font-weight: bold;
		position: absolute;
		right: 10px;
		top: 50%;
		color: #666;
		margin: -6px 0 0;
		width: 12px;
		height: 12px;
		padding: 0;
		background: url(../img/icon_pc.png) no-repeat -35px -35px;
		background-size: 79px auto;
	}
	#footer .block p span.minus {
		background: url(../img/icon_pc.png) no-repeat -47px -35px;
		background-size: 79px auto;
	}
	#footer .block p a span,
	#footer ul li a span {
		background: url(../img/icon_pc.png) no-repeat -60px -35px;
		background-size: 79px auto;
		width: 8px;
	}
	#footer ul li a span {
		background: url(../img/icon_pc.png) no-repeat -68px -35px;
		background-size: 79px auto;
	}
	#footer ul {
		margin: 0;
	}
	#footer ul li {
		margin: 0;
		border-bottom: 1px solid #949494;
	}
	#footer ul li a {
		font-size: 1.4em;
		color: #FFF;
		background: #666;
		border-bottom: 1px solid #333;
	}
	#footer ul.last {
		margin: 20px 0 0;
	}
	#footer ul.last li {
		margin: 0 0 15px;
		border-bottom: none;
	}
	#footer ul.last li a {
		font-size: 1.3em;
		color: #333;
		background: none;
		border-bottom: none;
		padding: 0 10px;
		text-decoration: underline;
	}
	#footer .copy p {
		text-align: center;
		padding: 20px 10px;
	}
	#footer .copy p a {
		float: none;
		display: block;
		margin: 0 0 5px;
		font-size: 1.3em;
	}
}

@media screen and (max-width:580px){
	#cover {
		width: 100%;
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		background: #000;
		filter: alpha(opacity=30);
		opacity: 0.3;
		z-index: 3;
	}
	#header p {
		max-width: 62%;
	}
	#header .menu_btn {
		display: block;
		width: 35px;
		height: 35px;
		background: url(../img/icon_pc.png) no-repeat left top;
		background-size: 79px auto;
		position: absolute;
		right: 10px;
		top: 0;
		z-index: 4;
	}

	#header .open {
		background-position: 0 -35px;
	}
	#header ul {
		position: absolute;
		right: 0;
		top: 33px;
		width: 100%;
		background: #495660;
		z-index: 4;
	}
	#header ul li {
		border-bottom: 1px solid #3b5c76;
		margin: 0;
		float: none;
		width: auto;
	}
	#header ul li .tri {
		display: none;
	}
	#header ul li a {
		color: #FFF;
		display: block;
		border-bottom: 1px solid #181a26;
		padding: 15px 10px;
		font-size: 1.5em;
		position: relative;
	}
	#header ul li a span {
		display: block;
		position: absolute;
		right: 10px;
		top: 50%;
		width: 8px;
		height: 12px;
		margin: -6px 0 0;
		background: url(../img/icon_pc.png) no-repeat -68px -35px;
		background-size: 79px auto;
	}
	#snav {
		width: auto;
		margin: 0 10px;
	}
	#snav #snav_ttl {
		margin: 0 0 20px;
		position: relative;
	}
	#snav #snav_ttl span {
		position: absolute;
		right: 10px;
		top: 50%;
		margin: -7px 0 0;
		width: 14px;
		height: 15px;
		display: block;
		background: url(../img/icon_pc.png) no-repeat -13px -70px;
		background-size: 79px auto;
	}
	#snav .nav {
		margin: -20px 0 20px;
	}
}

@media screen and (max-width:450px){
	#gnav ul li {
		width: 50%;
	}
	#gnav ul li a {
		line-height: 1;
		padding: 7px 0;
	}
	#gnav ul li.on a {
		line-height: 1;
		padding: 7px 0 6px;
	}
	#gnav ul li.last a {
		padding: 6px 0 5px;
	}
	#gnav ul li.last a span {
		padding: 9px 0 7px 20px;
	}
}

hr.space{
	height: 0;
	margin: 4em auto;
	padding: 0;
	border: 0;
	border-top: 1px solid #dedede;
	border-bottom: 1px solid #fff;
}

/*  2021.6.7  */
a.btn_01 {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #fff;
  border: 1px solid #228bc8;
  box-sizing: border-box;
  width: 100%;
  height: 50px;
  padding: 0 6% 0 12%;
  color: #228bc8;
  font-size: 16px;
  text-align: left;
  text-decoration: none;
  position: relative;
  transition-duration: 0.2s;
}
a.btn_01:hover {
  background: #228bc8;
  color: #fff;
}
a.btn_01:before {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 7px 0 7px 8px;
  border-color: transparent transparent transparent #228bc8;
  position: absolute;
  top: 50%;
  left: 6%;
  margin-top: -7px;
}
a.btn_01:hover:before {
  border-color: transparent transparent transparent #fff;
}

@media screen and (min-width:850px){
	a.btn_01{
		width: 50%;
		margin:0 auto;
	}
}
