@charset "UTF-8";

/* common ============ */

.index-btn-img {
text-align:center;
clear:both;
margin:3em auto 0;
width:90%;
max-width:360px;}
.index-btn-img a {
display:block;
transition:transform 0.25s;}
.index-btn-img a:hover {
transform:scale(1.05);}

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

.index-btn-img {
margin:2em auto 0;}

}

/* index mainimg ===================== */

.swiper-mainimg {
animation:fadeIn 1s ease 0s 1 normal;}
@keyframes fadeIn {
0% {opacity:0}
100% {opacity:1}}
.swiper-mainimg .swiper-wrapper .img {
width:100%;
height:800px;}
.swiper-mainimg .swiper-wrapper .img img {
pointer-events:none;
object-fit:cover;
width:100%;
height:100%;}

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

.swiper-mainimg .swiper-wrapper .img {
aspect-ratio:14 / 8;
height:auto;}

}

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

.swiper-mainimg .swiper-wrapper .img {
aspect-ratio:14 / 12;}

}

/* index-intro ===================== */

.index-intro {
position:relative;
padding:160px 0 75px 0;}
.index-intro img {
width:100%;}
.index-intro .logo {
position:absolute;
z-index:2;
left:50%;
bottom:100%;
width:45%;
max-width:350px;
transform:translate(-50%,-30%);}
.index-intro .img01 , .index-intro .img02 {
position:absolute;
z-index:2;
bottom:100%;
width:28%;}
.index-intro .img01 {
left:0%;
transform:translate(0,-15%);}
.index-intro .img02 {
right:-2%;
transform:translate(0,-12%);}
.index-intro h2 {
font-family:"Zen Maru Gothic", sans-serif;
margin-bottom:0.3em;
font-size:350%;
font-weight:700;
line-height:1.25;
white-space:nowrap;}

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

.index-intro {
padding:160px 0 57.5% 0;}
.index-intro .img01 , .index-intro .img02 {
width:32%;
transform:translate(0,-25%);}

}

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

.index-intro {
padding:7.5% 0 72.5% 0;}
.index-intro .logo {
position:static;
margin:0 auto 7.5%;
width:66.6666%;
transform:translate(0,0);}
.index-intro .img01 , .index-intro .img02 {
width:43%;
transform:translate(0,35%);}
.index-intro h2 {
margin-bottom:0.6em;
font-size:9vw;}

}

/* index-news ===================== */

