@charset "utf-8";
/*=========================================
        　リセットcss
=========================================*/
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html,
body,
div,
span,
iframe,
h1,
h2,
h3,
h4,
p,
a,
img,
i,
ul,
li,
form,
label,
footer,
header,
nav,
section {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    vertical-align: baseline;
}
html{
    max-width: 1550px;
    margin:0 auto;
}
header{
 max-width: 1550px;
    margin:0 auto;   
}
/* HTML5 display-role reset for older browsers */
footer,
header,
nav,
section {
    display: block;
}
.content-b{
    font-family: "din-2014", sans-serif;
font-weight: 400;
font-style: normal;
}
body {
    width: 100%;
    overflow-x: hidden;
    font-family: "Noto Sans JP", sans-serif;
}

html {
    margin-top: 0 !important;
}

a:hover {
    cursor: pointer;
}
li {
    list-style: none;
}
a {
    text-decoration: none;
    color: #000;
}
p {
    font-size: 18px;
}
/*共通項目*/
.fix-flex {
    display: flex;
}
.section-title {
    font-size: 30px;
}
.y-border {
    border-bottom: solid 5px #fbf62f;
}
/*横並び*/
.fix-flex {
    display: flex;
}
/*ダブルボーターの枠*/
/*.frame-doble{
    display: flex;
    justify-content: center;
    align-items: center;
    border:solid 1px #396fa4;
    padding:5px;
    position: relative;

}
.frame-doble__inner{
    border:solid 1px #396fa4; 
    padding: 30px;
}
.frame-doble__inner *{  
    font-size: 16px;
    line-height: 150%;
    }
.frame-title{
    position: absolute;
    top: -10px;
    left:-15px;
    transform: rotate(-20deg);
    background-color:  #eff3f5;
    padding:5px;
    color: #396fa4; 
    font-weight: bold;
}*/
.movie-name {
    background-color: #396fa4;
    padding-right: 0;
    color: #fff;
    font-weight: bold;
    width: auto;
    display: inline-block;
    text-align: center;
}
/*センタリング*/
/*端末サイズ*/
.sp {
    display: none;
}
/*セクションのタイトル*/
.section-title {
    font-weight: bolder;
    font-style: normal;
    font-size: 30px;
}
.pc {
    display: block;
}
.sp {
    display: none !important;
}
@media screen and (max-width: 500px) {
    .sp {
        display: block !important;
    }
    .pc {
        display: none !important;
    }
}

/*ヘッダー*/
header {
    width: 100%;
    height: 80px;
    background-color: rgba(255, 255, 255);
    box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.4);
    position: fixed;
    top: 0;
    z-index: 1005;
}
.header-wrapper {
    width: 95%;
    height: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
a.header-logo {
    width: 50%;
    height: 100%;
    align-items: center;
    display: flex;
}
a.header-logo img {
    width: 100%;
    height: auto;
}
.header-logo-box {
    position: relative;
    margin-top: 20px;
}
#header-left-top {
    position: absolute;
    transform: translate(-50%, -100%);
    width: 70%;
    left: 50%;
    color: #fff;
    background-color: #1b2a76;
    border-radius: 100vh;
    text-align: center;
    font-size: 14px;
}
/* .header-left {
    width: 40%;
}
.header-right {
    width: 60%;
} */
.header-left p {
    width: 50%;
    font-size: 14px;
    font-weight: bold;
}
.header-right {
    justify-content: flex-end;
}

.header-right li {
    border-right: 1px solid #797979;
}

.header-right li:first-of-type {
    border-left: 1px solid #797979;
}

.header-right a {
    font-size: 2.2vmin;
    padding: 15px 1rem;
    font-weight: bold;
    color: #243c88;
}
@media screen and (max-width: 1024px) {
 .header-right a {
    font-size: 13px;
    padding: 15px 10px;
    font-weight: bold;
    color: #243c88;
    white-space: nowrap;
}
}
/*問い合わせボタン*/
.contact-button {
    background-color: #1b2a76;
    /*border-radius: 10px;*/
    color: #fff;
    align-items: center;
    justify-content: center;
    padding: 12px 25px;
    font-weight: bold;
}
@media screen and (max-width: 1100px) {
    .contact-button {
        font-size: 14px;
    }
}
.contact-button:first-child {
    margin-right: 10px;
}
.contact-button:nth-child(2) {
    margin-right: 10px;
}
.contact-button * {
    color: #fff;
    font-weight: bold;
}
.contact-button i {
    font-size: 20px;
}
.fa-store {
    margin-right: 10px;
}

/* 追加：ヘッダーラインバナー */
.header-line {
    width: 280px;
}

@media screen and (max-width: 1575px) {
    .header-line {
        width: 230px;
    }
}
.line-button2 img {
    width: 100%;
    display: block;
}

/*メインビジュアル*/
.section-mv {
    /*background-image: url(images/mv1.png);*/
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    width: 100%;
    height: 90vh;
    position: relative;
}
section.mv-slick {
    height: 90vh;
}
.mv-text {
    position: absolute;
    letter-spacing: 4px;
    writing-mode: vertical-rl;
    font-weight: bold;
    font-size: 5vmin;
    height: 100%;
    text-shadow: -4px 3px 3px rgba(255, 255, 255, 0.4);
    right: 16%;
    bottom: 100px;
    text-align: end;
    line-height: 200%;
    font-family: "a-otf-ryumin-pr6n", serif;
    font-weight: 400;
    font-style: normal;
    z-index: 1000;
}
.mv-text span {
    writing-mode: horizontal-tb;
    letter-spacing: 0px;
    line-height: 120%;
}

/*メイン追加インスタバナー*/
.banner-box {
    letter-spacing: 0em;
    width: 100%;
    cursor: pointer;
    background-color: #396fa4;
    text-align: center;
    padding: 20px 0;
}
.insta-icon {
    position: relative;
    width: 20%;
    left: 50%;
    transform: translateX(-50%);
}
.insta-icon img {
    color: #fff;
}
.insta-banner-text {
    color: #fff;
    font-weight: bold;
    padding: 20px 0;
    line-height: 1.3em;
    letter-spacing: -1.5px;
}
.store-follower {
    border-bottom: 2px solid #fff;
}
.insta-view {
    position: relative;
    width: 70%;
    background-color: #fff;
    left: 50%;
    transform: translateX(-50%);
}
.insta-view p {
    font-size: inherit;
    color: #396fa4;
    padding: 5px 0;
    font-weight: bold;
}

