@charset "utf-8";
/* CSS Document */
/*===============================================
　▼ 共通項目 ▼
===============================================*/
body {
	width:100%;
	margin:0;
	padding:0;
	line-height: normal;
	letter-spacing: normal;
	font-size:100%;
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}
img {
	width:100%;
	margin:0;
	padding:0;
}
li {
	list-style:none;
}

/*===============================================
　▼ SP表示／PC非表示 ▼
===============================================*/
.pcnone {
	display:none !important;
}

/*===============================================
　▼ z-index 表示順序 ▼
===============================================*/
#header-bg {
	z-index: -999;
}


/*===============================================
　▼ header ▼
===============================================*/
img#header-bg {
	width: 100%;
	height:100vh;/*画像を画面全体に設定*/
	position: absolute;
	top: 0;
	left: 0;
	margin: 0;
	padding: 0;
}
header {
	width: 100%;
	height: auto;
	margin: 0 auto;
	padding: 0;
}
header > h4 {
	width: 80%;
	font-family: Georgia, "Times New Roman", Times, "serif";
	font-size: 100%;
	color: #fff;
	text-align: center;
	text-shadow:3px 3px 4px #000000;
	border-bottom: 1px solid #fff;
	position: relative;
	top: 2vh;
	margin: 0 auto;
	padding: 0 0 1vh 0;
	
}



/*===============================================
　▼ ヘッダーナビ ▼
===============================================*/
header > nav {
	width: 100%;
	height: auto;
	margin: 0 auto;
	padding:0;
}
header > nav > ul {
	width: 80%;
	height: auto;
	margin: 0 auto;
	padding:2% 0;
}
header > nav > ul > li {
	width: 15%;
	height: auto;
	vertical-align: middle;
	position: relative;
	top: 0vh;
	margin: 0 auto;
	padding: 0;
	float: left;
}
header > nav > ul > li:nth-of-type(3) {
	width: 40%;
	height: auto;
	vertical-align: middle;
	position: relative;
	top: 0vh;
	margin: 0 auto;
	padding: 0;
}
header > nav > ul > li > p {
	width: 100%;
	height: auto;
	color: #fff;
	font-size: 120%;
	text-align: center;
	text-shadow:3px 3px 4px #000000;
	vertical-align: middle;
	margin: 0 auto;
	padding: 5% 0;
}
header > nav > ul > li > h1 {
	font-family: Georgia, "Times New Roman", Times, "serif";
	font-size: 220%;
	color: #fff;
	text-align: center;
	text-shadow:3px 3px 4px #000000;
	vertical-align: middle;
	margin: 0 auto;
	padding: 0;
}
header > nav > ul > li > p:hover {
	background: rgba(204,204,204,0.3);
}


/*===============================================
　▼ ヘッダーメイン見出し ▼
===============================================*/
header > div {
	position: relative;
	top: 0;
	margin: 15vh auto;
	padding: 0;
}
header > div > p {
	font-family: Georgia, "Times New Roman", Times, "serif";
	font-size: 100%;
	color: #fff;
	text-align: center;
	text-shadow:3px 3px 4px #000000;
	margin: 0 auto;
	padding: 0;
}
header > div > h2 {
	font-family: Georgia, "Times New Roman", Times, "serif";
	font-size: 400%;
	color: #fff;
	text-align: center;
	text-shadow:3px 3px 4px #000000;
	position: relative;
	top: 0;
	margin: 0 auto;
	padding: 0;
}
header > aside {
	width:30%;
	margin:0 auto;
	padding:0;
}

header > aside > a,aside > a:hover {
	font-size:100%;
	text-align:center;
	text-decoration:none;
	color:#fff;
}

header > aside > a > p {
	font-weight: bold;
	padding:4% 0;
	background:rgba(204,204,204,0);
	border:2px solid #fff;
}

header > aside > a > p:hover {
	color:#000;
	font-weight: bold;
	background:#ff9900;/*2f2e2e*/
	-webkit-transition: 0.8s;
	-moz-transition: 0.8s;
	-o-transition: 0.8s;
	-ms-transition: 0.8s;
	transition: 0.8s;
}


/*===============================================
　▼ スクロール後、ヘッダー固定 ※デザイン ▼
===============================================*/
.clone-nav {
	width: 100% !important;
	height: auto;
	background: #fff;
	box-shadow: 1px 1px 8px #ccc;
	margin: 0 auto;
	padding:1% 0;
}
.clone-nav ul {
	width: 80% !important;
	margin: 0 auto;
}
.clone-nav li {
	width: 15%;
	height: auto;
	vertical-align: middle;
	position: relative;
	top: 0vh;
	margin: 0 auto;
	padding: 0;
	float: left;
}
.clone-nav li:nth-of-type(3) {
	width: 40%;
	height: auto;
	vertical-align: middle;
	position: relative;
	top: 0vh;
	margin: 0 auto;
	padding: 0;
}
.clone-nav li > p {
	width: 100%;
	height: auto;
	color: #000;
	font-size: 120%;
	text-align: center;
	vertical-align: middle;
	margin: 0 auto;
	padding: 5% 0;
}
.clone-nav li > h1 {
	font-family: Georgia, "Times New Roman", Times, "serif";
	font-size: 220%;
	color: #000;
	text-align: center;
	vertical-align: middle;
	margin: 0 auto;
	padding: 0;
}
.clone-nav li > p:hover {
	background: rgba(204,204,204,0.6);
}

  .is-show {
    transform: translateY(0);
  }
