@charset "UTF-8";

@media screen and (min-width: 768px),print {  
html{ overflow: auto;}
header .headnavi li.list span a:hover{ color: #fff; }

span.fl-line {display: block;line-height: 1;width: 612px;height: 75px;overflow: visible; /* sticky等に影響させない */margin: 0 auto;left: 33px;position: relative;}
span.fl-line img {width: 100%;height: auto;object-fit: contain;display: block;clip-path: inset(0 100% 0 0);transition: clip-path 0.3s ease-out;}
span.fl-line.is-show img { clip-path: inset(0 0 0 0); }

header.fixd { animation: none; }

body{padding-top: 0;overflow-x: visible;}
header{ position: fixed;}
header .h-logo img{ -webkit-filter: brightness(0) invert(1); filter: brightness(0) invert(1); }
header,header span a{color: #fff;}
header.fixd,header.fixd span a{ color: #333; }
header.fixd .h-logo img{ -webkit-filter: brightness(0); filter: brightness(0); }

h1{ position: fixed; top: 50%; right: 20%;  transform: translateY(-50%); z-index: 3;}
/* 通常状態 */
#mainch { transition: opacity 0.8s ease, filter 0.8s ease; will-change: opacity, filter; }
/* 消える状態 */
#mainch.is-hide { opacity: 0; filter: blur(6px); }

.stack-section { position: -webkit-sticky; position: sticky; top: 0; width: 100%; height: 100vh; overflow: hidden; }

/* 重なり順の指定（後ろにくるほど上に重なる） */
.section-01 { z-index: 1; }
.section-02 { z-index: 2; background: url(../images/index/contentsmain-photo02.jpg)no-repeat top center; background-size: cover;}
.section-03 {z-index: 3;height: auto;}

/* 初期状態：ちょい拡大＋ぼかし */

/* 表示後 */

.section-01{position:relative;}

.section-01 .section-content{
  position:absolute;top:0;left:0;width:100%;height:100%;
  background:url(../images/index/contentsmain-photo01.jpg)no-repeat top center;
  background-size:cover;
  transform:scale(1.03);
  filter:blur(6px);
  transition:transform 1.4s ease,filter 1.4s ease;
  will-change:transform,filter;
}

/* 表示後 */
.section-01.is-show .section-content{
  transform:scale(1);
  filter:blur(0);
}

#section-02 {--scale: 0.95;transform: scale(var(--scale));transform-origin: center center;will-change: transform;position: relative;}
 /*中身のコンテンツ（任意） */
.section-content {display: flex;align-items: center;justify-content: center;/* height: 100%; */}

#contentsmain {position: relative;z-index: 1;width: 100%;background-color: #DFF3FB;background-image: url(../images/flow/contents01-back01.png);background-repeat: no-repeat;background-position: center bottom; /* 初期：bottom -100px */background-size: 100% auto;}
#contentsmain .back-Box {background:  url(../images/about/contentsmain-back02.png)repeat, url(../images/index/contentsmain-back01.png)no-repeat top center;padding-top: 18rem;padding-bottom: 350px;}

#contentsmain .inner-Box {margin: 0 auto 200px;position: relative;z-index: 2;padding: 0rem 4rem 0rem;max-width: 1280px;height: 375px;}
#contentsmain .inner-Box h2{font-size: 2.4rem;line-height: 1.67;letter-spacing: 0.12rem;font-weight: 400;text-align: center;position: absolute;top: 122px;left: 50%;margin-left: 55px;z-index: 3;}
#contentsmain .inner-Box h2 span{font-size: 4.8rem;line-height: 0.83;letter-spacing: 0.24rem;font-weight: 400;position: relative;top: 35px;left: 27px;}
#contentsmain .inner-Box .fl-line{position: absolute;top: 206px;left: 50%;width: 266px;margin-left: 78px;}
#contentsmain .inner-Box figure{width: 50rem;height: auto;aspect-ratio: 500 / 375;text-align: center;}
#contentsmain .inner-Box figure img{ width: 100%; height: auto; }

#contentsmain .inner-Box2 {margin: 0 auto 130px;position: relative;z-index: 2;padding: 0rem 4rem 0rem;max-width: 1280px;height: 525px;}
#contentsmain .inner-Box2 h2{font-size: 2.4rem;line-height: 1.67;letter-spacing: 0.12rem;font-weight: 400;text-align: center;position: absolute;top: 167px;left: 50%;margin-left: -411px;z-index: 3;}
#contentsmain .inner-Box2 h2 span{font-size: 4.8rem;line-height: 0.83;letter-spacing: 0.24rem;font-weight: 400;position: relative;top: 0;left: 0;display: block;margin: 37px 0;}
#contentsmain .inner-Box2 .fl-line{position: absolute;top: 256px;left: 50%;width: 298px;height: auto;margin-left: -412px;}
#contentsmain .inner-Box2 figure{width: 70rem;margin: 0 0 0 auto;position: relative;left: 170px;height: auto;aspect-ratio: 700 / 525;text-align: center;}
#contentsmain .inner-Box2 figure img{ width: 100%; height: auto; }

#contentsmain .inner-Box3 {margin: 0 auto 130px;position: relative;z-index: 2;padding: 0rem 4rem 0rem;max-width: 957px;height: 525px;}
#contentsmain .inner-Box3 h2{font-size: 2.4rem;line-height: 2.2;letter-spacing: 0.12rem;font-weight: 400;text-align: center;margin-bottom: 38px;}
#contentsmain .inner-Box3 h3{font-size: 4.8rem;line-height: 1.25;letter-spacing: 0.24rem;font-weight: 400;text-align: center;margin-bottom: -15px;position: relative;z-index: 3;}
#contentsmain .inner-Box3 .fl-line{position: relative;top: 0;margin-bottom: -8px;}
#contentsmain .inner-Box3 .text{font-size: 2.4rem;line-height: 2.5;letter-spacing: 0.12rem;font-weight: 400;text-align: center;margin-bottom: 67px;}
#contentsmain .inner-Box3 ul{ display: -webkit-box; display: -moz-flex; display: -ms-flex; display: -o-flex; display: -ms-flexbox; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -ms-flex-wrap: wrap; flex-wrap: wrap; }
#contentsmain .inner-Box3 ul li{margin-right: 3.8%;width: 30.8%;}
#contentsmain .inner-Box3 ul li:nth-child(3){ margin-right: 0; }
#contentsmain .inner-Box3 ul .blue-btn a{ width: 100%; }

.backimgbox {width: 100%;height: 147px;background: url(../images/common/fix-bottom.svg) no-repeat bottom center;background-size: 100% auto;position: absolute;bottom: 0;z-index: 10;opacity: 1;/* visibility: hidden; */}

#gallery{ }
#gallery{margin-left: 18.9vw;padding: 15rem 0 0;position: relative;margin-bottom: 160px;background: #fff;z-index: 5;}
#gallery ul{margin-bottom: 40px;}
#gallery li{ width: 605px; margin-right: 33px; }
#gallery li .figbo{aspect-ratio: 605 / 454;margin-bottom: 17px;}
#gallery li h3{ font-size: 1.8rem; line-height: 1.8; letter-spacing: 0; font-weight: 500; }
#gallery h2{font-size: 5rem;line-height: 1;letter-spacing: 0.3rem;font-weight: 400;position: relative;/* left: 7px; */top: 3px;margin-bottom: 36px;padding-left: 7px;}
#gallery h2 span{position: relative;font-size: 1.5rem;line-height: 4;letter-spacing: 0;font-weight: 400;display: block;margin: 3px 0 0;padding-left: 21px;font-style: normal;}
#gallery h2 span::before{content: "";display: block;background: #000;width: 2rem;height: 1px;position: absolute;top: 3rem;left: -0.6rem;}
#gallery .morebtng{position: absolute;top: 21.9rem;left: 50%;display: block;width: 10rem;height: 3rem;font-size: 1.6rem;line-height: 1;letter-spacing: 0.128rem;font-weight: 400;font-style: italic;margin-left: 32.4rem;z-index: 4;}
#gallery .morebtng a{ color: #0097A3;}
#gallery .morebtng a::before{content: "";width: 10rem;height: 1px;background: #0097A3;position: absolute;bottom: 3px;right: 0;transition: all 0.3s ease-in-out;}
#gallery .morebtng a:hover::before{ width: 0;}
#gallery .morebtng a .arr{position: relative;top: -3px;left: 2px;width: 1.9rem;display: inline-block;}
#gallery .prev-arrow{position: absolute;bottom: -56px;z-index: 3;padding-right: 3.7rem;padding-bottom: 0rem;cursor: pointer;}
#gallery .next-arrow{position: absolute;bottom: -56px;left: 75px;transform: scale(-1, 1);padding-right: 37px;cursor: pointer;}
#gallery .gallery-counter{ color: #0097A3;}
#gallery .gallery-counter span{ display: inline-block; border-bottom: #0097A3 1px solid; }
#gallery .gallery-counter .current{padding: 0 0 4px 20px;margin-right: 12px;width: 4.1rem;}
#gallery .gallery-counter .total{margin-left: 14px;padding: 0 20px 4px 0px;}

#voice{background: transparent linear-gradient(90deg, #EEF7F9 0%, #C7EDF8 100%) 0% 0% no-repeat padding-box; }
#voice .back-Box{background: url(../images/about/contentsmain-back02.png)repeat;padding: 14.6rem 4rem; position: relative;}
#voice .back-Box::before{content: "Owners Voice";font-family: "Libre Baskerville", serif;font-style: italic;font-size: 12rem;line-height: 1;letter-spacing: 0;font-weight: 400;white-space: nowrap;color: #0097A3;opacity: 0.1;transform: rotate(90deg);transform-origin: top center;position: absolute;top: 88px;right: 27px;height: 10px;width: 10px;display: block;}
#voice .inner-Box{margin: 0 auto;max-width: 1192px;position: relative;z-index: 3;}
#voice{position: relative;z-index: 5;}
#voice ul{margin-bottom: 40px;}
#voice li{width: 100%;}
#voice li .figbo{aspect-ratio: 66 / 44;width: 55.4%;float: left;}
#voice li h3{ font-size: 1.8rem; line-height: 1.8; letter-spacing: 0; font-weight: 500; }
#voice h2{font-size: 5rem;line-height: 1;letter-spacing: 0.3rem;font-weight: 400;position: relative;left: 0;top: 3px;margin-bottom: 36px;}
#voice h2 span{position: relative;font-size: 1.5rem;line-height: 4;letter-spacing: 0;font-weight: 400;display: block;margin: 3px 0 0 6px;padding-left: 21px;font-style: normal;}
#voice h2 span::before{content: "";display: block;background: #000;width: 20px;height: 1px;position: absolute;top: 30px;left: -6px;}
#voice .data{width: 44.6%;float: left;padding-left: 10%;padding-top: 95px;}
#voice .data h3{font-size: 2.8rem;line-height: 1.6;letter-spacing: 0;font-weight: 500;margin-right: -9px;margin-bottom: 21px;}
#voice .data p.text{font-size: 1.4rem;line-height: 1.5;letter-spacing: 0.028rem;font-weight: 400;margin-top: 21px;margin-bottom: 55px;}
#voice .data p.blue-btn a{ margin: 0;}

#voice .morebtng{position: absolute;top: 67px;left: 50%;display: block;width: 100px;height: 30px;font-size: 1.6rem;line-height: 1;letter-spacing: 0.128rem;font-weight: 400;font-style: italic;margin-left: 493px;z-index: 4;}
#voice .morebtng a{ color: #0097A3;}
#voice .morebtng a::before{content: "";width: 100px;height: 1px;background: #0097A3;position: absolute;bottom: 3px;right: 0;transition: all 0.3s ease-in-out;}
#voice .morebtng a:hover::before{ width: 0;}
#voice .morebtng a .arr{position: relative;top: -3px;left: 2px;}


#contents01 {margin: 0 auto 95px;position: relative;background: #fff;z-index: 4;overflow: hidden;}

.video-wrapper { position: relative; max-width: 1145px; width: 100%; position: absolute; line-height: 0; top: 0; right: 0; }
.video-wrapper video { width: 100%; height: auto; opacity: 0.3; }
.video-wrapper::before, .video-wrapper::after { content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 1; }
.video-wrapper::before { background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 25% ); }
.video-wrapper::after { background: linear-gradient(to top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 30% ); }


#contents01 .ttl-Box {margin: 0 auto;position: relative;padding: 19.7rem 4rem 0 64rem;max-width: 1280px;z-index: 3;min-height: 448px;}
#contents01 .ttl-Box h2.f-min {margin-bottom: 0px;position: absolute;font-size: 5rem;line-height: 1.6;letter-spacing: 0.25rem;font-weight: 400;left: 40px;top: 151px;}
#contents01 .ttl-Box p.text {margin-bottom: 3rem;position: relative;font-size: 1.6rem;line-height: 2.2;letter-spacing: 0.032rem;font-weight: 400;}
#contents01 .inner-Box1 {margin: 0 auto 179px;position: relative;padding-left: 56.2%;z-index: 3;padding-top: 100px;min-height: 600px;}
#contents01 .inner-Box1 .photo {position: absolute;top: 0;left: 0;width: 47.9%;height: auto;aspect-ratio: 92 / 60;text-align: center;}
#contents01 .inner-Box1 .photo img{width: 100%;}
#contents01 h3.f-min {margin-bottom: 15px;position: relative;font-size: 2.8rem;line-height: 1.6;letter-spacing: 0;font-weight: 400;}
#contents01 p.text2 {margin-bottom: 4.1rem;position: relative;font-size: 1.6rem;line-height: 2.2;letter-spacing: 0.032rem;font-weight: 400;max-width: 480px;}
#contents01 .inner-Box2 {margin: 0 auto;position: relative;min-height: 600px;padding: 50px 4rem 0 4rem;max-width: 920px;}
#contents01 .inner-Box1 .inBox{ }
#contents01 .inner-Box2 .photo {position: absolute;top: 0;right: -220px;width: 50%;height: auto;aspect-ratio: 380 / 475;text-align: center;}
#contents01 .inner-Box2 .photo img{
    width: 380px;
    height: 475px;
}
#contents01 .inner-Box3 {margin: 0 auto;position: relative;min-height: 600px;padding: 67px 4rem 0 76rem;max-width: 1280px;}
#contents01 .inner-Box3 .photo {position: absolute;top: 55px;left: 40px;width: 43.9%;height: auto;aspect-ratio: 60 / 44;text-align: center;}
#contents01 .inner-Box3 .photo img{ width: 100%; }
#contents01 .blue-btn a{ margin: 0; }

  
#news{background: transparent linear-gradient(90deg, #EEF7F9 0%, #C7EDF8 100%) 0% 0% no-repeat padding-box; }
#news .back-Box{background: url(../images/about/contentsmain-back02.png)repeat;padding: 14.6rem 4rem 7.4rem 4rem;position: relative;}
#news .inner-Box{margin: 0 auto;max-width: 1192px;position: relative;z-index: 3;}
#news{position: relative;z-index: 5;}

#news ul{display: -webkit-box;display: -moz-flex;display: -ms-flex;display: -o-flex;display: -ms-flexbox;display: flex;-webkit-box-lines: multiple;-moz-box-lines: multiple;-ms-flex-wrap: wrap;flex-wrap: wrap;margin-bottom: 65px;}
#news ul li{width: 31.5%;margin-right: 2.7%;position: relative;margin-bottom: 20px;}
#news ul li:nth-child(3n){margin-right: 0%;}
#news ul li .incap{width: 100%;aspect-ratio: 378 / 253;overflow: hidden;margin-bottom: 1.5rem;}
#news ul li .incap img{width: 100%; height: 100%; object-fit: cover; display: block;}
#news ul li .databox{min-height: 39px;position: relative;padding-right: 77px;margin-bottom: 11px;}
#news ul li .databox .timebox{position: absolute;top: 1.3rem;right: 0;color: #0097A3;font-size: 1.1rem;line-height: 1;letter-spacing: 0.088rem;}
#news ul li .databox .category-box{ font-size: 1.2rem; line-height: 1; letter-spacing: 0; color: #fff; }
#news ul li .databox .category-box span{display: inline-block;background: #0097A3;margin: 0 4px 4px 0;padding: 8px 12px;}
#news ul li a{display: block;padding-bottom: 24px;}
#news ul li h3{font-size: 1.6rem;line-height: 1.6;letter-spacing: 0;font-weight: 500;}
#news ul li .text{ }
#news ul li .arr{position: absolute;bottom: 0;right: 8px;transition: all 0.3s ease-in-out;}
#news ul li a:hover .arr{right: 0px;}
#news h2{font-size: 5rem;line-height: 1;letter-spacing: 0.3rem;font-weight: 400;position: relative;left: 0;top: 3px;margin-bottom: 36px;}
#news h2 span{position: relative;font-size: 1.5rem;line-height: 4;letter-spacing: 0;font-weight: 400;display: block;margin: 3px 0 0 6px;padding-left: 21px;font-style: normal;}
#news h2 span::before{content: "";display: block;background: #000;width: 20px;height: 1px;position: absolute;top: 30px;left: -6px;}

#news .morebtng{position: absolute;top: 67px;left: 50%;display: block;width: 100px;height: 30px;font-size: 1.6rem;line-height: 1;letter-spacing: 0.128rem;font-weight: 400;font-style: italic;margin-left: 49.3rem;z-index: 4;}
#news .morebtng a{ color: #0097A3;}
#news .morebtng a::before{content: "";width: 100px;height: 1px;background: #0097A3;position: absolute;bottom: 3px;right: 0;transition: all 0.3s ease-in-out;}
#news .morebtng a:hover::before{ width: 0;}
#news .morebtng a .arr{position: relative;top: -3px;left: 2px;}

#contents02 { position: relative; overflow: hidden; color: #fff; height: 1000px; z-index: 5; }
#contents02 .bg-layer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/index/contents02-back.jpg) no-repeat top center; background-size: cover; z-index: -1; filter: blur(15px); transition: filter 0.1s ease-out; will-change: filter; transform: scale(1.1); }
#contents02 .inner-Box {margin: 0 auto 200px;/* position: relative; */z-index: 2;padding: 6.82vw 6.82vw 0rem;/* max-width: 1727px; */height: 375px;}
#contents02 .inner-Box h2{font-size: 2.60vw;line-height: 1.8;letter-spacing: 0;font-weight: 400;margin-bottom: 4px;}
#contents02 .inner-Box .fl-line{position: relative;top: 0;width: 27.92vw;margin: 0 0 398px 0;left: 21px;}
#contents02 .inner-Box .inBox{width: 910px;margin: 0 0 0 auto;position: absolute;right: 3vw;bottom: 4vw;}
#contents02 .blue-btn{position: absolute;top: 6px;right: 4px;}
#contents02 .blue-btn a{background: none;color: #fff;border: 1px solid #fff;padding-top: 1.4rem;backdrop-filter: blur(8px);-webkit-backdrop-filter: blur(8px);}
#contents02 .blue-btn a .arr{top: 0px;-webkit-filter: brightness(0) invert(1);filter: brightness(0) invert(1);}
#contents02 .inner-Box p{font-size: 1.8rem; line-height: 2.2; letter-spacing: 0.036rem; font-weight: 400;}

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

#contents01 .ttl-Box p.text{padding-top: 40px;}
#news .morebtng{left: auto; right: 0;}

}
@media screen and (min-width:768px) and ( max-width:1200px) {
#gallery .morebtng{left: auto;right: 2rem;}
#voice .morebtng{left: auto; right: 20px;}
#gallery .next-arrow{padding-right: 27px;}
#contents01 .ttl-Box p.text{padding-top: 30px;}

#contents01 .inner-Box3{padding: 67px 4rem 0 52%;}

}

@media screen and (min-width:768px) and ( max-width:1000px) {
#contents02 .inner-Box .inBox{width: 93%;padding-right: 291px;}
#gallery{margin-left: 8vw;}

#contents01 .inner-Box2 figure.photo {right: 0px;}
#contents01 .inner-Box2{padding-right: 420px;}

#contents01 .inner-Box3 {padding-left: 50%;}
#contents01 .inner-Box3 figure.photo {position: absolute;top: 55px;left: 0px;width: 45%;height: 49%;}

}
  
  

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

header{ display: none;}
#pc-glnavi{ background: none;backdrop-filter: none;}
#pc-glnavi .h-logo{ display: none; }
.zdo_drawer_buttonsp .zdo_drawer_bar {background-color: #fff;}
.logom{position: absolute;top: 5.33vw;left: 5.33vw;z-index: 3;width: 8.00vw;}
#pc-glnavi{ position: absolute;}

#pc-glnavi.topfix .zdo_drawer_buttonsp .zdo_drawer_bar {background-color: #222;}
#pc-glnavi.topfix .h-logo{ display: block; }
/* 基本の固定スタイル（アニメーションの土台） */
#pc-glnavi.fixed-base {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(4vw);
    -webkit-backdrop-filter: blur(4vw);
    transition: transform 0.4s ease-in-out; /* ここでスライドを制御 */
    transform: translateY(-100%); /* 基本は画面外 */
}

/* 表示状態（スライドイン） */
#pc-glnavi.topfix {
    transform: translateY(0);
}

