
@font-face {
    font-family: 'CormorantInfant-Light';
    src: url('https://shisan-mirai.jp/assets/fonts/CormorantInfant-Light.ttf') format('truetype');
}

@font-face {
    font-family: 'CormorantInfant-Regular';
    src: url('https://shisan-mirai.jp/assets/fonts/CormorantInfant-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'CormorantInfant-Medium';
    src: url('https://shisan-mirai.jp/assets/fonts/CormorantInfant-Medium.ttf') format('truetype');
}

@font-face {
    font-family: 'CormorantInfant-SemiBoldItalic';
    src: url('https://shisan-mirai.jp/assets/fonts/CormorantInfant-SemiBoldItalic.ttf') format('truetype');
}

/* -------------------------------------------- common */

.inner { max-width: 1100px; width: 94%; margin: auto; }
.max1200 { max-width: 1200px; width: 94%; margin: auto; }
.max900 { max-width: 900px; }

body { 
    font-size: 16px; 
    font-family: YuGothic, "Yu Gothic Medium", "Yu Gothic", -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, Verdana, Meiryo, sans-serif;
    font-weight: normal;
}

main { margin-left: auto; margin-right: 0; width: calc(100% - 80px); }

.font1 { font-family: "Hiragino Mincho Pro", "ヒラギノ明朝 Pro", serif; }
.font2-light { font-family: 'CormorantInfant-Light'; }
.font2-regular { font-family: 'CormorantInfant-Regular'; }
.font2-med { font-family: 'CormorantInfant-Medium'; }
.font2-sm-italic { font-family: 'CormorantInfant-SemiBoldItalic'; }
.font3 { font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif; }

a { transition: 0.5s; }
a:hover { opacity: 0.6; }

.txt { font-size: 15px; line-height: 220%; }

.color1 { color: #3A3A82; }

.box-shadow1 { box-shadow: 0px 0 22px #eaeaea; }
.box-shadow2 { box-shadow: 0px 0 18px -9px #6a6a6a; }

.head-style1 h3 { font-size: 130px; line-height: 100%; letter-spacing: 10px; }
.head-style1 .txt { font-size: 30px; line-height: 200%; }

.head-style2 h3,
.head-style2 h4 { font-size: 30px; padding: 0 0 30px; }
.head-style2 h3 span,
.head-style2 h4 span { display: block; font-size: 130px; line-height: 100%; letter-spacing: 5px; }

.box_bg::before { top: 70px; background-color: #E4ECF7; z-index: -1; width: 80%; height: 410px; max-width: 1250px; left: 0;  }

.num-circle { padding: 20px 0 0; font-size: 14px; border-radius: 50%; background-color: #3A3A82; display: inline-block; color: #fff; width: 80px; height: 80px; box-sizing: border-box; }
.num-circle span { display: block; font-size: 30px; line-height: 100%; letter-spacing: 1px; }

.plus-toggle { width: 40px; height: 2px; display: block; }
.plus-toggle::before { background-color: #3A3A82; height: 100%; transition: 0.5s; transform: translateY(2px) rotate(90deg); position: relative; }
.plus-toggle::after { background-color: #3A3A82; height: 100%; position: relative; }

.to_top { display: none; bottom: 50px; right: 4%; z-index: 99; }
.to_top a { width: 50px; height: 50px; background-color: #fff; border: 2px solid #3A3A82;  }
.to_top img { width: 14px; }

.bg-blue { background-image: url(https://shisan-mirai.jp/assets/img/tob/bg-color1.jpg); }

.bubble_bk { margin: auto; left: 0; right: 0; }
.bubble_bk span { font-size: 1.6rem; border-radius: 12px; background-color: #1E1E1E; padding: 0 3rem; height: 64px; line-height: 64px; color: #fff; display: inline-block; }
.bubble_bk span::after { bottom: -12px; width: 24px; height: 24px; right: 0; left: 0; background: url(https://shisan-mirai.jp/assets/img/tob/bubble-arw.png) no-repeat center center; background-size: 100% auto; }

/* -------------------------------------------- slider */

.swiper-pagination-bullet { transition: 0.5s; opacity: 1; width: 10px; height: 10px; border: 2px solid #3A3A82; background: #fff; margin: 0 8px !important; }
.swiper-button-disabled { opacity: 0.4 !important; }
.swiper-pagination-bullet-active { background-color: #3A3A82; }

/* -------------------------------------------- slick */

.slick-dots li button { display: none; }
.slick-dots li { margin: 0 8px; background: #fff; width: 10px; height: 10px; border: 2px solid #3A3A82; border-radius: 50%; }
.slick-dots li.slick-active { background-color: #3A3A82; }

.slick-arrow { opacity: 1; transition: 0.5s; }
.slick-arrow:hover { opacity: 0.7; }

/* -------------------------------------------- fv */

.fv { min-height: 600px; height: 100vh; background-image: url(https://shisan-mirai.jp/assets/img/fv.jpg); background-position: bottom center; }
.fv::before { height: 160px; max-width: 1100px; margin: auto; width: 100%; z-index: 2; top: 0; background: url(https://shisan-mirai.jp/assets/img/fv_txt2.png) no-repeat center top; background-size: auto 100%; }
.fv_box { width: 64%; max-width: 757px; padding: 0 0 300px; z-index: 2; }
.fv_txt {  width: 100%; margin: auto; left: 0; right: 0; top: 150px; }
.fv_scroll { bottom: 20px; right: 10px; width: 50px; }
.fv_txt2 { width: 100px; right: 6%; top: 100px; color: #3A3A82; direction: rtl; padding: 40px 0 0; }
.fv_txt2 span { font-size: 32px; line-height: 120%; letter-spacing: 4px; margin: 0 5px; word-break: break-all; text-align: center; display: block; background-color: #fff; writing-mode: vertical-rl; text-orientation: upright; }
.fv_txt2 span:first-child { margin-top: -40px; }

/* -------------------------------------------- nav */

nav { background-color: #35A39B; z-index: 2; height: 100vh; overflow-y: auto; width: 80px; -ms-overflow-style: none; scrollbar-width: none; }
nav a { width: 100%; height: 100%;  text-align: center; display: flex; align-items: center; justify-content: center; }
nav a span { writing-mode: vertical-rl; text-orientation: upright; font-size: 14px; letter-spacing: 2px; }
nav ul { height: 80vh; width: 100%; min-height: 520px; }
nav ul li { width: 100%;  }
nav ul li a { background-color: #fff; }
nav .contact_btn { justify-content: center; width: 100%; height: 20vh; min-height: 130px; background-image: url(https://shisan-mirai.jp/assets/img/nav_bg.png); }
nav .contact_btn a { color: #fff; }
nav .contact_btn a span { display: inline-block; padding: 20px 0 0; 
    background: url(https://shisan-mirai.jp/assets/img/icn-message.png) no-repeat center top;
    background-size: 16px auto;
}

/* -------------------------------------------- news */

.news { padding: 0 0 150px; }
.news .head-style2 h3 span { font-size: 80px; }
.news .date { color: #3A3A82; font-size: 15px; letter-spacing: 1px; }
.news ul { padding: 20px 0 0; }
.news ul li { border-top: 1px solid #bbc4d5; padding: 20px 60px 20px 0; background: url(https://shisan-mirai.jp/assets/img/btn-next2.svg) no-repeat right center; background-size: 50px auto;}
.news ul li:first-child { border: none; }
.news ul li a { display: block; }
.news ul li a .txt { font-size: 16px; letter-spacing: 2px; padding: 5px 0; }
.news ul li a .cat { font-size: 14px; padding: 0 15px; height: 30px; line-height: 30px; display: inline-block; border: 1px solid #c4c4c4; }

/* -------------------------------------------- about */

.about-news { padding: 120px 0 0; background: url(https://shisan-mirai.jp/assets/img/about-bg.png) no-repeat center -700px; background-size: 2500px auto; }
.about_head::after { font-size: 200px; opacity: 0.1; line-height: 65%; content: 'ABOUT'; width: 100%; text-align: center; left: 0; top: 0; z-index: 0; color: #3A3A82; font-family: 'CormorantInfant-Light'; }
.about_head p { font-size: 40px; padding: 30px 0; z-index: 2; position: relative; }
.about_head p span { font-size: 18px; display: block; }
.about h3 { padding: 30px 0; font-size: 26px; }
.about ul { padding: 90px 0 50px; }
.about ul li { width: calc(100% / 3); border-left: 1px solid #BFC7D4; box-sizing: border-box; }
.about ul li .num { letter-spacing: 2px; font-size: 40px; width: 100%; padding: 0 0 20px; }
.about ul li .num::after { width: 45px; height: 3px; bottom: 0; left: 0; right: 0; margin: auto; 
    background: rgb(141,196,226);
    background: linear-gradient(94deg, rgba(141,196,226,1) 0%, rgba(34,87,191,1) 100%); 
}
.about ul li .txt { line-height: 180%; font-size: 24px; width: 100%; text-align: center; padding: 20px 0 0; letter-spacing: 1px; }
.about ul li:first-child { border: none; }

/* -------------------------------------------- support */

.support { padding: 4rem 0; }
.support .bubble_bk { top: -32px; }
.support .about_head p { font-size: 1.8rem; color: #fff; }
.support .about_head::after { content: 'SUPPORT'; color: #fff; }
.support ul { padding: 3rem 0 0; gap: 1%; }
.support ul li { background-color: #fff; width: 24%; padding: 1rem; box-sizing: border-box; }
.support ul li .num { font-size: 14px }
.support ul li .num span { font-size: 1.75rem; display: block; }
.support ul li .txt { padding: 8px 0; font-size: 1.15rem; width: 100%; line-height: 150%; }
.support ul li img { max-width: 320px; }

/* -------------------------------------------- cashflow */

.cashflow { padding: 0 0 100px; }
.cashflow h3 { font-size: 40px; padding: 0 0 30px; }
.cashflow h3 span { font-size: 18px; display: block; padding: 0 0 10px; letter-spacing: 2px; }
.cashflow .chart { padding: 5% 0; }
.cashflow .chart .bg { width: 90%; max-width: 982px; }
.cashflow .chart .icons { z-index: 1; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.cashflow .chart .icons img { width: 13%; box-shadow: 0px 0 60px #cecece; }
.cashflow .chart .icons .round { max-width: 140px; border-radius: 50%; }
.cashflow .chart .icons .icn1 { top: 5%; left: 0;}
.cashflow .chart .icons .icn2 { top: 5%; left: 44%; }
.cashflow .chart .icons .icn3 { top: 5%; left: 87%; }
.cashflow .chart .icons .icn4 { top: 65%; left: 60%; width: 24%; max-width: 260px; }
.cashflow .chart .icons .icn5 { top: 62%; left: 22%; }

/* -------------------------------------------- reason */

.reason { padding: 50px 0 200px; }
.reason_wrap { max-width: 1600px; width: 100%; margin: auto; }

.reason_wrap .gradient { position: absolute; max-width: 1666px; left: -50%; top: -10%;  z-index: -1; }
.reason .r_list { padding: 50px 0 0; }
.reason .r_list li { width: 31%; padding: 30px 25px; border-radius: 12px; box-shadow: 0px 0 30px #cecece; box-sizing: border-box; background: #fff; }
.reason .r_list li .caption { min-height: 120px; display: flex; align-items: center;  box-sizing: border-box; }
.reason .r_list li .caption span { display: block; font-size: 26px; width: 100%; line-height: 160%; }
.reason .r_list li .txt { line-height: 180%; }
.reason .big { padding: 100px 0 60px; font-size: 28px; }
.reason .r_chart { padding: 0 0 100px; }
.reason .r_chart .col { width: 50%; overflow: hidden; }
.reason .r_chart .col p { font-size: 14px; line-height: 150%; padding: 20px 0 0; }
.reason .demand img { max-width: 720px; }

/* -------------------------------------------- merit */

.gradient-green { background: rgb(0,139,137); background: linear-gradient(94deg, rgba(0,139,137,1) 0%, rgba(240,246,220,1) 100%); }
.gradient-blue { background: rgb(34,87,191); background: linear-gradient(94deg, rgba(34,87,191,1) 0%, rgba(100,155,213,1) 75%, rgba(141,196,226,1) 100%); }
.gradient-purple {  background: rgb(77,67,148); background: linear-gradient(94deg, rgba(77,67,148,1) 0%, rgba(124,113,168,1) 70%, rgba(166,154,185,1) 100%);  }

.merit { padding: 0; overflow: hidden; }
.merit .gradient { position: absolute; max-width: 1666px; right: -20%; top: -10%; z-index: -1; transform: rotate(208deg) scaleX(-1); }
.merit_fv { background-image: url(https://shisan-mirai.jp/assets/img/merit-fv.jpg); max-width: 1600px; max-height: 540px; margin: auto; height: 30vw; }
.merit_wrap { padding: 80px 0 0; }
.merit h3 { font-size: 150px; letter-spacing: 5px; line-height: 100%; }
.merit .caption { font-size: 30px; padding: 0 0 100px; } 
.merit .info .tab { background-color: #fff; cursor: pointer; user-select: none; }
.merit .info .tab .plus-toggle { right: 30px; margin: auto; top: 0; bottom: 0; }
.merit .info.active .tab .plus-toggle::before { transform: translateY(2px) rotate(0); }
.merit .info h4 { font-size: 26px; padding: 20px 0; letter-spacing: 5px; }
.merit .info .contents .col { width: calc(100%/ 3); box-sizing: border-box; border: 1px solid #CCCCCC; border-left: none; }
.merit .info .contents .col .th { padding: 25px 0; font-size: 18px; font-weight: normal; color: #fff; }
.merit .info .contents .col:first-child { border-left: 1px solid #CCCCCC; }
.merit .info .contents .col p { padding: 15px 0; font-size: 14px; border-top: 1px solid #CCCCCC; box-sizing: border-box; }
.merit .info .contents .col p:first-child { border: none; }
.merit .info .contents .col p span { display: inline-block; }

.merit .list { padding: 30px 0 50px; }
.merit .list .detail { border-top: 1px solid #3A3A82; padding: 50px 0; }
.merit .list .detail:first-child { border: none; }
.merit .list .title { padding: 0 0 30px; }
.merit .list .title p { font-size: 60px; letter-spacing: 8px;}
.merit .list .title h4 { font-size: 24px; padding: 0 0 0 20px; letter-spacing: 1px; }
.merit .list .title h4 span { display: inline-block; padding: 0 0 2px; }
.merit .list .title h4 span small { height: 2px; width: 100%; position: absolute; left: 0; bottom: 0; }
.merit .list .box { width: 41%; }
.merit .list .box h5 { font-size: 30px; letter-spacing: 2px; }
.merit .list .box .txt { font-size: 16px; padding: 20px 0 0; }
.merit .list .figure { width: 55%; }
.merit .list .tags { gap: 10px; padding: 50px 0 0; }
.merit .list .tags li { line-height: 200%; text-align: center; padding: 0 30px; font-size: 14px; border: 1px solid #3A3A82; font-weight: 600; border-radius: 50px; }

/* -------------------------------------------- exterior */

.exterior { max-width: 1600px; margin: auto; }
.exterior .head-style1 { padding: 0 0 30px; }
.exterior .head-style1 h3 { letter-spacing: 2px; line-height: 100%; }
.exterior figure { margin: 0; }
.exterior .col { width: calc(25% - 5px); }
.exterior .col figure { width: 100%; padding: 146% 0 0; overflow: hidden; }
.exterior .col figure img { transition: 0.5s; left: 50%; top: 50%; transform: translate(-50%, -50%); position: absolute; }
.exterior .col figure:hover img { width: 110%; }
.exterior .col p { font-size: 30px; padding: 20px 0 0; }

/* -------------------------------------------- plan */

.plan { padding: 100px 0; overflow: hidden; }
.plan .gradient { position: absolute; max-width: 1666px; left: -20%; top: -40%; z-index: -1; }
.plan_wrap { max-width: 1600px; margin: auto; }
.plan_wrap::before { left: auto; right: 0; width: 75%; }
.plan .slider_nav { top: 140px; left: 0; width: 94%; max-width: 1100px; margin: auto; right: 0; z-index: 1; }
.plan .slider_nav .slider_arrow { width: 76px; cursor: pointer; transition: 0.5s; }
.plan .slider_nav .slider_arrow:hover { opacity: 0.6; }
.plan .slider_nav .pagecount { padding: 0 10px; display: flex; }
.plan .slider_nav .pagecount span { display: inline-block; padding: 0 15px; line-height: 120%; }
.plan .slider_nav .pagecount span:first-child { border-right: 1px solid #3A3A82; }
.plan .slider { width: 100%; max-width: 1600px; padding: 30px 0 80px; overflow: visible; margin: auto; /* position: relative; transform: translateX(-50%); left: 50%; */ }
.plan .slider .slide { border-radius: 10px; padding: 50px 40px; max-width: 1100px; transform: scale(0.9); transition: 0.5s; margin: auto; width: 88vw; box-sizing: border-box; background: #fff; }
.plan .slider .slide.swiper-slide-active { transform: scale(1); }
.plan .slider .slide .left { width: 43%; order: 1; }
.plan .slider .slide .right { width: 56%;  order: 2; }
.plan .slider .slide .title h4 { padding: 0 0 0 20px; font-size: 40px; box-sizing: border-box; width: calc(100% - 80px); }
.plan .slider .slide .txt { font-size: 16px; padding: 20px 0 30px; line-height: 200%; }
.plan .child_slider { width: calc(100% - 110px); margin: auto; border: 1px solid #EDEDED; }
.plan .child_slider_btn { width: 42px; cursor: pointer; top: 0; bottom: 0; left: 0; margin: auto; }
.plan .child_slider_btn.next { left: auto; right: 0; }
.plan .thumb_slider { width: calc(100% - 110px); margin: 10px auto 0; }
.plan .thumb_slide { cursor: pointer; opacity: 0.6; box-sizing: border-box; }
.plan .thumb_slide.swiper-slide-thumb-active { opacity: 1; border: 2px solid #EDEDED; }
.plan .slide .madori  { width: 100%; }
.plan .slide .madori .bordered { padding: 5px 0; border-top: 2px solid #d7dce4; border-bottom: 2px solid #d7dce4; width: 100%; }
.plan .slide .madori .bordered p { font-size: 15px; padding: 0 10px; border-left: 1px solid #000; line-height: 100%; margin: 5px 0; text-align: center; }
.plan .slide .madori .bordered p:first-child { border: none; }
.plan .slide .madori .measure { padding: 15px 0 0; }
.plan .slide .madori .measure .row { width: 100%; }
.plan .slide .madori .measure .row::after { width: 100%; border-top: 1px dashed #000; height: 1px; left: 0; top: 0; bottom: 0; margin: auto; }
.plan .slide .madori .measure .row p { word-break: keep-all; line-height: 180%; padding: 0 0 0 20px; background-color: #fff; position: relative; z-index: 2; }
.plan .slide .madori .measure .row p:first-child { padding: 0 20px 0 0; }

/* -------------------------------------------- faq */

.faq { padding: 100px 0; background-color: #F5FBFF; overflow: hidden; }
.faq .gradient { position: absolute; max-width: 1666px; right: -20%; top: -700px;  }
.faq ul li { padding: 10px 25px; border-top: 1px solid #92a1bc; }
.faq ul li:first-child { border: none; }
.faq ul li .txt { padding: 0 20px; max-width: calc(100% - 150px); }
.faq ul li .box { padding: 10px 0; }
.faq ul li .question { cursor: pointer; user-select: none; }
.faq ul li .question .letter { font-size: 30px; }
.faq ul li .question .txt { font-size: 18px; }
.faq ul li .question .plus-toggle { width: 30px; right: 0; top: 0; bottom: 0; margin: auto; }
.faq ul li.active .question .plus-toggle::before { transform: translateY(2px) rotate(0); }
.faq ul li .answer { display: none; }
.faq ul li .answer .letter { font-size: 26px; }

/* -------------------------------------------- voice */

.voice { padding: 100px 0; overflow: hidden; }
.voice .slider { padding: 0 0 70px; }
.voice .slide { transform: scale(0.9); padding: 100px 40px 30px; box-sizing: border-box; width: 80vw !important; max-width: 800px; margin: auto; box-sizing: border-box; transition: 0.5s; }
.voice .slick-active .slide { transform: scale(1); }
.voice .slide .num { padding: 5px 10px; left: 0; top: 10%; background-color: #3A3A82; color: #fff; }
.voice .slide .num span { letter-spacing: 2px; line-height: 100%; display: inline-block; padding: 0 8px; }
.voice .slide .num span:first-child { border-right: 1px solid #fff; }
.voice .slide h4 { font-size: 24px; }
.voice .slide .txt { padding: 20px 0 40px; }
.voice .slide .name { padding: 5px 0; border-bottom: 1px solid #d7dce4; border-top: 1px solid #d7dce4; }
.voice .slide .name p { padding: 0 15px; font-size: 14px; }
.voice .slick-list { padding: 30px 0 !important; box-sizing: border-box; }
.voice .slick-slide { margin: 0; }
.voice .swiper-pagination { position: relative; padding: 50px 0 0; }
.voice .slider_nav { padding: 30px 0 0; width: 100%; }
.voice .slider_nav .slider_arrow { width: 40px; cursor: pointer; transition: 0.5s; }
.voice .slider_nav .pagecount { padding: 0 15px; }
.voice .slider_nav .pagecount span { line-height: 100%; padding: 0 15px; }
.voice .slider_nav .pagecount span:first-child { border-right: 1px solid #3A3A82; }

/* -------------------------------------------- flow */

.flow { padding: 100px 0; background-color: #F5FBFF; }
.flow ol { padding: 30px 0 80px; }
.flow ol p { text-align: center; width: 100%; }
.flow ol li { border-radius: 15px; max-width: 236px; max-height: 236px; width: 19vw; height: 19vw; background-color: #fff; }
.flow ol li .num { font-size: 40px; }
.flow ol li .txt { font-size: 24px; line-height: 150%; min-height: 72px; }
.flow ol li .txt span { display: block; font-size: 16px; }
.flow ol li .txt sup { font-size: 11px; }
.flow ol li::before { left: -16%; width: 15%; max-width: 30px; height: 17px; top: 0; bottom: 0; transform: rotate(90deg);
    background: url(https://shisan-mirai.jp/assets/img/icn-arw2.svg) no-repeat center center;
    background-size: 100%;
}

.flow .training { padding: 20px 0; border-top: 1px solid #d1d8e5; border-bottom: 1px solid #d1d8e5; }
.flow .training h5 { font-size: 20px; line-height: 120%; }
.flow .training .txt { line-height: 180%; padding: 10px 0 0; }

/* -------------------------------------------- contact */

.contact { color: #fff; padding: 100px 0; background-image: url(https://shisan-mirai.jp/assets/img/contact-bg.jpg); }
.contact h5 { font-size: 18px; padding: 0 0 30px; }
.contact h5 span { display: block; font-size: 60px; letter-spacing: 5px; }
.contact .txt { font-size: 26px; letter-spacing: 2px; line-height: 180%; padding: 0 0 30px; }
.contact .btn_wrap { padding: 0; }
.contact .btn { font-size: 18px; color: #fff; height: 70px; line-height: 70px; max-width: 420px; width: 80%; display: block; margin: auto; 
    background: rgb(0,139,137);
    background: linear-gradient(94deg, rgba(0,139,137,1) 0%, rgba(197,227,207,1) 100%); 
}

.contact .btn img { width: 10px; right: 4%; top: 0; bottom: 0; margin: auto; }

.contact .col { width: 50%; padding: 10px 0; box-sizing: border-box; }
.contact .col .caption { font-size: 18px; padding: 0 0 20px; letter-spacing: 2px; }
.contact .tel { border-right: 1px solid #ffffff75; }
.contact .tel a { font-size: 52px; color: #fff; letter-spacing: 2px; padding: 0 0 0 40px; }
.contact .tel a::before { width: 30px; height: 38px; left: 0; top: 0; bottom: 0; margin: auto; background: url(https://shisan-mirai.jp/assets/img/icn-tel.png) no-repeat center center; background-size: 100% auto; }

/* -------------------------------------------- footer */

.footer { padding: 60px 0 30px; max-width: 1600px; width: 94%; margin: auto; }
.footer h5 { font-size: 36px; line-height: 100%; padding: 0 30px 30px 0; }
.footer h5 img { width: 390px; height: auto; }
.footer h6 { font-size: 16px; font-weight: 600; font-family: 'Arial'; }
.footer .col { padding: 0 0 20px 90px; }
.footer .col:first-child { padding-left: 0; }
.footer .col p { font-size: 13px; line-height: 170%;  }
.footer .col p.name { padding: 10px 0 0; font-weight: 600; }
.footer .rights { padding: 50px 0 0; font-size: 11px;}

@media screen and (min-width: 767px) {
    .pc-none { display: none; }
}

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

    .head-style1 h3 { font-size: 110px; }
    .head-style1 .txt { font-size: 24px; }

    .about_head p { padding: 16px 0; }
    .about h3 { font-size: 24px; }
    .about_head::after { font-size: 160px; }
    .about ul li .txt { font-size: 20px; }

    .support .about_head p { font-size: 1.4rem; }
    .support ul { gap: 2%; }
    .support ul li { max-width: 340px; width: 49%; margin-bottom: 2%; }

    .reason .r_list li { width: 32%; padding: 25px 3%; }
    .reason .r_list li .caption span { font-size: 24px; }
    .reason .big { font-size: 24px; }

    .merit h3 { font-size: 110px; }
    .merit .caption { font-size: 20px; }

    .exterior .head-style1 h3 { font-size: 100px; }
    .exterior .col p { font-size: 24px; }

    .plan .slider_nav { padding: 30px 0 0; position: static; justify-content: center; }
    .plan .slider_nav .slider_arrow { width: 45px; }
    .plan .slider { padding: 60px 0 0; }
    .plan .slider .slide { padding: 50px 6% 30px; }
    .plan .slider .slide .col { width: 100%; }
    .plan .slider .slide .left { order: 2; }
    .plan .slider .slide .right { order: 1; max-width: 520px; margin: auto; }
    .plan .slide .madori .bordered p { padding: 0 3%; font-size: 14px; }
    .plan .slide .madori .measure .row p { font-size: 14px; padding: 0 0 0 3%; }
    .plan .slide .madori .measure .row p:first-child { padding: 0 3% 0 0; }
    .plan .child_slider_btn { display: none; }
    .plan .child_slider { width: 100%; }
    .plan .thumb_slider { margin: 10px 0 0; width: 100%; }
    .plan .slider .slide .col .num-circle { position: absolute; top: -40px; margin: auto; left: 0; right: 0; }
    .plan .slider .slide .title h4 { padding: 20px 0 0; font-size: 30px; }
    .plan .slider .slide .txt { font-size: 14px; padding: 10px 0 20px; }
    .plan .swiper-pagination { display: none; }
    .plan .slider_nav .pagecount { padding: 0; }
    .plan .slider_nav .pagecount span { line-height: 100%; }

    .contact .col .caption { padding: 0 0 10px; }
    .contact .tel a { font-size: 34px; padding: 0 0 0 25px; letter-spacing: 1px; }
    .contact .tel a::before { width: 20px; }
    .contact .btn { font-size: 16px; height: 60px; line-height: 60px; }

    .flow ol li .num { font-size: 30px; }
    .flow ol li .txt { font-size: 18px; }
    
    .footer { width: 88%; }
    .footer .offices { width: 100%; }
    .footer .offices .col { padding-left: 0; padding-right: 4%; }
}

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

    /* -------------------------------------------- common */

    body.open-nav { overflow: hidden; }

    .inner { width: 88%; }
    .sp-none { display: none; }

    main { width: 100%; }

    .bubble_bk span { height: 54px; line-height: 54px; font-size: 1.25rem; }

    .txt { font-size: 14px; }

    .head-style1 h3 { font-size: 74px; letter-spacing: 2px; }
    .head-style1 .txt { font-size: 18px; line-height: 160%; }

    .menu_btn { width: 50px; display: block; z-index: 99; top: 20px; left: 4%; transition: 0.5s; }
    .menu_btn svg { fill: #fff; }
    .menu_btn.active svg { fill:#3A3A82; }

    .contact_btn { width: 60px; right: 0; top: 0; z-index: 99; }

    .box_bg::before { width: 68%; top: 40px; height: calc(100% - 40px); }

    .num-circle { font-size: 12px; padding: 25px 0 0; }
    .num-circle span { font-size: 26px; }

    .plus-toggle { width: 20px; height: 2px; }

    .bubble_bk span { padding: 0 2rem; height: 40px; line-height: 40px; font-size: 1.1rem; }

    .head-style2 h3,
    .head-style2 h4  { font-size: 20px }
    .head-style2 h3 span,
    .head-style2 h4 span { font-size: 70px; padding: 0 0 10px; }

    nav { transition: 0.5s; left: -102%; padding: 20px 6%; align-items: center; width: 100%; position: fixed; z-index: 100; box-sizing: border-box; background: url(https://shisan-mirai.jp/assets/img/nav_bg-sp.png) no-repeat center center; background-size: cover; }
    nav ul { padding: 30px 0 0; height: auto; min-height: 0; border-bottom: 1px solid #aab5d5; }
    nav ul li { border-top: 1px solid #aab5d5; }
    nav ul li a { text-align: left; display: block; padding: 20px 5px; height: auto; box-sizing: border-box;
        background: url(https://shisan-mirai.jp/assets/img/btn-next2.svg) no-repeat right center;
        background-size: 30px auto;
    }
    nav a span { font-size: 16px; writing-mode: inherit; text-orientation: inherit; }
    nav .contact_btn { height: auto; min-height: 0;
        background: rgb(0,139,137);
        background: linear-gradient(90deg, rgba(0,139,137,1) 0%, rgba(106,187,175,1) 60%, rgba(197,227,207,1) 100%); 
    }
    nav .contact_btn a { padding: 15px 0; background: url(https://shisan-mirai.jp/assets/img/icn-arw1.svg) no-repeat 94% center; background-size: 10px auto; }
    nav .contact_btn a::after { content: ''; display: block; }
    nav .contact_btn a span { padding: 0 0 0 30px; background-position: left center; background-size: 22px auto; }
    nav .close { position: absolute; right: 6%; top: 30px; width: 35px; cursor: pointer; }
    body.open-nav nav { left: 0%; }

    /* -------------------------------------------- fv */

    .fv { background-image: url(https://shisan-mirai.jp/assets/img/fv-sp.jpg); }
    .fv::before { height: 30%; background-image: url(https://shisan-mirai.jp/assets/img/fv_txt2-sp.png); }
    .fv_box { max-width: 480px; width: 88%; padding: 0 0 200px; text-align: center; }
    .fv_box img { width: 88%; }
    .fv_txt2 { margin: 20px 0 0; padding: 0 10px; text-align: center; width: auto; display: inline-block; direction: inherit; position: static; background-color: #fff; }
    .fv_txt2 span { font-size: 20px; letter-spacing: 0; display: inline-block;  writing-mode: inherit; text-orientation:inherit; }
    .fv_txt2 span:first-child { margin: 0; }

    .fv_scroll { width: 34px; }

    .news { padding: 0 0 60px; }
    .news .head-style2 h3 span { font-size: 70px; }
    .news ul li { background-size: 35px auto; }
    .news ul li a .txt { font-size: 14px; line-height: 180%; }
    .news ul li a .cat { font-size: 12px; height: 25px; line-height: 25px; padding: 0 8px; }

    .about-news { padding: 50px 0; background-size: 200% auto; background-position: center -100px; }
    .about_head::after { font-size: 90px; }
    .about_head p { font-size: 36px; padding: 25px 0 0; }
    .about_head p span { padding: 0 0 40px; }
    .about h3 { font-size: 18px; }
    .about ul { padding: 30px 0 0; width: 100%; max-width: 340px; margin: auto; }
    .about ul li { width: 100%; padding: 10px 0; display: flex; flex-wrap: wrap; border: none; justify-content: flex-start; align-items: center; }
    .about ul li .num { font-size: 36px; width: 80px; padding: 0; }
    .about ul li .num::after { left: auto; top: 0; width: 2px; height: 35px; 
        background: rgb(141,196,226);
        background: linear-gradient(180deg, rgba(141,196,226,1) 0%, rgba(34,87,191,1) 100%); 
    }
    .about ul li .txt { line-height: 160%; font-size: 18px; width: calc(100% - 100px); padding: 0 0 0 25px; box-sizing: border-box; text-align: left; }

    .support { padding: 3rem 0 2rem; }
    .support .bubble_bk { top: -20px; }
    .support .about_head p { font-size: 1.25rem; }
    .support ul li { padding: 2rem 6% 1rem; width: 100%; margin-bottom: 1rem; }
    .support ul li .num { font-size: 1.25rem; }
    .support ul li .num span { font-size: 2.5rem; }
    .support ul li .txt { font-size: 1.5rem; padding: 1rem 0; }

    .cashflow h3 { font-size: 30px; }
    .cashflow h3 span { padding: 0; }
    .cashflow .chart { padding: 20px 0; max-width: 520px; margin: auto; }
    .cashflow .chart .icons .round { max-width: none; }
    .cashflow .chart .icons img { width: 24%; box-shadow: 0px 0 14px #cecece; }
    .cashflow .chart .icons .icn2 { left: 0; }
    .cashflow .chart .icons .icn2 { top: 5%; left: 76%; }
    .cashflow .chart .icons .icn3 { top: 56%; left: 76%;  }
    .cashflow .chart .icons .icn4 { width: 60%; top: 87%; left: 20%; max-width: none; }
    .cashflow .chart .icons .icn5 { left: 0; top: 56%; }

    .reason { padding: 30px 0 50px; }
    .reason .r_list { padding: 60px 0 0; }
    .reason .r_list li { border-radius: 5px; max-width: 520px; width: 94%; padding: 20px 6% 25px; margin: 0 auto 60px; position: relative; }
    .reason .r_list li .num-circle { position: absolute; top: -40px; margin: auto; left: 0; right: 0; }
    .reason .r_list li .caption { min-height: 0; padding: 30px 0 15px; }
    .reason .big { padding: 50px 0; font-size: 20px; }
    .reason .r_chart { padding: 0 0 30px; }
    .reason .r_chart .col { width: 94%; max-width: 420px; margin: auto; padding: 0 0 30px; }
    .reason .r_chart .col p { font-size: 12px; padding: 10px 0 0; }
    .reason .demand img { max-width: 420px; }

    .merit_fv { height: 50vw; }
    .merit_wrap { padding: 30px 0 0; }
    .merit h3 { font-size: 80px; }
    .merit .caption { padding: 20px 0 30px; font-size: 16px; }
    .merit .info h4 { padding: 15px 0; font-size: 14px; letter-spacing: 2px; }
    .merit .info .tab .plus-toggle { right: 4%; }
    .merit .info .contents .col { width: 100%; border-left: 1px solid #CCCCCC; border-top: none; }
    .merit .info .contents .col:first-child { border-top: 1px solid #CCCCCC;  }
    .merit .info .contents .col .th { padding: 15px 0; font-size: 16px; }
    .merit .info .contents .col p { padding: 10px 0; font-size: 12px; }
    .merit .list { padding: 20px 0 0; }
    .merit .list .detail { padding: 30px 0 40px; }
    .merit .list .title p { font-size: 30px; letter-spacing: 2px; }
    .merit .list .title h4 { font-size: 18px; padding: 0 0 0 15px; }
    .merit .list .box { width: 100%; }
    .merit .list .title { padding: 0 0 20px; }
    .merit .list .figure { width: 100%; }
    .merit .list .box h5 { font-size: 22px; letter-spacing: 1px; }
    .merit .list .box .txt { font-size: 14px; padding: 20px 0; }
    .merit .list .tags { padding: 0 0 30px; }
    .merit .list .tags li { font-size: 12px; width: 48%; box-sizing: border-box; padding: 0; }

    .exterior .head-style1 { padding: 0 0 20px; }
    .exterior .head-style1 h3 { font-size: 60px; }
    .exterior .col { width: calc(50% - 5px); padding: 0 0 20px; }
    .exterior .col p { font-size: 18px; padding: 10px 0 0; }

    .plan { padding: 30px 0 50px; }
    .plan_wrap::before { left: 0; right: auto; height: 50%; }
    .plan .slider .slide { overflow: visible; }

    .faq { padding: 50px 0; }
    .faq ul li { padding: 10px 0; }
    .faq ul li .question .letter { font-size: 20px; }
    .faq ul li .question .txt { max-width: calc(100% - 50px); font-size: 16px; padding: 0 15px; line-height: 180%; }
    .faq ul li .question .plus-toggle { width: 20px; height: 1px; }
    .faq ul li .txt { max-width: calc(100% - 70px); }

    .voice { padding: 50px 0 0; }
    .voice .slide { padding: 60px 6% 30px; max-width: 80vw; }
    .voice .slick-slider { margin-bottom: 0; }
    .voice .slick-dots { display: none; }
    .voice .slider_nav { padding: 20px 0 0; }
    .voice .slider_nav .pagecount { padding: 0 10px; }
    .voice .slider_nav .slider_arrow { width: 50px; }
    .voice .slide .num { top: 4%; }
    .voice .slide .num span { font-size: 14px; }
    .voice .slide h4 { font-size: 20px; }
    .voice .slide .txt { padding: 20px 0; line-height: 180%; }
    .voice .slide .name { text-align: center; }
    .voice .slide .name p { width: 100%; }
    .voice .slick-dots { display: none !important; }

    .flow  { padding: 60px 0; }
    .flow ol { display: block; padding: 30px 0; }
    .flow ol li { width: 88vw; height: 88vw; margin: 0 auto 50px; }
    .flow ol li::before { width: 30px; top: -30px; bottom: auto; left: 0; right: 0; transform: rotate(180deg); }
    .flow ol li .num { font-size: 40px; }
    .flow ol li .txt { font-size: 24px; }

    .contact { padding: 50px 0 60px; }
    .contact h5 span { font-size: 45px; }
    .contact .txt { font-size: 18px; letter-spacing: 1px; }
    .contact .txt span { display: inline-block; }
    .contact .btn { height: 60px; line-height: 60px; font-size: 16px; width: 80%; }
    .contact .btn img { right: 6%; }
    .contact .tel { border-right: none; border-bottom: 1px solid #ffffff75; }
    .contact .col .caption { padding: 0 0 20px; }
    .contact .col { width: 100%; padding: 20px 0 10px; }

    .to_top a { width: 40px; height: 40px; }

    .footer { padding: 40px 0 20px; }
    .footer h5 { text-align: center; font-size: 30px; padding: 0 0 30px; margin: auto; }
    .footer h5 img { width: 80%;}
    .footer .rights { padding: 10px 0 0; }
}