/*section-catch*/
.section-catch {
    width: 100%;
    padding: 100px 0;
}
.section-catch h2 {
    font-size: 35px;
    justify-content: center;
    align-items: center;
    color: #396fa4;
}
@media screen and (max-width: 1024px){
    .section-catch h2 {
        font-size: 32px;
    }
    .section-glass__change-p {
        font-size: 32px;
    }
}
/*section-needs*/
.section-wrapper {
    width: 80%;
    margin: 0 auto;
    max-width: 1400px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
/*lifestye*/
.section-lifestyle {
    padding: 100px 0 80px 0;
    background-color: #F4F4F3;
}
.section-lifestyle .section-wrapper {
    width: 80%;
    margin: 0 auto;
    max-width: 1400px;
}
.section-lifestyle .section-title {
    width: 100%;
    text-align: center;
    margin-bottom: 50px;
}
.section-lifestyle .fix-flex {
    justify-content: space-between;
    align-items: flex-end;
}
.section-lifestyle .left-content {
    width: 47%;
}
.section-lifestyle .right-content {
    width: 47%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: end;
}
.section-lifestyle .good-glass {
    font-size: 40px;
    line-height: 170%;
    text-align: center;
    margin-bottom: 50px;
    font-weight: bold;
}
   .section-lifestyle .good-glass {
        font-size: 1.7rem;
    }

.section-lifestyle .frame-doble__inner p {
    font-size: 18px;
    line-height: 170%;
}
@media screen and (max-width: 1024px) {
    .section-lifestyle .good-glass {
        font-size: 1.4rem;
        margin-bottom: 30px;
    }
    .section-lifestyle .frame-doble__inner p{
        font-size: 15px;
    }
}
@media screen and (max-width: 500px) {
.section-lifestyle .frame-doble__inner p{
        font-size: 16px;
    }
}
.interview {
    width: 100%;
    height: 260px;
}
/* .section-qa .movie-area iframe {
    width: 90%;
} */
.section-lifestyle .right-content iframe {
    width: 90%;
    height: 245px;
}

.voice {
    display: flex;
    column-gap: 50px;
    border-radius: 16px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 30px 50px;
    background-color: #ffffff;
    justify-content: space-between;
}
@media screen and (max-width:850px){
    .voice {
        display: flex;
        flex-direction: column;
    }
}
.voice__left {
    width: 35%;
    display: flex;
    /* column-gap: 50px; */
    align-items: center;
    justify-content: space-between;
}

.voice__logo {
        width: 10%;
    height: auto;
}

.voice__illustArea {
    width: 83%;
}

.voice__illust {
    width: 85%;
    height: auto;
    margin: 0 auto;
    display: block;
}

.voice__balloon {
    position: relative;
    display: inline-block;
    margin: 1.5em 0;
    padding: 7px 10px;
    min-width: 120px;
    max-width: 100%;
    color: #555;
    font-size: 16px;
    background: #fff;
    border: solid 3px #4c97cc;
    border-radius: 10px;
    box-sizing: border-box;
}

.voice__balloon:before {
    content: "";
    position: absolute;
    top: -24px;
    left: 50%;
    margin-left: -15px;
    border: 12px solid transparent;
    border-bottom: 12px solid #fff;
    z-index: 2;
}

.voice__balloon:after {
    content: "";
    position: absolute;
    top: -30px;
    left: 50%;
    margin-left: -17px;
    border: 14px solid transparent;
    border-bottom: 14px solid #4c97cc;
    z-index: 1;
}

.voice__comment {
    margin: 0;
    padding: 0;
    font-size: 20px;
    color: #4c97cc;
    font-weight: bold;
    text-align: center;
}

.voice__right {
    font-size: 2.4vmin;
    font-weight: normal;
    line-height: 200%;
    padding-top: 15px;
    width: 57%;
}
@media screen and (max-width:1200px){
    .voice__right {
        font-size: 2vmin;
    }
}
@media screen and (max-width: 1024px){
    .voice__right {
        font-size: 1.4vmin;
    }    
    .voice__comment{
        font-size: 15px;
    }
}
@media screen and (max-width:850px){
    .voice__left {
        width: 100%;
        display: flex;
        /* column-gap: 50px; */
        align-items: center;
        justify-content: space-between;
    }
    .voice__logo {
        width: 5%;
        height: auto;
    }
    .voice__illustArea {
        width: 80%;
        /* align-items: center; */
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .voice__right {
        font-size: 2.4vmin;
        font-weight: normal;
        line-height: 200%;
        padding-top: 15px;
        width: 100%;
    }
}
/*section-glass__change*/
.section-glass__change {
    padding: 80px 0 50px 0;
}
.section-glass__change .section-title {
    border: solid 3px #396fa4;
    width: 85%;
    margin: 0 auto;
    padding: 100px 0;
    text-align: center;
    align-items: center;
    justify-content: center;
    display: flex;
    border-radius: 20px;
    margin-bottom: 80px;
}
.section-glass__change .section-title img {
    width: 80px;
    height: 100%;
}
.section-glass__change .section-title img:first-child {
    margin-right: 10px;
}
.section-glass__change .section-title img:last-child {
    margin-right: 10px;
}
.section-glass__change-p {
    font-size: 40px;
}
.movie-list {
    margin: 0 auto;
}
.movie-list li {
    margin-bottom: 60px;
}
.movie-samary {
    width: 41%;
    position: relative;
    border-radius: 20px;
    box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 3%;
    background-color: #fff;
    line-height: 150%;
}
/*section-qa*/
.section-qa {
    padding: 50px 0;
    background-color: #eff3f5;
}
.section-qa .section-title {
    padding: 60px 0 70px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 40px;
    color: #396fa4;
}
.section-qa .section-title .y-border {
    padding: 0 5px;
}
.qa-list li {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 30px;
    border-bottom: solid 1px rgba(0, 0, 0, 0.1);
    padding-bottom: 30px;
    padding-left: 25px;
}
.qa-list li .interview {
    height: 340px;
}
.qa-area {
    width: 45%;
}
.movie-area {
    width: 45%;
    display: flex;
    flex-direction: column;
    align-items: end;
}
.question-text {
    position: relative;
    border: solid 4px #396fa4;
    width: 93%;
    padding: 50px 3%;
    background-color: #fff;
    display: flex;
    justify-content: center;
    font-weight: bold;
    color: #396fa4;
    font-size: 3.5vmin;
}

@media screen and (max-width: 1150px) {
    .question-text {
        font-size: 32px;
    }
}

@media screen and (max-width: 1150px) {
    .answer-text span {
        font-size: 28px;
    }
}
.section-case {
    width: 100%;
}
.section-case .section-title {
    padding: 60px 0;
    background-color: #396fa4;
    font-size: 30px;
    color: #fff;
    text-align: center;
    margin-bottom: 80px;
}
.case-list {
    width: 70%;
    margin: 0 auto;
}
.case-list li {
    margin-bottom: 50px;
}
.case-border {
    border-bottom: dashed 2px #cdcccc;
    padding-bottom: 20px;
}
.case-title {
    border: solid 4px #396fa4;
    color: #396fa4;
    padding: 5px 40px;
    font-weight: bold;
    font-size: 45px;
    font-weight: 700;
    display: inline-block;
    border-radius: 30px;
    font-family: "din-2014", sans-serif;
}
.case-text {
    font-weight: bold;
    font-size: 25px;
    margin: 20px auto;
}
.case-text p {
    font-size: 37px;
}
.case-list li img {
    width: 90%;
    height: auto;
    margin: 0 auto;
    display: block;
}
.soudan-link:first-child {
    background-color: #396fa4;
}
.soudan-link:last-child {
    background-color: #39a3a3;
}
/*web相談*/
.section-websoudan {
    background-color: #eff3f5;
    margin-top: 50px;
    padding: 80px 0;
}
.section-websoudan .frame-doble__inner * {
    font-size: 18px;
    line-height: 170%;
    font-weight: bold;
    padding: 20px;
}
.soudan-title {
    margin: 50px auto;
    text-align: center;
    font-size: 32px;
}

.section-websoudan .web-movie {
    width: 80%;
    margin: 0 auto;
    justify-content: space-between;
    align-items: flex-end;
}
.section-websoudan .left-content {
    width: 47%;
}
.section-websoudan .right-content {
    width: 47%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.section-websoudan .right-content .interview {
    height: 545px;
}
.flow-content {
    margin: 0 auto;
    border-radius: 10px;
    background-color: #fff;
    margin-top: 50px;
}
.flow-content ul {
    padding: 30px;
}
.flow-content li {
    flex-direction: column;
    align-items: flex-start;
    width: 25%;
    position: relative;
}
.flow-content li img {
    width: 50%;
    height: auto;
    margin: 20px auto;
}
.flow-content li p {
    color: #39a3a3;
    font-weight: bold;
    font-size: 16px;
    width: 90%;
}
.flow-title {
    background-color: #396fa4;
    padding: 20px 0;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    text-align: center;
    color: #fff;
    font-weight: bold;
    font-size: 40px;
}
.charge-list {
    display: flex;
    justify-content: space-between;
}
.charge-list li {
    width: 30%;
    flex-direction: column;
    /* 3人の画像開始位置を揃えるために下記削除 */
    /* justify-content: center; */
    align-items: center;
}
.flow-content .charge-list li img {
    width: 100%;
}

/* 眼鏡作製技能士(国家資格)ロゴ */
.flow-content .charge-list li .license-logo {
    width: 35%;
    margin: 0;
    position: absolute;
    top: 20px;
    left: 0;
}

.flow-content ul.charge-info {
    padding: 0;
    width: 100%;
}
.charge-info li {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    flex-direction: row;
    margin-bottom: 15px;
}
.charge-list__title {
    width: 35%;
    display: block;
    background-color: #39a3a3;
    padding: 5px 15px;
    border-radius: 15px;
    display: inline-block;
    color: #fff;
    font-weight: bold;
    text-align: center;
}
.charge-list__content {
    width: 65%;
    display: block;
    text-align: center;
}

/*御来店*/
.section-storesoudan {
    padding: 80px;
}
.section-storesoudan .store-movie {
    margin: 0 auto;
    justify-content: space-between;
}
/*ブランドと保証*/
.section-brand div.fix-flex {
    justify-content: space-between;
    margin-top: 40px;
    align-items: flex-start;
}

.section-brand img {
    width: 47%;
    height: auto;
}
#brand-border {
    border: solid 2px #39a3a3;
}
.card-border p.border-text {
    width: 80%;
    margin: 0 auto;
    font-weight: bold;
}
.brand-list li,.brand-text {
    font-weight: bold;
    margin-bottom: 10px;
    font-size: 22px;
    display: flex;
    align-items: center;
    position: relative;
}
.brand-text{
    margin-bottom: 30px;
    width: 70%;
    line-height: 170%;
}
.brand-list li:before {
    position: absolute;
    content: "";
    background-color: #39a3a3;
    width: 10px;
    height: 10px;
    left: -10px;
}
/*ニュース*/
/* .section-news{
    width: 100%;
    background-color: #efefed;
    padding: 40px 0;
    margin-bottom: 80px;
} */
.section-news {
    width: 100%;
    background-color: #efefed;
    padding: 60px 0;
    margin-top: 0px;
}
.news-wrapper {
    width: 80%;
    margin: 0 auto;
    max-width: 1400px;
}
.section-news p i {
    color: #396fa4;
    margin-right: 15px;
}
.section-news p {
    font-size: 32px;
    margin-bottom: 30px;
}
.news-content li {
   margin-bottom: 15px;
    padding-bottom: 15px;
    font-size: 17px;
    font-weight: bold;
    border-bottom: dashed 1px #BFBFBF;
    justify-content: flex-start;
}

.news-content li .title {
    width: 80%;
    color: #396fa4;
}
/*店舗情報*/
.section-lifestyle .fix-flex {
    justify-content: space-between;
    margin-bottom: 80px;
}
.section-lifestyle .section-title {
    font-size: 32px;
}

.section-store__info div.fix-flex {
    flex-direction: column;
}
.section-store__info img {
    width: 100%;
    height: 100%;
    margin: 0 auto;
    margin-bottom: 30px;
}
.store-info__area {
    width: 100%;
    display: flex;
    justify-content: space-between;
}
.store-outline {
    width: 47%;
}
.section-store__info .frame-doble {
    width: 47%;
    margin-top: 20px;
}
.store-outline li {
    display: flex;
    align-items: center;
    margin-bottom: 2px;
}
.outline-title {
    background-color: #4C97CC;
    color: #fff;
    padding: 10px 0;
    width: 25%;
    text-align: center;
}
.outline-content {
    padding: 10px 0;
    border: solid 2px #396fa4;
    background-color: #fff;
    color: #000;
    padding-left: 15px;
    font-weight: bold;
    width: 75%;
}
.section-store__info iframe {
    width: 90%;
    margin:0 auto;
    display: block;
    margin-top: 40px;
}
@media screen and (max-width:850px){
    .section-lifestyle .section-title {
        font-size: 22px;
    }    
}

/*コンタクト*/

.wpcf7-form {
    width: 100%;
}
.wpcf7-form li {
    margin-bottom: 2px;
}

/* iOSでのデフォルトスタイルをリセット */
input[type="submit"] {
    border-radius: 0;
    -webkit-box-sizing: content-box;
    -webkit-appearance: button;
    appearance: button;
    border: none;
    box-sizing: border-box;
    cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration {
    display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
    outline-offset: -2px;
}
input[type="submit"] {
    display: block;
    width: 30%;
    margin: 0 auto;
    margin-top: 50px;
    padding: 15px 0;
    font-size: 16px;
    background-color: #fff;
    border: solid 2px #396fa4;
    color: #396fa4;
}
/*.checkbox input[type='checkbox']*/
span.wpcf7-form-control-wrap {
    padding-left: 0;
}
/*セレクト*/
/*フッター*/
footer {
    background-color: #4C97CC;
    padding: 20px 0 10px 0;
    margin-top: 80px;
}
.footer-wrapper div.fix-flex {
    width: 100%;
}
.footer-wrapper {
    width: 85%;
    height: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
}
a.footer-logo {
    width: 30%;
    height: 100%;
    align-items: center;
    display: flex;
}
a.footer-logo img {
    width: 100%;
    height: auto;
}
.footer-left,
.footer-right {
    width: 50% !important;
}
.footer-left p {
    font-size: 14px;
    font-weight: bold;
    color: #fff;
}
.footer-right {
    justify-content: space-around;
    align-items: flex-end;
    flex-direction: column;
}
footer .footer-right a.contact-button.fix-flex {
    width: 60%;
    font-size: 20px;
    padding: 15px 2.5%;
}
footer .footer-right a.contact-button{
    margin-right: 0;
    justify-content: space-between;
    border: solid #fff 2px;
}
footer .footer-right a.contact-button img{
    width: 12%;
}
footer .footer-right a.contact-button img:last-child{
    width: 4%;
}
footer .footer-right a.contact-button:first-child{
    background-color: #3A6D9F;
}
footer .footer-right a.contact-button:last-child{
    background-color: #38A1A1;
}
.copy {
    text-align: center;
    font-size: 15px;
    color: #fff;
    font-weight: bold;
    padding-top: 10px;
    width: 85%;
    margin: 0 auto;
    margin-top: 10px;
}

@media screen and (max-width: 1023px) {
    .mv-text {
        bottom: 70px;
        font-size: 4vmin;
    }
    iframe {
        width: 100% !important;
    }
    .section-mv {
        /*background-image: url(images/mv1.png);*/
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        width: 100%;
        height: 50vh;
        position: relative;
    }
    section.mv-slick {
        height: 50vh;
    }
    .section-lifestyle .section-wrapper {
        width: 90%;
        margin: 0 auto;
        max-width: 1400px;
    }
    .section-lifestyle .good-glass {
        font-size: 22px;
    }
    .section-title {
        font-weight: bolder;
        font-style: normal;
        font-size: 25px;
    }
    .movie-list {
        width: 95%;
        margin: 0 auto;
    }
    .movie-name {
        width: 40%;
    }
    p {
        font-size: 16px;
    }
    .recomend-message {
        font-size: 18px;
        width: 90%;
    }
    .section-websoudan .web-movie {
        width: 90%;
    }
    .flow-content {
        width: 90%;
    }
    .section-contact {
        width: 90%;
    }
    section.section-storesoudan .section-wrapper {
        width: 100%;
    }
    .section-storesoudan {
        padding: 40px;
    }
    .section-storesoudan .store-movie {
        align-items: center;
    }
    .section-store__info div.fix-flex {
        justify-content: space-between;
        align-items: center;
        flex-direction: column;
    }
    .section-store__info img {
        width: 100%;
        height: 450px;
        object-fit: cover;
        margin: 0 auto;
        margin-bottom: 30px;
    }
    .store-info__area {
        width: 100%;
    }
    .catch-text h2 {
        font-size: 24px;
    }
}
@media screen and (max-width: 850px) {
    .mv-text {
        font-size: 27px;
        bottom: 55px;
    }
    .section-catch h2 {
        font-size: 22px;
        justify-content: center;
        align-items: center;
        color: #396fa4;
    }
    .section-catch {
        padding: 25px 0;
    }
    .section-title {
        font-weight: bolder;
        font-style: normal;
        font-size: 23px;
    }
    .section-store__info #section-parking-title {
        font-weight: bolder;
        font-style: normal;
        font-size: 23px;
    }
    .section-lifestyle .fix-flex {
        justify-content: space-between;
        flex-direction: column-reverse;
    }
    .section-lifestyle .left-content {
        width: 80%;
        margin: 0 auto;
        margin-top: 30px;
    }
    .section-lifestyle .good-glass {
        font-size: 20px;
        line-height: 170%;
        text-align: center;
        margin-bottom: 15px;
    }
    .section-lifestyle .right-content {
        width: 80%;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .movie-name {
        width: 30%;
    }
    .interview {
        width: 100%;
        height: 275px;
    }
    .qa-list li .interview {
        width: 100%;
        height: 265px;
    }
    .section-glass__change .section-title img {
        width: 60px;
        height: 100%;
    }
    .movie-samary {
        width: 80%;
    }
    .movie-area {
        width: 85%;
        margin-top: 40px;
    }
    .section-qa .section-title {
        font-size: 20px;
    }
    .section-qa {
        padding: 20px 0;
        background-color: #eff3f5;
    }
    .qa-list li {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 50px;
        flex-direction: column;
        padding-left: 0px;
    }
    .qa-area {
        width: 80%;
        margin-bottom: 30px;
    }
    .section-case .section-title {
        padding: 40px 0;
        background-color: #396fa4;
        color: #fff;
        text-align: center;
        margin-bottom: 50px;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .case-list {
        width: 85%;
        margin: 0 auto;
    }
    .soudan-link {
        height: 200px;
        font-size: 20px;
    }
    .soudan-title {
        width: 80%;
        margin: 0 auto;
        text-align: center;
        padding: 30px 0;
        border: solid 3px #396fa4;
        margin-bottom: 60px;
    }
    .recomend-message {
        font-size: 16px;
        width: 100%;
    }
    .section-websoudan .web-movie {
        width: 90%;
        flex-direction: column-reverse;
    }
    .section-websoudan .left-content {
        width: 80%;
        margin: 0 auto;
    }
    .flow-content ul {
        padding: 30px;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .flow-content li {
        flex-direction: column;
        align-items: flex-start;
        width: 44%;
        position: relative;
        margin-bottom: 30px;
    }
    .flow-content li img {
        width: 55%;
        height: auto;
        /* margin: 20px auto; */
        /* 眼鏡作製技能士(国家資格)ロゴのために左右のマージン0に変更 */
        margin: 20px 0;
    }
    .flow-content li p {
        color: #39a3a3;
        font-weight: bold;
        font-size: 16px;
        width: 100%;
    }
    .tantou li {
        width: 100%;
        flex-direction: row;
        justify-content: space-between;
    }
    .flow-content ul.charge-info {
        padding: 0;
        width: 47%;
    }
    .flow-content .charge-list li img {
        width: 47%;
    }

    /* 眼鏡作製技能士(国家資格)ロゴ */
    .flow-content .charge-list li .license-logo {
        width: 17%;
    }

    ul.charge-info li {
        display: flex;
        flex-direction: column;
    }
    .charge-list__title {
        margin: 10px auto;
        width: 80%;
        display: block;
        background-color: #39a3a3;
        padding: 10px 0px;
        border-radius: 25px;
        display: inline-block;
        color: #fff;
        font-weight: bold;
        text-align: center;
    }
    .charge-list__content {
        width: 100%;
        font-weight: bold;
        font-size: 18px;
        display: block;
        text-align: center;
    }
    .section-storesoudan .store-movie {
        align-items: center;
        flex-direction: column-reverse;
    }
    .section-brand .section-title {
        font-size: 19px;
    }
    .section-brand {
        background-color: #eff3f5;
        padding: 60px;
        margin-top: 80px;
        position: relative;
    }
    .section-brand div.fix-flex {
        justify-content: space-between;
        margin-top: 30px;
        flex-direction: column;
    }
    .section-brand img {
        width: 100%;
        height: auto;
        margin: 0 auto;
        margin-bottom: 50px;
    }
    .card-border {
        width: 100%;
        margin: 0 auto;
    }
    .section-brand div.fix-flex.hosyo {
        flex-direction: column-reverse;
        margin-top: 70px;
    }
    .news-content li {
        margin-bottom: 25px;
        font-size: 17px;
        font-weight: bold;
        flex-direction: column;
    }
    .news-content li .title {
        width: 100%;
        color: #396fa4;
    }
    .news-content li .date {
        width: 100%;
        margin-bottom: 10px;
    }
    .section-store__info {
        width: 90%;
    }
    .section-store__info div.fix-flex {
        width: 95%;
        justify-content: space-between;
        align-items: center;
        flex-direction: column;
    }
    .section-lifestyle .right-content iframe {
        width: 100%;
        height: 310px;
    }
    .header-left p {
        font-size: 13px;
        font-weight: bold;
        margin-left: 10px;
    }
    .header-logo-box {
        margin-top: 0;
    }
    #header-left-top {
        display: none;
    }
    a.header-logo {
        width: 45%;
        height: 100%;
        align-items: center;
        display: flex;
    }
    .contact-button {
        background-color: #1b2a76;
        border-radius: 10px;
        color: #fff;
        align-items: center;
        justify-content: center;
        padding: 12px 25px;
        font-weight: bold;
        font-size: 12px;
    }
    .footer-left p {
        font-size: 13px;
        font-weight: bold;
        margin-left: 10px;
    }
    a.footer-logo {
        width: 45%;
        height: 100%;
        align-items: center;
        display: flex;
    }
    .copy {
        text-align: center;
        font-size: 12px;
    }
    .store-info__area {
        width: 100%;
        display: flex;
        flex-direction: column;
    }
    .store-outline {
        width: 100%;
    }
    .section-store__info .frame-doble {
        width: 100%;
        margin-top: 30px;
    }
    .section-lifestyle {
        padding: 50px 0 80px 0;
        background-color: #eff3f5;
    }
}
@media screen and (max-width: 500px) {
    .section-news {
        margin-top: 90px;
    }
    .section-websoudan .frame-doble__inner * {
        font-size: 15px;
        line-height: 170%;
        font-weight: bold;
        padding: 0px;
    }
    .contact-button:first-child {
        margin-right: 0px;
    }
    .header-right {
        display: none;
    }
    .header-left {
        width: 100%;
        justify-content: space-between;
    }
    .section-mv {
        /*background-image: url(images/mv1.png);*/
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        width: 100%;
            margin-top: 80px;
        position: relative;
    }
    section.mv-slick {
        height: auto;
    }
    .mv-text {
        display: inline;
        font-size: 21px;
        bottom: 55px;
        height: 100%;
    }
    .section-catch h2 {
        font-size: 17px;
        text-align: center;
        justify-content: center;
        align-items: center;
        color: #396fa4;
    }
    .catch-text {
        width: 90%;
        margin: 0 auto;
    }
    .section-title {
        font-weight: bolder;
        font-style: normal;
        font-size: 16px;
    }
    .section-store__info #section-parking-title {
        font-weight: bolder;
        font-style: normal;
        font-size: 16px;
    }
    .movie-name {
        width: 45%;
        font-size: 20px;
        padding: 0;
        margin-bottom: 10px;
    }
    .right-content {
        width: 100% !important;
    }
    .interview {
        width: 100%;
        height: 155px;
    }
    .left-content {
        width: 100% !important;
    }
    .section-lifestyle .good-glass {
        font-size: 20px;
        line-height: 170%;
        text-align: center;
        margin-bottom: 30px;
    }
    .section-glass__change .section-title {
        font-size: 12px;
        width: 100%;
        margin-bottom: 50px;
    }
    .section-glass__change .section-title img {
        width: 25px;
        height: 100%;
    }
    .movie-area {
        width: 95%;
        margin-bottom: 40px;
    }
    .section-qa .movie-area {
        margin-bottom: 0px;
    }
    .section-qa .movie-area iframe {
        width: 100%;
    }
    .movie-samary {
        width: 90%;
    }
    .movie-samary {
        padding: 30px 6%;
    }
    .section-qa .section-title {
        font-size: 17px;
        text-align: center;
    }
    .qa-list {
        width: 95%;
        margin: 0 auto;
    }
    .qa-area {
        width: 97%;
        margin-bottom: 30px;
    }
    .section-case .section-title {
        padding: 40px 3%;
        flex-direction: column;
        background-color: #396fa4;
        color: #fff;
        text-align: center;
        margin-bottom: 50px;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 18px;
    }
    .section-case p {
        text-align: center;
        font-weight: bold;
        font-size: 16px;
    }
    .case-title {
        border: solid 2px #396fa4;
        color: #396fa4;
        padding: 5px 30px;
        font-weight: bold;
        font-size: 25px;
        display: inline-block;
        border-radius: 30px;
    }
    .case-border {
        border-bottom: dashed 2px #cdcccc;
        padding-bottom: 10px;
    }
    .case-text {
        font-weight: bold;
        font-size: 25px;
        width: 100%;
        margin: 10px auto 20px auto;
    }
    .section-glass__change {
        width: 95%;
        margin: 0 auto;
    }
    .contact-lead {
        width: 90%;
        margin: 0 auto;
    }
    .fix-flex.link-flex {
        flex-direction: column;
        margin-top: 40px;
    }
    .soudan-link {
        width: 100%;
        height: 180px;
        margin-top: 0px;
        font-size: 17px;
    }
    .section-websoudan {
        background-color: #eff3f5;
        margin-top: 50px;
        padding: 60px 0;
    }
    .soudan-title {
        width: 100%;
        margin: 0 auto;
        text-align: center;
        padding: 30px 0;
        border: 0;
        margin-bottom: 30px;
    }
    .recomend-message {
        width: 96%;
        padding: 30px 2%;
        margin-bottom: 50px;
    }
    .section-websoudan .web-movie {
        width: 100%;
        flex-direction: column-reverse;
    }
    .section-websoudan .right-content,
    .section-websoudan .left-content {
        width: 93% !important;
    }
    .section-websoudan .message {
        font-size: 20px;
        line-height: 170%;
        text-align: center;
        margin-bottom: 35px;
    }
    .flow-content {
        width: 95%;
    }
    .flow-title {
        font-size: 18px;
    }
    .flow-content li {
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
        position: relative;
        margin-bottom: 80px;
    }
    .flow-content li img {
        width: 30%;
        height: auto;
        margin: 20px auto;
    }
    .flow-content li:last-child {
        margin-bottom: 0;
    }
    .flow-content .charge-list li img {
        width: 100%;
    }

    /* 眼鏡作製技能士(国家資格)ロゴ */
    .flow-content .charge-list li .license-logo {
        width: 35%;
    }
    /* 眼鏡作製技能士(国家資格)のbrタグをnone */

    .flow-content ul.charge-info {
        padding: 0;
        width: 100%;
    }
    .flow-content li .charge-info li {
        margin-bottom: 10px;
    }
    .charge-list__title {
        width: 90%;
    }
    ul.charge-list li {
        margin-bottom: 15px;
    }
    .wpcf7-form li {
        display: flex;
        margin-bottom: 5px;
        flex-direction: column;
    }
    input[type="submit"] {
        display: block;
        width: 70%;
    }
    .section-storesoudan .store-movie {
        width: 95%;
    }
    .section-brand .section-title {
        font-size: 16px;
    }
    .section-brand {
        padding: 30px 20px;
        margin-top: 60px;
        width: 95%;
    }
    .card-title {
        display: inline-block;
        width: auto;
        position: absolute;
        font-weight: bold;
        top: -25px;
        padding: 0 10px;
        border-bottom: solid 5px #fff;
        z-index: 3;
        font-size: 17px;
    }
    .brand-list li {
        font-weight: bold;
        margin-bottom: 10px;
        font-size: 16px;
        display: flex;
        align-items: center;
        position: relative;
        padding-left: 15px;
    }
    .news-content li .date {
        width: 100%;
        margin-bottom: 10px;
    }
    .section-store__info img {
        width: 100%;
        height: 230px;
        object-fit: cover;
        margin: 0 auto;
        margin-bottom: 30px;
    }
    .store-outline li {
        display: flex;
        align-items: center;
        margin-bottom: 2px;
        flex-direction: column;
    }
    .outline-title {
        background-color: #396fa4;
        color: #fff;
        padding: 10px 0;
        width: 100%;
    }

    .outline-content {
        padding: 10px 0;
        border: solid 2px #396fa4;
        background-color: #fff;
        color: #000;
        padding-left: 15px;
        font-weight: bold;
        width: 95%;
    }
    .section-store__info iframe {
        width: 100%;
        height: 300px;
        margin-top: 40px;
    }
    .footer-right {
        display: none;
    }
    .footer-left {
        width: 100% !important;
        justify-content: space-between;
    }
    footer {
        background-color: #396fa4;
        padding: 20px 0 10px 0;
        margin-top: 50px;
    }
    .section-store__info .section-title {
        font-size: 16px;
    }
    .recomend-message {
        background-color: #396fa4;
        text-align: center;
        border-radius: 20px;
    }
    .section-storesoudan {
        padding: 40px 20px;
    }
    .section-websoudan .right-content .interview {
        width: 100%;
        height: 190px;
    }
    .qa-list li .interview {
        height: 190px;
    }
    .section-lifestyle .right-content iframe {
        width: 100%;
        height: 190px;
    }
}

@media screen and (max-width: 400px) {
    .section-title {
        font-weight: bolder;
        font-style: normal;
        font-size: 15px;
    }
    .section-store__info #section-parking-title {
        font-weight: bolder;
        font-style: normal;
        font-size: 15px;
    }
    .section-wrapper {
        width: 95%;
    }
    .qa-list li .interview {
        height: 185px;
    }
    .section-lifestyle .right-content iframe {
        width: 100%;
        height: 175px;
    }
    .frame-doble__inner * {
        font-size: 15px;
        line-height: 150%;
    }
    p {
        font-size: 15px;
    }
    .recomend-message {
        font-size: 15px;
        width: 94%;
    }
    .news-content li {
        margin-bottom: 25px;
        font-size: 15px;
        font-weight: bold;
        flex-direction: column;
    }
    .footer-left p {
        font-size: 12px;
    }
}
@media screen and (max-width: 320px) {
    .footer-left p {
        font-size: 10px;
    }
    .header-left p {
        font-size: 11px;
        font-weight: bold;
        margin-left: 10px;
    }
    .mv-text {
        font-size: 20px;
        bottom: 40px;
    }
    .section-lifestyle .good-glass {
        font-size: 14px;
        line-height: 170%;
        text-align: center;
        margin-bottom: 30px;
    }
    .frame-doble__inner {
        border: solid 1px #396fa4;
        padding: 20px;
    }
    .frame-doble__inner * {
        font-size: 14px;
        line-height: 150%;
    }
    .section-lifestyle {
        padding: 100px 0 60px 0;
        background-color: #eff3f5;
    }
    .section-glass__change .section-title {
        font-size: 13px;
        width: 100%;
        margin-bottom: 50px;
    }
    .section-websoudan .message {
        font-size: 17px;
        line-height: 170%;
        text-align: center;
        margin-bottom: 35px;
    }
    .charge-list__content {
        width: 100%;
        font-weight: bold;
        font-size: 15px;
        display: block;
        text-align: center;
    }
    .charge-list__title {
        width: 90%;
        font-size: 15px;
    }
    .section-storesoudan {
        padding: 40px 20px;
    }
}
p.insta-text {
    margin-top: 20px;
    margin-bottom: 10px;
    font-size: 16px;
}
footer .footer-left a.contact-button.fix-flex {
    width: 35%;
}

i.fab.fa-instagram {
    font-size: 30px;
}
a.insta-banner,
a.covid-19 {
    width: 250px;
    height: auto;
    position: absolute;
    bottom: 0px;
    left: 2%;
    cursor: pointer;
}
a.insta-banner:hover {
    cursor: pointer;
}
a.insta-banner img {
    width: 100%;
    cursor: pointer;
}
@media screen and (max-width: 850px) {
    a.insta-banner {
        width: 170px;
        height: auto;
        position: absolute;
        bottom: 2%;
        left: 2%;
        cursor: pointer;
    }
}
@media screen and (max-width: 500px) {
    a.insta-banner {
        width: 45%;
        height: auto;
        bottom: 1%;
        right: 5%;
        cursor: pointer;
    }
    footer .footer-left a.contact-button.fix-flex {
        width: 70%;
        margin: 0 auto;
        font-size: 15px;
    }
    p.insta-text {
        margin-top: 20px;
        margin-bottom: 10px;
        font-size: 14px;
        text-align: center;
    }
}

/*注意事項*/
@media screen and (max-width: 320px) {
    .section-mv {
        height: 470px;
    }
}
section.section-news a.news-link {
    color: #75879a;
    font-weight: bold;
    text-align: right;
    width: 100%;
    display: block;
    margin-top: 40px;
    text-decoration: underline;
}

/*電話リンク*/
@media screen and (max-width: 400px) {
    p.brand-attention {
        font-size: 13px;
        width: 75%;
        font-weight: bold;
        margin: 0 auto;
    }
}
@media screen and (max-width: 500px) {
    .section-catch {
        padding-top: 30px;
    }
}

/*駐車場*/
#section-parking .fix-flex {
    flex-direction: row;
    justify-content: space-between;
}

#section-parking img {
    width: 47%;
    height: 100%;
}