span.fl-line {display: block;line-height: 1;width: 75.01vw;height: 20.29vw;overflow: visible; /* sticky等に影響させない */margin: -9.9vw auto 0 auto;}
span.fl-line img { width: 100%; height: 100%; object-fit: contain; display: block; clip-path: inset(0 100% 0 0); transition: clip-path 0.3s ease-out; }
span.fl-line.is-show img { clip-path: inset(0 0 0 0); }

h1{position: fixed;top: 20vw;z-index: 3;width: 26.7vw;left: 36.1vw;}
/* 通常状態 */
#mainch { transition: opacity 0.8s ease, filter 0.8s ease; will-change: opacity, filter; }
/* 消える状態 */
#mainch.is-hide { opacity: 0; filter: blur(1.6vw); }

.stack-section {position: -webkit-sticky;position: sticky;top: 0;width: 100%;height: 100vh;overflow: hidden;}

/* 重なり順の指定（後ろにくるほど上に重なる） */
.section-01 {z-index: 1;background: url(../images/index/sp-contentsmain-photo01.jpg)no-repeat bottom center;background-size:  100% auto;}
.section-02 {z-index: 2;background: url(../images/index/sp-contentsmain-photo02.jpg)no-repeat bottom center;background-size: 100% auto;}
.section-03 {z-index: 3;height: auto;}

