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

* Description: レイアウトに関する設定

 - body
 - global-header
 - global-utility
 - global-nav
 - contents
 - sns_block
 - general_banner
 - global-footer

##############################################################
------------------------------------------------------------*/


/*------------------------------------------------------------
##############################################################
body
##############################################################
------------------------------------------------------------*/

/* small
------------------------------------------------------------*/
@media only screen and (max-width: 40em) {
	* { -webkit-text-size-adjust:none; }
}


/*------------------------------------------------------------
##############################################################
global-header
##############################################################
------------------------------------------------------------*/
header {
	border-bottom: 1px solid #4c9bc9;
}

#logo-block {
	float: left;
	width: 55%;
	padding-top: 15px;
}
#global-utility {
	float: right;
	text-align: right;
	width: 45%;
}
#logo-block #logo,
#logo-block span.description {
	display:inline-block;
	font-size: 12px;
	font-size: 0.75rem;
	line-height: 1.0;
	vertical-align: middle;
}
#logo-block span.description {
	margin-left: 2%;
}

/* medium
------------------------------------------------------------*/
@media only screen and (max-width: 48em) {
	#logo-block {
	width: 47.5%;
	}
}

/* small
------------------------------------------------------------*/
@media only screen and (max-width: 40em) {

	#logo-block {
		float: none;
		width: 100%;
	}
}

/*------------------------------------------------------------
##############################################################
#global-utility
##############################################################
------------------------------------------------------------*/

#global-utility ul {
	background-color: #0071b2;
	display: inline-block;
	padding: 4px 10px;
	border-radius: 0 0 3px 3px;
	-moz-border-radius: 0 0 3px 3px;
	-webkit-border-radius: 0 0 3px 3px;
}
#global-utility li {
	float: left;
	font-size: 12px;
	font-size: 0.75rem;
	padding: 2px 10px;
}
#global-utility li a:link,
#global-utility li a:visited {
	color: #fff;
}
#global-utility li a:hover,
#global-utility li a:active {
	color: #ccc;
}
#global-utility li:last-child {
	background-color: #fff;
	padding: 0;
}
#global-utility li:last-child a {
	color: #006699;
	text-align: center;
	display: inline-block;
	width: 50%;
	padding: 0 5px;
}
#global-utility li:last-child a.active {
	color: #fff;
	background-color: #333;
}
#global-utility li:last-child a:hover {
	color: #fff;
	background-color: #333;
}


/* medium
------------------------------------------------------------*/
@media only screen and (max-width: 48em) {
	#global-utility {
	width: 52.5%;
	}
}

/* small
------------------------------------------------------------*/
@media only screen and (max-width: 40em) {

	#global-utility {
		float: none;
		text-align: left;
		width: 100%;
	}
	#global-utility ul {
		display: block;
	}
	#global-utility li {
		width: 25%;
	}
}



/*------------------------------------------------------------
##############################################################
global-nav
##############################################################
------------------------------------------------------------*/

#global-nav {
	text-align: right;
	line-height: 0.6;
}
#global-nav ul {
	display: inline-block;
}
#global-nav ul li {
	display: block;
	float: left;
	text-align:center;
	font-size: 14px;
	font-size: 0.875rem;
}
#global-nav ul li a {
	display: block;
	border-bottom: 3px solid #fff;
	text-decoration: none;
	padding: 0 10px;
}
#global-nav ul li a:hover {
	color:  rgba(30, 198, 252, 1.0);
	border-bottom: 3px solid rgba(60, 164, 234, 1.0);
  transition: 0.3s;
}
#global-nav ul li.active a {
	border-bottom: 3px solid rgba(60, 164, 234, 1.0);
}

#global-nav li a .inner {
	display:table;
	width:100%;
}
#global-nav li a .inner span {
	display:table-cell;
	width:100%;
	vertical-align:middle;
	text-align:center;
}


/* medium
------------------------------------------------------------*/
@media only screen and (max-width: 48em) {
}

/* small
------------------------------------------------------------*/
@media only screen and (max-width: 40em) {

	#global-nav {
		text-align: left;
		margin-top: 2%;
		padding: 0 2%;
	}
	#global-nav ul {
		display: block;
	}
	#global-nav ul li {
		border-top: 1px solid #ccc;
		border-left: 1px solid #ccc;
		border-right: 1px solid #ccc;
		width: 33.33%;
	}
	#global-nav ul li+li {
		border-left: none;
	}
	#global-nav ul li:nth-child(4) {
		border-left: 1px solid #ccc;
	}
	#global-nav ul li a {
		padding: 2.5%;
	}

}

/*------------------------------------------------------------
##############################################################
global-titlearea
##############################################################
------------------------------------------------------------*/