/* 追加：フッターラインバナー非表示 */
.footer-line {
    display: none;
}

@media screen and (max-width: 1023px) {
    #section-parking img {
        width: 47%;
    }
}
@media screen and (max-width: 850px) {
    #section-parking p {
        margin-bottom: 20px;
        width: 47%;
        line-height: 120%;
    }
}
@media screen and (max-width: 500px) {

    #section-parking .fix-flex {
        flex-direction: column;
        justify-content: space-between;
    }
    #section-parking p,
    #section-parking img {
        width: 100%;
    }
    #section-parking img {
        margin-bottom: 0;
    }
}

/*ラインバナー*/
.section-line {
    margin: 70px 0;
    margin-bottom: 30px;
}
.section-line a {
    display: block;
    width: 75%;
    margin: 0 auto;
}
.section-line a img {
    display: block;
    width: 100%;
    height: auto;
}
@media screen and (max-width: 500px) {
    .section-line a {
        display: block;
        width: 90%;
        margin: 0 auto;
    }
    .section-line {
        margin: 50px 0;
        margin-bottom: 30px;
    }
}

/*追加*/
@media screen and (max-width: 1023px) {
    .header-right.fix-flex {
        display: none;
    }

    /* 追加：フッターラインバナー */
    .footer-line {
        display: block;
        max-width: 450px;
        width: 100%;
        position: fixed;
        z-index: 6;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
    }
    .line-button2 img {
        width: 100%;
        display: block;
    }
}