.index-news {}
.index-news img {
pointer-events:none;
width:100%;}
.index-news .img0101 , .index-news .img0102 {
position:absolute;
z-index:2;
left:-2%;
bottom:100%;
width:22%;
transform:translate(0,10%);}
.index-news .img0102 {
left:80%;}
.index-news .news-topics {
text-align:left;
margin:0 auto;
max-width:900px;}
.index-news .news-topics a {
position:relative;
display:flex;
flex-wrap:wrap;
padding:1.25em 1.5em 1.25em 0;
width:100%;
font-size:106.25%;
line-height:1.6;
color:#222;
border-bottom:2px dotted #222;}
.index-news .news-topics a:hover {
color:#e82;}
.index-news .news-topics a::after {
content:"";
position:absolute;
z-index:2;
right:7px;
top:50%;
width:6px;
height:6px;
border-right:1px solid #222;
border-bottom:1px solid #222;
transform:translate(0,-50%) rotate(-45deg);
transition:transform 0.25s;}
.index-news .news-topics a:hover::after {
transform:translate(10px,-50%) rotate(-45deg);}
.index-news .news-topics a .date {
padding-top:0.1em;
width:160px;
white-space:nowrap;}
.index-news .news-topics a .cate {
width:90px;
white-space:nowrap;}
.index-news .news-topics a .cate span {
text-align:center;
display:inline-block;
width:70px;
font-size:75%;
line-height:2;
white-space:nowrap;
color:#fff;
font-weight:700;
background:#8dc21f;
border-radius:0.5em;}
.index-news .news-topics a .cate span.news {
background:#8dc21f;}
.index-news .news-topics a .cate span.blog {
background:#f29600;}
.index-news .news-topics a .ttl {
padding-top:0.1em;
width:calc(100% - 250px);}

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

.index-news {
padding-top:15% !important;}
.index-news .img01 {
position:absolute;
display:flex;
flex-wrap:wrap;
justify-content:space-between;
left:50%;
bottom:100%;
width:75%;
transform:translate(-50%,-7%);}
.index-news .img0101 , .index-news .img0102 {
position:static;
width:46%;
transform:translate(0,0);}

}

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

.index-news {
padding-top:15% !important;}
.index-news .img01 {
width:90%;}
.index-news .news-topics a .date {
width:145px;}
.index-news .news-topics a .ttl {
padding-top:0.75em;
width:100%;
font-size:93.75%;}

}

/* index-contents ============ */

.index-contents {
justify-content:space-between;
align-items:center;
margin:0 auto;}
.index-contents.col-reverse {
flex-direction:row-reverse;}
.index-contents .img {
pointer-events:none;
width:47%;}
.index-contents .txt {
position:relative;
z-index:2;
width:48%;}
.index-contents .txt::before {
content:"";
opacity:0.3;
position:absolute;
z-index:-1;
top:0;
left:50%;
width:50%;
aspect-ratio:1 / 1;
background:url("../images/index_contents_bg.png") no-repeat center bottom / cover;
transform:translate(-50%,0);}
.index-contents .txt .ttl-eng {
margin-bottom:1em;
line-height:0;}
.index-contents .txt .ttl-eng img {
width:80%;
max-width:320px;}
.index-contents .txt h2 {
font-family:"Zen Maru Gothic", sans-serif;
margin-bottom:0.5em;
font-size:350%;
line-height:1.2;
font-weight:700;
white-space:nowrap;}
.index-contents .txt .desc {
text-align:left;
font-size:106.25%;
line-height:1.7;}

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

.index-contents .txt h2 {
font-size:5vw;}

}

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

.index-contents {
max-width:640px;}
.index-contents.col-reverse {
flex-direction:row;}
.index-contents .img {
width:100%;}
.index-contents .txt {
margin:2em 0 0 0;
width:100%;}
.index-contents .txt h2 {
font-size:400%;}

}

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

.index-contents .txt h2 {
font-size:10vw;}
.index-contents .txt .desc {
font-size:100%;}

}

/* index-bnr-area ===================== */

.index-bnr-area {
position:relative;
z-index:2;
padding:150px 0;
background:#dbebe4;
background-image:repeating-linear-gradient(-45deg,rgba(255,255,255,0.3) 0, rgba(255,255,255,0.3) 6px,transparent 6px, transparent 12px);}
.index-bnr-area::before , .index-bnr-area::after {
content:"";
z-index:1;
position:absolute;
pointer-events:none;
width:100%;
aspect-ratio:1500 / 80;
left:0;
top:-1px;
background:url("../images/bg_wave_white.svg") no-repeat center bottom / cover;}
.index-bnr-area::after {
top:auto;
bottom:-1px;
transform:rotate(180deg);}
.index-bnr-area ul {
justify-content:space-between;
width:100%;}
.index-bnr-area ul li {
width:48%;}
.index-bnr-area ul li a {
display:block;
transition:transform 0.25s;}
.index-bnr-area ul li a:hover {
transform:scale(1.05);}
.index-bnr-area ul li a img {
width:100%;
box-shadow:0 0 8px 2px rgba(0,0,0,0.15);
border-radius:3em;}

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

.index-bnr-area ul {
font-size:1.4vw;}

}

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

.index-bnr-area {
padding:15% 0;}

}

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

.index-bnr-area {
padding:100px 0;}
.index-bnr-area ul {
font-size:2.8vw;}
.index-bnr-area ul li {
padding:3.5% 0;
width:100%;}

}

/* index-instagram ===================== */

.index-instagram {}
.index-instagram .ttl-01::before {
background:url("../images/bg_ttl_instagram01.png") no-repeat center center / contain;}
.index-instagram .ttl-01::after {
background:url("../images/bg_ttl_instagram02.png") no-repeat center center / contain;}