/* 初期状態：ちょい拡大＋ぼかし */
#photo01 { transform: scale(1.03); filter: blur(1.6vw); transition: transform 1.4s ease, filter 1.4s ease; will-change: transform, filter; }

/* 表示後 */
#photo01.is-show {transform: scale(1);filter: blur(0);}
#section-02 {--scale: 0.95;transform: scale(var(--scale));transform-origin: center center;will-change: transform;}
/* 中身のコンテンツ（任意） */
.section-content {display: flex;align-items: center;justify-content: center;/* height: 100%; */}

#contentsmain {position: relative;z-index: 1;width: 100%;background-color: #DFF3FB;background-image: url(../images/flow/sp-contents01-back01.png);background-repeat: no-repeat;background-position: center bottom; /* 初期：bottom 0vw */background-size: 100% auto;}
#contentsmain .back-Box {background:  url(../images/about/contentsmain-back02.png)repeat, url(../images/index/contentsmain-back01.png)no-repeat top center;padding-top: 14.2vw;padding-bottom: 12.33vw;background-size: 10vw auto,100% auto;}

#contentsmain .inner-Box {margin: 3px auto 10.43vw;position: relative;z-index: 2;padding: 0;}
#contentsmain .inner-Box h2{text-align: left;position: relative;margin-left: 13.27vw;z-index: 3;font-size: 4.8vw;line-height: 1.5;letter-spacing: 0.24vw;font-weight: 400;margin-bottom: -12.1vw;}
#contentsmain .inner-Box h2 span{position: relative;font-size: 8vw;line-height: 1.6;letter-spacing: 0.4vw;font-weight: 400;margin-top: 2.1vw;display: block;left: 0.3vw;}
#contentsmain .inner-Box .fl-line{position: relative;width: 48vw;margin: 0 0 4vw 11vw;}
#contentsmain .inner-Box figure{margin-left: 33.3vw;width: 66.67vw;height: 50.13vw;}
#contentsmain .inner-Box figure img{ width: 100%; height: auto; }

