@import url('https://fonts.googleapis.com/css2?family=BenchNine:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@600&display=swap');

html{
width: 100%;
height: 100%;
}
html * {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
*, *:after, *:before {
    margin: 0;
    padding: 0;
    font-feature-settings: "palt";
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

body {
    width: 100%;
    height: 100%;
	background-color: rgb(0,0,0);
	font-size: 2vh;
	font-family: 'BenchNine', sans-serif;
}

/* @group basic */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, img, strong, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, tbody, tfoot, thead, tr, th, td, header, article, aside, figcaption, figure, footer, menu, nav, section {
	margin: 0;
	padding: 0;
	border: 0;
}
dl, ul {
	list-style-type: none;
}
img {
	vertical-align: bottom;
}

.individual {
	display: none;
	overflow: hidden;
}
.bold {
	font-weight: bold !important;
}
.large {
	font-size: 120%;
}
.middle {
	font-size: 75%;
}
.small {
	font-size: 55%;
	font-weight: normal;
}
.wide {font-family: 'Cairo', sans-serif !important;}
.bottom_line {border-bottom: 2px solid rgb(191,156,70);}
.bg_gd {
	background-color: rgb(191,156,70) !important;
}
.bg_stn {
	background: repeating-linear-gradient(45deg, rgb(242,119,198) 0px, rgb(242,119,198) 4px, transparent 4px, transparent 30px);
}
.txt_wt {color: rgb(255,255,255) !important;}
/* @end */

/* @group a */
a {
	text-decoration: none;
	background-color: transparent;
	font-weight: bold;
}
a:link {
	color: rgb(255,255,255);
	text-decoration: underline;
}
a:visited {
	color: rgb(191,156,70);
}
a:active {
	color: rgb(242,119,198);
	outline: 0;
}
a:hover {
	color: rgb(242,119,198);
	outline: 0;
}
/* @end */

/* @group page_top */
#page-top {
	width: 90%;
	height: 6vh;
	display: none;
    overflow: hidden;
	position: fixed;
	right: 5%;
	bottom: -1px;
	z-index: 1100;

	-webkit-border-top-left-radius: 1.5vh;
	-moz-border-top-left-radius: 1.5vh;
	-ms-border-top-left-radius: 1.5vh;
	-o-border-top-left-radius: 1.5vh;
	border-top-left-radius: 1.5vh;
	-webkit-border-top-right-radius: 1.5vh;
	-moz-border-top-right-radius: 1.5vh;
	-ms-border-top-right-radius: 1.5vh;
	-o-border-top-right-radius: 1.5vh;
	border-top-right-radius: 1.5vh;
}
#page-top p {
    width: calc(100% / 2);
    display: inline;
    float: left;
	text-align: center;
	background: rgb(191,156,70);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
#page-top p:hover {
	background: rgb(242,119,198);
}
#move-page-top, #page-top .reload {
	color: #fff;
    font-size: 3vh;
	line-height: 6vh;
	text-decoration: none;
	display: inline;
	cursor: pointer;
}
/* @end */

/* @group header */
header {
	width: 100%;
	max-width: 960px;
	margin: 2vh auto;
	padding: 0;
	position: relative;
	overflow: hidden;
}
header h1 {
	visibility: hidden;
	display: none;
	overflow: hidden;
}
#header_logo {
	position: relative;
	width: 100%;
	max-width: 960px;
	margin: 0 auto 4vh;
	overflow: hidden;
}
#header_logo img {
	width: 100%;
}

nav {
	width: 100%;
	margin: 0 auto 2vh;
    position: relative;
	overflow: hidden;
	
/*	background-color: rgb(18,18,18);*/
	-webkit-border-radius: .2vw;
	-moz-border-radius: .2vw;
	-ms-border-radius: .2vw;
	-o-border-radius: .2vw;
	border-radius: .2vw;
}
nav ul{
    width: 100%;
    max-width: 300px;
	margin: 0 auto;
	position: relative;
	overflow: hidden;
    list-style-type: none;
}
nav li {
	width: calc(100% / 4);
    font-size: 4vh;
    text-align: center;
	overflow: hidden;
	display: inline;
	float: left;
}
nav a{text-decoration: none;}
nav li figure {height: 4vh;}
nav li figure img {
    object-fit: cover;
	height: 100%;
}

