@charset "UTF-8";

#contentsend{ margin-top: 0; }

/* フッター直前：余白は白背景の common-csr 内で確保（body 背景 #F0F1F3 が露出しない） */
body#history #common-csr {
  padding-bottom: 6rem;
}

@media screen and (min-width: 768px),print {
#mainttl .page-title,#mainttl .page-caption,.seo_bread_list,.seo_bread_list a{ color: #fff; }
.seo_bread_list a::after{ background: #fff;}

#mainttl{position:relative;overflow:hidden;padding: 10rem 0rem 0rem;}
#mainttl .bg-slider{ position:absolute; top:0; left:0; width:100%; height:100%; z-index:0; }
#mainttl .swiper-slide{ background-size:cover; background-position:center; }
#mainttl .inner-Box{ position:relative; z-index:1; }
#mainttl .inner-Box .page-caption{margin-bottom: 14.2rem;}

#contentsmain {margin: 0 auto 12rem 5rem;position: relative;padding: 12rem 5vw 0rem;}
#contentsmain .inner-Box{margin: 0 auto 12rem;position:relative;width:100%;max-width:120rem;display:flex;gap:6.67%;align-items:center;}
#contentsmain .inner-Box .photo-Box{position:relative;width:50%;order:1;}
#contentsmain .inner-Box .text-Box{position:relative;width:43.33%;order:2;}

#contentsmain .inner-Box .text-Box p.text {margin-bottom: 2.4rem;position: relative;font-size: 1.6rem;line-height: 2.0;letter-spacing: 0.05em;font-weight: 400;text-align: left;}
#contentsmain .inner-Box .text-Box p.text:last-child { margin-bottom: 0; }
#contentsmain .inner-Box .photo-Box figure.photo { position: relative; top: 0; left: 0; }
#contentsmain .inner-Box .photo-Box figure.photo img{ width: 100%; height: auto; }
#contentsmain .inner-Box2 { margin: 0 auto; position: relative; }
#contentsmain .inner-Box2 ul{max-width:67.6rem;margin:0 auto;display:grid;grid-template-columns:repeat(2,1fr);gap:2.37%;}
#contentsmain .inner-Box2 ul li{position:relative;}
#contentsmain .inner-Box2 ul li .gl-btn .arr img{transform: rotate(90deg);transform-origin: center;top: 43%;}


#contents01 {margin: 0 auto 16rem 5rem;position: relative;padding: 0rem 5vw 0;}
#contents01 .ttl-Box {margin: 0 auto 8rem;position: relative;max-width: 120rem;text-align: center;}
#contents01 .ttl-Box h2 {margin-bottom: 1.6rem;text-align: center;}
#contents01 .ttl-Box h2 span{  }
#contents01 .ttl-Box h2 img {width: auto;height: 4.5rem;}
#contents01 .ttl-Box h3 {font-size: 2.0rem;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: center;color: var(--main-blue);margin-bottom: 2.4rem;position: relative;}
#contents01 .ttl-Box p.text {position: relative;font-size: 1.6rem;line-height: 2.0;letter-spacing: 0.05em;font-weight: 400;text-align: center;margin-bottom: 0;}
#contents01 .inner-Box {margin: 0 auto;position: relative;max-width: 120rem;}
#contents01 .inner-Box ul{max-width:120rem;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap: 6.3rem 2%;}
#contents01 .inner-Box ul li{position:relative;max-width:38.4rem;width:100%;padding-bottom: 6.3rem;}
#contents01 .photo-Box {position: relative;margin-bottom: 0.8rem;}
#contents01 .text-Box { position: relative; }

#contents01 .photo-Box figure.photo { width: 100%; aspect-ratio: 384 / 260; overflow: hidden; text-align: center; position: relative;}
#contents01 .photo-Box figure.photo img { width: 100%; height: 100%; object-fit: cover; display: block; }

.nogl-btn {background: linear-gradient(90deg, var(--btn-grad-start) 0%, var(--btn-grad-end) 50%, var(--btn-grad-start) 100%);background-size: 200% 100%;background-position: 0% center;transition: background-position 0.6s ease-in-out;overflow: hidden;display: block;width: 100%;height: 5.4rem;color: #fff;position: absolute;padding: 2rem 0 0 2.3rem;transition: all 0.5s ease-in-out;font-size: 1.4rem;line-height: 1.0;letter-spacing: 0.05em;font-weight: 700;text-align: left;cursor: pointer;bottom: 0;left: 0;}
.nogl-btn:hover{ color: #fff; background-position: 100% center; }
.nogl-btn .arr::before{content: "";background: #fff;display: block;width: 1px;height: 1.3rem;position: absolute;top: 50%;transform: translateY(-50%);right: 0.6rem;}
.nogl-btn .arr::after{content: "";background: #fff;display: block;width: 1.3rem;height: 1px;position: absolute;top: 50%;transform: translateY(-50%);right: 0rem;}
.nogl-btn .arr {display: block;width: 3rem;height: 2rem;position: absolute;right: 2.6rem;top: 50%;border-left: 1px solid #fff;transform: translatey(-50%);}
.nogl-btn:hover .arr img{  transform: translateY(-50%) rotate(360deg);}


#contents01 .text-Box h4 {margin-bottom: 0.8rem;position: relative;font-size: 2.0rem;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: left;}
#contents01 .text-Box p.ltext {position: relative;font-size: 1.4rem;line-height: 1.8;letter-spacing: 0.05em;font-weight: 400;text-align: left;}
#contents01 .text-Box p.popbtb { margin-bottom: 30px; position: relative; }

.modal{display:none;}
.modal.is-open{position:fixed;inset:0;display:flex;justify-content:center;align-items:center;padding:2rem;background: rgba(0,0,0,0.6);z-index: 100;}
.modal-inner{position: relative;width: 68rem;max-height: calc(100vh - 4rem);margin: 0 auto;padding: 4rem;background: #fff;}
.modal-content{max-height: calc(100vh - 8rem);overflow-y: auto;padding-bottom: 4rem;}
.modal-content .modal-swiper{margin-bottom: 3.2rem;}

.modal-content .swiper-slide {background: #E7EDF7;width: 100%;height: 40rem;display: flex;align-items: center;justify-content: center;overflow: hidden;}
.modal-content .swiper-slide img {width: auto;height: auto;max-width: 100%;max-height: 40rem;object-fit: contain;}
.modal-content .slider-controls {display: flex;align-items: center;justify-content: center;gap: 1.5rem;margin-top: 2.4rem;}
.modal-content .slider-controls .swiper-pagination { position: static !important; width: auto !important; display: flex !important; gap: 1.0rem; }
.modal-content .slider-controls .swiper-pagination-bullet { width: 0.8rem; height: 0.8rem; background: var(--main-blue); opacity: 0.3; margin: 0 !important; }
.modal-content .slider-controls .swiper-pagination-bullet-active { opacity: 1; }
.modal-content .prev-arrow, .next-arrow {cursor: pointer;line-height: 0;/* filter: brightness(0) invert(1); */transform: scale(-1, 1);}
.modal-content .next-arrow { transform: scale(1, 1); }
.modal-navigation .prev-button{position: absolute;left: 50%;margin-left: -42.4rem;top: 50%;display: block;background: #fff;width: 5rem;height: 5rem;border-radius: 50%;text-align: center;padding-top: 0.6rem;transform: scale(-1, 1);cursor: pointer;}
.modal-navigation .next-button{position: absolute;left: 50%;margin-left: 37.4rem;top: 50%;display: block;background: #fff;width: 5rem;height: 5rem;border-radius: 50%;text-align: center;padding-top: 0.6rem;cursor: pointer;}
.modal-navigation .prev-button img,.modal-navigation .next-button img{ width: 1.1rem; }
.modal-inner .close-button{position: absolute;top: 0;right: -4.2rem;cursor: pointer;line-height: 0;z-index: 50;background: none;}
.modal-inner .modal-ttl{font-size: 2.2rem;line-height: 1.6;letter-spacing: 0.05em;font-weight: 700;text-align: left;margin-bottom: 2.4rem;}
.modal-inner .modal-text{margin-bottom: 2.4rem;font-size: 1.6rem;line-height: 1.8;letter-spacing: 0.05em;font-weight: 400;text-align: left;}
.modal-inner table{max-width: 800px;width: 100%;margin: 0 auto 3.2rem;border-top: #CCC 1px solid;font-size: 1.6rem;line-height: 1.5;letter-spacing: 0.05em;font-weight: 400;text-align: left;}
.modal-inner table th{font-weight: 700;background: #E2E5EA;border-bottom: #CCC 1px solid;padding: 1.6rem 2rem;width: 33.7%;}
.modal-inner table td{background: #fff;border-bottom: #CCC 1px solid;padding: 1.6rem 2rem;}
.modal-inner .modal-close2{ color: var(--main-blue);font-size: 1.4rem; line-height: 1.0; letter-spacing: 0.05em; font-weight: 400; text-align: center; }
.modal-inner .modal-close2 img{ position: relative; }
.single-modal .modal-navigation{ display: none; }

#contents02 {margin: 0 auto 16rem 5rem;position: relative;padding: 0rem 5vw 0;}
#contents02 .ttl-Box {margin: 0 auto 8rem;position: relative;max-width: 120rem;text-align: center;}
#contents02 .ttl-Box h2 {margin-bottom: 1.6rem;text-align: center;}
#contents02 .ttl-Box h2 span{  }
#contents02 .ttl-Box h2 img {width: auto;height: 4.5rem;}
#contents02 .ttl-Box h3 {font-size: 2.0rem;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: center;color: var(--main-blue);margin-bottom: 2.4rem;position: relative;}

#contents02 .inner-Box {margin: 0 auto;position: relative;max-width: 120rem;}


#contents02 .inner-Box .flip-item { opacity: 1; transition: opacity 0.25s ease; }
#contents02 .inner-Box .flip-item.is-hidden { opacity: 0; pointer-events: none; }
#contents02 .inner-Box .flip-item.is-none { display: none; }
#contents02 .inner-Box .flip-list { position: relative; transition: min-height 0.2s ease; }
#contents02 .inner-Box .flip-list {list-style: none;padding: 0;max-width: 120rem;display: flex;justify-content: flex-start;gap: 1.3%;flex-wrap: wrap;}
#contents02 .inner-Box li.category{background:#E2E5EA;text-align:center;color:var(--main-blue);display:flex;align-items:center;justify-content:center;cursor: default;}
#contents02 .inner-Box li.category .cate-inner{padding-top: 7.3rem;}
#contents02 .inner-Box li.category .cate-inner span{font-size: 1.2rem;line-height: 1.0;letter-spacing: 0.05em;font-weight: 600;text-align: center;margin-bottom: 0.8rem;display: block;padding-top: 1rem;}
#contents02 .inner-Box li.category .cate-inner h4{font-size: 3.2rem;line-height: 1;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
#contents02 .inner-Box li.nophoto-item{ cursor: default; }

/* 見出しカード（.category）以外を角丸 */
#contents02 .inner-Box li:not(.category) { overflow: hidden; border-radius: 1.2rem; }
#contents02 .inner-Box li:not(.category) .flip-card-inner { border-radius: 1.2rem; }
#contents02 .inner-Box li:not(.category) .face { border-radius: 1.2rem; overflow: hidden; }

#contents02 .inner-Box li {width: calc(21.5% - 2.6%);min-height: 22.7rem;cursor: pointer;margin-bottom: 20px;}
#contents02 .inner-Box .flip-card-inner { position: relative; width: 100%; height: 100%; text-align: center; transition: transform 0.6s; transform-style: preserve-3d; }
#contents02 .inner-Box .flip-item.is-flipped .flip-card-inner { transform: rotateY(180deg); }
#contents02 .inner-Box .face {position: absolute;width: 100%;height: 22.7rem;top: 0;left: 0;backface-visibility: hidden;display: flex;flex-direction: column;align-items: baseline;padding: 2.4rem 2.4rem;/* position: relative; */}
#contents02 .inner-Box .face.front {background: #fff;color: var(--main-blue);}
#contents02 .inner-Box .face .no {margin-bottom: 1.2rem;font-size: 3.0rem;line-height: 1.0;letter-spacing: 0.03em;font-weight: 700;text-align: center;}
#contents02 .inner-Box .face.front h3 {font-size: 1.6rem;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: left;display: block;border-bottom: 1px dashed #ccc;padding-bottom: 0.8rem;width: 100%;margin-bottom: 1.6rem;}
#contents02 .inner-Box .face.front h3 span{  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }

#contents02 .inner-Box li .htext{font-size: 1.3rem;line-height: 1.6;letter-spacing: 0.05em;font-weight: 400;text-align: left;color: #333;}
#contents02 .inner-Box li .htext span{  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden;}
#contents02 .inner-Box li .click{font-size: 1.2rem;line-height: 1.0;letter-spacing: 0.05em;font-weight: 600;text-align: right;position: absolute;bottom: 1.8rem;right: 1.8rem;}
#contents02 .inner-Box li .pmore{font-size: 1.2rem;line-height: 1.0;letter-spacing: 0.05em;font-weight: 600;text-align: right;position: absolute;bottom: 1.8rem;right: 1.8rem;padding-right: 1.2rem;}
#contents02 .inner-Box li .pmore .plus{ display: block; position: absolute; top: 0; right: 0; width: 0.9rem; height: 0.9rem; }
#contents02 .inner-Box li .pmore .plus::before{ content: ""; width: 0.9rem; height: 1px; background: var(--main-blue); position: absolute; top: 50%; left: 0;}
#contents02 .inner-Box li .pmore .plus::after{ content: ""; width: 0.9rem; height: 1px; background: var(--main-blue); position: absolute; top: 50%; left: 0;transform: rotate(90deg); transform-origin: center;}

/* --- 裏面のデザイン --- */
#contents02 .inner-Box .face.back {background: #fff;color: var(--main-blue);transform: rotateY(180deg);box-sizing: border-box;padding: 0;}
#contents02 .inner-Box .face.back .ftext{font-size: 1.4rem;line-height: 1.8;letter-spacing: 0.05em;font-weight: 400;text-align: left;color: #333;padding: 0 1.6rem;}
#contents02 .inner-Box .face.back .ftext span{  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}
#contents02 .inner-Box .face.back .photo-only{position:absolute;top:0;left:0;width:100%;height:100%;}
#contents02 .inner-Box .face.back .photo-only img{width:100%;height:100%;object-fit:cover;}

#contents02 .inner-Box .face.back .photo{position: relative;top:0;left:0;width:100%;height:13rem;margin-bottom: 0.8rem;}
#contents02 .inner-Box .face.back .photo img{width:100%;height:100%;object-fit:cover;}

.modal-content .photo {width: 100%;height: 54rem;display: flex;align-items: center;justify-content: center;overflow: hidden;margin-bottom: 2.4rem;}
.modal-content .photo img {width: auto;height: auto;max-width: 100%;max-height: 54rem;object-fit: contain;}
.modal-content .ftext{ font-size: 1.6rem; line-height: 1.8; letter-spacing: 0.05em; font-weight: 400; text-align: left;}

}
@media screen and (min-width:768px) and ( max-width:1023px) {
#contentsmain,#contents01,#contents02{margin-left: 0rem!important;}


	
}

@media screen and (max-width: 767px) {
body#history #common-csr {
  padding-bottom: 6vw;
}

#link01,#link02{display: block; padding-top: 10vw; margin-top: 10vw;}

#mainttl .page-title,#mainttl .page-caption{color: #fff;}
.seo_bread_list{color: #999;}
.seo_bread_list a{color: #333;}
.seo_bread_list a::after{background: #333;}

#mainttl{position:relative;overflow:hidden;padding: 8.27vw 0vw 0vw;}
#mainttl .bg-slider{ position:absolute; top:0; left:0; width:100%; height:100%; z-index:0; }
#mainttl .swiper-slide{background-size: auto 80vw;background-position: top center;}
#mainttl .inner-Box{position:relative;z-index:1;padding-top: 12.4vw!important;}
#mainttl .inner-Box .page-caption{margin-bottom: 19.9vw;}
#mainttl h1{margin-right: -6vw;}


#contentsmain {position: relative;padding: 10.4vw 4vw 12.2vw;}
#contentsmain .inner-Box{margin: 0 auto 6vw;position:relative;width:100%;}
#contentsmain .inner-Box .photo-Box{position:relative;order:1;}
#contentsmain .inner-Box .text-Box{position:relative;order:2;margin-bottom: 6vw;}

#contentsmain .inner-Box .text-Box p.text {margin-bottom: 3.3vw;position: relative;font-size: 3.73vw;line-height: 1.7;letter-spacing: 0.05em;font-weight: 350;text-align: left;}
#contentsmain .inner-Box .text-Box p.text:last-child { margin-bottom: 0; }
#contentsmain .inner-Box .photo-Box figure.photo { position: relative; top: 0; left: 0; }
#contentsmain .inner-Box .photo-Box figure.photo img{ width: 100%; height: auto; }
#contentsmain .inner-Box2 {position: relative;}
#contentsmain .inner-Box2 ul{margin:0 auto;}
#contentsmain .inner-Box2 ul li{position:relative;margin-bottom: 2.6vw;}
#contentsmain .inner-Box2 ul li .gl-btn a{text-align: center;padding: 3.9vw 4.9vw 4.9vw;font-size: 3.73vw;line-height: 1.7;letter-spacing: 0.05em;font-weight: bold;height: 13.9vw;}
#contentsmain .inner-Box2 ul li .gl-btn .arr{right: 1.3vw;position: absolute;top: 5.4vw;}
#contentsmain .inner-Box2 ul li .gl-btn .arr::before{right: 11vw;top: 1.4vw;height: 5vw;}
#contentsmain .inner-Box2 ul li .gl-btn .arr img{transform: rotate(90deg);transform-origin: center;top: 39%;}
#contentsmain .inner-Box2 ul li:last-child{ margin-bottom: 0;}

#contents01 {margin: 0 auto 12.67vw;position: relative;}
#contents01 .ttl-Box {margin: 0 4.3vw 6.73vw;position: relative;text-align: center;}
#contents01 .ttl-Box h2 {margin-bottom: 4.17vw;text-align: center;}
#contents01 .ttl-Box h2 span{  }
#contents01 .ttl-Box h2 img {width: auto;height: 5.6vw;}
#contents01 .ttl-Box h3 {color: var(--main-blue);margin-bottom: 3.4vw;position: relative;font-size: 4.8vw;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
#contents01 .ttl-Box p.text {position: relative;margin-bottom: 0;font-size: 3.73vw;line-height: 1.7;letter-spacing: 0em;font-weight: 400;text-align: left;}
#contents01 .inner-Box {margin: 0 4vw;position: relative;max-width: 120rem;}
#contents01 .inner-Box ul{margin:0 auto;}

#contents01 .inner-Box ul li{display:flex;gap:3.1%;position:relative;width:100%;padding-bottom:16.80vw;border:1px solid #CCCCCC;background:#fff;padding: 2.8vw 2.8vw 22.3vw;margin-bottom: 3vw;}
#contents01 .photo-Box{width:29.72%;} /* 96 ÷ 323 */
#contents01 .text-Box{width:67.18%;} /* 217 ÷ 323 */

#contents01 .photo-Box figure.photo { width: 100%; aspect-ratio: 384 / 260; overflow: hidden; text-align: center; position: relative;}
#contents01 .photo-Box figure.photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.popbtb{ }
.nogl-btn {background: linear-gradient(90deg, var(--btn-grad-start) 0%, var(--btn-grad-end) 50%, var(--btn-grad-start) 100%);background-size: 200% 100%;background-position: 0% center;transition: background-position 0.6s ease-in-out;overflow: hidden;display: block;width: 86.3vw;height: 9.4vw;color: #fff;position: absolute;padding: 3.13vw 0 0 0.13vw;transition: all 0.5s ease-in-out;cursor: pointer;bottom: 2.5vw;left: 2.8vw;font-size: 3.47vw;line-height: 1.0;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
.nogl-btn:hover{ color: #fff; background-position: 100% center; }
.nogl-btn .arr::before{content: "";background: #fff;display: block;width: 0.27vw;height: 2.47vw;position: absolute;top: 50%;transform: translateY(-50%);right: 1.3vw;}
.nogl-btn .arr::after{content: "";background: #fff;display: block;width: 2.67vw;height: 0.27vw;position: absolute;top: 50%;transform: translateY(-50%);right: 0vw;}
.nogl-btn .arr {display: block;width: 5.2vw;height: 3.43vw;position: absolute;right: 4.53vw;top: 50%;border-left: 0.37vw solid #fff;transform: translatey(-50%);}
.nogl-btn:hover .arr img{  transform: translateY(-50%) rotate(360deg);}


#contents01 .text-Box h4 {margin-bottom: 2.13vw;position: relative;font-size: 3.73vw;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: left;}
#contents01 .text-Box p.ltext {position: relative;font-size: 3.2vw;line-height: 1.5;letter-spacing: 0.05em;font-weight: 400;text-align: left;}
#contents01 .text-Box p.popbtb { margin-bottom: 8.0vw; position: relative; }

.modal{display:none;}
.modal.is-open{position:fixed;inset:0;display:flex;justify-content:center;align-items:center;padding: 20.33vw 5.33vw 4.33vw;background: rgba(0,0,0,0.6);z-index: 1000;}
.modal-inner{position: relative;width: 91.33vw;max-height: calc(100vh - 10.67vw);margin: 0 4vw;padding: 4.17vw;background: #fff;}
.modal-content{max-height: calc(100vh - 21.33vw);overflow-y: auto;padding-bottom: 2.67vw;}
.modal-content .modal-swiper{margin-bottom: 4.53vw;}

.modal-content .swiper-slide {background: #E7EDF7;width: 100%;height: 55.37vw;display: flex;align-items: center;justify-content: center;overflow: hidden;}
.modal-content .swiper-slide img {width: auto;height: auto;max-width: 100%;max-height: 55.37vw;object-fit: contain;}
.modal-content .slider-controls {display: flex;align-items: center;justify-content: center;gap: 4.00vw;margin-top: 4.4vw;}
.modal-content .slider-controls .swiper-pagination { position: static !important; width: auto !important; display: flex !important; gap: 2.67vw; }
.modal-content .slider-controls .swiper-pagination-bullet {width: 1.60vw;height: 1.60vw;background: var(--main-blue);opacity: 0.3;margin: 0 !important;}
.modal-content .slider-controls .swiper-pagination-bullet-active { opacity: 1; }
.modal-content .prev-arrow, .next-arrow {cursor: pointer;line-height: 0;/* filter: brightness(0) invert(1); */transform: scale(-1, 1);width: 1.9vw;}
.modal-content .next-arrow { transform: scale(1, 1); }
.modal-navigation .prev-button{position: absolute;left: 50%;margin-left: -113.07vw;top: 50%;display: block;background: #fff;width: 13.33vw;height: 13.33vw;border-radius: 50%;text-align: center;padding-top: 2.13vw;transform: scale(-1, 1);cursor: pointer;}
.modal-navigation .next-button{position: absolute;left: 50%;margin-left: 99.73vw;top: 50%;display: block;background: #fff;width: 13.33vw;height: 13.33vw;border-radius: 50%;text-align: center;padding-top: 2.13vw;cursor: pointer;}
.modal-navigation .prev-button img,.modal-navigation .next-button img{ width: 2.93vw; }
.modal-inner .close-button{position: absolute;top: -9vw;right: -0.1vw;cursor: pointer;line-height: 0;z-index: 50;background: none;width: 6.5vw;}
.modal-inner .modal-ttl{line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: left;margin-bottom: 3.4vw;}
.modal-inner .modal-text{margin-bottom: 6.40vw;font-size: 4.27vw;line-height: 1.8;letter-spacing: 0.05em;font-weight: 400;text-align: left;}
.modal-inner table{width: 100%;margin: 0 auto 7.53vw;border-top: #CCC 0.27vw solid;font-weight: 400;font-size: 3.73vw;line-height: 1.5;letter-spacing: 0.02em;text-align: left;}
.modal-inner table th{font-weight: 700;background: #E2E5EA;border-bottom: #CCC 0.27vw solid;padding: 2.27vw 2.33vw 2.67vw 2.33vw;width: 23.9%;}
.modal-inner table td{background: #fff;border-bottom: #CCC 0.27vw solid;padding: 2.27vw 2.33vw 2.67vw 2.33vw;}
.modal-inner .modal-close2{ color: var(--main-blue);font-size: 3.73vw; line-height: 1.0; letter-spacing: 0.05em; font-weight: 400; text-align: center; }
.modal-inner .modal-close2 img{position: relative;width: 3.3vw;margin-right: 1.2vw;}
.single-modal .modal-navigation{ display: none; }

#contents02 {margin: 0 auto 15.57vw;position: relative;padding: 0vw 0vw 0;}
#contents02 .ttl-Box {margin: 0 auto 6.33vw;position: relative;text-align: center;}
#contents02 .ttl-Box h2 {margin-bottom: 3.47vw;text-align: center;padding-left: 1vw;}
#contents02 .ttl-Box h2 span{  }
#contents02 .ttl-Box h2 img {width: auto;height: 5.6vw;}
#contents02 .ttl-Box h3 {color: var(--main-blue);margin-bottom: 6.40vw;position: relative;font-size: 4.8vw;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: center;}

#contents02 .inner-Box {margin: 0 4vw;position: relative;max-width: 120rem;}


#contents02 .inner-Box .flip-item { opacity: 1; transition: opacity 0.25s ease; }
#contents02 .inner-Box .flip-item.is-hidden { opacity: 0; pointer-events: none; }
#contents02 .inner-Box .flip-item.is-none { display: none; }
#contents02 .inner-Box .flip-list { position: relative; transition: min-height 0.2s ease; }
#contents02 .inner-Box .flip-list{list-style:none;padding:0;max-width:120rem;display:flex;justify-content:flex-start;gap: 4%;flex-wrap:wrap;margin-bottom: 2.9vw;}
#contents02 .inner-Box li{width: calc((98% - 2%) / 2);min-height: 52.53vw;cursor:pointer;margin-bottom: 4.13vw;}


#contents02 .inner-Box li.category{background:#E2E5EA;text-align:center;color:var(--main-blue);display:flex;/* align-items:center; */justify-content:center;cursor: default;}
#contents02 .inner-Box li.category .cate-inner{padding: 18vw 0 0;}
#contents02 .inner-Box li.category .cate-inner span {margin-bottom: 2.13vw;display: block;padding-top: -0.33vw;font-size: 3.2vw;line-height: 1.0;letter-spacing: 0.05em;font-weight: 600;text-align: center;}
#contents02 .inner-Box li.category .cate-inner h4{font-size: 6.4vw;line-height: 1.0;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
#contents02 .inner-Box li.nophoto-item{ cursor: default; }

/* 見出しカード（.category）以外を角丸 */
#contents02 .inner-Box li:not(.category) { overflow: hidden; border-radius: 2.67vw; }
#contents02 .inner-Box li:not(.category) .flip-card-inner { border-radius: 2.67vw; }
#contents02 .inner-Box li:not(.category) .face { border-radius: 2.67vw; overflow: hidden; }

#contents02 .inner-Box .flip-card-inner { position: relative; width: 100%; height: 100%; text-align: center; transition: transform 0.6s; transform-style: preserve-3d; }
#contents02 .inner-Box .flip-item.is-flipped .flip-card-inner { transform: rotateY(180deg); }
#contents02 .inner-Box .face {position: absolute;width: 100%;height: 52.53vw;top: 0;left: 0;backface-visibility: hidden;display: flex;flex-direction: column;align-items: baseline;padding: 3.9vw 4.4vw;/* position: relative; */}
#contents02 .inner-Box .face.front {background: #fff;color: var(--main-blue);}
#contents02 .inner-Box .face .no {margin-bottom: 3.20vw;font-size: 8.0vw;line-height: 1.0;letter-spacing: 0.03em;font-weight: 700;text-align: center;}
#contents02 .inner-Box .face.front h3 {font-size: 4.0vw;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: left;display: block;border-bottom: 0.27vw dashed #ccc;padding-bottom: 2.33vw;width: 100%;margin-bottom: 2.67vw;}
#contents02 .inner-Box .face.front h3 span{  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }

#contents02 .inner-Box li .htext{font-size: 3.47vw;line-height: 1.6;letter-spacing: 0.05em;font-weight: 400;text-align: left;color: #333;}
#contents02 .inner-Box li .htext span{  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden;}
#contents02 .inner-Box li .click {font-size: 3.2vw;line-height: 1.0;letter-spacing: 0.05em;font-weight: 600;text-align: right;position: absolute;bottom: 4.80vw;right: 4.80vw;padding-right: 3vw;}
#contents02 .inner-Box li .click .arr{
    width: 2vw;
    display: block;
    position: absolute;
    top: 0;
    right: 0;
}
#contents02 .inner-Box li .pmore {font-size: 3.2vw;line-height: 1.0;letter-spacing: 0.05em;font-weight: 600;text-align: right;position: absolute;bottom: 4.80vw;right: 4.80vw;padding-right: 3.20vw;}
#contents02 .inner-Box li .pmore .plus{ display: block; position: absolute; top: 0; right: 0; width: 2.40vw; height: 2.40vw; }
#contents02 .inner-Box li .pmore .plus::before{ content: ""; width: 2.40vw; height: 0.27vw; background: var(--main-blue); position: absolute; top: 50%; left: 0;}
#contents02 .inner-Box li .pmore .plus::after{ content: ""; width: 2.40vw; height: 0.27vw; background: var(--main-blue); position: absolute; top: 50%; left: 0;transform: rotate(90deg); transform-origin: center;}

/* --- 裏面のデザイン --- */
#contents02 .inner-Box .face.back {background: #fff;color: var(--main-blue);transform: rotateY(180deg);box-sizing: border-box;padding: 0;}
#contents02 .inner-Box .face.back .ftext{font-size: 3.73vw;line-height: 1.8;letter-spacing: 0.05em;font-weight: 400;text-align: left;color: #333;padding: 0 4.27vw;}
#contents02 .inner-Box .face.back .ftext span{  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}
#contents02 .inner-Box .face.back .photo-only{position:absolute;top:0;left:0;width:100%;height:100%;}
#contents02 .inner-Box .face.back .photo-only img{width:100%;height:100%;object-fit:cover;}

#contents02 .inner-Box .face.back .photo{position: relative;top:0;left:0;width:100%;height: 26.67vw;margin-bottom: 2.13vw;}
#contents02 .inner-Box .face.back .photo img{width:100%;height:100%;object-fit:cover;}

.modal-content .photo {width: 100%;/* height: 144.00vw; */display: flex;align-items: center;justify-content: center;overflow: hidden;margin-bottom: 6.40vw;}
.modal-content .photo img {width: auto;height: auto;max-width: 100%;max-height: 144.00vw;object-fit: contain;}
.modal-content .ftext{ font-size: 4.27vw; line-height: 1.8; letter-spacing: 0.05em; font-weight: 400; text-align: left;}

}