#contentsmain .inner-Box2 {margin: 3px auto 9.33vw;position: relative;z-index: 2;padding: 0;}
#contentsmain .inner-Box2 h2{text-align: center;position: relative;z-index: 3;font-size: 4.8vw;line-height: 1.5;letter-spacing: 0.24vw;font-weight: 400;margin-bottom: -22.2vw;}
#contentsmain .inner-Box2 h2 span{position: relative;font-size: 8vw;line-height: 1.6;letter-spacing: 0.4vw;font-weight: 400;margin-top: 2.1vw;display: block;margin-bottom: 4.6vw;}
#contentsmain .inner-Box2 .fl-line{position: relative;width: 49vw;margin: 0 0vw 12.2vw 28.6vw;}
#contentsmain .inner-Box2 figure{
    margin-right: 20.2vw;
    width: 80.00vw;
    height: 60.00vw;
}
#contentsmain .inner-Box2 figure img{ width: 100%; height: auto; }

#contentsmain .inner-Box3 {margin: 0 auto 34.87vw;position: relative;z-index: 2;padding: 0vw 9.3vw 0vw;}
#contentsmain .inner-Box3 h2{text-align: center;margin-bottom: 4.13vw;font-size: 4.27vw;line-height: 2;letter-spacing: 0.21vw;font-weight: 400;}
#contentsmain .inner-Box3 h3{font-weight: 400;text-align: center;margin-bottom: 0vw;position: relative;z-index: 3;font-size: 7.47vw;line-height: 1.8;letter-spacing: 0.37vw;}
#contentsmain .inner-Box3 .fl-line{position: relative;top: 0;margin-bottom: 0vw;margin: -10vw 0 -4.5vw 0;left: 3.7vw;}
#contentsmain .inner-Box3 .text{text-align: center;margin-bottom: 10.87vw;font-size: 4.27vw;line-height: 2;letter-spacing: 0.21vw;font-weight: 400;}
#contentsmain .inner-Box3 ul{display: -webkit-box;display: -moz-flex;display: -ms-flex;display: -o-flex;display: -ms-flexbox;display: flex;-webkit-box-lines: multiple;-moz-box-lines: multiple;-ms-flex-wrap: wrap;flex-wrap: wrap;margin: 0 0.7vw;}
#contentsmain .inner-Box3 ul li{width: 100%;margin-bottom: 4.4vw;}
#contentsmain .inner-Box3 ul li:nth-child(3){ margin-right: 0; }
#contentsmain .inner-Box3 ul .blue-btn a{ width: 100%; }