/*===============================================
　▼ スクロール後、ヘッダー固定 ※システム ▼
===============================================*/
  .clone-nav {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2;
    width: 100%;
    transition: .3s;
    transform: translateY(-100%);
  }
  .is-show {
    transform: translateY(0);
  }

/*===============================================
　▼ article ▼
===============================================*/
article {
	width: 100%;
	height: auto;
	margin: 0 auto;
	padding: 0;
	
}
/*===============================================
　▼ main-block001 ▼
===============================================*/
#main-block001 {
	width: 80%;
	height: auto;
	margin: 40vh auto;
	padding: 0;
	position: relative;
	top: 0;
}
#main-block001 > div:nth-of-type(odd) {
	width: 40%;
	height: 50vh;
	overflow-y: hidden;
	margin: 0;
	padding: 0;	
	float: left;
}
#main-block001 > div:nth-of-type(odd) img {
	width: 100%;
	margin: 0;
	padding: 0;	
}
#main-block001 > div:nth-of-type(even) {
	width: 60%;
	height: 50vh;
	margin: 0;
	padding: 0;	
	float: left;
}
#main-block001 > div:nth-of-type(even) h1 {
	width: 75%;
	color: #000;
	text-align: center;
	font-size: 400%;
	text-shadow:3px 3px 4px #fff;
	margin: 0 auto;
	padding: 2% 0 0 2%;
	align-items:baseline;/*上下中央揃え*/
	justify-content: center; /*左右中央揃え*/
}
#main-block001 > div:nth-of-type(even) > blockquote {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 2%;	
}
#main-block001 > div:nth-of-type(even) > blockquote > p {
	color: #000;
	text-align: center;
	font-size: 100%;
	line-height: 1.8em;
	margin: 0;
	padding: 0;	
}

/*===============================================
　▼ main-block002 ▼
===============================================*/
#main-block002 {
	width: 100%;
	height: auto;
	margin: -30vh 0 0 0;
	padding: 0;
}
#main-block002 > blockquote {
	width: 100%;
	height: auto;
	margin: 0 auto;
	padding: 0;
}
div#background-fixed {
    width: 100%;
    height: 90vh;/*75vh*/
	background: url(../img/main-block002-img001.jpg) no-repeat;
    background-attachment: fixed;
    margin:0 auto;
    padding:0;
}
div#background-fixed > h1 {
    color:#fff;
	text-align: center;
	font-size: 400%;
	text-shadow:3px 3px 4px #000;
    margin:0;
    padding:2% 0 1% 0;
}
#main-block002 > blockquote > div > dl {
	width:80%;
	height:auto;
	margin:0 auto;
	padding:0;
}
#main-block002 > blockquote > div > dl > dt {
	width:28%;
	height:auto;/*50vh*/
	background:rgba(255,255,255,0.4);
	border:2px solid #ccc;
	margin:0 3% 0 0;
	padding:1%;
	float:left;
}
#main-block002 > blockquote > div > dl > dt:first-child {
	margin: 0 3% 0 2%;
}
#main-block002 > blockquote > div > dl > dt:last-child {
	margin: 0;
}
#main-block002 > blockquote > div > dl > dt > div {
	width:100%;
	height:auto;
	margin:0;
	padding:0;
}
#main-block002 > blockquote > div > dl > dt > aside {
	width:96%;
	height:auto;
	background: #fff;
	margin:2% 0;
	padding:2%;
}
#main-block002 > blockquote > div > dl > dt > aside > h2 {
    color:#000;
	text-align: center;
	font-size: 150%;
	text-shadow:3px 3px 4px #fff;
    margin:0;
    padding:2% 0 2% 0;
}
#main-block002 > blockquote > div > dl > dt > aside > p {
    color:#000;
	text-align: center;
	font-size: 100%;
    margin:0;
    padding:2%;
}


#main-block002 > blockquote > div > dl > dt > aside > div {
	width:100%;
	margin:2% 0;
	padding:0;
}


#main-block002 > blockquote > div > dl > dt > aside > div > a,#main-block002 > blockquote > div > dl > dt > aside > p > div > a:hover {
	font-size:100%;
	text-align:center;
	text-decoration:none;
	color:#fff;
}

#main-block002 > blockquote > div > dl > dt > aside > div > a > p {
	padding:4% 0;
	background:#2f2e2e;
}