/* ハンバーガーメニュー */
#nav {
    position: absolute;
    height: 100vh;
    width: 100%;
    left: 100%;
    top: 0;
    background: #396fa4;
    transition: 0.7s;
}
#nav ul {
    padding-top: 80px;
    display: flex;
    flex-wrap: wrap;
}
#nav ul li {
    flex-basis: 100%;
    list-style-type: none;
    font-size: 20px;
    border-bottom: solid 1px rgba(255, 255, 255, 0.8);
}
#nav ul a::after {
    position: absolute;
    content: url(./images/menu-tri.png);
    color: #fff;
    font-weight: bold;
    top: 50%;
    right: -50px;
    transform: translateY(-50%) scale(0.3);
}
#nav ul a {
    position: relative;
    display: inline-block;
    text-decoration: none;
    color: #fff;
    margin: 0 10px;
    padding: 30px 0;
    transition: 0.5s;
    font-weight: bold;
    width: 70%;
}

#hamburger {
    display: block;
    position: absolute;
    top: 25px;
    right: 10px;
    width: 40px;
    height: 30px;
    cursor: pointer;
    transition: 1s;
}
.inner_line {
    display: block;
    position: absolute;
    left: 0;
    width: 40px;
    height: 3px;
    background-color: #000;
    transition: 1s;
    border-radius: 4px;
}
#line1 {
    top: 0;
}
#line2 {
    top: 13px;
}
#line3 {
    bottom: 0px;
}
.nav-icons {
    justify-content: center;
    margin: 30px 0;
}
.nav-icons a {
    margin: 0 20px;
}
.nav-icons img {
    width: 50px;
}
.nav-icons i {
    box-sizing: border-box;
    font-size: 55px;
}
.nav-icons .fab,
.nav-icons .fas {
    color: #fff;
}

/* header-rightメニュー */
@media screen and (max-width: 1023px) {
    #header-left-top {
        display: none;
    }
    .header-logo-box {
        margin-top: 0;
    }
}
.header-right ul {
    display: flex;
    align-items: center;
    margin-right: 10px;
}
.header-right li {
    font-weight: bold;
    font-size: 15px;
}
footer a.insta-banner {
    position: relative;
    bottom: unset;
    /* width: 30%; */
    left: unset;
    display: block;
    margin-top: 20px;
}
.footer-left p.insta-banner-text {
    color: red;
    font-size: 16px;
    text-align: left;
}
/* footer-menu */
.footer-menu {
    width: 85%;
    margin: 10px auto;
}
.footer-menu ul {
    display: flex;
    justify-content: center;
}
.footer-menu a {
    padding: 5px 20px;
    color: #fff;
    font-weight: bold;
}
.footer-menu .rborder {
    border-right: #243C88 solid 1px;
}
.footer-menu li:first-child .rborder {
    border-left: #243C88 solid 1px;
}
@media screen and (max-width: 500px) {
    .footer-menu {
        width: 100%;
    }
    .footer-menu a {
        padding: 0 5px;
    }
}

/* section-group */
.group-wrapper {
    width: 80%;
    margin: 0 auto;
    justify-content: space-around;
}
.group-block {
    display: block;
    width: 40%;
}
.group-banner-child {
    border: solid 1px #396fa4;
}
.group-banner-hearing {
    border: solid 1px #cd5c5c;
}
.group-block img {
    width: 30%;
}

@media screen and (max-width: 500px) {
    .group-wrapper {
        display: block;
    }
    .group-block {
        width: 90%;
        margin: 20px auto;
    }
    .insta-banner-text {
        font-size: 12px;
    }
    .insta-view {
        font-size: 13px;
        padding: 0 10px;
    }
    .group-wrapper {
        width: 95%;
        margin: 0 auto;
        justify-content: space-around;
    }
    .nav-icons.fix-flex i {
        font-size: 45px;
    }
    .nav-icons.fix-flex img {
        width: 40px;
    }
    .nav-icons.fix-flex i:last-child {
        font-size: 35px;
    }
}

/* ==============================================
            2023/04/10~ 細川追加分
  ============================================== */
