@charset "utf-8";
img{
max-width:100%}

.pc{
display:none!important}
#menu-toggle {
	display: flex;
}
header {
	position:relative;
	padding:.4em;
min-width:unset}
header #logo {
width:80%;
}
header #menu-toggle {
	position:absolute;
	right:1em;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	flex-direction: column;
	gap: 5px;
	cursor: pointer;
	z-index: 110;
}
#menu-toggle span {
	display: block;
	width: 25px;
	height: 3px;
	background-color: #333;
	border-radius: 2px;
	transition: all 0.3s;
}

/* ハンバーガーアニメーション */
#menu-toggle.active span:nth-child(1) {
 transform: rotate(45deg) translate(5px, 5px);
}
#menu-toggle.active span:nth-child(2) {
 opacity: 0;
}
#menu-toggle.active span:nth-child(3) {
 transform: rotate(-45deg) translate(5px, -5px);
}

header nav {
	position: fixed;
	top: 0;
	left: -100%; /* 初期は非表示 */
	width: 70%;
	max-width: 300px;
	height: 100%;
	background-color: #fff;
	box-shadow: 2px 0 6px rgba(0, 0, 0, 0.2);
	padding: 60px 20px;
	transition: left 0.3s ease;
	background:#666;
}
header nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 20px;
	flex-direction: column;
}
header nav a {
	color:#FFF;
margin:0;
padding:1em 0;
font-size:4vw
}

#logo{
width:30%}
/* 表示中の状態 */
  header nav.active {
	left: 0;
}

  /* ハンバーガーアニメーション */
  #menu-toggle.active span:nth-child(1) {
 transform: rotate(45deg) translate(5px, 5px);
}
 #menu-toggle.active span:nth-child(2) {
 opacity: 0;
}
 #menu-toggle.active span:nth-child(3) {
 transform: rotate(-45deg) translate(5px, -5px);
}
/**/
footer{}
footer .Inner{
padding: 2em 0;
display:block}
footer img{
display:block;
width:80%;
margin: 0 auto 1em}
footer figcaption{
text-align:center;
font-size:3vw}
footer .telephone{
padding: 0 0 2.6em;
text-align:center}

footer .telephone p{
font-size:5.2vw;
line-height: 1.6em}
footer .telephone a[href^="tel:"]{
font-size:8vw;
display: inline-block}

footer figcaption{
padding: 1em 0 2em;}
footer nav{
text-align:right;
font-size:2.8vw;}
#Copyright{font-size:2.8vw;
padding: 3em 0 9em;}
/**/



/**/
section {
	padding:4em 0
}
.kaso section{
padding: 0 0 2em 0}
nav[aria-label="Breadcrumb"] ol,
.Inner {
	width:92%
}

video {
	width:auto;
	height:100%
}
.breadcrumb ul{
padding: 2em 0
}
.breadcrumb ul li{font-size:2.8vw}
/**/


h1#mainK{
padding: 1.8em 0;
background-size: cover;
font-size:6.2vw}

section#mainK{
font-weight:700;
font-size:7.2vw;
padding: 1em 0;
line-height:normal;
background-size: 200%}

nav[aria-label="Breadcrumb"]{
padding: 2em 0 2.4em;
margin:0;
font-size:2.8vw}


h2 {
	font-size:6.2vw
}
h2 .catSub{
font-size:3.8vw}

section.past h2{
font-size:5vw}
.kaso h2{
font-size:6vw}


p, li, dl, th, td {
	font-size:3.4vw;
}
.btnMore a {
	font-size:4vw
}
/**/
nav[aria-label="Breadcrumb"] ol li{
font-size:2.4vw;}
/**/

#pageTop{
bottom:3em;
right: 1em}

#pageTop img{
width:50%}
/**/

section#mainINDEX{
width:100%;
overflow:hidden;
background-image:url(../images/main_sp.png);
background-position:center top;
background-repeat:repeat-y;
background-size: cover;
padding: 0 0 2em;}
section#mainINDEX .Inner h1{
padding: 2em .6em 1em}

section#mainINDEX .northJP{
display:block;
margin: 0 -2% 0 auto;
width:90%}
section#mainINDEX dl{
padding:1em;
display:block;
width:100%}

