@charset "UTF-8";

/* --------------------------------------------------------------------------------------
 基本設定
--------------------------------------------------------------------------------------- */

/* 基本フォント ------------------------------ */

body {
	color: #333;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
	font-size: 12px;
	line-height: 1.5;
	-webkit-text-size-adjust:none;
}

input,textarea,select {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
	font-size: 100%;
	vertical-align:top;
}

h1,h2,h3,h4,h5,h6 {
	font-size: 100%;
	font-weight: normal;
}


/* 基本タグ ------------------------------ */

body,div,
h1,h2,h3,h4,h5,h6,
dl,dt,dd,ul,ol,li,
p,blockquote,pre,cite,code,caption,
form,fieldset,legend,input,textarea,select,option,label {
	margin: 0;
	padding: 0;
}

body {
	background: #fff;
	text-align: left;
}

img,table {
	border: none;
}

img {
	max-width: 100%;
	height: auto;
	vertical-align: top;
}

table {
	border-collapse: collapse;
}

ul {
	list-style: none;
}

address,em,cite {
	font-style: normal;
}

.none {
	display:none;
}

article, aside, footer, header, menu, nav, section { display: block; font-size: 100%; }

/* 基本テキストリンク ------------------------------ */

a {
	text-decoration: none;
}

a:link {
	color: #333;
	text-decoration: none;
}
a:visited {
	color: #333;
	text-decoration: none;
}
a:hover {
	color: #333;
	text-decoration: underline;
}
a:active {
	color: #333;
	text-decoration: underline;
}

.over a:hover,
.over input:hover {
	opacity: 0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha(opacity=80)";
	text-decoration: none;
}


/* --------------------------------------------------------------------------------------
 float解除
--------------------------------------------------------------------------------------- */

.clearfix:after { content:""; display:block; height:0; clear:both; visibility:hidden;font-size: .1em;}
.clearfix { display:inline-block; }
/*\*/
* html .clearfix { height:1%; }
.clearfix { display:block; }
/**/

/* --------------------------------------------------------------------------------------
 レイアウト
--------------------------------------------------------------------------------------- */

#wrap	{
	min-width: 1000px;
	width: 100%;
}

.inner {
	position: relative;
	width: 980px;
	margin: 0 auto;
}

@media screen and (max-width: 640px) {
#wrap	{
	min-width: 320px;
}

.inner {
	width: auto;
}
}

/* --------------------------------------------------------------------------------------
 ヘッダー
--------------------------------------------------------------------------------------- */

#header	{
	padding: 22px 0 27px;
	background: url(../img/bg_header01.gif) repeat center top #0078dd;
}

#header .headerLeft	{
	float: left;
}

#header .headerLeft .logo {
	width: 267px;
}

#header .headerRight	{
	float: right;
}

#header .headerRight .snsIcon {
	margin: 22px 0 0;
}

#header .headerRight .snsIcon li {
	float: left;
	width: 46px;
	height: 46px;
	text-align: center;
	margin: 0 12px 0 0;
}

#header .headerRight .snsIcon li a {
	display: block;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	padding: 7px;
	border-radius: 50%;
	background: #fff;
}

@media screen and (max-width: 640px) {
#header	{
	padding: 1.7% 0 3.8%;
	background: url(../img/bg_header01.gif) repeat center top #0078dd;
	background-size: 17.9%;
}

#header .headerLeft	{
	float: none;
}

#header .headerLeft .logo {
	width: 50.1%;
	margin: 0 4.2%;
}

#header .headerRight	{
	float: none;
	display: none;
}
}

/* --------------------------------------------------------------------------------------
 フッター
--------------------------------------------------------------------------------------- */

#footer	{
	position: relative;
	padding: 33px 0 20px;
}

#footer .pagetop{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	margin: -42px 0 0;
	text-align: center;
}

#footer .footerLeft	{
	float: left;
}