/*共通*/
.sp-br {
    display: none;
}
/* =========== mv ============ */
/* 40歳からのメガネ作りは~ */
.mv-text {
    text-shadow: unset;
    line-height: unset;
}
.mv-text-box {
    background-color: #243C88;
    color: white;
    position: absolute;
    text-align: center;
    font-size: min(56px, 4vh);
    padding: 15px;
    line-height: 100%;
}
.mv-text-box_1 {
    bottom: 10%;
}
.mv-text-box_2 {
    bottom: 5%;
    right: calc(100% + 30px);
}
@media screen and (max-width: 1024px) {
    .section-mv {
        height: 45vh;
    }
    .mv-text{
        bottom: 30px;
    }
    .mv-text-box{
        font-size: 3vmin;
    }
}
/* バナー*/
.banner-box {
    background-color: white;
    border: 2px solid #243C88;
    padding: 10px 0;
    transition: 0.3s;
}
.banner-box:hover {
    transition: 0.3s;
}
a.covid-19 {
    bottom: calc(7% + 147px);
    width: 350px;
}
.covid-banner-box {
    display: flex;
    justify-content: space-around;
    align-items: center;
    border-radius: 10px;
}
.covid-images {
    width: 3%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.covid-images img {
    width: 100%;
}
.attention {
    width: 10%;
}
.countermeasure {
    width: 60%;
    font-size: 17px;
    text-align: left;
}
a.insta-banner {
    width: 350px;
    bottom: 7%;
}
.insta-banner-box {
    padding: 0;
}
.insta-banner-text {
    color: black;
}
.insta-icon {
    position: unset;
    transform: unset;
    width: 100%;
    display: flex;
    justify-content: space-around;
    align-items: center;
}
.insta-banner-text {
    color: red;
}
.store-follower {
    color: #243C88;
    font-size: 30px;
}
.follwer_under {
    font-size: 30px;
    color: #243C88;
}
.number1 {
    font-size: 50px;
}
a.insta-banner .insta-icon img {
    width: 15%;
    height: 15%;
}
.insta-view {
    background-color: #243C88;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}
a.insta-banner .insta-view img {
    width: 3%;
    height: auto;
    margin-left: 5%;
}
.insta-view p {
    color: white;
}
/* =========== バナー ============ */
/* 共通設定*/
.group-wrapper {
    width: 80%;
    margin: 30px auto;
    justify-content: space-around;
}
.group-block {
    width: 35%;
}
.group-block img {
    width: 50%;
}
/*子供メガネ*/
/*補聴器*/
/*.group-banner-hearing p.hearing-banner-title{
    margin-top: 30px;
 }*/
/* =========== バナー2 ============ */
.group-block img.banner2 {
    display: block;
    width: 100%;
}
/* =========== section-news ============ */
.section-news i {
    display: none;
}
.section-title {
    text-align: center;
}
.news-content li .date {
    width: auto;
    margin-right: 20px;
    background-color: #243C88;
    color: white;
    font-weight: lighter;
    text-align: center;
        padding: 5px 10px;
    border-radius: 5px;
    letter-spacing: 1.2px;
}
.news-content li .title {
    color: #243C88;
    text-decoration: underline;
    font-weight: lighter;
}
section.section-news a.news-link {
    color: #243C88;
    text-decoration: none;
}
/* =========== section-catch ============ */
.section-catch {
    background-color: #243C88;
}
.section-catch h2 {
    color: white;
    letter-spacing: 3px;
}
.section-catch h2 span,
.section-title span.megane-change {
    color: #ffff00;
    text-decoration: underline 2.5px wavy #ffff00;
}
/* =========== section-lifestyle ============ */
.section-lifestyle {
    padding: 50px 0;
}
.section-lifestyle .section-title {
    color: #243C88;
}
.section-lifestyle .good-glass {
    text-align: left;
}
.movie-name {
    background-color: unset;
    text-align: right;
    color: #243C88;
    margin-top: 10px;
}
.movie-name span {
        background-color: #243C88;
    color: white;
    padding: 2px 15px;
    border-radius: 5px;
    margin-right: 10px;
}
/* =========== section-glass__change ============ */
.section-glass__change {
    background-color: #f2f2f1;
    padding: 0;
}
.section-glass__change .section-title {
    width: 100%;
    border: unset;
    border-radius: unset;
    background-color: #243C88;
    color: white;
    margin-bottom: unset;
}
/*movie-list*/
.movie-left {
    display: block;
    width: 50%;
}
.movie-list li {
    margin-top: 40px;
}
.movie-samary {
    box-shadow: unset;
    width: auto;
    background-color: #f2f2f1;
    font-size: 19px;
}
li.movie-block .fix-flex {
    align-items: flex-end;
    justify-content: space-between;
}
/*movie-block共通*/
/*movie-block1*/
.problems-box {
    display: flex;
    align-items: center;
    margin-bottom: 40px;
}
.problems-box .title {
    background-color: unset;
    color: #243C88;
    text-align: left;
    padding: unset;
    font-size: 3.7vmin;
}
@media screen and (max-width: 1024px){
    .problems-box .title {
        font-size: 2.7vmin;
    }
}
@media screen and (max-width: 1024px){
.problems-box {
    display: flex;
    align-items: center;
    margin-bottom: 30px;
}
}
.problems {
    margin-right: 20px;
}
.problems p {
    background-color: #243C88;
    width: 7vw;
    height: 7vw;
    max-width: 100px;
    max-height: 100px;
    border-radius: 50%;
    color: white;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.content-a {
    font-size: 2vmin;
}

.content-b {
    font-weight: 700;
    font-size: 6vmin;
    line-height: 90%;
    font-family: "din-2014", sans-serif;
}
/*movie-block2*/
/* =========== section-qa============ */
.section-qa {
    background-color: #e5ecf7;
    padding-top: 0;
}
.y-border {
    border-bottom: unset;
}
.section-qa .section-title {
    color: #243C88;
}
/*qa-list*/
.qa-list {
    display: flex;
    justify-content: space-between;
    column-gap: 70px;
}
.qa-list li {
    display: block;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.15);
    border-radius: 10px;
    padding: 25px;
    background-color: white;
    width: calc(50% - 35px);
}
.qa-area,
.section-qa .movie-area {
    width: 100%;
}
.q-wrap {
    display: flex;
    justify-content: space-around;
    align-items: center;
    width: 100%;
    padding-bottom: 15px;
}
.q-wrap img {
    width: 15%;
    height: auto;
}
.q-wrap p {
    width: 80%;
    padding-bottom: unset;
    padding: unset;
}
.question-text {
    border: unset;
    color: #243C88;
    padding: 0 3%;
    display: block;
}
.answer-text {
    background-color: unset;
    color: #3e84c0;
    border: solid 3px #3e84c0;
    position: relative;
    padding:10px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
    text-align: center;
    display: block;
    width: 80%;
    margin:0 auto;
    margin-bottom: 50px;
    font-weight: 500;
}
.answer-text::before {
    content: "";
    position: absolute;
    top: 102.5%;
    left: 50%;
    margin-left: -10px;
    border: 10px solid transparent;
    border-top-color: #3e84c0;
}
.answer-text::after {
    content: "";
    position: absolute;
    top: 99%;
    left: 50%;
    margin-left: -10px;
    border: 10px solid transparent;
    border-top-color: #fff;
    /*  border-bottom-color: #3e84c0;*/
}
/*↓以前の編集内容の打ち消し設定↓*/
.answer-text span {
    position: unset;
    display: block;
    width: auto;
    height: auto;
    border: unset;
    background-color: unset;
    border-radius: unset;
    color: #3e84c0;
    font-size: 3.5vmin;
}
.answer-sentence1 {
    font-size: 1.5pc;
}
/* =========== section-case ============ */
.section-case .section-title {
    color: #243C88;
    background-color: unset;
    text-align: center;
    font-size: 40px;
    margin-bottom: unset;
}
.section-case p {
    text-align: left;
}
/*case-list*/
.case-list {
    width: 90%;
    margin: 0 auto;
    max-width: 1400px
}
.case-list li {
    display: flex;
}
.case-list > li:nth-of-type(2) {
    column-gap: 44px;
    flex-direction: row-reverse;
}
.case-border {
    position: relative;
    width: 47%;
    border-bottom: unset;
}
.case-title {
    color: #3e84c0;
    border: unset;
    display: block;
    border-radius: unset;
    padding: unset;
}
div.case-text {
    color: white;
    text-align: left;
    position: absolute;
}
.case-text p {
    margin-bottom: 10px;
    background-color: #3e84c0;
    padding: 3px;
    letter-spacing: 0.07em;
    display: inline-block;
        width: auto;
    white-space: nowrap;
}

.case-text div {
        font-size: 18px;
    color: black;
    margin-top: 20px;
}

.case-text_yellow {
    color: #ffff00;
}
.case-list li img {
    width: 53%;
    height: auto;
    display: block;
    border-radius: 5px;
}
@media screen and (max-width: 1024px){
    .content-a {
        font-size: 1.1vmin;
    }
    .content-b {
        font-weight: 700;
        font-size: 3.5vmin;
    }
    .section-qa .section-title{
        font-size: 27px;
    }
    .question-text {
        font-size: 23px;
    }
    .answer-text span{
        font-size: 2vmin;
    }
    .section-case .section-title {
        font-size: 30px;
    }
    .case-text p {
        font-size: 27px;
    }
    .case-text div {
        font-size: 16px;
    }
}

@media screen and (max-width: 1150px) {
    .case-list li img {
        width: 48%;
    }
}
/*contact-lead*/
.section-case p.contact-lead {
    text-align: center;
    font-weight: bold;
    font-size: 40px;
}

@media screen and (max-width: 1150px) {
    .section-case p.contact-lead {
        margin-top: 140px;
    }
    .case-text div {
        margin-top: 20px;
    }
}

.section-case p.contact-lead span {
    padding: 10px;
    color: white;
    font-weight: bold;
    padding: 0 10px;
}
.section-case p.contact-lead span:nth-of-type(1) {
    background-color: #2f9291;
    margin-right: 5px;
}
.section-case p.contact-lead span:nth-of-type(2) {
    background-color: #e9734f;
    margin-left: 5px;
}
/*soudan-link*/
.link-flex{
    margin-top: 55px;
    justify-content: space-between;
}
.soudan-link {
        width: 30%;
    padding: 50px 1.6%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: unset;
    position: relative;
    color: #fff;
    font-weight: bold;
    font-size: 25px;
}
.soudan-link:last-child {
    background-color: #e9734f;
}
.link-flex a:nth-of-type(2) {
    background-color: #2f9291;
}
.link-flex a img:nth-of-type(1) {
    width: 17%;
    margin-right: 30px;
}
.link-flex a img:nth-of-type(2) {
    width: 5%;
    position: absolute;
    right: 7%;
}
/* =========== section-websoudan ============ */
.section-websoudan {
    margin-top: unset;
    padding: unset;
    background-color: #f2f2f1;
}
.soudan-title span:nth-of-type(1) {
    color: #2f9291;
}
.soudan-title span:nth-of-type(2) {
    color: #243C88;
    font-size: 40px;
}
.questions {
    width: 100%;
    margin-bottom: 30px;
}
/*recomend-message*/
.recomend-message {
    color: #ffff2b;
    background-color: #243C88;
    position: relative;
    border-radius: 10px;
    text-align: center;
    display: inline-block;
    font-size: 30px;
    padding: 10px 50px;
    font-weight: bold;
    margin-bottom: 40px;
}
.recomend-message::before {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
        margin-left: -20px;
    border: 20px solid transparent;
    border-top-color: #243C88;
}
.free-soudan {
    color: black;
    font-weight: bold;
    text-align: center;
    font-size: 20px;
    letter-spacing: 1.3px;
}
.free-soudan span {
    color: #e9734f;
}
/*web-movie*/
.section-websoudan .web-movie {
    width: 100%;
    background-color: #243C88;
    color: white;
    margin-top: 50px;
}
.web-movie_wrapper {
    width: 100%;
    display: flex;
    margin: 0 auto;
    justify-content: center;
    align-items: center;
}
.section-websoudan .message {
    display: flex;
    justify-content: center;
    align-items: center;
}
.message img {
    display: block;
    width: 70%;
    margin-bottom: 20px;
}
.section-websoudan .frame-doble__inner * { 
    display: block;
    font-size: 17px;
    font-weight: normal;
}
.section-websoudan .left-content,.section-websoudan .right-content{
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.section-websoudan .right-content .yt *{
    width: 100%;
}
.section-websoudan .right-content .yt,.section-websoudan .right-content .yt .movie {
    width: 100%;
    height: 420px;
}
.web-movie_wrapper .left-wrapper {
    width: 70%;
}
 
/*flow-content*/
section.section-flow {
    background-color: #E9EFF8;
}
.flow-content {
    background-color: unset;
}
.flow-title {
    background-color: unset;
    color: #243C88;
    font-weight: bold;
    margin-bottom: 40px;
}
.web-flow {
    display: block;
    width: 100%;
}
/*tantou*/
.tantou {
    background-color: white;
    border: 5px solid #243C88;
}
.flow-content ul {
    padding-top: unset;
}
.flow-content li.fix-flex {
    width: 32%;
}
.flow-content .charge-list li .license-logo {
    top: 16.5%;
}
.flow-content li p.charge-name {
    background-color: #243C88;
    color: white;
    padding: 5px;
    text-align: center;
    font-weight: bold;
    font-size: 20px;
    border-radius: 10px;
    width: 100%;
}
.charge-info li {
    align-items: stretch;
    margin-bottom: 3px;
}
.charge-list__title {
    background-color: #3e84c0;
    border-radius: unset;
    padding: 5px;
    font-weight: unset;
    font-size: 18px;
    margin-right: 1%;
    display: flex;
    flex: 1;
    justify-content: center;
    align-items: center;
}
.charge-list__content {
    background-color: #e5ecf7;
    color: #243C88;
    padding: 5px;
    font-size: 18px;
    font-weight: bold;
}
@media screen and (max-width: 1024px){
    .section-websoudan .right-content .yt, .section-websoudan .right-content .yt .movie{
        width: 100%;
        height: 325px;
    }
}
/* =========== section-contact ============ */

.section-contact {
    width: 100%;
    background-color: #e5ecf7;
    padding-bottom: 50px;
    margin-bottom: 0;
}
section.section-contact .section-title {
    margin-top: 0;
    background-color: #243C88;
    color: #fff;
    padding: 40px 0px;
    padding-bottom: 100px;
}
.form-wrapper {
    width: 70%;
    background-color: white;
    margin: 0 auto;
    padding: 50px;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.15);
    margin-top: -55px;
}
/*contact-form*/
form {
    font-weight: bold;
    font-size: 18px;
}
form input {
    font-weight: bold;
    color: #828282;
}
.wpcf7-form {
    width: 80%;
    margin: 0 auto;
}
.wpcf7-form li {
    margin-bottom: 30px;
}
input[type="submit"] {
    color: white;
    background-color: #e9734f;
    width: 60%;
    font-size: 1.5pc;
    border: unset;
    border-radius: 50px;
}
/* =========== section-storesoudan ============ */
.section-storesoudan {
    padding: 0 80px 50px 80px;
    background-color: #f2f2f1;
}
.section-storesoudan .soudan-title span:nth-of-type(1) {
    color: #e9734f;
}
.section-storesoudan .store-movie {
    justify-content: center;
}
/* =========== section-brand ============ */
.section-brand,.section-store__info,.section-parking{
    padding: 40px 50px;
    background-color: #E9EFF8;
    margin-top: 30px;
}
.brand-wrapper {
    width: 90%;
    background-color: #e5ecf7;
    margin: 0 auto;
    max-width: 1400px;
    padding-bottom: 50px;
}
.section-brand .section-title,
.section-store__info .section-title,
.section-store__info #section-parking-title {
    margin-bottom: 40px;
    text-align: center;
    display: block;
    color: #243C88;
    font-size: 25px;
}
.card-title {
    background-color: #4C97CC;
    color: white;
    display: inline-block;
    text-align: left;
    position: unset;
    border-bottom: unset;
    padding:5px 10px;
    margin-bottom: 15px;
    font-size: 24px;
    font-weight: bold;
}
#brand-border,
.card-border {
    border: unset;
    background-color: unset;
    width: 48%;
}
.card-border {
    display: block;
}
.brand-list li:before {
    content: "・";
    position: unset;
    background-color: unset;
    width: auto;
    height: auto;
}
p.brand-attention,
.miekata-attention {
    font-size: 15px;
    font-weight: normal;
    text-indent: -15px;
    padding-left: 15px;
    width: 70%;
}
.miekata-attention {
    margin-top: 50px;
}
/*見え方保証*/
.card-border p.border-text {
    width: 100%;
}
.section-brand img {
    width: 48%;
}
/* =========== section-store__info ============ */
.section-store__info .section-wrapper {
    width: 70%;
}
.info_upper-content {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: space-around;
}
.store-info__area {
    display: block;
    width: 43%;
    margin-right: 1%;
    font-size: 18px;
}
.store-outline {
    width: 100%;
}
.outline-content {
    border: unset;
    color: black;
}
.section-store__info .frame-doble {
    width: 100%;
    margin-bottom: unset;
}
.frame-doble__inner p span {
    color: #243C88;
    font-weight: bold;
    margin-bottom: 15px;
    font-size: 20px;
    display: block;
    margin-bottom: 15px;
}
p.sotore-info__text{
    font-size: 16px;
    line-height: 150%;
}
.section-store__info img {
    width: 55%;
}
/* =========== section-parking ============ */
section#section-parking img {
    width: 40%;
}
p.parking-text {
    width: 55%;
    line-height: 200%;
}
span.bold {
    font-weight: bold;
}
#section-parking img {
    width: min(350px, 50%);
    height: auto;
    flex-shrink: 0;
    object-fit: contain;
}