#global-titlearea {
	background-color: #0071b2;
}
#global-titlearea .breadcrumbs {
	border: none;
	background-color: transparent;
	margin: 10px 0 0 0;
	padding: 0.5625rem 0.875rem 0.5625rem 0;
}
#global-titlearea .breadcrumbs li {
	line-height: 1.5 !important;
}
#global-titlearea .breadcrumbs .current {
	color: #eee;
}
.breadcrumbs > *:before {
	color: #eee;
	content: ">";
}
#global-titlearea .breadcrumbs a:link,
#global-titlearea .breadcrumbs a:visited {
	color: #fff;
	text-decoration: underline;
}
#global-titlearea .breadcrumbs a:hover,
#global-titlearea .breadcrumbs a:active {
	color: #ccc;
}
#global-titlearea h1 {
	color: #fff;
	font-size: 24px;
	font-size: 1.5rem;
	margin: 55px 0 35px;
}

/* large
------------------------------------------------------------*/
@media only screen and (max-width: 63.625em) {

	#global-titlearea .row {
    padding-left: 0.625rem;
    padding-right: 0.625rem;
	}
}


/* medium
------------------------------------------------------------*/
@media only screen and (max-width: 48em) {

}

/* small
------------------------------------------------------------*/
@media only screen and (max-width: 40em) {
}


/*------------------------------------------------------------
##############################################################
contents
##############################################################
------------------------------------------------------------*/

#contents .container {
	padding-top: 40px;
	padding-bottom: 40px;
}
.container-fluid {
	padding: 25px 0;
}
#archive-contents {
	padding-right: 30px;
}
#page-contents {
	padding-right: 30px;
}
.catch-image {
	overflow: hidden;
	margin-bottom: 20px;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}


/* sub
------------------------------ */
#contents #sub {
	margin-bottom: 5rem;
}
#sub #category-list {
	padding-top: 40px;
}
#sub #category-list dt {
	margin-bottom: 0;
}
#sub #category-list dt a {
	display:block;
	background: #0071b2 url(../images/arrow_small2.png) 98% center no-repeat;
	color: #fff;
	font-size: 14px;
	font-weight: normal;
	text-decoration: none;
	padding: 0.6rem 1.0rem;
}
#sub #category-list dd li a {
	display:block;
	background: url(../images/arrow_small.png) 5% center no-repeat;
	border-bottom: 1px dotted #cacaca;
	font-size: 0.875rem;
	font-weight: normal;
	text-decoration: none;
	padding: 0.6rem 1.0rem 0.6rem 2.0rem;
}
#sub #category-list dt a:hover {
	background-color: rgba(60, 164, 234, 1.0);
}
#sub #category-list dd ul li.category-child>a,
#sub #category-list dd ul li.active>a {
	color: #505050;
	font-weight: bold;
	background: transparent url(../images/arrow_small2-2.png) 5% center no-repeat;
}
#sub #category-list dd li ul {
	border-bottom: 1px dotted #cacaca;
	margin: 0;
	padding: 0;
}
#sub #category-list dd li ul li a {
	border: none;
	background: none;
	display: inline-block;
	font-size: 12px;
	font-size: 0.75rem;
	padding: 0.3rem 1.0rem 0.3rem 2.0rem;
}
#sub #category-list dd li ul li a:before {
	content: '・ '
}
#sub #category-list dd ul ul li.active>a {
	background: none;
	font-weight: normal;
}


/* large
------------------------------------------------------------*/
@media only screen and (max-width: 63.625em) {
	.row.collapse {
    padding-left: 0.625rem;
    padding-right: 0.625rem;
	}
}

/* medium
------------------------------------------------------------*/
@media only screen and (max-width: 48em) {
}

/* small
------------------------------------------------------------*/
@media only screen and (max-width: 40em) {
	#sub #category-list dd li a {
		background: url(../images/arrow_small.png) 2% center no-repeat;
	}
	#sub #category-list dd ul li.category-child>a,
	#sub #category-list dd ul li.active>a {
		background: transparent url(../images/arrow_small2-2.png) 2% center no-repeat;
	}
	#archive-contents {
		padding: 0;
	}
	#archive-contents,
	#page-contents {
		padding-right: 0;
	}


}


/*------------------------------------------------------------
##############################################################
footer
##############################################################
------------------------------------------------------------*/

#global-footer {
	background-color: #333;
	color: #fff;
}
.rich-footer {
	padding-top: 40px;
	padding-bottom: 40px;
}
.rich-footer dt {
	margin-bottom: 10px;
}
.rich-footer dt img {
	max-width: 100%
}
.rich-footer dd.row>.medium-6.columns {
  padding-left: 0;
  padding-right: 0;
}
.rich-footer dd address p,
.rich-footer dd li {
	font-size: 12px;
	font-size: 0.75rem;
}
.rich-footer dd address a {
	text-decoration: none;
}
.rich-footer dd a {
	text-decoration: underline;
}
.footer-copyright {
 	background-color: #000;
 	color: #fff;
 	text-align: center;
 	padding: 0.5rem 0;
 }
#copyright {
	font-size: 12px;
	font-size: 0.75rem;
}
.rich-footer a {
	color: #fff;
}
.rich-footer a:hover {
	color: #ccc;
}