@charset "UTF-8";
@media screen and (max-width: 1024px) {





    /*index*/
    .index .mainimg {
        height: 70vh;
    }
    .index .mainimg h2 {
        top: 15rem;
    }
    .index>.flex {
        height: initial;
        padding: 1rem 10%;
    }
    .index>.flex .blog {
        margin: 0 auto 3rem;
    }
    .index_cnt1 .inner .col2 a {
        width: 100% !important;
        margin: 0 0 3rem;
    }
    .index_cnt2 .inner .col2 .right {
        display: flex;
        gap: 2.6vw;
    }
    .index_cnt2 .inner .col2 .left p {
        position: relative;
        z-index: 1;
    }
    .index_cnt2 .inner .col2 .left>p:not(.buttonA) {
        /*margin: 0 0 15rem;*/
    }
    /*
    .index_cnt2 .inner .col2 .right .pic1 {
        width: 55%;
        bottom: 1rem;
        left: 3rem;
    }
    .index_cnt2 .inner .col2 .right .pic2 {
        width: 30%;
        top: initial;
        left: initial;
        right: 3rem;
        bottom: 10rem;
    }*/
    .index_cnt2 .inner .col2 .right .pic1 {
        width: 50%;
        aspect-ratio: 3/2;
        overflow: hidden;
        position: initial;
    }
    .index_cnt2 .inner .col2 .right .pic2 {
        width: 50%;
        aspect-ratio: 3/2;
        overflow: hidden;
        position: initial;
    }
    .index_cnt3 .inner .col2 {
        padding: 0 0 3rem;
        margin: 0 0 3rem;
        border-bottom: 0.1rem dashed #000;
    }
    .index_cnt3 .inner .col2 .left {
        border: 0.5rem solid #fff;
    }
    .index_cnt4 .inner .webgene-blog {
        display: block;
    }
    .index_cnt4 .inner .webgene-blog .webgene-item {
        padding: 0 0 3rem;
        margin: 0 0 3rem;
        border-bottom: 0.1rem dashed #000;
    }
    .index_cnt6 .inner .flex {
        display: block;
    }
    .index_cnt6 .inner .flex .pic {
        width: 100%;
        margin: 0 0 3rem;
    }
    .index_cnt6 .inner .flex .pic img {
        height: initial;
        width: 100%;
    }
    .index_cnt6 .inner .flex .webgene-blog {
        width: 100%;
        display: block;
    }
    .index_cnt6 .inner .flex .webgene-blog .webgene-item {
        width: 100%;
        padding: 0 0 3rem;
        margin: 0 0 3rem;
        border-bottom: 0.1rem dashed #000;
    }
    .index .banner{
        background: #f6ede5;
        padding: clamp(1rem,1.04vw,2rem);
    }
    .index .banner .flex {
        width: 90%;
        margin: auto;
        position: initial;
    }
    .index .banner .flex [class^="button"] {
        width: 100%;
        margin: 0 0 2rem;
    }




    /*about*/
    .about_cnt1 .inner .col2 .left {
        border: 0.5rem solid #fff;
        box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.2);
    }
    .about_cnt1 .inner .illust {
        position: initial;
    }
    .about_cnt3 .inner .illust {
        position: initial;
        width: 50%;
    }
    .about_cnt3 .inner .illust img {
        width: 100%;
    }
    .about_cnt4 .inner .window {
        display: block;
    }
    .about_cnt4 .inner .window .left {
        width: 100%;
        margin: 0 0 3rem;
    }
    .about_cnt4 .inner .window .right {
        width: 100%;
        border: 0.5rem solid #fff;
    }
  .about_cnt4 .inner .window .right img{
    width:100%;}





    /*blog & blogdetail共通*/
    :is(.blog_cnt1, .blogdetail_cnt1) .inner .webgene-blog {
        display: block;
    }
    :is(.blog_cnt1, .blogdetail_cnt1) .inner .webgene-blog .webgene-item {
        margin: 0 0 1rem;
    }






    /*blog*/
    .blog_cnt2 .inner .webgene-blog .webgene-item .dl {
        display: block;
    }
    .blog_cnt2 .inner .webgene-blog .webgene-item .dt {
        margin: 0 0 1rem;
    }
    .blog_cnt2 .inner .webgene-blog .webgene-item .pic {
        margin: 0 0 1rem;
    }
    .blog_cnt2 .inner .webgene-blog .webgene-item .cate {
        margin: 0 0 1rem;
    }
    .webgene-pagination :is(.prev, .next),
    .webgene-pagination ul .number.selected,
    .webgene-pagination ul .number {
        width: 2em;
        height: 2em;
        margin: 0;
    }
    .webgene-pagination ul {
        width: 100%;
        justify-content: space-between;
    }
    .webgene-pagination .prev {
        margin: 0;
    }
    .webgene-pagination .next {
        margin: 0;
    }





    /*contact*/
    .contact_cnt1 .inner .col2 .left {
        margin: 0 0 3rem;
        padding: 0 0 3rem;
        border-bottom: 0.1rem dashed #000;
    }
    .contact_cnt1 .inner .col2 .right .insta {
        width: 100%;
    }
    form .dl {
        display: block;
    }
    form .dl .dt {
        width: 100%;
    }
    form .dl .dd {
        width: 100%;
    }
    form .privacyLabel {
        /*font-size: 1rem;*/
      
        font-size: 1.5rem;
    }
    .privacyformError {
        margin-top: -36.5px !important;
    }




}