/*=========================================
        　細川追加分：レスポンシブ
=========================================*/
/* =========== max-width:850px ============ */
@media screen and (max-width: 850px) {
    .section-websoudan .right-content {
        width: 100%;
        margin: 0 auto;
        margin-bottom: 0px;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .section-websoudan .right-content .yt, .section-websoudan .right-content .yt .movie {
        width: 100%;
        height: 440px;
    }
    /*  MV　*/
    .mv-text-box {
        font-size: 20px;
    }
    .mv-text-box_1 {
        bottom: 5%;
    }
    .mv-text-box_2 {
        right: 110%;
        bottom: 0%;
    }
    .banner-box {
        width: 300px;
    }
    .insta-banner-text {
        padding: 5px 0;
        font-size: 15px;
    }
    .countermeasure {
        font-size: 18px;
        width: 70%;
    }
    a.covid-19 {
        bottom: 21%;
    }
    a.insta-banner {
        bottom: 2%;
    }
    .insta-view p {
        font-size: 13px;
        font-weight: lighter;
    }
    .number1 {
        font-size: 30px;
    }
    .store-follower {
        font-size: 15px;
    }
    .follwer_under {
        font-size: 20px;
    }
    /*  お知らせ　*/
    .news-content li .date {
        text-align: center;
        width: 20%;
    }
    /*  ライフスタイル　*/
    .section-lifestyle .right-content {
        width: 80%;
    }
    .movie-name {
        width: 90%;
        margin-top: 30px;
    }
    .section-lifestyle .good-glass {
        text-align: left;
    }
    .frame-doble {
        margin-bottom: 50px;
    }
    .section-catch h2 span,
    .section-title span.megane-change {
        border-bottom: 2px wavy #ffff00;
    }
    /*改善するかも*/
    .movie-area .movie-name {
        margin-top: unset;
        margin: 0 auto;
    }
    .movie-left {
        width: 80%;
        padding-top: unset;
    }
    .content-a {
        right: 20%;
        font-size: 16px;
    }
    .content-b {
        font-size: 25px;
        top: 37%;
        right: 25%;
    }
    .problems p {
        width: 60px;
        height: 60px;
    }
    .problems-box {
        align-items: center;
    }
    /*  Q&A　*/
    .section-qa .section-title {
        font-size: 25px;
    }
    .qa-list {
        display: unset;
    }
    .qa-list li {
        width: 80%;
        margin: 0 auto;
        margin-bottom: 50px;
    }
    /*ケース*/
    /*.case-list{
        width: 80%;
    }
    .case-text p:nth-child(1){
        width: 260%;
    }
    .case-text p:nth-child(2),.case-text p:nth-child(3){
        width: 300%;
    }*/
    .case-list li:first-child {
        display: block;
    }
    .case-list li:last-child {
        flex-direction: column;
    }
    div.case-text {
        position: unset;
        width: auto;
    }
    .case-border {
        width: 80%;
    }
    .section-case p.contact-lead span {
        padding: 5px;
    }
    /*相談リンク*/
    .soudan-link {
        margin-top: 50px;
        font-size: 16px;
    }
    .soudan-link{
        padding: 30px 1.6%;
    }
    section#section-websoudan {
        padding-top: 30px;
    }
    .soudan-title span:nth-of-type(2) {
        color: #243C88;
        font-size: 30px;
    }
    .recomend-message::before{
        border: 10px solid transparent;
    }
    .recomend-message {
        margin-bottom: 30px;
        font-size: 20px;
    }
    /*  一言　*/
    .web-movie_wrapper {
        padding-top: 30px;
    }
    .left-content {
        width: 40%;
    }
    .left-wrapper {
        width: 100%;
        margin-left: unset;
    }
    /*担当者*/
    .charge-list {
        display: block;
    }
    .flow-content li.fix-flex {
        width: 100%;
        display: block;
    }
    .flow-content .charge-list li img {
        width: 100%;
    }
    ul.charge-info li {
        display: flex;
        flex-direction: unset;
        align-items: stretch;
    }
    .flow-content ul.charge-info {
        width: 100%;
    }
    .charge-list__title {
        margin: unset;
    }
    .charge-list__title,
    .charge-list__content {
        width: 70%;
    }
    /*  コンタクトフォーム*/
    .form-wrapper {
        width: 80%;
        padding: 50px 30px;
    }
    .wpcf7-form {
        width: 90%;
    }
    /*  向いています　*/
    .section-storesoudan {
        padding: 50px;
    }
    /*ブランド*/
    .brand-wrapper {
        width: 100%;
    }
    #brand-border,
    .card-border {
        width: 80%;
    }
    .section-brand img {
        width: 80%;
    }
    .section-brand div.fix-flex.hosyo {
        flex-direction: column;
    }
    .card-title {
        width: auto;
        text-align: center;
    }
    p.brand-attention {
        width: 100%;
    }
    .section-brand img {
        margin-bottom: unset;
    }
    /*お店情報*/
    .section-store__info .section-wrapper {
        width: 80%;
    }
    .info_upper-content {
        display: block;
    }
    .store-info__area {
        width: 100%;
    }
    .section-store__info img {
        width: 100%;
        margin-top: 30px;
    }
}
/* =========== max-width:600px ============ */
@media screen and (max-width: 850px) {
    /*共通*/
    .sp-br {
        display: block;
    }
    /*  MV  */
    .mv-text-box_1 {
        right: -50%;
        height: 280px;
    }
    .mv-text-box_2 {
        right: 60%;
    }
    .insta-view {
        padding: unset;
    }
    .mv-text-box {
        padding: 10px;
    }
    /*バナー*/
    .group-wrapper {
        margin-top: 100px;
    }
    .group-block {
        margin: 0 auto;
        width: 100%;
    }

    .case-list li img {
        width: 100%;
        height: auto;
    }
    #section-parking .fix-flex {
        padding: unset;
    }
    /*ニュース*/
    .section-news {
        margin-top: unset;
    }
    .news-content li .date {
        width: 50%;
    }
    /*  キャッチ　*/
    .section-catch h2 {
        display: block;
        font-size: 24px;
        text-align: center;
    }
    /*ライフスタイル*/
    .section-news p {
        font-size: 20px;
    }
    .section-lifestyle {
        padding: 30px 0;
    }
    .section-wrapper h2 {
        font-size: 17px;
    }
    .movie-name {
        margin-top: 10px;
    }
    .frame-doble {
        margin-bottom: unset;
    }

    /*メガネチェンジ*/
    .section-glass__change {
        width: 100%;
    }
    .movie-left {
        width: 90%;
    }
    
    .answer-text {
        width: 75%;
        padding: 20px 0;
        font-size: 18px;
    }
    .answer-text span {
        font-size: 3vmin;
    }
    /*ケース*/
    .case-list {
        width: 80%;
    }
    .case-text p:nth-child(2) {
        width: 373px;
    }
    .case-text p:nth-child(3) {
        width: 268px;
    }
    .case-text2 p:nth-child(1) {
        width: 100px;
        display: block
    }
    .case-text2 p:nth-child(2) {
        width: 215px;
    }
    .case-text2 p:nth-child(3) {
        width: 247px;
    }

    .case-list li {
        margin-bottom: 30px;
    }
    .soudan-link {
        margin-top: unset;
        width: 100%;
        height: 100px;
    }
    /*チェック*/
    .section-title {
        font-size: 20px;
    }
    .questions {
        width: 95%;
    }
    .recomend-message {
        width: 80%;
    }
    /*一言*/
    .message img {
        width: 60%;
    }
    .section-websoudan .frame-doble__inner * {
        font-size: 16px;
        width: 100%;
        margin: 20px auto;
    }
    .web-movie_wrapper {
        display: block;
    }
    /*流れ*/
    .flow-content {
        width: 95%;
    }
    /*コンタクト*/
    .wpcf7-form li {
        margin-bottom: 15px;
    }
    /*チェック*/
    .section-storesoudan {
        padding: 30px 0;
        width: 100%;
    }
    section.section-storesoudan .section-wrapper {
        width: 90%;
    }
    /*ブランド*/
    .section-brand .section-title {
        font-size: 20px;
    }

    .section-brand div.fix-flex {
        margin-top: unset;
    }
    .section-brand .section-title,
    .section-store__info .section-title,
    .section-store__info #section-parking-title {
        font-size: 20px;
    }
    .store-info__area {
        text-align: center;
    }
    .frame-doble__inner p span {
        font-size: 20px;
    }
    #section-parking p {
        width: 90%;
    }
    #section-parking img {
        width: 90%;
        margin-bottom: 30px;
    }
    .free-soudan {
        font-size: 16px;
    }
    section#section-parking img {
        width: 90%;
    }
    footer .footer-right a.contact-button.fix-flex {
        width: 60%;
        font-size: 14px;
    }
}

