/*管理画面設定----------------------------------*/
#adminBox {
    position: fixed;
    z-index: 100;
    width: 100%;
    bottom: 0;
    margin: 0;
}
#adminBox>#loginUserStatus {
    display: block;
}

body {
	color: #555 !important;
}
p {
	line-height: 1.8;
}
.container-fluid {
	padding: 0 !important;
}
a  {
 color: #6EB92B;
}
#about {
	background:url(../images/about-bg.png) repeat;
}
ul.multiple {
margin-bottom:2em;
}
ul.row {
	padding: 10px;
}
@media screen and (max-width: 767px) {
.sp-no {
	display: none;
}
}
h2 {
	color: #6EB92B;
	line-height: 1.4;
    margin-bottom: 5px;
    font-weight: 600 !important;
	padding: 30px;
}
@media screen and (max-width: 767px) {
h2 {
	font-size: 1.2rem !important;
	padding: 10px;
	}
}
#top-news p {
	line-height: 1.4;
}
#top-news span {
	display: block;
	margin-bottom: 8px;
}
#top-news .h4 p {
	border-left: 5px solid #6EB92B;
	padding-left: 10px;
}
@media screen and (max-width: 767px) {
#top-news .h4 p {
	font-size: 1rem;
}
}
#top-news .h4 p span {
	color: #6EB92B;
	font-weight: normal;
}

#attention {
font-size: 90%;
}

#illust01 {
	background-image: url("../images/illust01.png") ,url("../images/illust02.png") ;
	background-position: 10% 10%, 95% 5%;
	background-repeat: no-repeat, no-repeat;
}
#illust02 {
	background-image: url("../images/illust03.png") ,url("../images/illust04.png") ,url("../images/illust05.png") ,url("../images/illust06.png") ;
	background-position: left bottom, left 10%, right 5%, 85% 80%;
	background-repeat: no-repeat;
}
@media screen and (min-width:768px) and (max-width:1280px) {
	#illust01 {
		background-size: auto 100px, auto 150px;
	}
	#illust02 {
		background-size: auto 200px,  auto 150px,  auto 150px;
	}
}
@media screen and (max-width: 767px) {
	#illust01, #illust02 {
		background:none;
	}
}
div#movie {
	width:600px;
	margin: 0px auto;
}
@media screen and (max-width: 767px) {
div#movie {
	width:auto;
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
div#movie iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
}
.card-a {
    display: flex;
}
@media screen and (max-width: 767px) {
.card-a {
	margin-bottom: 10px;
}
}
.card-a > div {
    display: flex;
    flex-direction: column;
    background: #fff;
    overflow: hidden;
     border-radius: 4px;
}
.card-a > div > a {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}
.card-a > div .img, .card-c > div .img {
    overflow: hidden;
}
.card-a img, .card-b img, .card-c img {
    transition: all .3s;
    transform: scale(1);
}
.card-a div.text {
    padding: 20px;
}
.card-heading {
    line-height: 1.4;
    margin-bottom: 5px;
    font-weight: 600;
    text-align: center;
}
.card-a a  {
 color: #333;
}


#sdgs {
	background:url(../images/sdgs-bg.jpg) no-repeat center center / cover;
}
#sdgs h3 {
	color: #fff;
	font-weight: bold;
	font-weight: 600;
	font-size: 1.75rem;
	line-height: 1.4;
	margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
#sdgs h3 {
	font-size: 1.2rem;
	margin-bottom: 10px;
	}
}
#sdgs p {
	line-height: 1.6;
}
#sdgs .linkbtn a {
	background: #fff;
	color: #6EB92B;
}
@media screen and (min-width:768px) and (max-width:1280px) {
#sdgs-logo  {
	width: 250px;
	height: auto;
}
}
@media screen and (max-width: 767px) {
#sdgs-logo  {
	width: 150px;
	height: auto;
}
}
.linkbtn a {
	padding: 10px 20px;
	border-radius: 50px;
	font-weight: bold;
	font-size: 1.3rem;
	white-space: nowrap;
	background: #6EB92B;
	color: #fff;
}
@media screen and (max-width: 767px) {
.linkbtn a {
	font-size: 1rem;
}
}
.linkbtn a:link {
	text-decoration: none;
}
#products-link .img {
	object-fit:cover;
	border-radius:50%;
	overflow: hidden;
	margin: 0 auto;
}

#products-link h3 {
	color: #6EB92B;
	font-weight: 600;
	font-size: 1.2rem;
	line-height: 1.4;
	padding: 10px 0;
}
#products-link h3 a {
    background: url(../images/blankicon.png) no-repeat left center;
    padding: 35px;
}
#products-link p {
	line-height: 1.4;
	font-size: 0.9rem;
	padding: 0 10px;
}
@media screen and (max-width: 767px) {
#products-link h3 {
	font-size: 0.9rem;
	padding: 5px 0;
	}