#footer .footerLeft .logo	{
	margin: 4px 0 0 4px;
}

#footer .footerLeft small	{
	display: block;
	margin: 18px 0 0 2px;
}

#footer .footerRight {
	float: right;
}

#footer .footerRight address {
	display: block;
	margin: 21px 0 0;
	font-size: 83.3%;
}

#footer .footerRight .snsIcon {
	display: none;
}

#footer .footerRight .btn {
	margin: 12px 0 0;
	text-align: right;
}

#footer .footerRight .btn a {
	display: inline-block;
	padding: 2px 13px;
	background: #0063dd;
	text-align: center;
	font-size: 14px;
	color: #fff;
}

@media screen and (max-width: 640px) {
#footer	{
	padding: 2.2% 0;
}

#footer .pagetop{
	margin: -5.8% 0 0;
}

#footer .pagetop img {
	width: 11.8%;
}

#footer .footerLeft	{
	float: none;
}

#footer .footerLeft .logo	{
	display: none;
}

#footer .footerLeft small	{
	text-align: center;
	margin: 3.8% 0 0;
}

#footer .footerRight {
	float: none;
}

#footer .footerRight .logo	{
	display: none;
}

#footer .footerRight address {
	display: none;
}

#footer .footerRight .snsIcon {
	display: block;
	margin: 0 0 6.6%;
	text-align: center;
	letter-spacing: -.5em;
}

#footer .footerRight .snsIcon li {
	display: inline-block;
	width: 14.2%;
	height: 14.2%;
	margin: 0 2.3%;
	letter-spacing: 0;
}

#footer .footerRight .snsIcon li a {
	display: block;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	padding: 15.4%;
}

#footer .footerRight .btn {
	margin: 5% 0 0;
	text-align: center;
}

#footer .footerRight .btn a {
	padding: .6% 4%;
}
}

/* --------------------------------------------------------------------------------------
 コンテンツ
--------------------------------------------------------------------------------------- */

#contents	{
	position: relative;
	padding: 0 0 110px;
	background: url(../img/bg_contents01_pc.jpg) no-repeat center top fixed #eee;
	background-size: cover;
	overflow: hidden;
}

#contents .breadcrumb {
	padding: 25px 0 24px;
	letter-spacing: -.5em;
}

#contents .breadcrumb li {
	display: inline;
	color: #999;
	letter-spacing: 0;
}

#contents .breadcrumb li:after {
	margin: 0 1em;
	color: #333;
	content: "＞";
}
#contents .breadcrumb li:last-child:after {
	content: none;
}

#contents .breadcrumb li a {
	text-decoration: underline;
}
#contents .breadcrumb li a:hover {
	text-decoration: none;
}

@media screen and (max-width: 640px) {
#contents	{
	padding: 0 0 24%;
	background: url(../img/bg_contents01_sp.jpg) no-repeat center top fixed #eee;
	background-size: cover;
}

#contents .breadcrumb {
	display: none;
}
}

/* トップ */

#index .pickup {
	padding: 0 0 91px;
}

#index .section h2 {
	width: 230px;
}
#index .pickup h2 {
	margin: 0 auto 10px;
}
#index .archive h2 {
	margin: 0 auto 21px;
}

#index .section .articleList {
	overflow: hidden;
}
#index .pickup .articleList {
	margin: 0 -51px -27px 0;
}
#index .archive .articleList {
	margin: 0 -44px -44px 0;
}

#index .section .articleBox {
	float: left;
	background: #fff;
	cursor: pointer;
}
#index .pickup .articleBox {
	width: 464px;
	margin: 0 51px 27px 0;
}
#index .archive .articleBox {
	width: 297px;
	margin: 0 44px 44px 0;
}
#index .pickup .articleBox:nth-child(2n+1) ,
#index .archive .articleBox:nth-child(3n+1) {
	clear: both;
}

