@charset "utf-8";

body {
background: #000;
color:#eee;
font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN",メイリオ,Meiryo,sans-serif;
}
html,body,
h1,h2,h3,h4,h5,h6,p,
ul,li {
margin: 0;
padding: 0;
}
ul,li {
list-style: none;
}
img {
	vertical-align:middle;
	display: block;
	border:0;
	width:100%;
	height: auto;
	line-height:0;
	font-size:0;
}
a {
color:#fff;
text-decoration: underline;
}
#d-eigacom {
max-width: 200px;
margin: 1rem auto 1.5rem auto;
text-align: center;
}
#tifflogo {
max-width: 300px;
margin: 1rem auto 1.5rem auto;
text-align: center;
}
.blocker {
    z-index: 20;
}
.modal {
    z-index: 30;
    max-width:none !important;
    width: 90%;
    background: #000;
    padding: 20px 20px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    -ms-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: 0 0 10px #000;
    -moz-box-shadow: 0 0 10px #000;
    -o-box-shadow: 0 0 10px #000;
    -ms-box-shadow: 0 0 10px #000;
    box-shadow: 0 0 10px #000;
}
#videobox {
  object-fit: contain;
}
video {
width: 100%;
}
:root {
    --swiper-theme-color: #ff0000 !important;
}
#slidearea {
position: relative;
width: 100%;
}
.swiper-container {
width: 100%;
overflow: hidden;
}
.swiper-pagination-bullet-active {
    background: #ff0000 !important;
}
.swiper-horizontal>.swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom, .swiper-pagination-fraction {
    bottom: 1rem;
    top: auto;
    left: 0;
    width: 100%;
}
header h1 {
position: absolute;
top: 0;
left: 2rem;
z-index: 10;
width: 200px;
}
header p {
position: absolute;
top: 2rem;
right: 2rem;
z-index: 11;
width: 74px;
}
h2 {
font-size: 2rem;
margin-bottom: .75rem;
}
.headbox {
color:#fff;
padding: 3rem 7% 6rem 7%;
text-align: center;
}
#subcontentsarea ul {
padding: 3rem;
}

#moviearea {
position: relative;
width: 100%;
}
#moviearea div {
position: relative;
width: 100%;
}
#moviearea div::before {
position: absolute;
top: 0;
left: 0;
content: "";
width: 100%;
height: 100%;
background: rgba(0,0,0,0.3);
}
#moviearea h2 {
font-size: 4rem;
font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
line-height: 1.4;
position: absolute;
bottom:10%;
z-index: 1;
text-align: center;
width: 100%;
text-shadow: 0 0 20px rgba(0,0,0,0.8);
}
footer {
border-top: #ff0000 1px solid;
background: #000;
padding: 1.5rem 0;
color:#666;
}
footer p {
font-size: .7rem;
text-align: center;
}

#headarea {
position: relative;
height: 135px;
width: 100%;
background: url("images/headbk.jpg");
background-size: auto 100%;
z-index: 100;
}
.lead {
font-size: 1.15rem;
}

.row {
width: 100%;
display: flex;
justify-content: space-between;
}
.col-7 {
width: 58%;
}
.col-6 {
width: 50%;
}
.col-5 {
width: 42%;
}
.col-4 {
width: 33.333333%;
}
.col-3 {
width: 25%;
}
.col-2 {
width: 20%;
}

.text {
padding: 4%;
}
.text p {
margin: 0 0 1rem 0;
font-size: .95rem;
}
.text p.txt-ll {
font-size: 1.35rem;
line-height: 1.8;
color:#DFB763;
}
.text p.txt-l {
font-size: 1.15rem;
line-height: 1.8;
}

.cntbox {
padding: 1% 7% 7% 7%;
}
.table {
width: 100%;
border: #444 1px solid;
border-collapse:  collapse;
}
.table th {
width: 15%;
padding: 1%;
border: #444 1px solid;
background-color: #222;
color:#fff;
}
.table td {
width: 85%;
padding: 1%;
border: #444 1px solid;
background-color: #fff;
color:#111;
}
.mapbox {
margin: 2rem 0 0 0;
position: relative;
padding-bottom: 40%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.mapbox iframe,
.mapbox object,
.mapbox embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.mrgTlll {
    margin-top: 12rem !important;
}
.mrgTll {
    margin-top: 8rem !important;
}
.mrgTl {
    margin-top: 4rem !important;
}
.mrgT {
    margin-top: 2rem !important;
}
.mrgTs {
    margin-top: 1rem !important;
}
.mrgTss {
    margin-top: 0.5rem !important;
}
.mrgTno {
    margin-top: 0 !important;
}
.mrgBl {
    margin-bottom: 4rem !important;
}
.mrgB {
    margin-bottom: 2rem !important;
}
.mrgBs {
    margin-bottom: 1rem !important;
}
.mrgBss {
    margin-bottom: 0.5rem !important;
}
.mrgBno {
    margin-bottom: 0 !important;
}
.mrgRno {
    margin-right: 0 !important;
}
.mrgLno {
    margin-left: 0 !important;
}

@media screen and (max-width: 1200px) {

#moviearea h2 {
font-size: 3rem;
}

}
@media screen and (max-width: 991px) {

.row {
display: block;
width: 100%;
}
.row > .col-6 {
width: 100%;
}
.row > .col-3 {
display:block;
float: left;
width: 50%;
}
.headbox,
.text,
footer {
clear: both;
}
.text {
padding: 2%;
}

#moviearea h2 {
font-size: 2.4rem;
text-shadow: 0 0 15px rgba(0,0,0,0.8);
}

}


@media screen and (max-width: 768px) {



#moviearea div {
clear: both;
overflow: hidden;
}
#moviearea video {
position: relative;
top: 0;
left: -25%;
width: 150%;
}
.mrgTlll {
    margin-top: 6rem !important;
}
.mrgTll {
    margin-top: 4rem !important;
}
.mrgTl {
    margin-top: 2rem !important;
}
.mrgT {
    margin-top: 1rem !important;
}
.mrgTs {
    margin-top: 0.5rem !important;
}
.mrgTss {
    margin-top: 0.3rem !important;
}
.mrgBl {
    margin-bottom: 2rem !important;
}
.mrgB {
    margin-bottom: 1rem !important;
}
.mrgBs {
    margin-bottom: 0.5rem !important;
}
.mrgBss {
    margin-bottom: 0.3rem !important;
}

}