section#mainINDEX dt{
font-size:4.4vw;
padding: .4em 0;
margin-bottom:1em;
}

section#mainINDEX dd{
width: auto}
section#mainINDEX dd.Info{
display:block}

section#mainINDEX dd.Info small.year{
font-size:6vw;
padding-left:.28em;
margin-bottom:3em;
float:left}
section#mainINDEX dd.Info .date{
padding-left:.48em;
overflow:hidden;
display:flex;
align-items:center;}
section#mainINDEX dd.Info .date:nth-of-type(2){
padding-top:15px;
}
section#mainINDEX dd.Date{
line-height: 1.6em;
text-align: right;
font-size: 6.4vw}

section#mainINDEX dd.Date span{
display: block;
margin: -.4em .6em 0 0}
section#mainINDEX dd.Info strong{
font-size:10vw}

section#mainINDEX dd.Info small.week{  font-family: "Courier New", Courier, monospace;
font-size:6vw}
section#mainINDEX dd.Info .time{
font-size:5vw}
section#mainINDEX dd.place{
font-size:5vw;
width:auto;
text-align:center}
section#mainINDEX dd.place small{
font-size:4vw}
/**/
#Introduction p{
text-align:left}
#Introduction .Features .Inn p{
margin: 1.4em 0;
}
#Introduction p.catch{
line-height:1.688em;
font-size:5.4vw;}
#Introduction p.catch br{
display:none}

#Introduction img{
display:block;
margin:auto}
#Introduction .Features .Inn .feature h3,
#Introduction .Features .Inn .feature p{
text-align: left;
}
#Introduction .Features .Inn .feature p{
font-size: 6vw
}
#Introduction .Features .Inn .feature h3{
align-items: baseline;
display: flex;
padding-top: .4em
}
#Introduction .Features .Inn .feature h3 em{
display: inline-block;
padding-left: .2em;
font-size: 10.8vw
}
#Introduction .Features .Inn .feature{
background-position: right center;
background-size:auto 96%;
padding: 0 0 1.6em 1.6em;

/*
max-width: 380px;
aspect-ratio: 1 / 1;
margin:auto;
text-align:center*/}

#Introduction .Features{
padding:0;
display:block}
#Introduction .Features .Inn{
width:100%;
margin:0 auto 2.4em}
#Introduction .Features .Inn .feature{
width: auto;
height: auto;
border-radius:10px;}

#Introduction .Features .Inn:nth-of-type(2) .feature{
background-size:auto 130%}

#Introduction .Features .Inn:nth-of-type(3) .feature{
background-position: 108% center}

#Introduction .Features .Inn:nth-of-type(3) .feature p{
font-size: 5.4vw;
}
/**/

#PickUp{
padding: 2em 0!important}
#PickUp .btnMore{
padding-top: 1.6em}
#PickUp .photo{
aspect-ratio: 220 / 160;
width:40%}
#PickUp .photo img{
width: auto!important;
max-width:unset;
max-height: 100%;
}
#PickUp dt{
font-size: 2.4vw}
#PickUp dd{
padding-left:4.8em;
font-size: 2.88vw}
/**/
section#Overview{
padding: 2em 0}

/**/
#Overview .gaiyo th, #Overview .gaiyo td{
font-size:3.8vw;}

#Overview .gaiyo th{
white-space:nowrap}
/**/
section.CV{
background-position:.8em 1em;
background-size: 24%;
width:94%;
margin: 1em auto 2em;
padding:1.4em 0 .6em!important;}
section.CV h2{
padding: 0 0 1em;
font-size:4vw}
section.CV h2,section.CV p{
text-align:left;
padding-left:30%}
section.CV h2+p{
line-height: 1.4em;
font-size:5vw}
section.CV .btn a{
font-size:3.6vw}


/**/
.bnrFIX{
justify-content:space-between;
align-items:center;
display:flex;
text-align:center;
top:auto;
width:100%;
bottom:0;
right:0;
left:0;
padding: .4em .6em;
min-height:unset;
border-radius:0}

.bnrFIX .Inn{
align-items:center;}