#index .section .articleBox h3 {
	line-height: 1.375;
	font-size: 16px;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
}
#index .pickup .articleBox h3 {
	height: 2.75em;
	margin: 0 16px 16px;
	padding: 16px 0 0;
	-webkit-line-clamp: 2;
}
#index .archive .articleBox h3 {
	height: 4.125em;
	padding: 4px 0 0;
	-webkit-line-clamp: 3;
}

#index .section .articleBox h3 a {
	display: block;
	overflow: hidden;
}

#index .section .articleBox .thumb {
	overflow: hidden;
}
#index .pickup .articleBox .thumb {
	height: 308px;
}
#index .archive .articleBox .thumb {
	height: 173px;
}

#index .section .articleBox .thumb:hover {
	opacity: 0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha(opacity=80)";
	text-decoration: none;
}

#index .pickup .articleBox .txtBox {
	padding: 14px 16px 18px;
}
#index .archive .articleBox .txtBox {
	padding: 12px 16px 16px;
}

#index .section .articleBox .date {
	font-size: 83.3%;
	color: #999;
}

#index .pickup .articleBox .txt {
	height: 3.334em;
	margin: 0 0 8px;
	line-height: 1.667;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

#index .archive .more {
	clear: both;
	display: none;
}

@media screen and (max-width: 640px) {
#index .pickup {
	padding: 5% 0 8.7%;
}

#index .section h2 {
	width: 44.8%;
}
#index .pickup h2 {
	margin: 0 auto 2.8%;
}
#index .archive h2 {
	margin: 0 auto 1.9%;
}

#index .pickup .articleList {
	margin: 0 0 -4.5%;
}
#index .archive .articleList {
	margin: 0 0 -3.3%;
}

#index .section .articleBox {
	float: none;
}
#index .pickup .articleBox {
	width: auto;
	margin: 0 4.3% 4.5%;
}
#index .archive .articleBox {
	display: table;
	width: 91.4%;
	margin: 0 4.3% 3.3%;
}

#index .pickup .articleBox h3 {
	height: 2.5em;
	margin: 0 3.4% 3.4%;
	padding: 3.4% 0 0;
	line-height: 1.25;
}
#index .archive .articleBox h3 {
	height: 3.999em;
	padding: .6% 0 0;
	line-height: 1.333;
	font-size: 100%;
}

#index .section .articleBox .thumb {
	height: auto;
}
#index .archive .articleBox .thumb {
	display: table-cell;
	width: 50.8%;
	vertical-align: middle;
}

#index .archive .articleBox .thumb img {
	width: 100%;
}

#index .pickup .articleBox .txtBox {
	padding: 4% 3.4% 6.2%;
}
#index .archive .articleBox .txtBox {
	display: table-cell;
	width: 49.2%;
	box-sizing: border-box;
	padding: 0 4.2%;
	vertical-align: middle;
}

#index .pickup .articleBox .txt {
	height: 5em;
	margin: 0 0 2.4%;
	line-height: 1.25;
	-webkit-line-clamp: 4;
}

#index .archive .more {
	display: block;
	width: 34%;
	margin: 5.9% auto -14.2%;
}
}

/* 下層 */

#article #contents .contentsBox {
	position: relative;
	margin: 0 0 0 74px;
	padding: 47px 48px 124px;
	background: #fff;
}

#article .articleWrap {
	padding: 0 0 42px;
}

#article .articleWrap .ttlBox .date {
	color: #999;
}

#article .articleWrap .ttlBox h1 {
	padding: 12px 0 17px;
	line-height: 1.46;
	font-size: 216.7%;
}

#article .articleWrap .txtBox {
	padding: 0 0 10px;
	line-height: 2.14;
	font-size: 116.7%;
}

#article .articleWrap .txtBox h2 {
	margin: 48px 0 14px;
	line-height: 1.9;
	font-size: 142.9%;
}