@media screen and (max-width: 1023px) {
    .section-lifestyle .left-content {
        width: 100%;
    }
    .section-lifestyle .right-content {
        width: 100%;
    }   
    .movie-left {
        width: 100%;
    }
    .movie-area {
        width: 100%;
    }

    .section-catch {
        padding: 30px 0;
    }

    .section-catch .fix-flex {
        flex-direction: row;
        align-items: center;
    }

    .qa-list {
        flex-direction: column;
    }

    .qa-list li {
        width: 94%;
    }

    .case-list li {
        flex-direction: column !important;
    }

    .case-list li img {
        margin: 175px auto 0;
        width: 100%;
    }

    .case-text div {
        font-size: 18px;
        margin-top: 0;
    }

    .link-flex {
        flex-direction: row;
    }

    .section-glass__change-p {
        font-size: 24px;
    }

    .section-case p.contact-lead {
        margin-top: 40px;
    }

    .web-movie_wrapper {
        flex-direction: column;
    }

    .section-websoudan .left-content {
        width: 100%;
    }
    .left-wrapper {
        margin: 0 auto;
    }
    
    #brand-border,.card-border {
        width: 90%;
        margin: 0 auto;
    }

    p.brand-attention {
        width: 100%;
    }

    .info_upper-content {
        display: block;
    }

    .store-info__area {
        width: 100%;
    }

    .section-store__info img {
        width: 100%;
    }

    header .fix-flex {
        flex-direction: row;
    }

    .group-wrapper {
        flex-direction: row;
    }

    .mv-text {
        bottom: 28px;
    }

    .mv-text-box {
        font-size: 20px;
    }

    .mv-text-box_1 {
        bottom: 5%;
    }

    .mv-text-box_2 {
        bottom: 0%;
        right: 108%;
    }

    #section-parking .fix-flex {
        flex-direction: column;
    }

    #section-parking p {
        width: 100%;
    }

    #section-parking img {
        width: 100%;
    }
}

@media screen and (max-width: 850px) {
    .link-flex a img:nth-of-type(1) {
        width: 15%;
        margin-right: 15px;
    }
    .hamburger-menu.sp {
        display: block!important;
    }
    .header-wrapper{
        justify-content: flex-start;
    }
    .case-text p {
        font-size: 20px;
    }

    .case-list li img {
        margin: 0 auto;
    }

    .section-case p.contact-lead {
        font-size: 25px;
        margin-bottom: 20px;
    }

    .soudan-title {
        width: 100%;
    }
    .voice__right {
        font-size: 20px;
    }
}
@media screen and (max-width: 850px){
    .section-lifestyle .right-content {
        width: 70%;
    }
    .section-lifestyle .left-content {
        width: 70%;
    }
    .section-line a {
        display: block;
        width: 100%;
        margin: 0 auto;
    }
}


@media screen and (max-width: 500px) {
    .section-lifestyle .section-title {
        margin-bottom: 40px;
        margin-top: 40px;
    }
    .section-catch h2 {
        display: block;
        font-size: 25px;
        text-align: center;
    }
    .section-catch h2 span, .section-title span.megane-change{
        display: block;
    }
    .mv-text-box_1 {
        right: -90%;
        height: 280px;
    }
    li.movie-block .fix-flex {
        flex-direction: column;
    }
    .section-brand, .section-store__info, .section-parking {
        padding: 40px 5%;
    }
    .soudan-link {
        /* padding: 30px 1.6%; */
    }
    .qa-list li {
        width: 85%;
    }

    .banner-box {
        width: auto;
    }

    .insta-banner-text {
        font-size: 12px;
    }

    .voice {
        max-width: 100%;
        padding: 30px;
    }

    .voice__illustArea {
        width: 95%;
    }
    .voice__left {
        align-items: flex-start;
    }
    .voice__comment {
        font-size: 18px;
    }
    .voice__illust {
        width: 230px;
        height: 230px;
    }
    .section-glass__change .section-title{
        padding: 50px 0;
    }
    .voice__right {
        font-size: 16px;
    }
    .section-glass__change-p {
        font-size: 20px;
    }
    .movie-samary {
        font-size: 18px;
    }
    .problems-box {
        display: flex;
        flex-direction: column;
    }
    .problems-box .title {
        font-size: 22px;
        text-align: center;
        margin-top: 15px;
    }
    .problems p {
        width: 80px;
        height: 80px;
    }
    .content-a{
        font-size: 18px;
    }
    .content-b {
        font-size: 30px;
    }
    .movie-samary {
        padding: 0;
    }
    .movie-area .movie-name {
        margin-top: unset;
        margin: 0 auto;
        margin-top: 10px;
    }
    .movie-list li {
        margin-bottom: 0px;
    }
    .movie-list li {
        margin-bottom: 40px;
    }
    .answer-text {
        width: 100%;
        padding: 20px 0;
        font-size: 18px;
    }
    .answer-text span {
        font-size: 18px;
    }
    .section-case .section-title {
        font-size: 19px;
    }
    .section-case p {
        font-size: 33px;
    }
    .case-list {
        width: 90%;
    }
    .case-border {
        width: 100%;
    }

    .case-text p {
        font-size: 18px;
    }

    .case-text p:nth-child(2) {
        width: auto;
    }
    .case-text p:nth-child(3) {
        width: auto;
    }
    .case-text2 p:nth-child(1) {
        width: auto;
        display: inline-block;
    }
    .case-text2 p:nth-child(2) {
        width: auto;
    }
    .case-text2 p:nth-child(3) {
        width: auto;
    }
    .case-text p {
        padding: 7px 5px;
    }
    .case-text div {
        font-size: 14px;
        margin-top: 0;
    }
    .section-case p.contact-lead {
        font-size: 20px;
        line-height: 200%;
    }
    .soudan-link {
        height: 150px;
    }

    .message img {
        margin-top: 60px;
    }

    .soudan-title span:nth-of-type(2) {
        font-size: 24px;
    }

    .recomend-message {
        font-size: 28px;
    }
    /* ハンバーガーメニュー */
#nav {
    position: absolute;
    height: 100vh;
    width: 100%;
    left: 100%;
    top: 0;
    background: #396fa4;
    transition: 0.7s;
}
#nav ul {
    padding-top: 80px;
    display: flex;
    flex-wrap: wrap;
}
#nav ul li {
    flex-basis: 100%;
    list-style-type: none;
    font-size: 20px;
    border-bottom: solid 1px rgba(255, 255, 255, 0.8);
}
#nav ul a::after {
    position: absolute;
    content: url(./images/menu-tri.png);
    color: #fff;
    font-weight: bold;
    top: 50%;
    right: -50px;
    transform: translateY(-50%) scale(0.3);
}
#nav ul a {
    position: relative;
    display: inline-block;
    text-decoration: none;
    color: #fff;
    margin: 0 10px;
    padding: 30px 0;
    transition: 0.5s;
    font-weight: bold;
    width: 70%;
}

#hamburger {
    display: block;
    position: absolute;
    top: 25px;
    right: 10px;
    width: 40px;
    height: 30px;
    cursor: pointer;
    transition: 1s;
}
.inner_line {
    display: block;
    position: absolute;
    left: 0;
    width: 40px;
    height: 3px;
    background-color: #000;
    transition: 1s;
    border-radius: 4px;
}
#line1 {
    top: 0;
}
#line2 {
    top: 13px;
}
#line3 {
    bottom: 0px;
}
.in {
    transform: translateX(-100%);
    z-index: 1005;
}
.line_1,
.line_2,
.line_3 {
    background: #fff;
}
.line_1 {
    transform: translateY(14px) rotate(-45deg);
    top: 0;
    z-index: 1009;
}
.line_2 {
    opacity: 0;
}
.line_3 {
    transform: translateY(-14px) rotate(45deg);
    bottom: 0;
    z-index: 1009;
}
.nav-icons {
    justify-content: center;
    margin: 30px 0;
}
.nav-icons a {
    margin: 0 20px;
}
.nav-icons img {
    width: 50px;
}
.nav-icons i {
    box-sizing: border-box;
    font-size: 55px;
}
.nav-icons .fab,
.nav-icons .fas {
    color: #fff;
}
.soudan-link {
    padding: 0 5%;
    width: 90%;
}
.soudan-link {
    font-size: 20px;
}
.recomend-message {
    font-size: 23px;
    width: 85%;
    padding: 20px 5%;
}
.free-soudan {
    font-size: 19px;
}
.web-movie_wrapper .left-wrapper {
    width: 100%;
}
.section-websoudan .right-content{
    width: 100% !important;
    margin-top: 45px;
}
.flow-title {
    font-size: 30px;
    margin-bottom: 30px;
    margin-top: 30px;
    padding: 0;
}
.message img {
    margin-top: 30px;
}
.message img {
    width: 90%;
}
.section-websoudan .right-content .yt, .section-websoudan .right-content .yt .movie {
    width: 100%;
    height: 250px;
}
.mv-text {
    bottom: 27%;
}
.mv-text-box_2 {
    bottom: 5%;
}
.section-mv {
    height: 65vh;
}
a.covid-19 {
    bottom: 15%;
    left: 2.55%;
    width: 95%;
}
a.insta-banner {
    bottom: -5%;
}
a.insta-banner {
    left: 2.5%;
    width: 95%;
}
	#brand-border, .card-border {
    width: 100%;
    margin: 0 auto;
}
.brand-list li {
    font-size: 17px;
    padding-left: 5px;
}
p.brand-attention {
    width: 90%;
    text-indent: -15px;
    padding-left: 10px;
    margin-bottom: 30px;
}
.section-brand img {
    width: 100%;
}
.brand-text {
    margin-bottom: 30px;
    width: 100%;
    line-height: 170%;
    font-size: 18px;
}
.store-info__area {
    width: 100%;
    flex-direction: column-reverse;
    display: flex;
}
.info_upper-content {
    display: flex;
    flex-direction: column-reverse;
}
.section-store__info div.fix-flex {
    width: 100%;
}
.section-store__info .frame-doble {
    width: 100%;
    margin-bottom: 30px;
    margin-top: 0;
}
.outline-content {
    padding-left: 0;
    width: 100%;
}
section#section-parking img {
    width: 100%;
}
.web-flow {
    display: block;
    width: 65%;
    margin: 0 auto;
}
.group-wrapper {
    width: 90%;
    margin: 80px auto;
    justify-content: space-around;
}
.group-block {
    margin-bottom: 30px;
}
}
/*問い合わせフォーム*/
.wpcf7-form li p {
    display: flex;
    align-items: center;
    justify-content: space-between;
	    width: 100%;
}
label.contact-title {
    width: 30%;
    color: #243C88;
}