.backimgbox {width: 100vw;height: 39.2vw;background: url(../images/common/fix-bottom.svg) no-repeat bottom center;background-size: 100% auto;position: absolute;bottom: 0vw;z-index: 10;opacity: 1;}

#gallery{ }
#gallery{padding: 17.2vw 0 0 6.1vw;position: relative;margin-bottom: 17.37vw;background: #fff;z-index: 5;top: -0.4vw;}
#gallery ul{margin-bottom: 7.67vw;}
#gallery li{margin-right: 4.27vw;width: 74.67vw;}
#gallery li .figbo{aspect-ratio: 605 / 455;margin-bottom: 2.53vw;overflow: hidden;}
#gallery li .figbo img{ width: 100%; height: 100%;}
#gallery li h3{font-size: 4.27vw;line-height: 1.5;letter-spacing: 0;font-weight: 500;}
#gallery h2{position: relative;/* left: 1vw; */top: 0.8vw;margin-bottom: 6.8vw;font-size: 7.47vw;line-height: 0.71;letter-spacing: 0.45vw;font-weight: 400;font-style: italic;padding-left: 1vw;}
#gallery h2 span{position: relative;display: block;margin: 4.8vw 0 0;padding-left: 5.6vw;font-style: normal;font-size: 3.73vw;line-height: 1.5;letter-spacing: 0;font-weight: 400;}
#gallery h2 span::before{content: "";display: block;background: #000;width: 4.33vw;height: 0.27vw;position: absolute;top: 2.7vw;left: -0.9vw;}
#gallery .morebtng{position: absolute;bottom: -1.5vw;right: 6.6vw;display: block;height: 8.0vw;margin-left: revert-layer;z-index: 4;font-size: 3.73vw;line-height: 1;letter-spacing: 0.3vw;font-weight: 400;font-style: italic;}
#gallery .morebtng a{ color: #0097A3;}
#gallery .morebtng a::before{content: "";width: 23.67vw;height: 0.27vw;background: #0097A3;position: absolute;bottom: 1.3vw;right: 0;transition: all 0.3s ease-in-out;}
#gallery .morebtng a .arr{position: relative;top: -1.1vw;left: 0.53vw;width: 4.7vw;display: inline-block;margin-right: 0.4vw;margin-left: 0.1vw;}
#gallery .prev-arrow{position: absolute;bottom: -10.7vw;width: 3vw;}
#gallery .next-arrow{position: absolute;bottom: -10.7vw;left: 23.7vw;transform: scale(-1, 1);width: 3vw;}
#gallery .gallery-counter{color: #0097A3;font-size: 3.73vw;line-height: 1;letter-spacing: 0.3vw;font-weight: 400;font-style: italic;}
#gallery .gallery-counter span{ display: inline-block; border-bottom: #0097A3 0.27vw solid; }
#gallery .gallery-counter .current{padding: 0 0 2.67vw 5.33vw;margin-right: 1.9vw;}
#gallery .gallery-counter .total{margin-left: -0.27vw;padding: 0 4.53vw 2.67vw 0.0vw;}