#products-link p {
	padding: 0;
	}
#products-link h3 a {
background: url(../images/blankicon.png) no-repeat left center / 20px;
padding: 20px;
}
}
.img img:hover, .img img:hover {
  transform: scale(1.1);
transition-duration: 0.5s;
}

#recruit {
	background:url(../images/recruit-bg.jpg) no-repeat center center / cover;
}
#recruit h2 {
	color: #fff;
}

.top-p10 {
	padding: 80px 20px;
}
@media screen and (max-width: 767px) {
.top-p10 {
	padding: 20px;
}
}

@media screen and (max-width: 810px) {
header .logo h1 {
    font-size: 1em !important;
    margin: 0 !important;
}
}

/*能登半島お知らせ----------------------------------*/
#oshirase {
margin-top:6em;
}
@media screen and (max-width: 767px) {
#oshirase  { margin-top: 60px;}
}

/*パラパラ画像----------------------------------*/


#mission { background: #fff; overflow-y: visible; z-index: 200; }


#mission .blocks { width: 100%; }

#mission .blocks ul { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: -moz-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }

#mission .blocks ul li { width: 25%; height: 0px; padding-bottom: 25.33%; display: block; position: relative; background: #fff; perspective: 800; }

#mission .blocks ul li .inr, #mission .blocks ul li .b, #mission .blocks ul li .f, #mission .blocks ul li .i_b { width: 100%; position: absolute; height: 100%; top: 0px; left: 0px; }


#mission .blocks ul li .inr { transform-style: preserve-3d; -moz-transform-style: preserve-3d; -webkit-transform-style: preserve-3d; -webkit-transition: transform 0.4s ease; -ms-transition: transform 0.4s ease; transition: transform 0.4s ease; transform: rotateX(45deg) rotateY(0deg) rotateZ(135deg) scale(1); -webkit-transform: rotateX(45deg) rotateY(0deg) rotateZ(135deg) scale(1); -moz-transform: rotateX(45deg) rotateY(0deg) rotateZ(135deg) scale(1); -ms-transform: rotateX(45deg) rotateY(0deg) rotateZ(135deg) scale(1); }

#mission .blocks ul li .b, #mission .blocks ul li .f { backface-visibility: hidden; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; }

#mission .blocks ul li .f { background: #fff; z-index: 2; }

#mission .blocks ul li .b { background: #fff; transform: rotateY(180deg); -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); -ms-transform: rotateY(180deg); }


#mission .blocks ul li ul { position: absolute; width: 100%; height: 100%; top: 0px; left: 0px; }

#mission .blocks ul li ul li { width: 100%; height: 100%; padding-bottom: 0px; position: absolute; top: 0px; left: 0px; background-size: cover; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${freaking-ie})"; filter: alpha(opacity=0); -webkit-opacity: 0; -khtml-opacity: 0; -moz-opacity: 0; opacity: 0; -webkit-transition: opacity 0.8s ease; -ms-transition: opacity 0.8s ease; transition: opacity 0.8s ease; }

#mission .blocks ul li ul.active0 li:nth-child(1) { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${freaking-ie})"; filter: alpha(opacity=100); -webkit-opacity: 1; -khtml-opacity: 1; -moz-opacity: 1; opacity: 1; }

#mission .blocks ul li ul.active1 li:nth-child(2) { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${freaking-ie})"; filter: alpha(opacity=100); -webkit-opacity: 1; -khtml-opacity: 1; -moz-opacity: 1; opacity: 1; }

#mission .blocks ul li ul.active2 li:nth-child(3) { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${freaking-ie})"; filter: alpha(opacity=100); -webkit-opacity: 1; -khtml-opacity: 1; -moz-opacity: 1; opacity: 1; }

#mission .blocks ul li ul.active3 li:nth-child(4) { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${freaking-ie})"; filter: alpha(opacity=100); -webkit-opacity: 1; -khtml-opacity: 1; -moz-opacity: 1; opacity: 1; }

#mission .blocks ul li ul li.img0 { background-image: url(../images/mission/img0.jpg); }

#mission .blocks ul li ul li.img1 { background-image: url(../images/mission/img1.jpg); }

#mission .blocks ul li ul li.img2 { background-image: url(../images/mission/img2.jpg); }

#mission .blocks ul li ul li.img3 { background-image: url(../images/mission/img3.jpg); }

#mission .blocks ul li ul li.img4 { background-image: url(../images/mission/img4.jpg); }