#main-block002 > blockquote > div > dl > dt > aside > div > a > p:hover {
	color:#000;
	background:#ff9900;/*2a4268*/
	-webkit-transition: 0.8s;
	-moz-transition: 0.8s;
	-o-transition: 0.8s;
	-ms-transition: 0.8s;
	transition: 0.8s;
}
/*===============================================
　▼ main-block003 ▼
===============================================*/
#main-block003 {
	width: 80%;
	height: auto;
	margin: 10vh auto;
	padding: 0;
	position: relative;
	top: 0;
}
#main-block003 > h1 {
	color: #000;
	text-align: center;
	font-size: 400%;
	text-shadow:3px 3px 4px #fff;
	margin: 0 auto;
	padding: 2% 0 0 0%;
	align-items:baseline;/*上下中央揃え*/
	justify-content: center; /*左右中央揃え*/
}
#main-block003 > blockquote {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 2% 0;	
}
#main-block003 > blockquote > a {
}
#main-block003 > blockquote > a > dl {
	width:28%;
	height:auto;/*50vh*/
	background:rgba(255,255,255,0.4);
	border-bottom:5px solid #fff;
	margin:0 0% 0 2.5%;
	padding:1%;
	float:left;
}
#main-block003 > blockquote > a > dl:hover {
	border-bottom:5px solid #FF9900;
	
}
#main-block003 > blockquote > a > dl > dt {
	width: 100%;
	color: #000;
	margin: 0;
	padding: 0;	
}
#main-block003 > blockquote > a > dl > dd:nth-of-type(1) {
	width: 100%;
	color: #000;
	font-size: 90%;
	margin: 0;
	padding: 2% 0;	
}
#main-block003 > blockquote > a > dl > dd:nth-of-type(2) {
	width: 100%;
	color: #000;
	font-size: 150%;
	margin: 0;
	padding: 2%;
}

/*===============================================
　▼ footer ▼
===============================================*/
footer {
	width: 100%;
	height: 5vh;
	background: #2f2e2e;
	margin: 0 auto;
	padding:2% 0;	
}
footer > h1 {
	color: #fff;
	text-align: center;
	margin: 0 auto;
	padding:0;	
}


/*===============================================
　▼ 固定ブロック N-PLUS ▼
===============================================*/

#space10 {
	width: 100%;
	height: 30vh;
	margin: 0;
	padding: 0;
}
#nplus-block {
	width: 100%;
	height: auto;
	background: rgba(204,204,204,0.9);/*42,66,104,0.8*/
	margin: 0 auto;
	padding: 0;
	position: fixed;
	bottom: 0;
	z-index: 100;
}
#nplus-block > blockquote {
	width: 90%;
	height: auto;
	margin: 0 auto;
	padding: 0;
}
#nplus-block > blockquote a {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
}
#nplus-block > blockquote a > img {
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0;
}

/*== ▼ クリック展開ボタン ▼ ==*/
/*全体*/
.hidden_box {
	width:100%;
    margin: 0 auto;/*2em 0*/
    padding: 0;
}

/*ボタン装飾*/
.hidden_box label {
	width: 20%;
    font-weight: bold;
    background: #2a4268;/*efefef*/
    border-radius: 5px;
	border:2px solid #fff;
    cursor :pointer;
    transition: .5s;
	text-align: center;
	color: #fff;
	display: inline-block;
	margin: 0 auto;
    padding:15px;
	position: relative;
	top:-20px ;
}

/*アイコンを表示*/
.hidden_box label:before {
    display: inline-block;
    /*content: '\f078';テキスト前アイコン*/
    font-family: 'FontAwesome';
    padding-right: 5px;
    transition: 0.2s;
	content: "▼ CLOSE ▼";
}

/*ボタンホバー時*/
.hidden_box label:hover {
    background: #fff;
	border:2px solid #2a4268;
	color: #2a4268;
}

/*アイコンを切り替え*/
.hidden_box input:checked ~ label:before {
    /*content: '\f078';テキスト前アイコン*/
     -ms-transform: rotate(360deg);
     -webkit-transform: rotate(360deg);
     transform: rotate(360deg);
	content: "▲ OPEN ▲";
}
.hidden_box input:checked ~ label:before:hover {
	color: #fff !important;
}

/*チェックは見えなくする*/
.hidden_box input {
    display: none;
}

/*============================
　　　中身を非表示にしておく
.hidden_box .hidden_show {
    height: 0;
	margin: 0;
    padding: 10px 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
}
============================*/
.hidden_box .hidden_show {
	margin: 0;
    padding: 10px 0;
    height: auto;
    opacity: 1;
}

/*==========================
　　クリックで中身表示
.hidden_box input:checked ~ .hidden_show {
	margin: 0;
    padding: 10px 0;
    height: auto;
    opacity: 1;
}
===========================*/
.hidden_box input:checked ~ .hidden_show {
    height: 0;
	margin: 0;
    padding: 10px 0;
    overflow: hidden;
    opacity: 0;
    transition: 0.8s;
}