/* 初期状態 */
.index .mainimg .slider .pic .pic_sp, .mainimg .pic .pic_sp {
	display: none;
}
.index .mainimg .slider .pic .pic_pc, .mainimg .pic .pic_pc {
	display: block;
}

/* SP */
@media screen and (max-width: 767px) {
.index .mainimg .slider .pic .pic_pc, .mainimg .pic .pic_pc {
	display: none;
}
.index .mainimg .slider .pic .pic_sp, .mainimg .pic .pic_sp {
	display: block;
}
}
 @media screen and (max-width: 520px) {
.inner, .index .banner {
	width: 90%;
}
.index>.flex {
	padding: 1rem 3%;
}
.index_cnt2 .inner .col2 .right {
	display: block;
}
.index_cnt2 .inner .col2 .right .pic1 {
	width: 80%;
	position: static;
	aspect-ratio: 8.6 / 5.8;
	overflow: hidden;
}
.index_cnt2 .inner .col2 .right .pic2 {
	width: 50%;
	aspect-ratio: 3 / 2;
	overflow: hidden;
	position: relative;
	left: 45.5625vw;
	bottom: 5.85vw;
}
.index_cnt2 .inner .col2 .right .illust {
	width: 13.37vw;
	bottom: 25vw;
}
.index_cnt3 .inner .illust2 {
	width: 25.18vw;
	bottom: -24.5vw;
}
.index_cnt5 .inner .illust {
	width: 17.95vw;
	top: 60vw;
}
.about_cnt1 .inner .illust img {
	width: 15vw;
}
.about_cnt1 .inner .col2:not(:last-of-type), .about_cnt3 .inner>p, .about_cnt5 .inner .col2 .right p {
	margin: 0 0 2rem;
}
.about_cnt3 .inner .illust {
	position: static;
	width: 38%;
	margin-bottom: 2rem;
}
.about_cnt4 .inner .window .left h4::after {
	content: none;
}
.index .mainimg h2 {
	top: 10rem;
}
.blog_cnt2 .inner .webgene-blog .webgene-item .dt p a {
	font-size: 2rem !important;
}
.blogdetail_cnt2 .inner .webgene-blog .webgene-item .dt {
	font-size: 2.5rem;
}
.about_cnt2 {
	background-position: center top;
}
.index>.flex .info {
	align-items: end;
}
.index_cnt5 .inner .grid {
	width: 100%;
}
.header .logo {
	left: 7.02vw;
}
.about_cnt5 .inner .col2 .right h4 {
	margin: 0 0 1rem;
}
.bottom {
	padding: 5rem 0;
}
.about_cnt5 .inner .map {
	margin: 0 auto 2rem;
}
form .dl .dd {
	padding: 0 0 1rem 0;
}
}
@media (min-width:521px) and (max-width:767px) {
.index_cnt5 .inner .illust {
    width: 14.95vw;
    top: 49vw;
}
}
 @media screen and (max-width: 1023px) {
.banner::before {
	content: "";
	position: absolute;
	top: 10px;
	left: 10px;
	right: 10px;
	bottom: 10px;
	border: 2px solid #ead99f;
	pointer-events: none;
}
}
@media screen and (min-width: 1000px) {
.contact_cnt1 .inner .col2 .left {
	border-bottom: none;
}
.index .banner .flex {
	display: flex !important;
	gap: 1rem;
	position: absolute;
	left: revert-rule;
	bottom: 1.3vw;
	z-index: 1;
	top: auto;
	width: auto;
}
.index_cnt3 .inner .illust2 {
	bottom: -10.5vw;
}
.about_cnt1 .inner .col2, .about_cnt4 .inner .window, .contact_cnt1 .inner .col2 {
	display: flex !important;
}
}
@media screen and (max-width: 900px) {
.index_cnt3 .inner .titleA {
	margin: 0 0 5rem;
}
}
@media screen and (max-width: 1024px) {
  .about_cnt2 {
    background-position: center;
}
.footer .col2 {
	margin: 0 auto 5rem;
}
.footer {
	padding: 5rem 0 3rem;
}
.index_cnt6 .inner .flex .webgene-blog .webgene-item:nth-last-child(-n+2) {
	margin: 0;
}
.header.scroll-nav {
	background: rgb(255 255 255 / 40%);
}
.index>.flex .blog {
	align-items: center;
	margin: 0 auto 1rem;
}
.index_cnt3 .inner .illust1 {
	width: 13.979vw;
}
.index_cnt3 .inner .col2 .right h4::after {
	font-size: 2rem;
}
.index_cnt3 {
	padding: 5rem 0 10rem 0 !important;
}
.index_cnt6 .inner .flex .webgene-blog {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}
.index_cnt3 .inner .col2:nth-last-child(2) {
	border-bottom: none;
}
.titleA {
	gap: 1rem;
}
}
@media (min-width:768px) and (max-width:1024px) {
.about_cnt1 .inner .illust {
	position: relative;
	width: 13rem;
	bottom: 2rem;
}
form .dl .dt {width: 50%;}
.about_cnt3 .inner .illust {
	position: relative;
	width: 15rem;
	bottom: 4rem;
}
.about_cnt3 .inner>p {
	padding: 0 0 8rem;
	margin: 0;
}
.bottom {
	padding: 5rem 0 2rem;
}
.index>.flex {
	padding: 1rem 5%;
}
.index>.flex, .index_cnt1 .inner .col2 {
	display: flex !important;
	width: 100%;
}
.bottom .col2, .about_cnt4 .inner .col2, form .dl {
	display: flex !important;
}
.header .nav {
	max-width: inherit;
}
.index_cnt2 .inner .col2 .right .illust {
	display: none;
}
      [class^="button"] {
        width: 50%;
    }
  .about_cnt5 .inner .col2 .right p {
    margin: 0 0 2rem;}
  .about_cnt5 .inner .col2 .right h4 {
    margin: 0 0 1rem;
}
  .index_cnt3 .inner .col2 .right h4::after {
        font-size: 1.8rem;
    }
}
@media screen and (min-width: 1025px) {
.spbr br {
	display: none;
}
.index_cnt5 .inner .grid {
	width: 80.5vw;
}
}
@media (min-width:1025px) and (max-width:1600px) {
  .index_cnt2 .inner .col2 .right .pic2 {
    width: auto;
    position: relative;
    left: 0;
    bottom: -31.15vw;
}
  .index_cnt2 .inner .col2 .right .illust{display:none;}
}
@media screen and (min-width: 1500px) {
.index_cnt3 .inner .illust2 {width: 10.18vw;}
  .index_cnt3 .inner .col2 {
    margin: 0 0 10rem;
}
  .about_cnt1::before {
            bottom: 10.8125vw;
        height: 36.41vw;
}
  .about_cnt3 {
    padding: 12rem 0 0rem;}
}