#mission .blocks ul li ul li.img5 { background-image: url(../images/mission/img5.jpg); }

#mission .blocks ul li ul li.img6 { background-image: url(../images/mission/img6.jpg); }

#mission .blocks ul li ul li.img7 { background-image: url(../images/mission/img7.jpg); }

#mission .blocks ul li ul li.img8 { background-image: url(../images/mission/img8.jpg); }

#mission .blocks ul li ul li.img9 { background-image: url(../images/mission/img9.jpg); }

#mission .blocks ul li ul li.img10 { background-image: url(../images/mission/img10.jpg); }

#mission .blocks ul li ul li.img11 { background-image: url(../images/mission/img11.jpg); }

#mission .blocks ul li ul li.img12 { background-image: url(../images/mission/img12.jpg); }

#mission .blocks ul li ul li.img13 { background-image: url(../images/mission/img13.jpg); }

#mission .blocks ul li ul li.img14 { background-image: url(../images/mission/img14.jpg); }

#mission .blocks ul li ul li.img15 { background-image: url(../images/mission/img15.jpg); }

#mission .blocks ul li ul li.img16 { background-image: url(../images/mission/img16.jpg); }

#mission .blocks ul li ul li.img17 { background-image: url(../images/mission/img17.jpg); }

#mission .blocks ul li ul li.img18 { background-image: url(../images/mission/img18.jpg); }

#mission .blocks ul li ul li.img19 { background-image: url(../images/mission/img19.jpg); }

#mission .blocks ul li ul li.img20 { background-image: url(../images/mission/img20.jpg); }

#mission .blocks ul li ul li.img21 { background-image: url(../images/mission/img21.jpg); }

#mission .blocks ul li ul li.img22 { background-image: url(../images/mission/img22.jpg); }

#mission .blocks ul li ul li.img23 { background-image: url(../images/mission/img23.jpg); }

#mission .blocks ul li ul li.img24 { background-image: url(../images/mission/img24.jpg); }

#mission .blocks ul li ul li.img25 { background-image: url(../images/mission/img25.jpg); }

#mission .blocks ul li ul li.img26 { background-image: url(../images/mission/img26.jpg); }
#mission .blocks ul li ul li.img27 { background-image: url(../images/mission/img27.jpg); }
#mission .blocks ul li ul li.img28 { background-image: url(../images/mission/img28.jpg); }
#mission .blocks ul li ul li.img29 { background-image: url(../images/mission/img29.jpg); }
#mission .blocks ul li ul li.img30 { background-image: url(../images/mission/img30.jpg); }
#mission .blocks ul li ul li.img31 { background-image: url(../images/mission/img31.jpg); }
#mission .blocks ul li ul li.img32 { background-image: url(../images/mission/img32.jpg); }
#mission .blocks ul li ul li.img33 { background-image: url(../images/mission/img33.jpg); }


#mission .blocks ul .icon .b, #mission .blocks ul .icon .i_b { background-size: cover; }

#mission .blocks ul .icon00 .i_b { background-image: url(../images/common/icon/00.png); }

#mission .blocks ul .icon00 .i_b { background-image: url(../images/common/icon/00.png); }
#mission .blocks ul .icon01 .i_b { background-image: url(../images/common/icon/01.png); }


  #mission { width: 100%; }
  #mission .col2 { width: 100%; position: relative; height: 0px; padding-bottom: 43%; }

  #mission .col2 .blocks { width: 100%; height: 0px; padding-bottom: 100%; position: absolute; right: 0%; top: 0px; }
  #mission .col2 .blocks ul { position: absolute; height: 100%; width: 100%; display: block; }
  #mission .col2 .blocks ul li { width: 20%; height: 0px; padding-bottom: 20%; position: absolute; }
  #mission .col2 .blocks ul li ul { width: 100%; }
  #mission .col2 .blocks ul li ul li { height: 100%; width: 100%; padding-bottom: 0px; }
  #mission .col2 .blocks ul .m0 { left: 0px; top: 0px; }
  #mission .col2 .blocks ul .m1 { left: 20%; top: 0px; }
  #mission .col2 .blocks ul .m2 { left: 40%; top: 0px; }
  #mission .col2 .blocks ul .m3 { left: 60%; top: 0px; }
  #mission .col2 .blocks ul .m4 { left: 80%; top: 0px; }
  #mission .col2 .blocks ul .m5 { left: 0px; top: 20%; }
  #mission .col2 .blocks ul .m6 { left: 20%; top: 20%; }
  #mission .col2 .blocks ul .m7 { left: 40%; top: 20%; }
  #mission .col2 .blocks ul .m8 { left: 60%; top: 20%; }
  #mission .col2 .blocks ul .m9 { left: 80%; top: 20%; }
  