.bnrFIX p{
line-height:1.2em;
}
.bnrFIX p strong{
font-size:4vw}
.bnrFIX p strong br,
.cv-toggle{
display:none}
.bnr{
width:92%;
margin:auto}
.bnrFIX .btn{
position:relative;
color:transparent;
width: 30%;
font-size:3vw;
border-radius:6px;
overflow:hidden;
background-image: url(../images/ico_mail.png);
background-position:1em center;
background-repeat:no-repeat;
background-size: 1.2em;
padding: .488em 0;
margin:0}
.bnrFIX .btn::after{
content:"お問い合わせ";
color:#FFF;
position:absolute;
left:4em;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
font-size:2.5vw}

/**/

.listCategory{
justify-content:space-between;}

.listCategory li{
width:48%;
margin: 0 0 1em
}
/**/
section.DL ul{width:90%; margin:auto;
display:block}
section.DL ul li{
width:unset;
margin: 0 0 1em;
font-size:4vw}
section.DL ul li a{
padding: 1em 0 1em 1em;
background-size: 1.2em}

/**/
.shuttenCategory h3{
font-size:5vw;
margin-bottom:0}

.shuttenCategory p.aRIGHT{
font-size:2.8vw;
margin:0 0 1em}
.shuttenCategory table{
width:1200px;
}
.shuttenCategory th,
.shuttenCategory td{
font-size: 3.2vw}
/**/
#infoDetails p{
font-size:4vw;
margin: 0 0 2em}

/**/
  .gallery {
    flex-direction: column;
  }
   .gallery .Inn{
  width: 100%;
  aspect-ratio: 508 / 380;
  }
  .thumbnails {
    display: flex;
    justify-content: center;
    gap: 5px;
  }
.thumbnails li{
height: 6.4em;
width:calc(100% / 3);}

.thumbnails img{
height:100%}


/**/
#Movies{
display:block;
padding: 1em;
margin-bottom:3em
}

#Movies h2{
display:flex;
justify-content:center;
}
#Movies h2 img{
width:auto;
height: 1.4em;
margin-right:.6em}
/*
.movie{
 width: 100%;
 height: 0;
 position: relative;
 padding-top: 56.25%;
 overflow: hidden;
}

.movie iframe{
 position: absolute;
 top: 0;
 left: 0;
 width: 100% !important;
 height: 100% !important;
}

*/

/**/

#companyDATA{
margin-bottom:2em;
padding: 2em 1em}

#companyDATA h2{
font-size:5.2vw}

#companyDATA th{
width:28%}

#companyDATA .box:nth-of-type(1){
padding-bottom:2em}

/**/

#searchINDEX ul li{
line-height: 1.6em;
padding: .8em 0;
margin: 1em 0 0;
width:48.8%}

/**/
#searchSECOND .areaINFO .areaShosai{
margin: 0 0 1.6em}
#Access h3,
#searchSECOND .areaINFO h3{
font-size:4.4vw;
text-align:center}
#searchSECOND li a{
padding: .8em 1.2em}

#searchSECOND .areaINFO figure img{
width: 80%}
#searchSECOND .areaINFO .areaShosai h5{
font-size:3.8vw}

#searchSECOND .areaINFO .boxArea h4{
font-size:4.2vw}
#searchSECOND .areaINFO .areaShosai ul.listNormal li,
#searchSECOND .areaINFO .boxArea th, #searchSECOND .areaINFO .boxArea td{
font-size:3vw}
#searchSECOND .areaINFO .boxArea tr th.company{
width: 36%}
/**/
#searchSECOND ul.listAnk{
padding:0}
#searchINDEX p{
margin: 0 0 2em}
#searchINDEX h3{
margin: 2em 0 1em;
font-size:4.2vw}

/**/

#companyINFO .Intro{
padding:0 0 3em;
border-bottom:1px dotted #CCC;
margin: 0 0 3em}


#companyINFO h3{
font-size:4.4vw}

#companyINFO h4{
font-size:4vw}

#companyINFO .btn{
border:0;
padding: 0}
/**/

#Access .flexPC.tbl table{
width:100%;
}

#Access .flexPC.tbl th{
padding-right:2em;
}
#Access iframe{
height:24em;
margin-bottom:3em}
	#Privacy h2{
		font-family:5vw}
		
/**/
#PanelInformation{
padding-top: 2em}
#PanelPdfInformation a{
font-size:3.6vw;
margin:0 auto;
width: 80%;}