#article .articleWrap .txtBox p {
	margin: 0 0 30px;
}
#article .articleWrap .txtBox .bold {
	font-weight: bold;
}
#article .articleWrap .txtBox .img {
	margin: 0 0 26px;
	text-align: center;
}

#article .articleWrap .outline {
	margin: 0 8px 0 0;
	padding: 20px 0 0;
	border-top: 1px solid #ccc;
	line-height: 1.83;
}

#article .articleWrap .snsIcon {
	position: absolute;
	top: 0;
	left: -74px;
}

#article .articleWrap .snsIcon li {
	width: 46px;
	height: 46px;
	text-align: center;
	margin: 0 0 21px;
}

#article .articleWrap .snsIcon li a {
	display: block;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	padding: 7px;
	border-radius: 50%;
	background: #fff;
}

#article .articleControls {
	margin: 0 8px 0 0;
	padding: 22px 0;
	border-top: 1px solid #ccc;
}

#article .articleControls li {
	width: 62px;
	margin: 0 3px;
}
#article .articleControls .back {
	float: left;
}
#article .articleControls .next {
	float: right;
}

#article .linkBtn {
	padding: 46px 0 31px;
	text-align: center;
	letter-spacing: -.5em;
}

#article .linkBtn li {
	display: inline-block;
	width: 180px;
	margin: 0 1px;
	text-align: left;
	font-size: 16px;
	letter-spacing: -.0625em;
}
#article .linkBtn .toppage {
	letter-spacing: -.125em;
}

#article .linkBtn li a {
	display: block;
	padding: 10px 7px 9px 11px;
	color: #fff;
}
#article .linkBtn .event a {
	background: #dc0000;
}
#article .linkBtn .pamphlet a {
	background: #88bb22;
}
#article .linkBtn .toppage a {
	background: #0078dd;
}

#article .linkBtn li a span {
	display: block;
	padding: 0 18px 0 0;
	background: url(../img/icon_arw02.png) no-repeat right center;
}

#article .linkBtn li a span span {
	padding: 0;
	background: none;
	font-size: 10px;
	letter-spacing: 0;
}

#article .linkBtn li br {
	display: none;
}

#article .pickup {
	padding: 45px 0 0;
}
#article .archive {
	padding: 68px 0 0;
}

#article .section h2 {
	width: 186px;
}
#article .pickup h2 {
	margin: 0 auto 23px;
}
#article .archive h2 {
	margin: 0 auto 21px;
}

#article .section .articleList {
	overflow: hidden;
}
#article .pickup .articleList {
	margin: 0 -34px -26px 0;
}
#article .archive .articleList {
	margin: 0 -34px -15px 0;
}

#article .section .articleBox {
	float: left;
	background: #fff;
}
#article .pickup .articleBox {
	width: 388px;
	height: 101px;
	margin: 0 34px 26px 0;
	overflow: hidden;
	cursor: pointer;
}
#article .archive .articleBox {
	width: 388px;
	margin: 0 34px 15px 0;
}
#article .pickup .articleBox:nth-child(2n+1) ,
#article .archive .articleBox:nth-child(2n+1) {
	clear: both;
}

#article .section .articleBox h3 {
	line-height: 1.43;
	font-size: 14px;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
}
#article .pickup .articleBox h3 {
	height: 4.29em;
	padding: 2px 0 0;
	-webkit-line-clamp: 3;
}
#article .archive .articleBox h3 {
	height: 2.86em;
	padding: 0 0 6px;
	-webkit-line-clamp: 2;
}

#article .section .articleBox h3 a {
	display: block;
	overflow: hidden;
}

#article .pickup .articleBox .thumb {
	display: table-cell;
	width: 153px;
	height: 101px;
	vertical-align: middle;
	overflow: hidden;
}
#article .section .articleBox .thumb:hover {
	opacity: 0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha(opacity=80)";
	text-decoration: none;
}

#article .pickup .articleBox .thumb img {
	width: 153px;
}