span.contact-content {
    width: 100%;
    display: flex;
    flex-direction: column;
}
input[type=text], input[type=email], input[type=tel] {
    font-weight: bold;
    color: #828282;
    width: 100%;
    padding: 10px 5px;
}
/*コンタクト*/
/* iOSでのデフォルトスタイルをリセット */
input[type="submit"],
input[type="button"] {
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
}
select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    outline: none;
    background: transparent;
}
input[type="submit"] {
    
}
/*クライアント特別*/
/*section-form*/
.section-form{
    background-color: #E6E6E5;
    padding: 50px 0;
}
.form-heading{
    width: 100%;
    font-size: 30px;
    text-align: center;
    display: block;
    letter-spacing: 2px;
    margin-bottom: 10px;
}
.form-heading span{
    color: rgb(7,160,177);
}
/*全体設定*/
.wpcf7-form ul{
    width: 65%;
    margin: 0 auto;
    margin-top: 30px;

}
.wpcf7-form ul.margin-contact{
    margin-top: 20px;
}
span.wpcf7-form-control-wrap {
    width: 100%;
}
.wpcf7-form *{
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: bold;
}
.form-title{
    font-size: 18px;
    margin-bottom: 10px;
}
span.hissu {
    color: #a80c00;
    font-weight: 500;
    font-size: 13px;
    margin-left: 10px;
    display: flex;
    align-items: center;
}
.wpcf7-form li {
    display: flex;
    flex-direction: column;
    margin-bottom: 25px;
    align-items: flex-start;
    text-align: left;
}

.form-content{
    width: 100%;
    display: flex;
    flex-direction: column;

}
.wpcf7-form li.flex-start{
    justify-content: flex-start;
    align-items: flex-start;
}
/*全体設定*/
/*送信ボタン*/
.submit-button{
    color: #fff;
    background-color: #07A0B0;
    display: none;
    text-align: center;
    width: 25%;
    font-size: 20px;
    padding: 15px 0;
    border-radius: 35px;
    margin: 0 auto;
    margin-top: 50px;
    border: none!important;
}
#confirm-button{
  display: block;
}
/*input設定*/
span.contact-content input {
    font-size: 16px;
}
.form-content input[type='text'],.form-content input[type='tel'],.form-content input[type='email']{
    width: 100%;
    height: 100%;
    padding: 10px 0 10px 5px;
    border: solid 2px #000;
    background-color:#f2efeb;
    /*color: #c9c1b7;*/
    font-weight: lighter;
}
/*input設定*/
/*テキストエリア*/
.form-content textarea{
    width: 100%;
    height: 100%;
    padding: 10px 0 10px 5px;
    border: solid 2px #ebe6df;
    background-color: #f2efeb;
    border: solid 2px #000;
    /*color: #c9c1b7;*/
    font-weight: lighter;
    resize: none;
}
/*セレクトボックス*/
.form-content select {
    border: solid 2px #ebe6df;
    margin-right: 10px;
    width: 50%;
    padding: 5px 0;
    color: #595855;
    background-color: #f2efeb;
    margin-top: 10px;
}
span.date {
    display: flex;
    flex-direction: column;
}
/*テキストエリア*/
/*.checkbox input[type='checkbox']*/
/*ボタンを押した際のアニメーション*/
.check .wpcf7-list-item-label::before{
    position: absolute;
    content: '';
    width: 25px;
    height: 25px;
    background-color: #f2efeb;
    border: solid 2px #ebe6df;
    left:0px;
    border-radius: 5px;
 }
 .check .wpcf7-list-item input:checked + .wpcf7-list-item-label:before
 {
     position: absolute;
    content: '';
    background-image: url('../img/input-check.JPEG 2000');
    background-size: contain;
    width: 25px;
    height: 25px;
    border: solid 2px #ebe6df;
    background-color: #f2efeb;
    border-radius: 5px;
 }
 .check input{
    display: none;
 }
.check span.wpcf7-form-control {
    display: flex;
    flex-direction: column;
}
.check span.wpcf7-form-control .wpcf7-list-item {
    margin-bottom: 20px;
    padding-left: 25px;
    display: flex;
    align-items: center;
}
.radio .wpcf7-list-item-label{
        position: relative;
    padding-left: 40px;
    display: flex;
    align-items: center;
}
 /*ボタンを押した際のアニメーション*/
 /*ラジオボタン*/
/*ボタンを押した際のアニメーション*/
.radio .wpcf7-list-item-label::before{
    position: absolute;
    content: '';
    width: 25px;
    height: 25px;
    background-color: #f2efeb;
    border: solid 2px #ebe6df;
    left:0px;
    border-radius: 50%;
 }
 .radio input{
    display: none;
 }
 .radio input[type='text'] {
    display: block;
}
 /*.radio .wpcf7-list-item.first input:checked + .wpcf7-list-item-label:before,.radio .wpcf7-list-item:nth-child(2) input:checked + .wpcf7-list-item-label:before,.wpcf7-list-item:nth-child(3) input:checked + .wpcf7-list-item-label:before,.wpcf7-list-item:nth-child(4) input:checked + .wpcf7-list-item-label:before,.wpcf7-list-item:nth-child(5) input:checked + .wpcf7-list-item-label:before*/
.radio .wpcf7-list-item input:checked + .wpcf7-list-item-label:before {
     position: absolute;
    content: '';   
    background-size: contain;
    width: 23px;
    height: 23px;
    border: solid 4px #f2efeb;
    background-color:#71594C;
    border-radius: 50%;
 }
 .radio span.wpcf7-form-control {
    display: flex;
    flex-direction: column;
}
.radio span.wpcf7-form-control .wpcf7-list-item {
    margin-bottom: 20px;
    padding-left: 25px;
    display: flex;
    align-items: center;
}
 /*ボタンを押した際のアニメーション*/
@media screen and (max-width: 1024px){
    .wpcf7-form ul {
        width: 80%;
    }
}
@media screen and (max-width: 500px){
    .radio .wpcf7-list-item-label{
        margin-bottom:20px;
}
.wpcf7-list-item.last{
        margin-bottom:0px;
}
    .form-heading {
        font-size: 22px;
    }
    .wpcf7-form ul {
        width: 90%;
        margin-top: 50px;
    }
	.wpcf7-form {
    width: 100%;
}
    .wpcf7-form li p{
        display: flex;
        margin-bottom: 0px;
        flex-direction: column;
        align-items: flex-start;
    }
    .form-content {
        width: 100%;
        display: flex;
    }
    .form-title {
        width: 100%;
        display: flex;
        font-size: 16px;
        margin-bottom: 10px;
    }
    .submit-button {
        width: 70%;
        font-size: 15px;
    }
    .date {
        display: flex;
        flex-direction: column;
    }
    .form-content select{
        width: 100%;
        margin-bottom: 10px;
    }
    .radio .wpcf7-list-item{
        width: 100%;
    }
	span.contact-content {
    width: 95%;
}
	label.contact-title {
    width: 100%;
    color: #243C88;
    margin-bottom: 10px;
    font-size: 17px;
}
	span.wpcf7-form-control.wpcf7-checkbox.soudan-how {
    display: flex;
    flex-direction: column;
}
	.soudan-how .wpcf7-list-item {
    margin-left: 0;
    margin-bottom: 20px;
}
	li.checkbox p {
    margin-bottom: 0;
}
	.date-list {
    width: 100%;
}
}
@media screen and (max-width: 360px){
    .form-heading {
        font-size: 22px;
    }
}
@media screen and (max-width: 320px){
    .wpcf7-form * {
        font-family: 'Noto Sans JP', sans-serif;
        font-weight: bold;
        font-size: 12px;
    }
}
/*.checkbox input[type='checkbox']*/
.contact-content__text{
	position: relative;
    display: flex;
    align-items: center;
    padding-left: 40px;
    margin:0 10px;
}
.wpcf7-list-item-label {
    position: relative;
    display: flex;
    align-items: center;
     padding-left: 30px;
}
 .checkbox .contact-content .wpcf7-list-item-label:before{
 	position: absolute;
 	content: '';
 	width: 25px;
 	height: 25px;
 	background-color: #ececec;
 	left:0px;
 }
 .checkbox .contact-content div.fix-flex {
    position: relative;
    display: flex;
	 flex-direction: column;
    align-items: center;
    padding-left: 0px;
    margin-bottom: 20px;
}
span.wpcf7-form-control {
    padding-left: 0;
}
span.wpcf7-form-control-wrap {
    padding-left: 0;
}
.soudan-content span.wpcf7-list-item {
    display: inline-block;
    margin: 0 0 0 1em;
    width: 100%;
    margin-bottom: 20px;
    margin-left: 0;

}
 .checkbox .contact-content div.fix-flex.wrap{
 	flex-wrap: wrap;
 }
 .checkbox .contact-content input{
 	display: none;
 }

.checkbox .contact-content input#other-content {
    width: 97%;
    display: block;
    padding-left: 3%;
    color: #939393;
    font-size: 15px;
    border: solid 1px #000000;
    border-radius: 5px;
}
.checkbox .contact-content span#other-content__area {
    width: 90%;
    height: 40px;
    display: block;
    border: solid 2px #ececec;
}
 .wpcf7-list-item.first input:checked + .wpcf7-list-item-label:before,.wpcf7-list-item:nth-child(2) input:checked + .wpcf7-list-item-label:before,.wpcf7-list-item:nth-child(3) input:checked + .wpcf7-list-item-label:before,.wpcf7-list-item:nth-child(4) input:checked + .wpcf7-list-item-label:before,.wpcf7-list-item:nth-child(5) input:checked + .wpcf7-list-item-label:before
 {
     position: absolute;
    content: '';
    background-image: url(./images/input-check.png);
    background-size: contain;
    width: 23px;
    height: 23px;
    border: solid 2px #ececec;
    background-color: #fff;
 }
 .soudan-content {
    padding: 0;
    padding-left: 0;
    padding-bottom: 0;
}
.soudan-date {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding: 10px 3%;
}
/*セレクト*/
.date-list {
    width: 80%; 
}
select.wpcf7-form-control.wpcf7-select {
    width: 100%;
    height: 40px;
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 15px;
    border: solid 1px #000000;
    border-radius: 5px;
    background-color: #EAEAEA;
    color: #424242;
}
.soudan-content span.wpcf7-list-item-label {
    width: 100%;
}
.soudan-content span.contact-content.fix-flex {
    width: 100%;
}

.date-list p {
    display: flex;
    flex-direction: column;
}
h2#accordion1 {
    text-align: center;
    width: 100%;
    justify-content: center;
    color: #243C88;
}
.wpcf7-form ul {
    width: 85%;
}
ul#accordion-content1 li p {
    font-size: 15px;
    font-weight: normal;
}
.atention {
    background-color: #F4F4F4;
	padding:20px 0;
}
@media screen and (max-width: 500px){
	.date-list {
    width: 100%;
}
}
section.sub-header.fix-flex {
    justify-content: center;
    padding: 80px 0;
    background-color: #3970A4;
    color: #fff;
	font-size:30px;
}
@media screen and (max-width: 500px){
section.sub-header.fix-flex {
    justify-content: center;
    padding: 40px 0;
    background-color: #3970A4;
    color: #fff;
	font-size:20px;
}
	
}