#voice{background: transparent linear-gradient(90deg, #EEF7F9 0%, #C7EDF8 100%) 0% 0% no-repeat padding-box; }
#voice .back-Box{background: url(../images/about/contentsmain-back02.png)repeat;padding: 15.1vw 2.2vw 11.9vw 2.2vw;position: relative;background-size: 10vw auto;}
#voice .back-Box::before{content: "Owners Voice";font-family: "Libre Baskerville", serif;white-space: nowrap;color: #0097A3;opacity: 0.1;transform: rotate(90deg);transform-origin: top center;position: absolute;top: 15.67vw;right: -1.1vw;height: 2.67vw;width: 1.67vw;display: block;font-size: 21.33vw;line-height: 1;letter-spacing: 0;font-weight: 400;font-style: italic;}
#voice .inner-Box{margin: 0 4vw;position: relative;z-index: 3;}
#voice{position: relative;z-index: 5;overflow: hidden;}
#voice ul{margin-bottom: 8.77vw;}
#voice li{width: 100%;}
#voice li .figbo{aspect-ratio: 66 / 44;width: 100%;margin-bottom: 3.8vw;}
#voice li h3{ font-size: 4.8vw; line-height: 1.8; letter-spacing: 0; font-weight: 500; }
#voice h2{position: relative;left: 0;top: 0.8vw;margin-bottom: 6.8vw;font-size: 7.47vw;line-height: 1;letter-spacing: 0.45vw;font-weight: 400;font-style: italic;}
#voice h2 span{position: relative;display: block;margin: 3.4vw 0 0 1.6vw;padding-left: 4.8vw;font-style: normal;font-size: 3.73vw;line-height: 1.5;letter-spacing: 0;font-weight: 400;}
#voice h2 span::before{content: "";display: block;background: #000;width: 4.43vw;height: 0.27vw;position: absolute;top: 2.6vw;left: -1.7vw;}
#voice .data{width: 100%;}
#voice .data h3{margin-right: 0vw;margin-bottom: 3.7vw;font-size: 5.33vw;line-height: 1.6;letter-spacing: 0;font-weight: 500;}
#voice .data p.text{margin-bottom: 8.67vw;font-size: 3.47vw;line-height: 1.5;letter-spacing: 0.07vw;font-weight: 400;}
#voice .data p.blue-btn a{ margin: 0;}