/* @group contents */
.contents_arch0 {
	width: 92%;
	max-width: 1024px;
	margin: 2vh auto;
	padding: 0;
	position: relative;
    text-align: center;
}
.contents_arch1 {
	width: calc(96% / 2);
	margin: 2vh 0 0 2%;
	padding: 0;
	position: relative;
}
.contents_arch2:first-child {
	padding: 0 2% 0 0;
}
.contents_arch2:nth-child(even) {
	padding: 0 0 0 2%;
}
.contents_arch2 {
	width: calc(100% / 2);
	margin: 4vh 0;
	padding: 0;
	position: relative;
}
.contents_arch0, .contents_arch1, .contents_arch2 {
	overflow: hidden;
	display: block;
	-webkit-border-radius: .2vw;
	-moz-border-radius: .2vw;
	-ms-border-radius: .2vw;
	-o-border-radius: .2vw;
	border-radius: .2vw;
}
.cont_2box {
	display: -ms-flexbox;
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	align-items: stretch;
	margin: 0 auto 0;
	width: 100%;
}
.cont_box {
	width: calc(96%/2);
	margin: 1%;
	padding: 3%;
}
.arch_title {
	color: rgb(255,255,255);
	font-size: 3vh;
	line-height: 1.6em;
	font-weight: bold;
	text-align: center;
	margin: 1vh auto 1vh;
}
.arch_boxtitle {
	font-size: 2.4vh;
	line-height: 1.4em;
	font-weight: bold;
	text-align: left;
	margin: 0 0 1.5vh;
	padding: 0 0 1vh 0;
	border-bottom: 2px solid rgb(191,156,70);
}
.arch_subtitle {
	color: rgb(255,255,255);
	font-size: 2.4vh;
	line-height: 1.8em;
	font-weight: bold;
	text-align: justify;
	text-justify: inter-ideograph;
	margin: 0 0 2vh;
	padding: 2vw;
	border: 2px solid rgb(191,156,70);
	overflow: hidden;
}
.arch_catch {
	color: rgb(191,156,70);
	font-size: 2.4vh;
	line-height: 1.8em;
	font-weight: bold;
	text-align: center;
	margin: 4vh 0 2vh;
}
.arch_lead {
	color: rgb(255,255,255);
	font-size: 2.4vh;
	font-weight: normal;
	line-height: 1.8em;
	text-align: justify;
	text-justify: inter-ideograph;
	margin: 0 auto 0;
}
.arch_para {
	color: #efefef;
	font-size: 2vh;
	font-weight: normal;
	line-height: 1.8em;
	text-align: justify;
	text-justify: inter-ideograph;
}
.arch_paras {
	color: #efefef;
	font-size: 1.8vh;
	font-weight: normal;
	line-height: 1.6em;
	text-align: justify;
	text-justify: inter-ideograph;
}
.arch_eyecatch {
	color: rgb(255,255,255);
	font-size: 3vh;
	line-height: 6em;
	font-weight: bold;
	text-align: center;
	width: 90%;
	margin: 0 auto;
}
.arch_inclnavi {
	color: rgb(229,0,18);
	font-size: 2.4vh;
	line-height: 2em;
	font-weight: bold;
	text-align: center;
	width: 80%;
	margin: 1vh auto 2vh;
	background-color: rgb(191,156,70);

	-webkit-border-radius: 1em;
	-moz-border-radius: 1em;
	-ms-border-radius: 1em;
	-o-border-radius: 1em;
	border-radius: 1em;
}
.arch_inclnavi-L {
	color: rgb(229,0,18);
	font-size: 2.4vh;
	line-height: 2em;
	font-weight: bold;
	text-align: center;
	width: 90%;
	margin: 1vh auto 2vh;
    padding: 2vw;
	background-color: rgb(191,156,70);

	-webkit-border-radius: 1em;
	-moz-border-radius: 1em;
	-ms-border-radius: 1em;
	-o-border-radius: 1em;
	border-radius: 1em;
}
.arch_caption {
	color: rgb(191,156,70);
	font-size: 2vh;
	font-weight: normal;
	line-height: 1.6em;
	text-align: justify;
	text-justify: inter-ideograph;

	width: 100%;
	overflow: hidden;
	position: relative;
	display: block;
	margin: 0 auto 6vh;
	padding: 2vh;
	border: 1px solid rgb(191,156,70);
}
.contents_arch2 figure {
	width: 80%;
	margin: 0 auto;
	display: block;
	overflow: hidden;
}
.contents_arch2 img {
	width: 100%;
}

.btn-push {
  display: inline-block;
  width: 100%;
  text-align: center;
  background-color: rgb(191,156,70);
  font-size: 3vh;
  color: #FFF;
  text-decoration: none;
  font-weight: bold;
  padding: .3vh 1vw;
  margin: 1vh auto;
  border-radius: 1vw;
  border-bottom: .2vh solid rgb(89,89,89);
}
.btn-push:active {
    transform: translateY(.2vh);
    border-bottom: none;
}

.frame-box-001 {
    width: 88%;
	max-width: 960px;
	padding: 2vw;
    margin: 0 auto;
	position: relative;
}
.frame-box-001::before, .frame-box-001::after {
	content: '';
	width: 5vw;
	height: 5vw;
	position: absolute;
}
.frame-box-001::before {
	border-left: solid .5vw rgb(255,255,255);
	border-top: solid .5vw rgb(255,255,255);
	top: 1vw;
	left: 1vw;
}
.frame-box-001::after {
	border-right: solid .5vw rgb(255,255,255);
	border-bottom: solid .5vw rgb(255,255,255);
	bottom: 1vw;
	right: 1vw;
}
/* @end */