#article .pickup .articleBox .txtBox {
	display: table-cell;
	width: 235px;
	box-sizing: border-box;
	padding: 12px 10px;
}
#article .archive .articleBox .txtBox {
	padding: 0 3px 0 21px;
	background: url(../img/icon_arw01.png) no-repeat 3px 3px;
}

#article .section .articleBox .date {
	font-size: 83.3%;
	color: #999;
}

@media screen and (max-width: 640px) {
#article #contents .contentsBox {
	margin: 3.1% 2.3% 0;
	padding: 2.5% 3% 3.8%;
}

#article .articleWrap {
	padding: 0 0 4.9%;
}

#article .articleWrap .ttlBox h1 {
	padding: 1.7% 0 2.8%;
	line-height: 1.375;
	font-size: 133.3%;
}

#article .articleWrap .txtBox {
	padding: 0;
	line-height: 1.5;
	font-size: 100%;
}

#article .articleWrap .txtBox h2 {
	margin: 16px 0 8px;
	line-height: 1.36;
	font-size: 116.7%;
}

#article .articleWrap .txtBox p {
	margin: 0 0 18px;
}
#article .articleWrap .txtBox .img {
	margin: 0 0 32px;
}
#article .articleWrap .txtBox .img:first-child {
	margin: 0 0 12px;
}

#article .articleWrap .outline {
	margin: 0 1.7%;
	padding: 2.8% 0 6.3%;
	line-height: 1.5;
	font-size: 83.3%;
}

#article .articleWrap .snsIcon {
	position: static;
	text-align: center;
	letter-spacing: -.5em;
}

#article .articleWrap .snsIcon li {
	display: inline-block;
	width: 15.9%;
	height: 15.9%;
	margin: 0 2.6%;
	letter-spacing: 0;
}

#article .articleWrap .snsIcon li a {
	display: block;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	padding: 15.4%;
}

#article .articleControls {
	margin: 0 1.7%;
	padding: 3.3% 0;
}

#article .articleControls li {
	width: 17.3%;
	margin: 0 .7%;
}

#article .linkBtn {
	padding: 6.6% 0 0;
}

#article .linkBtn li {
	width: 32.333%;
	margin: 0 1% 0 0;
	vertical-align: middle;
	line-height: 1.2;
	font-size: 11px;
}
#article .linkBtn li:last-child {
	margin: 0;
}

#article .linkBtn li a {
	padding: 3% 4% 3% 3%;
	color: #fff;
}

#article .linkBtn li a span {
	padding: 0 6% 0 0;
	background-size: 6px;
}
#article .linkBtn .event a span ,
#article .linkBtn .pamphlet a span {
	padding: 7px 6% 6px 0;
}

#article .linkBtn li a span span {
	margin: 2px 0 0;
	line-height: 1.5;
	font-size: 9px;
}
#article .linkBtn .event a span span ,
#article .linkBtn .pamphlet a span span {
	padding: 0;
}

#article .linkBtn li br {
	display: initial;
}

#article .pickup {
	padding: 8.7% 0 0;
}
#article .archive {
	display: none;
}

#article .section h2 {
	width: 32.5%;
}
#article .pickup h2 {
	margin: 0 auto 1.4%;
}

#article .pickup .articleList {
	margin: 0 0 -3.5%;
}

#article .section .articleBox {
	float: none;
}
#article .pickup .articleBox {
	display: table;
	width: 100%;
	height: auto;
	margin: 0 0 3.5%;
}

#article .pickup .articleBox h3 {
	height: 3.75em;
	padding: .6% 0 0;
	line-height: 1.25;
	font-size: 12px;
}

#article .pickup .articleBox .thumb {
	width: 49.6%;
	height: auto;
}

#article .pickup .articleBox .thumb img {
	width: 100%;
}

#article .pickup .articleBox .txtBox {
	width: 50.4%;
	padding: 0 3.4%;
	vertical-align: middle;
}
}