#voice .morebtng{position: relative;display: block;height: 8.0vw;margin-left: revert-layer;z-index: 4;font-size: 3.73vw;line-height: 1;letter-spacing: 0.3vw;font-weight: 400;font-style: italic;width: 24vw;margin-left: auto;}
#voice .morebtng a{ color: #0097A3;}
#voice .morebtng a::before{content: "";width: 23.67vw;height: 0.27vw;background: #0097A3;position: absolute;bottom: 1.3vw;right: 0;transition: all 0.3s ease-in-out;}
#voice .morebtng a .arr{position: relative;top: -1.1vw;left: 0.53vw;width: 4.7vw;display: inline-block;margin-right: 0.4vw;margin-left: 0.1vw;}


#contents01 {margin: 0 auto 25.33vw;position: relative;background: #fff;z-index: 4;}

.video-wrapper { position: relative;  width: 100%; position: absolute; line-height: 0; top: 0; right: 0; }
.video-wrapper video { width: 100%; height: auto; opacity: 0.3; }
.video-wrapper::before, .video-wrapper::after { content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 1; }
.video-wrapper::before { background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 25% ); }
.video-wrapper::after { background: linear-gradient(to top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0) 30% ); }

#contents01 .circle-container{width: 18vw;height: 23vw;margin-bottom: -15.7vw;}
#contents01 .circle-container .number{font-size: 7.7vw;top: -1.9vw;left: -3vw;}
#contents01 .ttl-Box {position: relative;z-index: 3;padding: 14vw 5vw 0vw 6.3vw;margin-bottom: 14.2vw;}
#contents01 .ttl-Box h2.f-min {margin-bottom: 0.0vw;font-size: 7.47vw;line-height: 1.6;letter-spacing: 0.37vw;font-weight: 400;margin-bottom: 5.2vw;}
#contents01 .ttl-Box p.text {margin-bottom: 3vw;position: relative;font-size: 4.27vw;line-height: 1.8;letter-spacing: 0.09vw;font-weight: 400;}
#contents01 .inner-Box1 {margin: 0 6.4vw 18.93vw;position: relative;z-index: 3;}
#contents01 .inner-Box1 figure.photo {position: relative;top: 0;left: 0;margin-bottom: 6vw;width: 87.20vw;height: 57.07vw;}
#contents01 .inner-Box1 figure.photo img{width: 100%;}
#contents01 h3.f-min {margin-bottom: 3.3vw;position: relative;font-size: 5.33vw;line-height: 1.6;letter-spacing: 0;font-weight: 400;}
#contents01 p.text2 {margin-bottom: 8.1vw;position: relative;font-size: 3.73vw;line-height: 1.7;letter-spacing: 0.07vw;font-weight: 400;}
#contents01 .inner-Box2 {margin: 0 6.4vw 19.73vw;position: relative;z-index: 3;}
#contents01 .inner-Box2 figure.photo {position: relative;top: 0;left: 0;margin: 0 17vw 6vw;width: 53.33vw;height: 66.67vw;}
#contents01 .inner-Box2 figure.photo img{width: 100%;}
#contents01 .inner-Box3 {margin: 0 6.4vw -8.47vw;position: relative;z-index: 3;}
#contents01 .inner-Box3 figure.photo {position: relative;top: 0;left: 0;margin-bottom: 6vw;width: 87.20vw;height: 64.00vw;}
#contents01 .inner-Box3 figure.photo img{width: 100%;}
#contents01 .blue-btn a{ margin: 0; }

  
#news{background: transparent linear-gradient(90deg, #EEF7F9 0%, #C7EDF8 100%) 0% 0% no-repeat padding-box;z-index: 3;position: relative;}
#news .back-Box{background: url(../images/about/contentsmain-back02.png)repeat;padding: 15.1vw 2.2vw 11.9vw 2.2vw;position: relative;background-size: 10vw auto;}
#news .inner-Box{margin: 0 4vw;position: relative;z-index: 3;}