#container {
	width: 100%;
	padding: 2vw;
	position: relative;
}
#contents_box {
	width: 96%;
	margin: 2% auto 2%;
	overflow: hidden;
	position: relative;
	background-color: rgb(0,0,0);
}
.contents_sect {
	margin: 0 auto;
	padding: 0 4%;
	position: relative;
	overflow: hidden;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.pc {
	visibility: visible;
}
.sp {
	visibility: hidden;
	display: none;
	overflow: hidden;
}

#container .box{
    margin: 0 0 2vh 0;
    border:1px solid rgb(255,255,255);
    padding: 0;

	background-color: rgb(0,0,0);
	-webkit-border-radius: .2vw;
	-moz-border-radius: .2vw;
	-ms-border-radius: .2vw;
	-o-border-radius: .2vw;
	border-radius: .2vw;
}
.box figure {
	width: 100%;
    margin: 0 0 1vh 0;
	display: block;
	overflow: hidden;
}
.box figure img{
    object-fit: cover;
    width: 100%;
}
.box picture {
	width: 100%;
    margin: 0 0 1vh 0;
	display: block;
	overflow: hidden;
}
.box picture img{
    object-fit: cover;
    width: 100%;
}
.box .item_title {
	color: rgb(255,255,255);
	font-size: 3vh;
	line-height: 1em;
	font-weight: bold;
	text-align: center;
	margin: 0 auto 1vh;
}
.box .item_paragraph{
	color: #efefef;
	font-size: 1.6vh;
	font-weight: normal;
	line-height: 1.8em;
	text-align: justify;
	text-justify: inter-ideograph;
}

/* @group table */
table {
	width: 100%;
    margin: 0 auto 1vh;
	border-collapse: collapse;
	border-spacing: 0;
	overflow: hidden;
	background-color: rgb(255,255,255);
}
table tr {
	width: 100%;
	overflow: hidden;
}
table td {
	padding: 0.5vh;
	text-align: center;
	overflow: hidden;
	vertical-align: middle;
    border-bottom: 1px solid rgb(66,66,66);
}
table td.list{width: 30%;}
table td.listcont{width: 70%;}
/* @end */

/* @group banner */
.banner {
	width: 100%;
	overflow: hidden;
	position: relative;
}
.bnr_r {
	width: 100%;
	max-width: 1200px;
	margin: 4vh auto;
	border: 1px solid rgb(220,220,220);
}
.bnr_a, .bnr_b {
	width: 100%;
	max-width: 728px;
	margin: 4vh auto;
	border: 1px solid rgb(220,220,220);
}
.bnr_sq {
	width: 100%;
	max-width: 300px;
	margin: 4vh auto;
	border: 1px solid rgb(220,220,220);
}
.bnr_r img, .bnr_a img, .bnr_b img, .bnr_sq img {
	width: 100%;
}
/* @end */

/* @group footer */
footer {
	width: 100%;
	padding: 0 0 4vh;
	overflow: hidden;
	background-color: rgb(0,0,0);
}
.footer_contents {
	width: 100%;
	max-width: 960px;
	margin: 0 auto;
	display: block;
	overflow: hidden;
	position: relative;
}
footer .ftr_para {
	color: #efefef;
	font-size: 2vh;
	font-weight: normal;
	line-height: 1.8em;
	text-align: center;
}
/* @end */

/* @group Clearfix */
.clearfix:before, .clearfix:after {
	content: "";
	display: table;
}
.clearfix:after {
	clear: both;
}
.clearfix {
	zoom: 1;
}s
/* @end */

@media screen and (min-width:1280px){
#container{
    column-count: 4;
}
}

@media screen and (min-width:768px){
/*デスクトップ/タブレット横*/
.pc {
	visibility: visible;
}
.sp {
	visibility: hidden;
	display: none;
	overflow: hidden;
}
header {
	width: 100%;
	margin: 0 auto;
}
#container{
    column-count: 3;
    column-gap: 2vh;
}
#container .box{
    break-inside: avoid;
    page-break-inside: avoid;
}
main section{
    column-count: 2;
}
}

@media screen and (max-width:481px) {
/*タブレット縦 /スマートフォン横*/

.pc {
	visibility: hidden;
	display: none;
	overflow: hidden;
}
.tb {
	visibility: hidden;
	display: none;
	overflow: hidden;
}
.sp {
	visibility: visible;
	display: block;
}

#page-top {
	width: 96%;
    right: 2%;
}
#container{
    column-count: 1;
}
#container .box{
    break-inside: avoid;
    page-break-inside: avoid;
}
main section{
    column-count: 1;
}

.box .item_paragraph{
	font-size: 2vh;
	line-height: 1.8em;
	padding: 0 1vw;
}
.arch_eyecatch {
	color: rgb(255,255,255);
	font-size: 3vh;
	line-height: 2em;
	font-weight: bold;
	text-align: center;
	width: 90%;
	margin: 0 auto 4vh;
}

footer .ftr_para {
	color: #efefef;
	font-size: 1.4vh;
	font-weight: normal;
	line-height: 1.4em;
	text-align: center;
}
}