@charset "UTF-8";
/* CSS Document */
/*===================================================
	画面用CSS（PC/SMP）
===================================================*/
/*////////////////////////////////////////////////////////////
	TOP
///////////////////////////////////////////////////////////*/
@media (max-width: 1024px) {
  .topMain .topKv {
    height: 460px;
  }
  .topMain .topKv .topKvContainer {
    max-width: none;
    padding: 0 20px;
  }
  .topMain .topKv .topKvContainer .topKvCopy {
    top: 30px;
    right: 15px;
    width: 96px;
  }
  .topMain .topKv .topKvContainer .topKvCopy h1 {
    font-size: 34px;
    line-height: 48px;
  }
  .topMain .topKv .topKvContainer .topKvCatch {
    top: 60px;
    right: 125px;
    gap: 4px;
    width: 65px;
  }
  .topMain .topKv .topKvContainer .topKvCatch .txtBox {
    flex-basis: 32px;
    width: 32px;
  }
  .topMain .topKv .topKvContainer .topKvCatch .txtBox p {
    min-height: 0;
    padding: 10px 0;
    font-size: 18px;
    line-height: 32px;
  }
  .topMain .topKv .topKvContainer .topKvCatch .txtBox:last-child p {
    min-height: 0;
  }
  .topMain .topKv .topKvContainer .topKvLead {
    right: 15px;
    bottom: 20px;
    left: 15px;
    gap: 4px;
    width: auto;
    padding: 12px 16px;
  }
  .topMain .topKv .topKvContainer .topKvLead p {
    font-size: clamp(12px, 3.5vw, 15px);
    line-height: 24px;
  }
  .topMain .topKv .topKvContainer .topKvLead p + p {
    font-size: 11px;
    line-height: 20px;
  }
  .topMain .concept {
    min-height: 900px;
  }
  .topMain .concept .conceptContainer {
    padding: 330px 0 60px;
  }
  .topMain .concept .conceptContainer .conceptTitle {
    max-width: 600px;
  }
  .topMain .concept .conceptContainer .conceptTitle .conceptImage {
    top: -145px;
    left: 0;
    width: 60px;
  }
  .topMain .concept .conceptContainer .conceptTitle .secTtl p {
    font-size: 16px;
    line-height: 26px;
  }
  .topMain .concept .conceptContainer .conceptTitle .secTtl h2 {
    margin: 10px 0 0;
    font-size: clamp(26px, 5.5vw, 48px);
    line-height: 1.5;
  }
  .topMain .concept .conceptContainer .txtBox {
    max-width: 600px;
    margin: 36px auto 0;
  }
  .topMain .concept .conceptContainer .txtBox p {
    font-size: 14px;
    line-height: 28px;
  }
  .topMain .concept .conceptContainer .txtBox p + p {
    margin: 12px 0 0;
  }
  .topMain .concept .conceptContainer .btnMore {
    margin: 30px 0 0;
  }
  .topMain .concept .conceptContainer .btnMore a {
    min-height: 56px;
    padding: 16px 26px;
    font-size: 14px;
    line-height: 24px;
    border-radius: 28px;
  }
}
@media (max-width: 1024px) {
  .topMain .grapes .grapesContainer {
    padding: 64px 0;
  }
  .topMain .grapes .grapesContainer .grapesTitle .titleLabel .imgBox {
    width: 58px;
  }
  .topMain .grapes .grapesContainer .grapesTitle .titleLabel .txtBox {
    margin-left: -16px;
    padding: 0 0 2px;
  }
  .topMain .grapes .grapesContainer .grapesTitle .titleLabel .txtBox p {
    font-size: 13px;
    line-height: 22px;
  }
  .topMain .grapes .grapesContainer .grapesTitle .secTtl {
    margin: 12px 0 0;
  }
  .topMain .grapes .grapesContainer .grapesTitle .secTtl h2 {
    font-size: clamp(28px, 5.5vw, 44px);
  }
  .topMain .grapes .grapesContainer .grapesLead {
    max-width: 600px;
    margin: 28px auto 0;
  }
  .topMain .grapes .grapesContainer .grapesLead p {
    font-size: 14px;
    line-height: 2;
  }
  .topMain .grapes .grapesContainer .grapesLead p + p {
    margin: 10px 0 0;
  }
  .topMain .grapes .grapesContainer .grapesList {
    gap: 20px;
    margin: 40px 0 0;
  }
  .topMain .grapes .grapesContainer .grapesList .grapesItem {
    width: calc((100% - 20px) / 2);
    min-height: 0;
    padding: 16px 16px 24px;
  }
  .topMain .grapes .grapesContainer .grapesList .grapesItem .grapesInfo {
    margin: 16px 0 0;
  }
  .topMain .grapes .grapesContainer .grapesList .grapesItem .grapesInfo .ttl h3 {
    font-size: clamp(16px, 2.7vw, 22px);
  }
  .topMain .grapes .grapesContainer .grapesList .grapesItem .grapesInfo .harvest {
    margin: 8px 0 0;
  }
  .topMain .grapes .grapesContainer .grapesList .grapesItem .grapesInfo .harvest p {
    font-size: 12px;
  }
  .topMain .grapes .grapesContainer .grapesList .grapesItem .txtBox {
    margin: 24px 0 0;
  }
  .topMain .grapes .grapesContainer .grapesList .grapesItem .txtBox p {
    font-size: 14px;
    line-height: 1.9;
  }
  .topMain .grapes .grapesContainer .grapesImage {
    position: static;
    width: min(65%, 320px);
    margin: 32px auto 0;
  }
  .topMain .grapes .grapesContainer .grapesNote {
    max-width: none;
    margin: 24px 0 0;
  }
  .topMain .grapes .grapesContainer .grapesNote p {
    font-size: 13px;
  }
}
@media (max-width: 480px) {
  .topMain .grapes .grapesContainer .grapesList .grapesItem {
    width: 100%;
    padding: 24px;
  }
  .topMain .grapes .grapesContainer .grapesList .grapesItem .imgBox {
    max-width: 332px;
    margin: 0 auto;
  }
  .topMain .grapes .grapesContainer .grapesList .grapesItem .grapesInfo .ttl h3 {
    font-size: 22px;
  }
}
@media (max-width: 1024px) {
  .topMain .schedule .scheduleContainer {
    padding: 64px 0;
  }
  .topMain .schedule .scheduleContainer .scheduleTitle .titleLabel .imgBox {
    width: 58px;
  }
  .topMain .schedule .scheduleContainer .scheduleTitle .titleLabel .txtBox {
    margin-left: -16px;
    padding: 0 0 2px;
  }
  .topMain .schedule .scheduleContainer .scheduleTitle .titleLabel .txtBox p {
    font-size: 13px;
    line-height: 22px;
  }
  .topMain .schedule .scheduleContainer .scheduleTitle .secTtl {
    margin: 12px 0 0;
  }
  .topMain .schedule .scheduleContainer .scheduleTitle .secTtl h2 {
    font-size: clamp(26px, 5.5vw, 44px);
  }
  .topMain .schedule .scheduleContainer .scheduleLead {
    margin: 28px 0 0;
  }
  .topMain .schedule .scheduleContainer .scheduleLead p {
    font-size: 14px;
  }
  .topMain .schedule .scheduleContainer .scheduleLead p + p {
    margin: 8px 0 0;
    font-size: 12px;
  }
  .topMain .schedule .scheduleContainer .scheduleGuide {
    display: block;
    margin: 24px 0 0;
  }
  .topMain .schedule .scheduleContainer .scheduleGuide p {
    font-size: 12px;
    line-height: 2;
    text-align: right;
  }
  .topMain .schedule .scheduleContainer .scheduleScroll {
    margin: 8px 0 0;
  }
  .topMain .schedule .scheduleContainer .scheduleNote {
    margin: 20px 0 0;
    text-align: left;
  }
  .topMain .schedule .scheduleContainer .scheduleNote p {
    font-size: 12px;
  }
  .topMain .schedule .scheduleContainer .scheduleNote p + p {
    margin: 8px 0 0;
  }
}
@media (max-width: 1024px) {
  .topMain .blogSection .blogContainer {
    padding: 64px 0 0;
  }
  .topMain .blogSection .blogContainer .blogTitle .titleLabel .imgBox {
    width: 58px;
  }
  .topMain .blogSection .blogContainer .blogTitle .titleLabel .txtBox {
    margin-left: -16px;
    padding: 0 0 2px;
  }
  .topMain .blogSection .blogContainer .blogTitle .titleLabel .txtBox p {
    font-size: 13px;
    line-height: 22px;
  }
  .topMain .blogSection .blogContainer .blogTitle .secTtl {
    margin: 12px 0 0;
  }
  .topMain .blogSection .blogContainer .blogTitle .secTtl h2 {
    font-size: clamp(28px, 5.5vw, 44px);
  }
  .topMain .blogSection .blogContainer .blogLead {
    margin: 28px 0 0;
  }
  .topMain .blogSection .blogContainer .blogLead p {
    font-size: 14px;
  }
  .topMain .blogSection .blogContainer .blogLead p + p {
    margin: 8px 0 0;
  }
  .topMain .blogSection .blogContainer .blogList {
    margin: 28px 0 0;
  }
  .topMain .blogSection .blogContainer .blogList .webgene-blog {
    gap: 20px;
  }
  .topMain .blogSection .blogContainer .blogList .webgene-blog .webgene-item {
    width: calc((100% - 20px) / 2);
  }
  .topMain .blogSection .blogContainer .blogList .webgene-blog .webgene-item a {
    padding: 12px;
  }
  .topMain .blogSection .blogContainer .blogList .webgene-blog .webgene-item a .time {
    margin: 12px 0 0;
  }
  .topMain .blogSection .blogContainer .blogList .webgene-blog .webgene-item a .time p {
    font-size: 12px;
    line-height: 20px;
  }
  .topMain .blogSection .blogContainer .blogList .webgene-blog .webgene-item a .title p {
    font-size: 14px;
  }
  .topMain .blogSection .blogContainer .btnMore {
    margin: 36px 0 0;
  }
  .topMain .blogSection .blogContainer .btnMore a {
    width: 260px;
    min-height: 56px;
    padding: 16px 24px;
    font-size: 14px;
    line-height: 24px;
    border-radius: 28px;
  }
  .topMain .instaSection .instaContainer {
    padding: 64px 0;
  }
  .topMain .instaSection .instaContainer .instaTitle .titleLabel .imgBox {
    width: 58px;
  }
  .topMain .instaSection .instaContainer .instaTitle .titleLabel .txtBox {
    margin-left: -16px;
    padding: 0 0 2px;
  }
  .topMain .instaSection .instaContainer .instaTitle .titleLabel .txtBox p {
    font-size: 13px;
    line-height: 22px;
  }
  .topMain .instaSection .instaContainer .instaTitle .secTtl {
    margin: 12px 0 0;
  }
  .topMain .instaSection .instaContainer .instaTitle .secTtl h2 {
    font-size: clamp(32px, 5.5vw, 44px);
  }
  .topMain .instaSection .instaContainer .instaLead {
    max-width: 600px;
    margin: 28px auto 0;
  }
  .topMain .instaSection .instaContainer .instaLead p {
    font-size: 14px;
    line-height: 2;
  }
  .topMain .instaSection .instaContainer .instaLead p + p {
    margin: 8px 0 0;
  }
  .topMain .instaSection .instaContainer .instaImage {
    position: static;
    width: min(45%, 200px);
    margin: 24px 0 0;
  }
  .topMain .instaSection .instaContainer .instaPanel {
    max-width: 700px;
    margin: 24px auto 0;
  }
  .topMain .instaSection .instaContainer .instaPanel .instaList .webgene-blog .webgene-item {
    width: calc((100% - 2px) / 2);
  }
}
@media (max-width: 480px) {
  .topMain .blogSection .blogContainer .blogList .webgene-blog .webgene-item {
    width: 100%;
  }
}
/*////////////////////////////////////////////////////////////
  BEKKOについて
///////////////////////////////////////////////////////////*/
@media (max-width: 1024px) {
  .aboutMain .message .messageContainer {
    padding: 40px 0 64px;
  }
  .aboutMain .message .messageContainer .messageTitle .messageGirl {
    width: 48px;
  }
  .aboutMain .message .messageContainer .messageTitle .titleLabel {
    margin: -14px 0 0;
  }
  .aboutMain .message .messageContainer .messageTitle .titleLabel .imgBox {
    width: 58px;
  }
  .aboutMain .message .messageContainer .messageTitle .titleLabel .txtBox {
    margin-left: -16px;
    padding: 0 0 2px;
  }
  .aboutMain .message .messageContainer .messageTitle .titleLabel .txtBox p {
    font-size: 13px;
    line-height: 22px;
  }
  .aboutMain .message .messageContainer .messageTitle .secTtl h2 {
    font-size: clamp(30px, 5.5vw, 44px);
  }
  .aboutMain .message .messageContainer .secContainer {
    flex-direction: column;
    gap: 32px;
    margin: 36px 0 0;
  }
  .aboutMain .message .messageContainer .secContainer .messageImage {
    flex: auto;
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
  }
  .aboutMain .message .messageContainer .secContainer .messageContent {
    flex: auto;
    width: 100%;
    padding: 0;
  }
  .aboutMain .message .messageContainer .secContainer .messageContent .secTtl h3 {
    font-size: clamp(24px, 4vw, 32px);
    line-height: 1.6;
  }
  .aboutMain .message .messageContainer .secContainer .messageContent .txtBox {
    margin: 24px 0 0;
  }
  .aboutMain .message .messageContainer .secContainer .messageContent .txtBox p {
    font-size: 14px;
  }
  .aboutMain .message .messageContainer .secContainer .messageContent .txtBox p + p {
    margin: 18px 0 0;
  }
  .aboutMain .history .historyContainer {
    flex-direction: column;
    gap: 32px;
    padding: 64px 0;
  }
  .aboutMain .history .historyContainer .historyContent {
    flex: auto;
    width: 100%;
  }
  .aboutMain .history .historyContainer .historyContent .secTtl h2 {
    font-size: clamp(24px, 4vw, 32px);
  }
  .aboutMain .history .historyContainer .historyContent .txtBox {
    margin: 24px 0 0;
  }
  .aboutMain .history .historyContainer .historyContent .txtBox p {
    font-size: 14px;
  }
  .aboutMain .history .historyContainer .historyContent .txtBox p + p {
    margin: 18px 0 0;
  }
  .aboutMain .history .historyContainer .historyImage {
    flex: auto;
    width: 100%;
    max-width: 500px;
  }
  .aboutMain .features .featuresContainer {
    padding: 64px 0;
  }
  .aboutMain .features .featuresContainer .secTtl h2 {
    font-size: clamp(24px, 4vw, 32px);
  }
  .aboutMain .features .featuresContainer .secContainer {
    flex-direction: column;
    gap: 32px;
    margin: 36px 0 0;
  }
  .aboutMain .features .featuresContainer .secContainer .featuresImage {
    flex: auto;
    width: 100%;
    max-width: 700px;
    margin: 0 auto;
  }
  .aboutMain .features .featuresContainer .secContainer .featuresContent {
    flex: auto;
    width: 100%;
  }
  .aboutMain .features .featuresContainer .secContainer .featuresContent .secTtl h3 {
    font-size: clamp(24px, 4vw, 32px);
    line-height: 1.6;
  }
  .aboutMain .features .featuresContainer .secContainer .featuresContent .txtBox {
    margin: 24px 0 0;
  }
  .aboutMain .features .featuresContainer .secContainer .featuresContent .txtBox p {
    font-size: 14px;
  }
  .aboutMain .features .featuresContainer .secContainer .featuresContent .txtBox p + p {
    margin: 18px 0 0;
  }
  .aboutMain .features .featuresContainer .featuresList {
    flex-direction: column;
    gap: 20px;
    margin: 36px 0 0;
  }
  .aboutMain .features .featuresContainer .featuresList .featuresItem {
    width: 100%;
    padding: 24px;
  }
  .aboutMain .features .featuresContainer .featuresList .featuresItem .number p {
    font-size: 36px;
  }
  .aboutMain .features .featuresContainer .featuresList .featuresItem .ttl {
    margin: 16px 0 0;
  }
  .aboutMain .features .featuresContainer .featuresList .featuresItem .ttl h3 {
    font-size: 20px;
  }
  .aboutMain .features .featuresContainer .featuresList .featuresItem .txtBox {
    margin: 20px 0 0;
  }
  .aboutMain .features .featuresContainer .featuresList .featuresItem .txtBox p {
    font-size: 14px;
  }
  .aboutMain .mission .missionContainer {
    padding: 64px 0;
  }
  .aboutMain .mission .missionContainer .secTtl h2 {
    font-size: clamp(28px, 5.5vw, 44px);
  }
  .aboutMain .mission .missionContainer .missionLead {
    margin: 28px 0 0;
  }
  .aboutMain .mission .missionContainer .missionLead p {
    font-size: 14px;
  }
  .aboutMain .mission .missionContainer .txtBox {
    margin: 24px 0 0;
    text-align: left;
  }
  .aboutMain .mission .missionContainer .txtBox p {
    font-size: 14px;
  }
  .aboutMain .overview .overviewContainer {
    padding: 64px 0;
  }
  .aboutMain .overview .overviewContainer .secTtl h2 {
    font-size: clamp(24px, 4vw, 32px);
  }
  .aboutMain .overview .overviewContainer .overviewList {
    margin: 28px 0 0;
  }
  .aboutMain .overview .overviewContainer .overviewList .overviewItem .ttl {
    flex-basis: 90px;
    padding: 14px 12px;
  }
  .aboutMain .overview .overviewContainer .overviewList .overviewItem .ttl p {
    font-size: 14px;
    line-height: 1.8;
  }
  .aboutMain .overview .overviewContainer .overviewList .overviewItem .txtBox {
    padding: 14px 12px;
  }
  .aboutMain .overview .overviewContainer .overviewList .overviewItem .txtBox p,
.aboutMain .overview .overviewContainer .overviewList .overviewItem .txtBox a {
    font-size: 14px;
    line-height: 1.8;
    overflow-wrap: anywhere;
  }
  .aboutMain .access .accessContainer {
    flex-direction: column;
    gap: 28px;
    padding: 64px 0;
  }
  .aboutMain .access .accessContainer .accessContent {
    flex: auto;
    width: 100%;
    padding: 0;
  }
  .aboutMain .access .accessContainer .accessContent .secTtl h2 {
    font-size: clamp(24px, 4vw, 32px);
  }
  .aboutMain .access .accessContainer .accessContent .txtBox {
    margin: 24px 0 0;
  }
  .aboutMain .access .accessContainer .accessContent .txtBox p {
    font-size: 14px;
  }
  .aboutMain .access .accessContainer .accessMap {
    flex: auto;
    width: 100%;
  }
  .aboutMain .access .accessContainer .accessMap iframe {
    height: clamp(240px, 55vw, 360px);
  }
}
/*////////////////////////////////////////////////////////////
  ブログ一覧・詳細
///////////////////////////////////////////////////////////*/
@media (max-width: 1024px) {
  .bloglistMain .blogSection .postContainer,
.blogMain .blogSection .postContainer {
    padding: 40px 0 64px;
  }
  .bloglistMain .blogSection .postContainer .catePanel .categoryBox .webgene-blog,
.blogMain .blogSection .postContainer .catePanel .categoryBox .webgene-blog {
    gap: 10px;
  }
  .bloglistMain .blogSection .postContainer .catePanel .categoryBox .webgene-blog .webgene-item a,
.blogMain .blogSection .postContainer .catePanel .categoryBox .webgene-blog .webgene-item a {
    min-height: 44px;
    padding: 10px 38px 10px 20px;
    font-size: 14px;
    line-height: 22px;
    border-radius: 24px;
  }
  .bloglistMain .blogSection .postContainer .catePanel .categoryBox .webgene-blog .webgene-item a::after,
.blogMain .blogSection .postContainer .catePanel .categoryBox .webgene-blog .webgene-item a::after {
    right: 18px;
    width: 14px;
    height: 12px;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--list,
.blogMain .blogSection .postContainer .blogPanel--list {
    margin: 36px 0 0;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--list .webgene-blog,
.blogMain .blogSection .postContainer .blogPanel--list .webgene-blog {
    gap: 20px;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-item,
.blogMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-item {
    width: calc((100% - 20px) / 2);
  }
  .bloglistMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-item a,
.blogMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-item a {
    min-height: 0;
    padding: 12px 12px 24px;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-item a .time,
.blogMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-item a .time {
    margin: 12px 4px 0;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-item a .time p,
.blogMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-item a .time p {
    font-size: 12px;
    line-height: 20px;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-item a .title,
.blogMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-item a .title {
    margin: 6px 4px 0;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-item a .title p,
.blogMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-item a .title p {
    font-size: 14px;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-pagination,
.blogMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-pagination {
    margin: 20px 0 0;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-pagination ul,
.blogMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-pagination ul {
    gap: 4px;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-pagination ul li a,
.blogMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-pagination ul li a {
    width: 30px;
    font-size: 12px;
    line-height: 40px;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-pagination ul li.prev,
.blogMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-pagination ul li.prev {
    margin-right: 4px;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-pagination ul li.next,
.blogMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-pagination ul li.next {
    margin-left: 4px;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--detail,
.blogMain .blogSection .postContainer .blogPanel--detail {
    margin: 40px auto 0;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .ttlBox h2,
.blogMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .ttlBox h2 {
    font-size: clamp(24px, 4vw, 32px);
  }
  .bloglistMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .blogInfo .time p,
.blogMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .blogInfo .time p {
    font-size: 12px;
    line-height: 22px;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .postBox,
.blogMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .postBox {
    margin: 24px 0 0;
    font-size: 14px;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .postBox h1,
.bloglistMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .postBox h2,
.blogMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .postBox h1,
.blogMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .postBox h2 {
    font-size: 24px;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .postBox h3,
.blogMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .postBox h3 {
    font-size: 20px;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .postBox h4,
.bloglistMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .postBox h5,
.bloglistMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .postBox h6,
.blogMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .postBox h4,
.blogMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .postBox h5,
.blogMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .postBox h6 {
    font-size: 18px;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .postBox blockquote,
.blogMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .postBox blockquote {
    padding: 12px 16px;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .postBox .postTxt,
.blogMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .postBox .postTxt {
    margin: 24px 0 0;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .btnBackBox,
.blogMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .btnBackBox {
    margin: 40px 0 0;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .btnBackBox .btnContact,
.bloglistMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .btnBackBox .btnMore,
.blogMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .btnBackBox .btnContact,
.blogMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .btnBackBox .btnMore {
    max-width: 260px;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .btnBackBox .btnContact a,
.bloglistMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .btnBackBox .btnMore a,
.blogMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .btnBackBox .btnContact a,
.blogMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .btnBackBox .btnMore a {
    min-height: 56px;
    padding: 16px 20px;
    font-size: 14px;
    line-height: 24px;
    border-radius: 28px;
  }
  .bloglistMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .btnBackBox .btnMore,
.blogMain .blogSection .postContainer .blogPanel--detail .webgene-blog .webgene-item .btnBackBox .btnMore {
    margin-top: 20px;
  }
}
@media (max-width: 480px) {
  .bloglistMain .blogSection .postContainer .blogPanel--list .webgene-blog .webgene-item {
    width: 100%;
  }
}
/*////////////////////////////////////////////////////////////
  お問い合わせ・お問い合わせ完了
///////////////////////////////////////////////////////////*/
@media (max-width: 1024px) {
  .contactMain .orderInfo .orderInfoContainer {
    padding: 64px 0;
  }
  .contactMain .orderInfo .orderInfoContainer .secTtl h2 {
    font-size: 28px;
  }
  .contactMain .orderInfo .orderInfoContainer .txtBox {
    margin: 28px 0 0;
    text-align: left;
  }
  .contactMain .orderInfo .orderInfoContainer .txtBox p {
    font-size: 14px;
  }
  .contactMain .orderInfo .orderInfoContainer .txtBox p + p {
    margin: 24px 0 0;
  }
  .contactMain .contactGuide .contactGuideContainer {
    padding: 48px 0 0;
  }
  .contactMain .contactGuide .contactGuideContainer .setPanel {
    flex-direction: column;
    gap: 24px;
    padding: 20px;
  }
  .contactMain .contactGuide .contactGuideContainer .setPanel .imgBox {
    flex: auto;
    width: 100%;
    max-width: 363px;
  }
  .contactMain .contactGuide .contactGuideContainer .setPanel .setContent {
    flex: auto;
    width: 100%;
  }
  .contactMain .contactGuide .contactGuideContainer .setPanel .setContent .secTtl h2 {
    font-size: 22px;
  }
  .contactMain .contactGuide .contactGuideContainer .setPanel .setContent .txtBox {
    margin: 20px 0 0;
  }
  .contactMain .contactGuide .contactGuideContainer .setPanel .setContent .txtBox p {
    font-size: 14px;
  }
  .contactMain .contactGuide .contactGuideContainer .linePanel {
    margin: 40px 0 0;
    padding: 32px 20px;
  }
  .contactMain .contactGuide .contactGuideContainer .linePanel .secTtl h2 {
    font-size: 22px;
  }
  .contactMain .contactGuide .contactGuideContainer .linePanel .lineContainer {
    flex-direction: column;
    gap: 24px;
    align-items: center;
    margin: 24px 0 0;
  }
  .contactMain .contactGuide .contactGuideContainer .linePanel .lineContainer .lineContent {
    flex: auto;
    width: 100%;
  }
  .contactMain .contactGuide .contactGuideContainer .linePanel .lineContainer .lineContent .txtBox p {
    font-size: 14px;
  }
  .contactMain .contactGuide .contactGuideContainer .linePanel .lineContainer .lineContent .orderTemplate {
    padding: 20px;
  }
  .contactMain .contactGuide .contactGuideContainer .linePanel .lineContainer .lineContent .orderTemplate p {
    font-size: 14px;
    line-height: 26px;
  }
  .contactMain .contactGuide .contactGuideContainer .linePanel .lineContainer .lineQr {
    flex: auto;
    width: 160px;
    height: 160px;
    margin: 0;
  }
  .contactMain .mailSection .mailContainer {
    padding: 64px 0;
  }
  .contactMain .mailSection .mailContainer .secTtl h2 {
    font-size: 28px;
  }
  .contactMain .mailSection .mailContainer .contactForm {
    margin: 28px 0 0;
  }
  .contactMain .mailSection .mailContainer .contactForm .form .formBox .formRow {
    flex-direction: column;
    padding: 16px 0;
  }
  .contactMain .mailSection .mailContainer .contactForm .form .formBox .formRow .dt {
    flex: auto;
    gap: 10px;
    padding: 0 0 12px;
  }
  .contactMain .mailSection .mailContainer .contactForm .form .formBox .formRow .dt .fieldLabel label {
    font-size: 16px;
  }
  .contactMain .mailSection .mailContainer .contactForm .form .formBox .formRow .dd {
    flex: auto;
    padding: 0;
  }
  .contactMain .mailSection .mailContainer .contactForm .form .formBox .formRow .dd input,
.contactMain .mailSection .mailContainer .contactForm .form .formBox .formRow .dd textarea {
    min-height: 52px;
    padding: 12px 16px;
    font-size: 16px;
    line-height: 26px;
  }
  .contactMain .mailSection .mailContainer .contactForm .form .formBox .formRow .dd textarea {
    height: 104px;
  }
  .contactMain .mailSection .mailContainer .contactForm .form .orderFields {
    margin: 36px 0 0;
  }
  .contactMain .mailSection .mailContainer .contactForm .form .orderFields .orderTitle {
    padding: 0;
  }
  .contactMain .mailSection .mailContainer .contactForm .form .orderFields .orderTitle h3 {
    font-size: 18px;
  }
  .contactMain .mailSection .mailContainer .contactForm .form .orderFields .formBox {
    margin: 20px 0 0;
  }
  .contactMain .mailSection .mailContainer .contactForm .form .privacy {
    margin: 32px 0 0;
  }
  .contactMain .mailSection .mailContainer .contactForm .form .privacy .agreeBox {
    height: 300px;
    padding: 16px;
  }
  .contactMain .mailSection .mailContainer .contactForm .form .privacy .agreeBox .box .txtBox p,
.contactMain .mailSection .mailContainer .contactForm .form .privacy .agreeBox .box .txtBox a {
    font-size: 12px;
  }
  .contactMain .mailSection .mailContainer .contactForm .form .agreeCheck {
    margin: 28px 0 0;
  }
  .contactMain .mailSection .mailContainer .contactForm .form .agreeCheck label {
    font-size: 14px;
    line-height: 2;
  }
  .contactMain .mailSection .mailContainer .contactForm .form .btnSubmitBox {
    max-width: 260px;
    margin: 40px auto 0;
  }
  .contactMain .mailSection .mailContainer .contactForm .form .btnSubmitBox .btnSubmit button {
    min-height: 56px;
    padding: 16px 20px;
    font-size: 16px;
    line-height: 24px;
    border-radius: 28px;
  }
}
@media (max-width: 1024px) {
  .contactCompleteMain .completeSection .completeContainer {
    padding: 64px 0;
  }
  .contactCompleteMain .completeSection .completeContainer .secTtl h2 {
    font-size: 24px;
  }
  .contactCompleteMain .completeSection .completeContainer .txtBox {
    margin: 28px 0 0;
    text-align: left;
  }
  .contactCompleteMain .completeSection .completeContainer .txtBox p {
    font-size: 14px;
  }
  .contactCompleteMain .completeSection .completeContainer .btnMore {
    max-width: 260px;
    margin: 36px auto 0;
  }
  .contactCompleteMain .completeSection .completeContainer .btnMore a {
    min-height: 56px;
    padding: 16px 20px;
    font-size: 14px;
    line-height: 24px;
    border-radius: 28px;
  }
}