#news ul{margin-bottom: 17.33vw;}
#news ul li{width: 100%;position: relative;margin-bottom: 5.33vw;padding-bottom: 4vw;border-bottom: #BFDEE0 1px solid;}
#news ul li .incap{width: 24.6%;float: left;aspect-ratio: 1 / 1;overflow: hidden;margin-bottom: 1.5rem;margin-right: 4.9%;}
#news ul li .incap img{width: 100%; height: 100%; object-fit: cover; display: block;}
#news ul li .mmbox{width: 70%;float: left;}
#news ul li .databox{position: relative;margin-bottom: 2.93vw;}
#news ul li .databox .timebox{top: 1.3rem;right: 0;color: #0097A3;font-size: 2.93vw;line-height: 1;letter-spacing: 0.23vw;display: inline;}
#news ul li .databox .category-box{font-size: 3.2vw;line-height: 1;letter-spacing: 0;color: #fff;display: inline;}
#news ul li .databox .category-box span{display: inline-block;background: #0097A3;padding: 1.93vw 3.1vw;margin: 0 1.07vw 1.07vw 0;}
#news ul li a{display: block;padding-bottom: 6.4vw;}
#news ul li h3{font-size: 3.73vw;line-height: 1.5;letter-spacing: 0;font-weight: 500;}
#news ul li .text{ }
#news ul li .arr{position: absolute;bottom: 0;right: 2.13vw;transition: all 0.3s ease-in-out;}
#news ul li a:hover .arr{right: 0.0vw;}
#news h2{position: relative;left: 0;top: 0.8vw;margin-bottom: 6.8vw;font-size: 7.47vw;line-height: 1;letter-spacing: 0.45vw;font-weight: 400;font-style: italic;}
#news h2 span{position: relative;display: block;margin: 3.4vw 0 0 1.6vw;padding-left: 4.8vw;font-style: normal;font-size: 3.73vw;line-height: 1.5;letter-spacing: 0;font-weight: 400;}
#news h2 span::before{content: "";display: block;background: #000;width: 4.43vw;height: 0.27vw;position: absolute;top: 2.6vw;left: -1.7vw;}

#news .morebtng{position: relative;display: block;height: 8.0vw;margin-left: revert-layer;z-index: 4;font-size: 3.73vw;line-height: 1;letter-spacing: 0.3vw;font-weight: 400;font-style: italic;width: 24vw;margin-left: auto;}
#news .morebtng a{ color: #0097A3;}
#news .morebtng a::before{content: "";width: 23.67vw;height: 0.27vw;background: #0097A3;position: absolute;bottom: 1.3vw;right: 0;transition: all 0.3s ease-in-out;}
#news .morebtng a .arr{position: relative;top: -1.1vw;left: 0.53vw;width: 4.7vw;display: inline-block;margin-right: 0.4vw;margin-left: 0.1vw;}


#contents02 {position: relative;overflow: hidden;color: #fff;z-index: 5;height: 197.33vw;}
#contents02 .bg-layer {position: absolute;top: 0;left: 0;width: 100%;height: 197.33vw;background: url(../images/index/contents02-back.jpg) no-repeat top center;background-size: cover;z-index: -1;filter: blur(4.0vw);transition: filter 0.1s ease-out;will-change: filter;transform: scale(1.1);}
#contents02 .inner-Box {margin: 0 auto 53.33vw;position: relative;z-index: 2;padding: 13.8vw 3vw;}
#contents02 .inner-Box h2{margin-bottom: -4.93vw;font-size: 7.2vw;line-height: 1.8;letter-spacing: 0;font-weight: 400;margin-left: 4vw;}
#contents02 .inner-Box .fl-line{position: relative;top: 0;margin: 0 0 2.1vw 0;left: 5.6vw;}
#contents02 .inner-Box .inBox{margin: 0 4vw;position: relative;}
#contents02 .blue-btn{position: relative;top: 0;right: 0;margin-right: -1vw;}
#contents02 .blue-btn a{background: none;color: #fff;border: 0.27vw solid #fff;padding-top: 3.73vw;backdrop-filter: blur(1vw);-webkit-backdrop-filter: blur(1vw);}
#contents02 .blue-btn a .arr{top: 1.2vw;-webkit-filter: brightness(0) invert(1);filter: brightness(0) invert(1);}
#contents02 .inner-Box p{font-size: 3.73vw;line-height: 1.7;letter-spacing: 0.07vw;font-weight: 400;margin-bottom: 8vw;}




}