@media screen and (max-width: 767px) {
 #mission .col2 { width: 100%; position: relative; height: 0px; padding-bottom: 55%; }
  #mission .col2 .blocks ul li { width: 25%; height: 0px; padding-bottom: 25%; position: absolute; }
  #mission .col2 .blocks ul .m0 { left: 0px; top: 0px; }
  #mission .col2 .blocks ul .m1 { left: 25%; top: 0px; }
  #mission .col2 .blocks ul .m2 { left: 50%; top: 0px; }
  #mission .col2 .blocks ul .m3 { left: 75%; top: 0px; }
  #mission .col2 .blocks ul .m4 { left: 0px; top: 25%; }
  #mission .col2 .blocks ul .m5 { left: 25%; top: 25%; }
  #mission .col2 .blocks ul .m6  { left: 50%; top: 25%; }
  #mission .col2 .blocks ul .m7 { left: 75%; top: 25%; }
  #mission .col2 .blocks ul .m8 { display:none; }
  #mission .col2 .blocks ul .m9 { display:none }
}

#mission .col2 .blocks.animate ul li.c .inr { transform: rotateX(0deg) rotateY(180deg) rotateZ(0deg) scale(1); -webkit-transform: rotateX(0deg) rotateY(180deg) rotateZ(0deg) scale(1); -moz-transform: rotateX(0deg) rotateY(180deg) rotateZ(0deg) scale(1); -ms-transform: rotateX(0deg) rotateY(180deg) rotateZ(0deg) scale(1); }

#mission .col2 .blocks.animate ul li.c .inr .f { background: none; }






/*スライダー----------------------------------*/
.multiple { padding: 0;}
.multiple div img { width: 100%;}
.multiple div { margin: 0;}
.multiple .slick-next { right: 17px;　z-index: 100;}
.multiple .slick-prev { left: 23px; z-index: 100;}
.multiple li { margin-right:15px;}
.slick-arrow {
	z-index: 100;
	display: block;
}
.prev-arrow, .next-arrow {
    z-index: 100;
	display: block;
}
.next-arrow {
    right: -50px;
}
.prev-arrow {
	left: -50px;
}

.prev-arrow, .next-arrow {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: 40%;
    display: block;
	width: 30px;
    height: 30px;
    margin-top: -20px;
    padding: 0;
    cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
    background: transparent;
	opacity: 0.5;
}

.slick-dots {
	display: none;
}

@media screen and (max-width: 767px) {
.next-arrow {
    right: 20px;
}
.prev-arrow {
    left: 20px;
}
.prev-arrow, .next-arrow {
	width: 30px;
    height: 30px;
}
}

#blueocean {
background:  url(/themes/saraya/images/blueocean.png) no-repeat right bottom;
color: #003071;
}

#blueocean .linkbtn a {
background:#003071;
}

@media screen and (max-width: 767px) {
#blueocean {
background:  url(/themes/saraya/images/blueocean.png) no-repeat right top / cover;
color: #003071;
}
}


#expo2025 {
background-color:#294c7f;
}
#expo-innner {
background:  url(/themes/saraya/images/sea-image.png) no-repeat right top / cover;
position:relative;
}
#partnerlogo {
position:absolute;
top:0;
right: 0;
}
#expo2025-dates {
position:absolute;
width:250px;
top:-150px;
left: 200px;
}
@media screen and (min-width:768px) and (max-width:1600px) {
#partnerlogo {
top:0;
right: 0;
width:450px;
}
#expo2025-dates {
width:200px;
top:-150px;
left: 100px;
}
}
@media screen and (max-width: 767px) {
#partnerlogo {
position:static;
height:100px;
}
#expo2025-dates {
width:100px;
top:-50px;
left: 10px;
}
}
#expo-innner h2 {
font-family: "A1 Mincho B JIS2004 AP";;
color:#0068b7;
    z-index: 50;
    position: relative;
}
@media screen and (min-width:768px) and (max-width:1200px) {
#expo-innner h2 {
        padding-top: 80px;
}
}
@media screen and (max-width: 767px) {
#expo-innner h2 {
       margin-top:-40px;
}
}



/*万博終了文言「たくさんのご来場ありがとうございました」----------------------------------*/
.closeTxt{
    background: #58ceff; /* 赤の場合 #dc3545 */
    color: #fff;
    font-size: 2rem;
    line-height: 1.5;
    font-weight: bold;
    padding: 1rem 1rem 0.7rem;
    margin: 10px 0 0 !important;
    text-align: center;
}

@media screen and (max-width: 810px){
    .closeTxt{
        font-size: 1.2rem;
    }
}