@charset "UTF-8"; /*----------------------------------------------------- Reset ----------------------------------------------------- */ html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section , main { display: block; } a:link, a:visited, a:hover, a:active { color: #373737; text-decoration: none; } body { line-height: 1; text-align: justify; background: #F2F0EB; /*color: #FAFAF9;*/ color: #373737; font-family: 'A1明朝' , '中ゴシックBBB', "Cardo" , 'sans-serif', 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", "Hiragino Mincho Pro", HGS明朝E, メイリオ, Meiryo, serif /*scroll-behavior: auto; */} ol, ul { list-style: none; } table { border-collapse: collapse; border-spacing: 0; } * { margin: 0; padding: 0; } img { max-width: 100%; width: 100%; height: auto; vertical-align: bottom; flex-shrink: 0; } picture { display: block; } span.uwa { vertical-align: 8px; font-size: 60%; } /*滞在色変*/ #Index nav.localnav #menu01 a , #Outline nav.localnav #menu02 a , #Location nav.localnav #menu03 a , #Plan nav.localnav #menu04 a , #Quality nav.localnav #menu05 a , #Structure nav.localnav #menu06 a { color: #fff; background: var(--blown); } /*オーバーレイ*/ .overlay { background: #fff; position: fixed; top: 0; left: 0; height: 100%; width: 100%; z-index: 10000; } /*fade*/ .fade { opacity: 0; transition: opacity 1.5s; } .fade.is_inview { opacity: 1; transition-delay: .8s; } .fade_early { opacity: 0; transition: opacity 1s; } .fade_early.is_inview { opacity: 1; transition-delay: .1s; } .fadeup { opacity: 0; transform: translateY(30px); transition: opacity 2s, transform .8s; } .fadeup.is_inview { opacity: 1; transform: translateY(0); transition-delay: .1s; } .fadeup02 { opacity: 0; transform: translateY(30px); transition: opacity 2s, transform .8s; } .fadeup02.is_inview { opacity: 1; transform: translateY(0); transition-delay: .2s; } .fadeup03 { opacity: 0; transform: translateY(30px); transition: opacity 2s, transform 1s; } .fadeup03.is_inview { opacity: 1; transform: translateY(0); transition-delay: .3s; } .center { text-align: center; } .left { text-align: left; } .right { text-align: right; } /*----------------------------------------------------- common ----------------------------------------------------- */ h1 , h2 , h3 , h4 , h5 { font-feature-settings: "palt"; font-weight: initial; line-height: 1.5; } .pc { display: block; } .tab { display: none; } .sp { display: none; } p { font-feature-settings: "palt"; line-height: 1.6; } p.annotation { font-size: 10px; } /*p.small { font-size: 10px!important; margin-top: 5px; }*/ p.annotation_mgn { font-size: 10px!important; margin-top: 5px; } p.subttl { font-size: clamp(1.125rem, 1.094rem + 0.16vw, 1.25rem); line-height: 35px; color: #BB915C; margin-bottom: 20px; } /*[data-overDirection="full"] { width: 100vw; margin: 0 calc(50% - 50vw); }*/ [data-size="w750"]{ max-width: 750px; margin: 0 auto; } [data-size="w850"]{ max-width: 850px; width: 90%; margin: 0 auto; } [data-size="w900"]{ max-width: 900px; width: 90%; margin: 0 auto; } [data-size="w1000"]{ max-width: 1000px; width: 90%; margin: 0 auto; } [data-size="w1200"]{ max-width: 1200px; width: 90%; margin: 0 auto; } [date-font="gothic"] { font-family: '中ゴシックBBB'; } [date-font="A1gothic"] { font-family: 'A1ゴシック M'; } :root { --blown: #A08572; --yellowgreen: #94b428; --emeraldgreen-color: #4ac0a0; --gothic-font: 中ゴシックBBB , "Hiragino Kaku Gothic ProN"; --A1gothic-font: A1ゴシック M , "Hiragino Kaku Gothic ProN"; } .line { border:solid #bb915c82 .3px; margin-bottom: 40px; } .center { text-align: center; } .left { text-align: left; } .right { text-align: right; } .mgn10 { margin-bottom: 10px; } .mgn20 { margin-bottom: 20px; } .mgn30 { margin-bottom: 30px; } /*----------------------------------------------------- headまわり ----------------------------------------------------- */ #main { /*position: relative; margin-top: 0px; */background-color: #F2F0EB; } /*下層ページ 冒頭共通*/ .pages .head_area { height: 190px; margin: 0 auto 110px; } .pages .head_area .head_inner { position: relative; max-width: 1920px; height: 100%; display: flex; align-items: center; justify-content: center; } .pages .head_area h3 { display: flex; flex-direction: column; justify-content: center; background: #ffffffba; color: var(--blown); padding: 20px; box-sizing: border-box; max-width: 410px; width: 100%; } .pages .head_area h3 img { margin: 0 auto 10px; } .pages .head_area span { font-size: clamp(0.75rem, 0.703rem + 0.23vw, 0.938rem); text-align: center; } .pages .head_area p.annotation { display: block; position: absolute; right: 3%; bottom: 3%; text-align: right; color: #fff; } .pages .intro { position: relative; } .pages .intro_inner { display: flex; justify-content: space-between; margin-bottom: 50px; position: relative; gap: 20px; } .pages .intro p.intro_ttl { font-size: clamp(1.125rem, 0.991rem + 0.57vw, 1.563rem); line-height: 2; margin-bottom: 50px; } .pages .intro p.txt { font-size: clamp(0.813rem, 0.774rem + 0.16vw, 0.938rem); line-height: 35px; } .pages .intro .txt_wrap { max-width: 425px; width: 100%; } .pages .intro .ph_wrap { max-width: 480px; width: 100%; right: -50px; } /*----------------------------------------------------- Top Page ----------------------------------------------------- */ #Index #main { overflow: hidden; } /* 予告広告 */ #Index .yokoku_wrap { position: absolute; z-index: 10; margin: 20px auto 0; right: 0; left: 0; font-family: var(--gothic-font); display: flex; align-items: center; justify-content: center; padding: 0 5%; box-sizing: border-box; } #Index .yokoku_wrap span.ttl { width: 70px; text-align: center; font-size: 13px; border: 1px solid; padding: 5px; box-sizing: border-box; display: block; margin-right: 10px; white-space: nowrap; } #Index .yokoku_wrap p.yokoku_txt { font-size: clamp(0.625rem, 0.587rem + 0.16vw, 0.75rem); display: flex; align-items: center; } /* スライド */ #Slider_wrap { position: relative; margin-bottom: 30px; } #Slider_wrap .logo_mark { position: absolute; top: 55%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); max-width: 190px; width: 100%; z-index: 10; } #Slider { z-index: 3; position: relative; } #Slider .slider-img img { max-width: 100%; width: 100%; height: auto; } #Slider .slide-dots { margin: 0; padding: 0; text-align: center; display: none; } #Slider button { background: none; border: none; outline: none; padding: 5px 15px; } /* メインコンテンツ */ #Index .common_area .catch_copy { text-align: center; background: url("../img/top/catch_parts.png") no-repeat; max-width: 282px; height: auto; background-size: contain; margin: 0 auto 50px; } #Index .common_area .catch_copy img { max-width: 193px; width: 100%; } #Index .common_area .access_detail { background: #fff; padding: 20px 5%; text-align: center; } #Index .common_area .access_detail img { max-width: 885px; width: 100%; } #Index .fg_name_wrap { text-align: center; margin-bottom: 60px; padding: 0 5%; } #Index .fg_name { font-size: clamp(2rem, 1.641rem + 1.8vw, 3.438rem); margin-bottom: 10px; line-height: 1; } #Index .fg_subname { font-size: clamp(0.875rem, 0.813rem + 0.31vw, 1.125rem); color: var(--blown); } /* CVエリア */ #Index .cv_area { padding: 60px 5% 0; margin-bottom: 100px; } #Index .cv_area .cv_area_ttl { font-size: clamp(2.188rem, 1.797rem + 1.95vw, 3.75rem); text-align: center; margin-bottom: 35px; line-height: 1.1; } #Index .cv_area .cv_btn { max-width: 600px; margin: 0 auto; background: var(--blown); text-align: center; transition: .2s cubic-bezier(0.45, 0, 0.55, 1); cursor: pointer; } #Index .cv_area .cv_btn a { font-size: clamp(1.25rem, 1.172rem + 0.39vw, 1.563rem); color: #fff; padding: 30px 5%; display: block; } #Index .cv_area .cv_btn:hover { box-shadow: 0px 0px 10px 2px rgb(162 85 15 / 40%); } /* インフォメーション */ #Index .information { margin: 0 auto 100px; max-width: 500px; } #Index .information .information_content { background: #fff; padding: 60px 130px; box-sizing: border-box; margin-right: calc(50% - 50vw); position: relative; } #Index .information h3.head_en { position: absolute; top: 20px; z-index: 1; left: -155px; } #Index .information h3.head_en img { max-width: 212px; width: 100%; } #Index .information dl { height: 100px; overflow-y: scroll; position: relative; padding-right: 30px; } #Index .information .info-item { display: flex; margin-bottom: 10px; align-items: flex-start; } #Index .information .info-item:last-child { margin-bottom: 0; } #Index .information .info-item dt { margin-right: 2em; white-space: nowrap; padding-top: 3px; font-size: clamp(0.813rem, 0.766rem + 0.23vw, 1rem); } #Index .information .info-item dd { line-height: 1.6; font-size: clamp(0.813rem, 0.766rem + 0.23vw, 1rem); } /* コンセプト */ #Index .concept_area { background-color: #F2F0EB; transition: background-color 0.5s ease, color 0.5s ease, border-bottom-color 0.5s ease; padding-bottom: 80px; } #Index .concept_area .concept_ttl { position: relative; height: 250px; display: flex; align-items: center; justify-content: center; background: url("../img/top/cencept_bg.png") no-repeat; background-size: cover; margin-bottom: 80px; } #Index .concept_area .concept_ttl p.annotation { position: absolute; left: 5%; bottom: 10px; color: #fff; } #Index .concept_area h3.head_en { max-width: 130px; width: 100%; } #Index .color_bg h4 { text-align: center; font-size: clamp(1.625rem, 1.516rem + 0.55vw, 2.063rem); margin-bottom: 50px; } #Index .color_bg h4 span { display: block; font-size: clamp(1.125rem, 0.984rem + 0.7vw, 1.688rem); } #Index .color_bg .section_inner { display: flex; justify-content: space-between; gap: 20px; } #Index .color_bg .section_inner picture { max-width: 465px; width: 100%; } #Index .color_bg .section_inner p.txt { font-size: clamp(0.875rem, 0.859rem + 0.08vw, 0.938rem); line-height: 2; } #Index .color_bg .section_inner .txt_wrap { max-width: 390px; width: 100%; } #Index .color_bg .section_inner .txt_wrap p.annotation { margin-top: 10px; } #Index .color_bg .section_inner.sec01 { margin-bottom: 80px; } #Index .color_bg .section_inner.sec02 { flex-direction: row-reverse; } #Index .concept_area.color-active { background-color: #716864; color: #fff; padding-bottom: 80px; border-bottom-color: #716864; } #Index .concept_area .concept_ttl img { filter: invert(0); transition: filter 0.5s ease; } #Index .concept_area .last-line { display: inline-flex; align-items: center; gap: 10px; } #Index .concept_area .last-line::after { content: ""; display: block; width: 100px; height: 1px; background-color: #373737;; margin-bottom: 3px; } #Index .concept_area.color-active .last-line::after { background-color: #fff } /* 街並み */ #Index .common_area02 { position: relative; z-index: 1; margin-top: 100px; } #Index .common_area02 .fg_name_wrap { margin-bottom: 0; } #Index .common_area02 .catch_copy { margin-bottom: 100px; } #Index .common_area02 .annotation { position: absolute; right: 5%; text-shadow: 1px 1px 10px #fff, -1px 1px 10px #fff, 1px -1px 10px #fff, -1px -1px 10px #fff; bottom: 10px; } /* コンテンツリンク */ #Index .contents_area { padding: 80px 0; background-color: #F2F0EB; color: #333; transition: background-color 0.5s ease, color 0.5s ease, border-bottom-color 0.5s ease; } #Index .contents_area.contents-active { background-color: #BDA490; color: #fff; border-bottom-color: #BDA490; } #Index .contents_area h3 { text-align: center; } #Index .contents_area h3 img { max-width: 160px; width: 100%; margin: 0 auto 60px; filter: invert(1); } #Index .contents_area.contents-active h3 img { filter: invert(0); } #Index .contents_links { background: #fff; max-width: 850px; width: 100%; box-sizing: border-box; display: flex; align-items: center; transition: .7s; padding: 40px 50px; position: relative; } #Index .contents_links:hover .contents_img { opacity: .3; } #Index .contents_links:not(:last-of-type) { margin-bottom: 60px; } #Index .contents_links:last-child { margin-bottom: 0 !important; } #Index .contents_links:nth-child(even) { flex-direction: row-reverse; margin: 0 0 60px auto; } #Index .contents_links .contents_img { max-width: 540px; width: 100%; position: absolute; right: -50px; } #Index .contents_links:nth-child(even) .contents_img { position: absolute; left: -50px; } #Index .contents_links_txtarea { display: flex; align-items: baseline; flex-direction: column; max-width: 280px; } #Index .contents_links_txtarea h4 { font-size: 25px; color: var(--green-color); margin-bottom: 10px; } #Index .contents_area h4 img { margin-bottom: 10px; } #Index .contents_area .access h4 img { max-width: 252px; width: 100%; } #Index .contents_area .plan h4 img { max-width: 55px; width: 100%; } #Index .contents_area .quality h4 img { max-width: 100px; width: 100%; } #Index .contents_area .structure h4 img { max-width: 288px; width: 100%; } #Index .contents_area h4 span { display: block; font-size: clamp(0.813rem, 0.781rem + 0.16vw, 0.938rem); color: var(--blown); } #Index .contents_links_txt { font-size: clamp(0.813rem, 0.766rem + 0.23vw, 1rem); margin-bottom: 20px; } #Index .more_btn { background: #fff; border: 1px solid var(--blown); font-family: var(--A1gothic-font); max-width: 195px; padding: 13px 20px; box-sizing: border-box; position: relative; cursor: pointer; text-align: center; margin: 0 0 0 auto; font-size: clamp(0.813rem, 0.766rem + 0.23vw, 1rem); transition: all 0.2s ease-in-out; } /*#Index .more_btn:after { content: ""; width: 0%; height: 100%; background: var(--blown); color: #fff; position: absolute; transition: all 0.4s ease-in-out; }*/ #Index .contents_links:hover .more_btn::after { width: 100%; } #Index .more_btn span { position: relative; box-sizing: border-box; text-align: center; color: var(--blown); z-index: 20; transition: all 0.3s ease-in-out; margin-left: 20px; } #Index .contents_links .btn_arrow { margin-right: 5px; line-height: 0; } #Index .contents_links .btn_arrow svg { fill: var(--blown); width: 7px; height: 11px; transition: all 0.3s ease; } #Index .contents_links:hover .more_btn { background:var(--blown); } #Index .contents_links:hover .more_btn span { color: #fff; } #Index .contents_links:hover .btn_arrow svg { fill: #fff; } /* フッター */ #Index .last { margin-bottom: 80px; } #Index .last .cv_area { margin-bottom: 50px; } /*----------------------------------------------------- Location Common ----------------------------------------------------- */ #Location #main , #Quality #main {padding-bottom:100px;} #Location .head_area {background:url("../img/location/head.png") no-repeat;background-size:cover;background-position:center;margin-bottom:0;} #Location .head_area h3 img {max-width:285px;width:100%;} #Location .pages .intro::before {content:'';display:block;background:url("../img/location/intro_bg.png") no-repeat;background-size:cover;width:100%;min-height:550px;z-index:-1;position:absolute;} #Location .pages .intro_inner {padding:60px 0 50px;margin-bottom:0;} #Location .pages .intro .txt_wrap, #Location .pages .intro .ph_wrap {position:relative;} #Location .anchor_menu_wrap {padding:0 0 60px;} #Location ul.menu {display:flex;justify-content:center;gap:25px;} #Location ul.menu li {max-width:192px;display:flex;align-items:center;justify-content:center;transition:0.3s ease-in-out;background:var(--blown-color);} #Location ul.menu li:hover {opacity:.6;} #Location .txt15 {font-size:clamp(0.813rem, 0.781rem + 0.16vw, 0.938rem);} #Location .txt23 {font-size:clamp(1.125rem, 1.047rem + 0.39vw, 1.438rem);} #Location .anchor_obi {display:flex;justify-content:center;align-items:stretch;} #Location .anchor_obi .ph, #Location .anchor_obi .head_ttl {width:50%;} #Location .anchor_obi .head_ttl {background:#716864;display:flex;align-items:center;justify-content:center;} #Location .anchor_obi .ph {position:relative;} #Location .anchor_obi p.annotation {position:absolute;right:5%;color:#fff;bottom:2%;} #Location .anchor_intro .txt23 {margin-bottom:30px;} #Location .sec {margin-bottom:100px;} #Location .sec_head .sec_head_ttl {background:#ffffffcc;width:340px;height:100px;display:flex;align-items:center;} #Location .anchor_inner {margin-bottom:140px;position:relative;} #Location .anchor_inner .txt23 {text-align:center;margin-bottom:40px;} #Location .anchor_inner .flex {display:flex;justify-content:space-between;gap:40px;margin-bottom:30px;flex-wrap:wrap;} #Location .anchor_inner .flex .box {width:calc(100% / 2 - 20px);} #Location .anchor_inner .flex .box.center_box {margin: 0 auto} #Location .anchor_inner .flex .box p.txt13 {font-size:clamp(0.688rem, 0.656rem + 0.16vw, 0.813rem);} #Location .anchor_inner .sp_flex {display:flex;justify-content:space-between;flex-wrap:wrap;margin-bottom:10px;} #Location .anchor_inner .sp_flex .box {width:calc(92% / 3);margin-bottom:30px;} #Location .anchor_inner .sp_flex::after {content:'';display:block;width:calc(92% / 3);} #Location .anchor_inner .sp_flex.column4 .box {width:calc(92% / 4);margin-bottom:30px;} #Location .anchor_inner .sp_flex.column4::after {content:'';display:block;width:calc(92% / 3);} #Location .anchor_inner .ph {margin-bottom:10px;} /*----------------------------------------------------- Access (#Access_anchor) ----------------------------------------------------- */ #Location #Access_anchor {margin-bottom:60px;} #Location #Access_anchor .anchor_obi h4 {max-width:220px;} #Location #Access_anchor .anchor_intro {background:#E0D8CB;} #Location #Access_anchor .anchor_intro_inner {display:flex;justify-content:space-between;gap:50px;padding:60px 0;} #Location #Access_anchor .anchor_intro_inner .txt_wrap {width:30em;} #Location .anchor_intro picture {max-width:565px;width:100%;} #Location .access_intro p.annotation { margin-top: 20px; text-align: right; } /* train */ #Location .train .sec_head {background:url("../img/location/train_head_img.png") no-repeat;background-size:cover;display:flex;justify-content:center;align-items:center;height:180px;position:relative;margin-bottom:60px;background-position:center;} #Location .train .sec_head .sec_head_ttl img {max-width:98px;margin:0 auto;} #Location .train .sec_head p.annotation {position:absolute;right:5%;bottom:1%;} #Location .train .txt15 {text-align:center;margin-bottom:40px;line-height:2;} #Location .train .train_img01, #Location .train .train_img03 {margin-bottom:60px;} #Location .train .train_img02 {margin-bottom:30px;} #Location .train .train_img02 p.annotation_mgn {padding-right:5%; max-width: 900px; width: 90%; margin-left: auto; margin-right: auto; } #Location .sec_ttl {margin-bottom:10px; font-size: clamp(1.125rem, 1.047rem + 0.39vw, 1.438rem); text-align: center;} /* renewal */ #Location .renewal_wrap {background:url("../img/location/renewal_bg.png") no-repeat;background-size:100%;padding:100px 0;} #Location .renewal_container {background:#fff;max-width:900px;width:90%;margin:0 auto;} #Location .renewal_inner {padding:0 50px 50px 50px;box-sizing:border-box;} #Location .renewal_main {margin-bottom:30px;} #Location .renewal_wrap .sec {margin-bottom:80px;} #Location .renewal_wrap .sec:last-of-type {margin-bottom:60px;} #Location .renewal_wrap .renewal_img {margin-bottom:10px;} #Location .renewal_wrap .txt15 {font-size:15px;text-align:center;line-height:2;} #Location .renewal_wrap .renewal_intro {margin-bottom:60px;} #Location .renewal_wrap .renewal_ttl {color:#B93F47;font-size:23px;text-align:center;margin-bottom:20px;} #Location .renewal_wrap p.sec_txt {font-size:13px;font-family:var(--gothic-font);margin-bottom:10px;} #Location .renewal_wrap .renewal_img {margin-bottom:30px;} #Location .renewal_wrap .renewal_sec02_img, #Location .renewal_wrap .sec .box {margin-bottom:20px;} #Location .renewal_wrap .sec picture {margin-bottom:10px;} /* car */ #Location .car .sec_head {background:url("../img/location/car_head_img.png") no-repeat;background-size:cover;display:flex;justify-content:center;align-items:center;height:180px;position:relative;margin-bottom:60px;background-position:center;} #Location .car .sec_head .sec_head_ttl img {max-width:98px;margin:0 auto;} #Location .car .sec_head p.annotation {position:absolute;right:5%;bottom:1%;color:#fff;} #Location .car .car_img01 {margin-bottom:10px;} /*----------------------------------------------------- Location (#Location_anchor) ----------------------------------------------------- */ #Location #Location_anchor .intro {background:#E0D8CB;} #Location #Location_anchor .tanabata {background:#DCEAF5;padding-bottom:70px;} #Location #Location_anchor .tanabata .tanabata_main {margin-bottom:60px;} #Location #Location_anchor .tanabata .tanabata_inner .flex {display:flex;justify-content:space-between;gap:50px;} #Location #Location_anchor .tanabata .tanabata_inner .flex .phtxt {max-width:254px;margin-top:10px;} /* Shopping */ #Location .shopping .sec_head {background:url("../img/location/shopping_head_img.png") no-repeat;background-size:cover;display:flex;justify-content:center;align-items:center;height:180px;position:relative;margin-bottom:60px;background-position:center;} #Location .shopping .sec_head .sec_head_ttl img {max-width:98px;margin:0 auto;} #Location .shopping .sec_head p.annotation {position:absolute;right:5%;bottom:1%;} #Location #Shopping_anchor .info_open .open_txt {max-width:545px;width:100%;margin:0 auto 30px;} /* Gourmet */ #Location .gourmet .sec_head {background:url("../img/location/gourmet_head_img.png") no-repeat;background-size:cover;display:flex;justify-content:center;align-items:center;height:180px;position:relative;margin-bottom:60px;background-position:center;} #Location .gourmet .sec_head .sec_head_ttl img {max-width:98px;margin:0 auto;} #Location .gourmet .sec_head p.annotation {position:absolute;right:5%;bottom:1%;color:#fff;} /* Park */ #Location .park .sec_head {background:url("../img/location/park_head_img.png") no-repeat;background-size:cover;display:flex;justify-content:center;align-items:center;height:180px;position:relative;margin-bottom:60px;background-position:center;} #Location .park .sec_head .sec_head_ttl img {max-width:57px;margin:0 auto;} #Location .park .sec_head p.annotation {position:absolute;right:5%;bottom:1%;color:#fff;} /* Education */ #Location .education .sec_head {background:url("../img/location/education_head_img.png") no-repeat;background-size:cover;display:flex;justify-content:center;align-items:center;height:180px;position:relative;margin-bottom:60px;background-position:center;} #Location .education .sec_head .sec_head_ttl img {max-width:125px;margin:0 auto;} #Location .education .sec_head p.annotation {position:absolute;right:5%;bottom:1%;color:#fff;} #Location #Education_anchor .park_contents {background:#E6E6DC;margin-bottom:40px;} #Location #Education_anchor .park_contents_inner {padding:40px;} #Location #Education_anchor .park_contents_flex {display:flex;justify-content:space-between;gap:15px;} #Location #Education_anchor .park_contents_flex:not(:last-child) {margin-bottom:90px;} #Location #Education_anchor .leftbox {max-width:550px;width:100%;} #Location #Education_anchor .leftbox .phwrap {margin-bottom:40px;} #Location #Education_anchor .leftbox p.txt13 {font-size:clamp(0.688rem, 0.656rem + 0.16vw, 0.813rem);} #Location #Education_anchor .rightbox {width:20em;background:#fff;padding:5px;box-sizing:border-box;} #Location #Education_anchor .rightbox .subimg_ttl {font-size:clamp(0.938rem, 0.891rem + 0.23vw, 1.125rem);color:var(--blown-color);} #Location #Education_anchor .rightbox .txt12 {font-size:clamp(0.813rem, 0.828rem + -0.08vw, 0.75rem);padding:5px 10px;box-sizing:border-box;margin-bottom:5px;} #Location #Education_anchor .rightbox article:not(:last-child) {margin-bottom:30px;} #Location #Education_anchor .kosodate_wrap {background:#EFE5E4 url("../img/location/kosodate_bg.png") no-repeat;background-size:40%;background-position:left top;padding:50px;box-sizing:border-box;} #Location #Education_anchor .kosodate_wrap article:not(:last-child) {margin-bottom:50px;} #Location #Education_anchor .kosodate_wrap .kosodate_flex {display:flex;justify-content:space-between;gap:20px;} #Location #Education_anchor .kosodate_wrap .mainimg {max-width:440px;width:100%;} #Location #Education_anchor .kosodate_flex .txt_wrap {width:calc(100% - 440px);} #Location #Education_anchor .kosodate_wrap p.kosodate_ttl {text-align:center;color:#CE8A7A;font-size:clamp(1.125rem, 1.047rem + 0.39vw, 1.438rem);margin-bottom:20px;} #Location #Education_anchor .kosodate_wrap p.kosodate_ttl + .annotation {text-align:center;margin-bottom:20px;} #Location #Education_anchor .kosodate_wrap .detail p.kosodate_ttl {margin-bottom:0;} #Location #Education_anchor .kosodate_wrap p.txt {font-size:clamp(0.813rem, 0.828rem + -0.08vw, 0.75rem);margin-bottom:20px;} #Location #Education_anchor .kosodate_wrap p.time {font-size:clamp(0.625rem, 0.594rem + 0.16vw, 0.75rem);margin-top:10px;} #Location #Education_anchor .kosodate_wrap .link_btn {background:#CE8A7A;color:#fff;max-width:250px;width:100%;padding:10px;box-sizing:border-box;display:block;font-size:14px;margin-top:10px;text-align:center;transition:.5s;} #Location #Education_anchor .kosodate_wrap .link_btn:hover {background:var(--blown);} #Location #Education_anchor .mimamori_flex {display:flex;justify-content:space-between;} #Location #Education_anchor .mimamori_flex .blk {width:calc(100% / 3 - 20px);display:flex;flex-direction:column;} #Location #Education_anchor .mimamori_flex .blk .ph {margin-bottom:10px;} #Location #Education_anchor .mimamori_flex .blk .blk_ttl {font-size:clamp(1rem, 0.984rem + 0.08vw, 1.063rem);color:#CE8A7A;} #Location #Education_anchor .mimamori_flex .blk .blk_ttl span {font-size:80%;color:#373737;margin-left:5px;} #Location #Education_anchor .mimamori_flex .blk .blk_txt {font-size:clamp(0.688rem, 0.672rem + 0.08vw, 0.75rem);margin-bottom:10px;} #Location #Education_anchor .mimamori_flex .kosodate_ph02_txt, #Location #Education_anchor .mimamori_flex .kosodate_ph03_txt, #Location #Education_anchor .mimamori_flex .link_btn {margin-top:auto;} /* Hospital */ #Location .hospital .sec_head {background:url("../img/location/hospital_head_img.png") no-repeat;background-size:cover;display:flex;justify-content:center;align-items:center;height:180px;position:relative;margin-bottom:60px;background-position:center;} #Location .hospital .sec_head .sec_head_ttl img {max-width:97px;margin:0 auto;} #Location .hospital .sec_head p.annotation {position:absolute;right:5%;bottom:1%;} #Hospital_anchor .anchor_inner, #Bank_anchor {margin-bottom:100px;} #Hospital_anchor .hospital_detail {background:#E6EFEC;padding:50px;box-sizing:border-box;margin-bottom:40px;} #Hospital_anchor .hospital_detail p.hospital_detail_ttl {color:#489C9C;text-align:center;font-size:clamp(1.125rem, 1.047rem + 0.39vw, 1.438rem);margin-bottom:30px;} #Hospital_anchor .hospital_detail .map {max-width:380px;margin:0 auto 40px;} /* Bank */ #Bank_anchor p.bank_ttl {text-align:center;color:var(--blown);background:#E2D9D3;padding:10px;font-size:clamp(1rem, 0.891rem + 0.55vw, 1.438rem);margin-bottom:20px;} /*----------------------------------------------------- Page Common ----------------------------------------------------- */ .floor_kind_wrap { display: flex; justify-content: space-between; } .floor_kind_wrap .txt_wrap { display: flex; flex-direction: column; background: #ffffffd4; padding: 20px 30px; height: 100%; position: relative; } .floor_kind_wrap .kind_item:not(:first-of-type) .txt_wrap::before { content: ''; border-left: 1px solid #997660; left: 0; width: 1px; height: 85%; position: absolute; } .floor_kind_wrap .kind_item { display: flex; flex-direction: column; width: calc(100% / 3); } .floor .txt_wrap .name_wrap p { color: #51311a; } .floor_kind_wrap .name_wrap { text-align: center; margin-bottom: 10px; } .floor_kind_wrap .name_wrap p.name_img { font-size: clamp(1rem, 0.938rem + 0.31vw, 1.25rem); line-height: 1; margin-bottom: 5px; } .floor_kind_wrap .name_wrap p.name { font-size:clamp(1.563rem, 1.484rem + 0.39vw, 1.875rem); line-height: 1; margin-bottom: 5px; } .floor_kind_wrap p.kind_txt { font-size: 13px; line-height: 22px; text-align: left; margin-bottom: 0; text-align: justify; } #Plan .floor_kind_wrap .txt_wrap { background: #FAF4E8; margin-bottom: 0!important; } #Plan .floor_kind_wrap { margin-bottom: 60px; } /*----------------------------------------------------- Plan Page General Styles ----------------------------------------------------- */ #Plan h3 img {max-width:62px;} #Plan .head_area {background:url("../img/plan/head.png") no-repeat;background-size:cover;background-position:center;} #Plan .sec_ttl { font-size: clamp(1rem, 0.938rem + 0.31vw, 1.25rem); text-align: center; margin-bottom: 20px; } #Plan ul.menu {display:flex;justify-content:center;gap:25px;} #Plan ul.menu li {max-width:250px; display:flex;align-items:center;justify-content:center;transition:0.3s ease-in-out;background:#fff;} #Plan ul.menu li a { padding: 20px 20px 16px; box-sizing: border-box; } #Plan ul.menu li a::after { content: ''; display: inline-block; width: 0; height: 0; border-style: solid; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 7px solid #716864; border-right: 0; vertical-align: 1px; margin-left: 10px; } #Plan ul.menu li:hover {opacity:.6;} /*----------------------------------------------------- landplan ----------------------------------------------------- */ #Plan .landplan { background: #E0D8CB; padding: 100px 0; } #Plan .landplan .en{ max-width: 241px; margin: 0 auto 70px; } #Plan .landplan .kukaku { max-width: 756px; margin: 0 auto 60px; } /*----------------------------------------------------- landplan ----------------------------------------------------- */ #Plan .housedesign { padding: 100px 0; } #Plan .housedesign .en { max-width: 324px; margin: 0 auto 70px; } #Plan .housedesign .housedesign_img { max-width: 667px; margin: 40px auto 0; } /*----------------------------------------------------- common ----------------------------------------------------- */ #Plan .sec .obi_ttl { min-height: 180px; position: relative; display: flex; align-items: center; justify-content: center; } #Plan .sec .obi_ttl .annotation { position: absolute; right: 2%; bottom: 1%; } #Plan .sec_inner { padding: 60px 0; } #Plan .sec_inner .head { text-align: center; margin-bottom: 50px; } #Plan .txt23 { font-size: clamp(1.125rem, 1.047rem + 0.39vw, 1.438rem); margin-bottom: 10px; } #Plan .txt22 { font-size: clamp(1.125rem, 1.063rem + 0.31vw, 1.375rem); } #Plan .txt15 { font-size: clamp(0.813rem, 0.781rem + 0.16vw, 0.938rem); } #Plan .txt12 { font-size: 12px; } #Plan .sec_inner .head .txt15 { line-height: 2; } /*----------------------------------------------------- wood ----------------------------------------------------- */ #Plan .wood .obi_ttl { background: url("../img/plan/wood_bg.png")no-repeat; background-size: cover; background-position: center; } #Plan .wood .obi_ttl .en { max-width: 109px; margin: 0 auto; } #Plan article:first-of-type {margin-bottom:60px;} #Plan .ttl_flex {display:flex;align-items:center;gap:30px;margin-bottom:20px;} #Plan .ttl_img {max-width: 114px;} #Plan .ttl {font-size:clamp(1.125rem, 1.047rem + 0.39vw, 1.438rem);margin-bottom:5px;} #Plan .txt {font-size:clamp(0.875rem, 0.859rem + 0.08vw, 0.938rem);} #Plan .fl_img_flex {display:flex;justify-content:space-between;gap:15px;} #Plan .fl_img_box {max-width:425px;} #Plan p.fl_img_txt {font-size:clamp(0.625rem, 0.594rem + 0.16vw, 0.75rem);margin-top:5px;} #Plan .beam .fl_img_txt {text-align:right;} /*----------------------------------------------------- color ----------------------------------------------------- */ #Plan .color .obi_ttl { background: url("../img/plan/color_bg.png")no-repeat; background-size: cover; background-position: center; } #Plan .color .obi_ttl .en { max-width: 110px; margin: 0 auto; } /*----------------------------------------------------- comfortable ----------------------------------------------------- */ #Plan .comfortable .obi_ttl { background: url("../img/plan/comfortable_bg.png")no-repeat; background-size: cover; background-position: center; } #Plan .comfortable .obi_ttl .en { max-width: 218px; margin: 0 auto; } /*----------------------------------------------------- laundry ----------------------------------------------------- */ #Plan .laundry_blk {margin:60px auto;background:#E8F6F6;position:relative;overflow:hidden;} #Plan .laundry_blk::before {content:'';display:block;background:url("../img/quality/laundry_bg01.png") no-repeat;background-size:contain;position:absolute;top:60px;right:-5px;width:344px;height:377px;} #Plan .laundry_blk .laundry::after {content:'';display:block;background:url("../img/quality/laundry_bg02.png") no-repeat;background-size:contain;position:absolute;bottom:0;left:-6%;width:377px;height:377px;z-index:-1;} #Plan .laundry_blk .laundry_inner {width:90%;margin:0 auto;z-index:1;position:relative;} #Plan .laundry_blk .laundry .laundry_ttl_wrap {margin-bottom:30px;} #Plan .laundry_blk .laundry .laundry_img01 {width:48%;} #Plan .laundry_blk .laundry .txt23 {color:#5EAFBE;margin-bottom:10px;} #Plan .laundry_blk .flex { display: flex; justify-content: space-between; } #Plan .laundry_blk .laundry .laundry_img01 {width:48%;} #Plan .laundry_blk .item { margin-bottom: 30px; width: 48%; } #Plan .laundry_blk h5 { font-size: clamp(1rem, 0.969rem + 0.16vw, 1.125rem); background: #5EAFBE; padding-left: 10px; padding-right: 10px; text-align: left; margin-bottom: 10px; color: #fff; height: 35px; display: flex; align-items: center; } #Plan .laundry_blk p.blk_ttl {font-size:clamp(1.125rem, 1.063rem + 0.31vw, 1.375rem);height: 40px;display: flex; align-items: center;justify-content: center;background:#5EAFBE;margin-bottom:25px;text-align:center;color:#fff;} /*----------------------------------------------------- bathtime ----------------------------------------------------- */ #Plan .bathtime_blk {background:url("../img/quality/bathtime_bg.png") no-repeat;background-size:cover;margin-bottom:30px;position:relative;} #Plan .bathtime_blk .bathtime_inner {padding:20px 70px 40px;box-sizing:border-box;} #Plan .bathtime_blk p.txt23 {color:#489C9C;margin-bottom:5px;} #Plan .bathtime_blk .ttl_area {margin-bottom:30px;} #Plan .bathtime_blk .ttl_area p {text-align:center;} #Plan .bathtime_blk p.blk_ttl {font-size:clamp(1.125rem, 1.063rem + 0.31vw, 1.375rem);height: 40px;display: flex; align-items: center;justify-content: center;background:#489C9C;text-align:center;color:#fff;} /*----------------------------------------------------- kitchen ----------------------------------------------------- */ #Plan .kitchen_blk {margin-bottom: 30px;} #Plan .kitchen_blk .blk_ttl { text-align: center; font-size: clamp(1.125rem, 1.063rem + 0.31vw, 1.375rem); color: #fff; background: #AD9380; height: 40px;display: flex; align-items: center;justify-content: center; } /*----------------------------------------------------- bels ----------------------------------------------------- */ #Plan .bels_blk {background: #E6E6DC; margin-bottom: 80px;} #Plan .bels_blk .bels_inner { padding: 30px; box-sizing: border-box; } #Plan .bels_blk .blk_ttl { text-align: center; font-size: clamp(0.938rem, 0.828rem + 0.55vw, 1.375rem); color: #fff; background: #5A8A7A; height: 40px;display: flex; align-items: center;justify-content: center; } #Plan .bels_blk .txt23 { color: #5A8A7A; } #Plan .bels_blk .txt_area { text-align: center; } /*----------------------------------------------------- bnr_link ----------------------------------------------------- */ #Plan .bnr_link { text-align: center; } #Plan .bnr_link p.txt20 { font-size: clamp(1rem, 0.938rem + 0.31vw, 1.25rem); margin-bottom: 30px; } #Plan .bnr_link a { transition: .5s; } #Plan .bnr_link a:hover { opacity: .5; } #Plan .bnr_link a img { max-width: 540px; width: 100%; margin: 0 auto;} /*----------------------------------------------------- exterior ----------------------------------------------------- */ #Plan .exterior_blk { background: #D6DBCB url("../img/plan/exterior_bg.png")no-repeat; background-position: top right; background-size: 100%; position: relative; } #Plan .exterior_blk .exterior_inner { padding: 100px 0; } #Plan .exterior_blk .en { max-width: 186px; margin: 0 auto 40px; } #Plan .exterior_blk .annotation { position: absolute; right: 3%; top: 10px; } #Plan .exterior_blk .head { text-align: center; margin-bottom: 30px; } #Plan .exterior_blk .point_wrap { background: #ffffffb0; padding: 65px 30px 30px; box-sizing: border-box; position: relative; margin: 50px auto;} #Plan .exterior_blk .point_wrap .en_point { position: absolute; max-width: 150px; top: -10px; right: 0; left: 0; margin: 0 auto; } #Plan .exterior_blk .point_wrap .point_flex { display: flex; justify-content: space-between; } #Plan .exterior_blk .point_wrap .pc_flex { display: flex; justify-content: space-between; gap: 20px; } #Plan .exterior_blk .point_wrap .box { width: 48%; position: relative; } #Plan .exterior_blk .point_wrap .box:first-child::after { content: ''; width: 1px; height: 100%; border-right: 1px solid #A08572; position: absolute; top: 0; right: -4%; } #Plan .exterior_blk .point_wrap .exterior_point_img01 { margin-bottom: 20px; } #Plan .exterior_blk .point_wrap .exterior_point_img02 .annotation { position: inherit; } #Plan .exterior_blk .point_wrap .harf { width: 48%; } #Plan .exterior_blk .point_wrap .txt23 { color: var(--blown); } /*----------------------------------------------------- Madori_anchor ----------------------------------------------------- */ #Plan #Madori_anchor { padding: 100px 0 50px; } #Plan #Madori_anchor .en { max-width: 131px; margin: 0 auto 50px; } #Plan #Madori_anchor .plan_detail { background: #ffffffb8; padding: 60px 50px; box-sizing: border-box; margin-bottom: 40px; } #Plan #Madori_anchor .plan_detail:not(:last-of-type) { margin-bottom: 80px; } #Plan #Madori_anchor .plan_detail .plan_num { padding-bottom: 20px; text-align: center; } #Plan #Madori_anchor .plan_detail .plan_num img { max-width: 100px; margin-bottom: 20px; } #Plan #Madori_anchor .plan_detail .plan_num::after { content: ''; display: block; width: 100%; border-bottom: 1px solid var(--blown); } #Plan #Madori_anchor .plan_detail .madori { width: 90%; margin: 0 auto 20px; } /*----------------------------------------------------- plant ----------------------------------------------------- */ #Plan .plant_blk .plant_wrap { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px; } #Plan .plant_blk .plant_item { background: #fff; padding: 20px; box-sizing: border-box; width: calc( 95% / 3); } #Plan .plant_blk .plant_item p.name { text-align: center; font-size: clamp(1rem, 0.922rem + 0.39vw, 1.313rem);} #Plan .plant_blk .plant_item p.flowering { text-align: center; font-size: clamp(0.75rem, 0.719rem + 0.16vw, 0.875rem); background: var(--blown); color: #fff; padding: 10px; box-sizing: border-box; margin-bottom: 10px; } #Plan .plant_blk .plant_item p.txt12 { font-size: clamp(0.625rem, 0.594rem + 0.16vw, 0.75rem); } #Plan .plant_blk .plant_item picture { margin-bottom: 10px; } #Plan .plant_blk .plant_all{ margin: 20px auto 0; } #Plan .plant_blk .plant_all picture { margin-bottom: 10px; } /*----------------------------------------------------- Quality Page General Styles ----------------------------------------------------- */ #Quality h3 img {max-width:111px;} #Quality .head_area {background:url("../img/quality/head.png") no-repeat;background-size:cover;background-position:center;} #Quality p.anchor_ttl {font-size:clamp(1.125rem, 0.938rem + 0.94vw, 1.875rem);padding:5px;background:var(--blown);margin-bottom:25px;text-align:center;color:#fff;} #Quality h5 {font-size:clamp(0.875rem, 0.76rem + 0.49vw, 1.25rem);background:#E0D8CB;padding:10px;text-align:left;margin-bottom:10px;} #Quality .flex {display:flex;justify-content:space-between;} #Quality .harf48 {width:48%;margin-bottom:40px;} #Quality .item {margin-bottom:30px;width:48%;} #Quality .item_wrap {display:flex;flex-wrap:wrap;justify-content:space-between;} #Quality .item_wrap_annotation {margin-bottom:45px;} #Quality .con_txt_wrap {width:100%;} #Quality .box_img {max-width:min(100%, 230px);width:100%;} #Quality .inner_flex, #Quality .inner_flex_pc {display:flex;justify-content:space-between;gap:10px;} #Quality picture.main {margin:0 0 5px;} #Quality .font-size95 {font-size:95%;} #Quality p.txt12 {font-size:clamp(0.625rem, 0.594rem + 0.16vw, 0.75rem);} #Quality p.txt15 {font-size:clamp(0.688rem, 0.625rem + 0.31vw, 0.938rem);} #Quality p.txt16 {font-size:clamp(0.875rem, 0.844rem + 0.16vw, 1rem);margin-bottom:30px;} #Quality p.txt17 {font-size:clamp(0.813rem, 0.75rem + 0.31vw, 1.063rem);} #Quality p.txt20 {font-size:clamp(0.875rem, 0.781rem + 0.47vw, 1.25rem);} #Quality p.txt21 {font-size:clamp(0.813rem, 0.688rem + 0.63vw, 1.313rem);} #Quality p.txt23 {font-size:clamp(1.125rem, 1.047rem + 0.39vw, 1.438rem);} #Quality p.gothic_ttl {font-size:clamp(0.813rem, 0.781rem + 0.16vw, 0.938rem);margin-bottom:10px;border-bottom:1px solid;} #Quality p.gothic_ttl.none {border-bottom:none;margin-bottom:5px;line-height:1.3;} #Quality p.gothic_mini {font-size:10px;line-height:17px;} /*----------------------------------------------------- Anchor Menu ----------------------------------------------------- */ #Quality .anchor_menu_wrap {background:#E0D8CB;padding:50px 0;} #Quality .anchor_menu_wrap .en_contents {margin:0 auto 30px;max-width:100px;} #Quality ul.menu {display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;} #Quality ul.menu:first-child {margin-bottom:10px;} #Quality ul.menu li {display:flex;align-items:center;justify-content:center;transition:0.3s ease-in-out;background:var(--blown); width: calc(96% / 4); } #Quality ul.menu::after { content: '';width: calc(96% / 4);display: block; } #Quality ul.menu li a {position: relative;width:100%;padding:15px;display:block;color:#fff;font-size:clamp(0.813rem, 0.766rem + 0.23vw, 1rem); line-height: 1.2;} #Quality ul.menu li a::after {content:'';display:inline-block;background:url("../img/quality/arrow.svg") no-repeat;background-size:contain;width:8px;height:14px;right:5%;position: absolute;} #Quality ul.menu li:hover {background:#716864;} /*----------------------------------------------------- Floor & Beam Section (#FloorBeam_anchor) ----------------------------------------------------- */ #FloorBeam_anchor {padding:80px 0;background:url("../img/quality/floorbg.png") no-repeat;background-size:100%;position:relative;} #FloorBeam_anchor article:first-of-type {margin-bottom:60px;} #FloorBeam_anchor .annotation {position:absolute;right:2%;top:1%;} #FloorBeam_anchor h4 {text-align:center;font-size:clamp(1.125rem, 1.047rem + 0.39vw, 1.438rem);margin-bottom:40px;} #FloorBeam_anchor .ttl_flex {display:flex;align-items:center;gap:30px;margin-bottom:20px;} #FloorBeam_anchor .ttl_img {max-width:170px;} #FloorBeam_anchor .ttl {font-size:clamp(1.125rem, 1.047rem + 0.39vw, 1.438rem);margin-bottom:20px;} #FloorBeam_anchor .txt {font-size:clamp(0.875rem, 0.859rem + 0.08vw, 0.938rem);} #FloorBeam_anchor .fl_img_flex {display:flex;justify-content:space-between;gap:15px;} #FloorBeam_anchor .fl_img_box {max-width:425px;} #FloorBeam_anchor p.fl_img_txt {font-size:clamp(0.625rem, 0.594rem + 0.16vw, 0.75rem);margin-top:5px;} #FloorBeam_anchor .beam .fl_img_txt {text-align:right;} /*----------------------------------------------------- Kitchen Section (#Kitchen_anchor) ----------------------------------------------------- */ #Kitchen_anchor {margin-bottom:100px;padding-top:60px;} #Kitchen_anchor .head {display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:20px;} #Kitchen_anchor .img_area {max-width:430px;width:100%;margin-left:10px;} #Kitchen_anchor .dairiseki {padding:30px 50px;background:url("../img/quality/dairiseki_bg.png") no-repeat;background-size:cover;width:100%;height:100%;margin:20px 0 50px;box-sizing:border-box;} #Kitchen_anchor .dairiseki .ttl_area {display:block;text-align:center;margin-top:0;margin-bottom:30px;} #Kitchen_anchor .dairiseki .txt23 {margin-bottom:10px;} #Kitchen_anchor .dairiseki .flex:first-of-type {margin-bottom:40px;} #Kitchen_anchor .dairiseki .flex {display:flex;justify-content:space-between;align-items:flex-start;} #Kitchen_anchor .dairiseki .flex .item {position:relative;margin-bottom:0;} #Kitchen_anchor .dairiseki .flex .item:first-child::after {content:'';display:block;border-right:1px solid #3C3C3C;position:absolute;width:1px;height:100%;right:-18px;top:0;} #Kitchen_anchor .dairiseki .img {width:min(100%, 220px);} #Kitchen_anchor .dairiseki .txt_wrap {width:min(100%, 195px);} #Kitchen_anchor p.obi {text-align:center;background:#3C3C3C;font-size:clamp(0.813rem, 0.734rem + 0.39vw, 1.125rem);color:#fff;border:1px solid var(--blown-color);padding:5px;margin-bottom:10px;letter-spacing:.15em;} #Kitchen_anchor .harf {width:48%;} #Kitchen_anchor .harf img {width:100%;margin-bottom:10px;} #Quality .quality_flex {display:flex;justify-content:space-between;align-items:flex-start;gap:20px;} #Quality .flex_go {display:flex;justify-content:space-between;gap:10px;} #Quality .flex_go:not(:last-child) {margin-bottom:15px;} #Quality .flex_go .harf img {width:100%;} #Quality .harf48 .harf_flex {width:48%;} #Quality .harf48 > div:not(:last-child) {margin-bottom:20px;} #Quality .cookingtime {margin-bottom:50px;} /*----------------------------------------------------- Laundry / Sink Section (#Laundry_anchor) ----------------------------------------------------- */ #Quality #Laundry_anchor[data-size="w900"] {margin:60px auto;background:#E8F6F6;position:relative;overflow:hidden;} #Quality #Laundry_anchor p.anchor_ttl, #Quality #Bathroom_anchor p.anchor_ttl, #Quality #Toilet_anchor p.anchor_ttl {background:#5EAFBE;color:#fff;} #Quality #Laundry_anchor h5 {background:#5EAFBE;color:#fff;} #Quality #Laundry_anchor[data-size="w900"]::before {content:'';display:block;background:url("../img/quality/laundry_bg01.png") no-repeat;background-size:contain;position:absolute;top:60px;right:-5px;width:344px;height:377px;} #Quality #Laundry_anchor .laundry {position:relative;margin-bottom:60px;} #Quality #Laundry_anchor .laundry::after {content:'';display:block;background:url("../img/quality/laundry_bg02.png") no-repeat;background-size:contain;position:absolute;bottom:0;left:-6%;width:377px;height:377px;z-index:-1;} #Quality #Laundry_anchor .laundry_inner {width:90%;margin:0 auto;z-index:1;position:relative;} #Quality #Laundry_anchor .laundry .laundry_ttl_wrap {margin-bottom:30px;} #Quality #Laundry_anchor .laundry .laundry_img01 {width:48%;} #Quality #Laundry_anchor .laundry .txt23 {color:#5EAFBE;margin-bottom:10px;} #Quality .dressing .ttl_area {text-align:center;margin-bottom:20px;} #Quality .dressing .item_wrap, #Quality .toilet .item_wrap {width:48%;} #Quality .dressing .item_wrap > div {width:100%;} #Quality .dressing .item, #Quality .toilet .item {margin-bottom:15px;} /*----------------------------------------------------- Bathroom Section (#Bathroom_anchor) ----------------------------------------------------- */ #Quality #Bathroom_anchor {margin-bottom:85px;} #Quality #Bathroom_anchor .head {margin-bottom:20px;} #Quality #Bathroom_anchor .ttl_area {text-align:center;} #Quality #Bathroom_anchor h5, #Quality #Toilet_anchor h5 {background:#acc4bc9e;color:#3C3C3C;} #Quality #Bathroom_anchor .bathroom_main {margin-bottom:30px;} #Quality .flex_pc {display:flex;justify-content:space-between;gap:10px;} #Quality picture.mahobin_logo {max-width:150px;margin-left:auto;margin-right:0;} #Quality picture.osoji_logo {max-width:186px;margin-left:auto;margin-right:0;} #Quality #Bathroom_anchor .bathtime {background:url("../img/quality/bathtime_bg.png") no-repeat;background-size:cover;padding:40px 70px;box-sizing:border-box;margin-bottom:30px;position:relative;} #Quality #Bathroom_anchor .bathtime::after {content:'';position:absolute;background:url("../img/quality/bathtime_img02.png") no-repeat;background-size:contain;width:300px;height:200px;right:0;bottom:0;} #Quality #Bathroom_anchor .bathtime p.txt23 {color:#5EAFBE;margin-bottom:5px;} #Quality #Bathroom_anchor .bathtime .ttl_area {margin-bottom:30px;} #Quality #Bathroom_anchor .bathtime .ttl_area p {text-align:center;} /*----------------------------------------------------- Toilet Section (#Toilet_anchor) ----------------------------------------------------- */ #Quality #Toilet_anchor {padding-bottom:60px;} #Quality #Toilet_anchor .head {margin-bottom:20px;} #Quality #Toilet_anchor .ttl_area {text-align:center;} /*----------------------------------------------------- Entrance Section (#Entrance_anchor) ----------------------------------------------------- */ #Quality #Entrance_anchor {margin-bottom:100px;margin-top:60px;} #Quality #Entrance_anchor .head {margin-bottom:20px;} #Quality #Entrance_anchor .ttl_area {text-align:center;margin-bottom:30px;} #Quality #Entrance_anchor picture.entrance_box02_img01 {max-width:141px;width:60%;margin-right:0;margin-left:auto;} #Quality #Entrance_anchor picture.entrance_box02_img02 {max-width:230px;width:100%;margin:0 auto;} /*----------------------------------------------------- Other Section (#Other_anchor) ----------------------------------------------------- */ #Quality #Other_anchor {margin-bottom:100px;} #Quality #Other_anchor .ttl_area {text-align:center;margin-bottom:30px;} #Quality .glas_wrap {background:url("../img/quality/others_bg.png") no-repeat;background-size:cover;width:100%;height:100%;padding:40px;box-sizing:border-box;} #Quality .glas_wrap p.glas_ttl {font-size:clamp(0.938rem, 0.781rem + 0.78vw, 1.563rem);text-align:center;color:#3B77AC;} #Quality .glas_wrap p.obi {background:#5f99bf;color:#FFFF8D;padding:5px;font-size:clamp(0.938rem, 0.781rem + 0.78vw, 1.563rem);text-align:center;} #Quality .glas_wrap .obi_txt {margin-bottom:20px;} #Quality .glas_wrap .others_img , #Quality .glas_wrap .con_txt_wrap {width:48%;} #Quality .glas_wrap .txt_wrap {width:48%;} #Quality .glas_wrap .glas_wrap_syanetu_img {width:100%;} #Quality .gothic15 {font-family:var(--A1gothic-font);font-size:15px;color:#3B77AC;line-height:1.3;} #Quality .cp_wrap {background:#fff;padding:20px;margin:30px 0 0;box-shadow:0px 0px 30px -5px #a2c2df;margin-bottom:30px;} #Quality .cp_wrap p.cp_ttl {font-size:clamp(0.875rem, 0.781rem + 0.47vw, 1.25rem);} #Quality .cp_wrap .flex_mark {display:flex;justify-content:space-between;align-items:center;} #Quality .glas_wrap img.mark {max-width:85px;margin-left:20px;} #Quality .cp_wrap .image_flex {width:50%;} #Quality .cp_wrap .flex_harf {width:48%;} #Quality .point_wrap {background:#ffffe7;padding:30px;margin-bottom:20px;} #Quality .point_wrap p.point_ttl {font-size:24px;font-family:"A1ゴシック R";position:relative;display:inline-block;color:#109342;} #Quality .point_wrap p.point_ttl::before {position:absolute;content:'';display:inline-block;left:-20px;top:-5px;width:3px;height:150%;background:#109342;border-radius:3px;transform:rotate(-25deg);} #Quality .point_wrap p.point_ttl::after {position:absolute;content:'';display:inline-block;right:-15px;top:-5px;width:3px;height:150%;background:#109342;border-radius:3px;transform:rotate(25deg);} #Quality .point_wrap .flex p.point_sec_ttl {line-height:20px;padding-bottom:5px;border-bottom:1px solid #109342;margin-bottom:10px;} #Quality .point_wrap .harf {position:relative;width:45%;} #Quality .point_wrap .harf:first-child::after {position:absolute;content:'';background:url("../img/quality/others_arrow.svg") no-repeat;width:42px;height:55px;display:inline-block;background-size:contain;top:160px;right:-60px;} #Quality .point_wrap p.mark_ttl {font-family:"A1ゴシック R";line-height:25px;color:#109342;text-align:center;font-size:clamp(0.813rem, 0.583rem + 0.98vw, 1.563rem);} #Quality .point_wrap .mark_wrap {max-width:700px;margin:0 auto;} #Quality .point_wrap .mark {max-width:100px;width:100%;margin-right:20px;} #Quality .point_wrap p.txt_ttl {font-family:"A1ゴシック R";font-size:clamp(0.813rem, 0.755rem + 0.24vw, 1rem);} #Quality .point_wrap span.orange {font-size:clamp(0.688rem, 0.625rem + 0.31vw, 0.938rem);color:#e8494a;text-decoration:underline;} #Quality .point_last {text-align:center;} #Quality .neo h5 {background:#5F99BF;color:#FFFF8D;padding:5px 10px 2px;} #Quality picture.others_img04_last {margin:10px 0;} /*----------------------------------------------------- Structure Page General Styles ----------------------------------------------------- */ #Structure p.txt12 { font-size: clamp(0.625rem, 0.594rem + 0.16vw, 0.75rem); } #Structure p.txt15 { font-size: clamp(0.625rem, 0.547rem + 0.39vw, 0.938rem); } #Structure h3 img {max-width:346px;} #Structure .head_area {background:url("../img/structure/head.png") no-repeat;background-size:cover;background-position:center;} #Structure .tab_box .btn_area { display: flex; gap: 30px; justify-content: center; margin: 0 auto 50px; flex-wrap: wrap; } #Structure .tab_box .tab_btn { width: 120px; height: 120px; background: #B9B9B9; display: flex; align-items: center; justify-content: center; border-radius: 50%; font-size: clamp(1rem, 0.906rem + 0.47vw, 1.375rem); color: #fff; line-height: 1.3; transition: .5s; cursor: pointer; } #Structure .tab_box .tab_btn:hover { background-color: #dce1e4; } #Structure .tab_box .tab_btn.active { background: var(--blown); color: #fff; } #Structure .tab_box .tab_panel { display: none; } #Structure .tab_box .tab_panel.active { display: block; } #Structure .lead { display: flex; align-items: center; width: 100%; } /*#Structure .ttlblock { position: absolute; left: 15%; width: 335px; }*/ #Structure .lead_ttl { font-size: clamp(1.25rem, 1.172rem + 0.39vw, 1.563rem); text-align: center; margin-bottom: 55px; } #Structure .lead_ttl span { font-size: clamp(1.688rem, 1.563rem + 0.63vw, 2.188rem); } #Structure .lead_txt { font-size: clamp(0.813rem, 0.781rem + 0.16vw, 0.938rem); text-align: center; margin-bottom: 80px; } #Structure span.red { color: #e8494a; } #Structure .lead_box { background: #fff; } #Structure .lead_box .lead_box_inner { padding: 50px; box-sizing: border-box; } #Structure .lead_box .lead_box_inner .contents_flex { display: flex; justify-content: space-between; gap: 30px; } #Structure .lead_box .txt_wrap { width: calc(100% - 375px); } #Structure .lead_box .lead_box_inner picture { max-width: 375px; width: 100%; } #Structure .lead_box .txt_wrap div:not(:last-child) { margin-bottom: 20px; } #Structure .contents { padding: 60px 0; overflow: hidden; } #Structure .contents p.ttl { font-size: clamp(1.125rem, 1.047rem + 0.39vw, 1.438rem); line-height: 1.3; margin-bottom: 10px; } #Structure .contents p.ttl span.big { font-size: clamp(1.688rem, 1.578rem + 0.55vw, 2.125rem); } #Structure .contents p.txt { font-size: clamp(0.813rem, 0.781rem + 0.16vw, 0.938rem); } /* Earthquake-resistant */ /*#Structure #Earthquake-resistant .ttlblock picture {max-width:300px; width:100%;}*/ #Structure #Earthquake-resistant .contents { background: #f0f0ea; padding: 60px 0; overflow: hidden; } #Structure #Earthquake-resistant .earthquake-resistant_intro01 { margin-bottom: 55px; } #Structure #Earthquake-resistant .earthquake-resistant_intro02 { margin-bottom: 30px; } #Structure #Earthquake-resistant .bf_obi { background: #323232; width: 100%; padding: 30px 5%; display: flex; justify-content: center; align-items: center; box-sizing: border-box; } #Structure #Earthquake-resistant .bf_obi picture { max-width: 457px; width: 100%; } #Structure #Earthquake-resistant .contents.bf { background: #E0D8CB; } #Structure #Earthquake-resistant .bf .contents_flex { display: flex; justify-content: space-between; margin-bottom: 60px; padding-bottom: 60px; border-bottom: 1px solid #323232; } #Structure #Earthquake-resistant .bf .contents_flex > div { width: 48%; } #Structure #Earthquake-resistant .bf .contents_flex .column { display: flex; flex-direction: column; } #Structure #Earthquake-resistant .bf .contents_flex .column picture { margin-top: auto; margin-bottom: 20px; } #Structure #Earthquake-resistant .bf .sec03.contents_flex { flex-direction: row-reverse; } #Structure #Earthquake-resistant .bf .sec04 .contents_flex { margin-bottom: 30px; padding-bottom: 0; border-bottom: none; flex-direction: row-reverse; } #Structure #Earthquake-resistant .bf .sec04 .bf_sec04_img { margin-bottom: 20px; } /* Fire-resistance */ /*#Structure #Fire-resistance .ttlblock picture {max-width:279px; width:100%;}*/ /*#Structure #Fire-resistance .lead { background: url("../img/structure/fireresistance_bg.png") no-repeat; background-size: cover; background-position: right bottom; }*/ #Structure #Fire-resistance .lead_box { margin-bottom: 50px; } #Structure #Fire-resistance .lead_box .contents_flex { border-bottom: 1px solid #323232; margin-bottom: 60px; padding-bottom: 60px; } #Structure #Fire-resistance .lead_box .contents_flex:nth-child(even) { flex-direction: row-reverse; border-bottom: none; margin-bottom: 0; padding-bottom: 0; } #Structure #Fire-resistance .contents_flex { display: flex; justify-content: space-between; } #Structure #Fire-resistance .contents_flex > div { width: 48%; } #Structure #Fire-resistance .sec02 .head_border { padding: 15px 25px; border-top: 1px solid #3c3c3c; border-bottom: 1px solid #3c3c3c; font-size: clamp(1.25rem, 1.094rem + 0.78vw, 1.875rem); margin-bottom: 50px; } #Structure #Fire-resistance .sec02 .contents_flex { display: flex; justify-content: space-between; } #Structure #Fire-resistance .sec02 { margin-bottom: 50px; } #Structure #Fire-resistance .sec03_ttl { text-align: center; color: #fff; background: #716864; padding: 5px; box-sizing: border-box; margin-bottom: 35px; font-size: clamp(1.125rem, 1.063rem + 0.31vw, 1.375rem); letter-spacing: .2em; } #Structure #Fire-resistance .sansyutu { padding: 20px 40px; background: #fff; margin-top: 20px; } #Structure #Fire-resistance .sansyutu p.sansyutu_ttl { font-size: clamp(1rem, 0.938rem + 0.31vw, 1.25rem); text-align: center; margin-bottom: 10px; border-bottom: 1px solid #3c3c3c; padding-bottom: 10px; } #Structure #Fire-resistance .sansyutu .sansyutu_flex { display: flex; justify-content: space-between; margin-bottom: 30px; gap: 20px; } #Structure #Fire-resistance .sansyutu p.sansyutu_subttl { font-size: clamp(1rem, 0.938rem + 0.31vw, 1.25rem); } #Structure #Fire-resistance .sansyutu p.sansyutu_subtxt { font-size: clamp(0.813rem, 0.781rem + 0.16vw, 0.938rem); } #Structure #Fire-resistance .sansyutu p.annotation { font-size: clamp(0.625rem, 0.594rem + 0.16vw, 0.75rem); font-family: var(--gothic-font); margin-top: 30px; } /* Durability */ /*#Structure #Durability .ttlblock picture {max-width:305px; width:100%;}*/ /*#Structure #Durability .lead { background: url("../img/structure/durability_bg.png") no-repeat; background-size: cover; background-position: right bottom; }*/ #Structure #Durability .lead_ttl { margin-bottom: 0; } #Structure #Durability .ls30_wrapper { background: #f0f0ea; padding: 0 0 60px; } #Structure #Durability .ls30 { background: #E0D8CB; padding: 50px 0; } #Structure #Durability .ls30 .durability_intro { max-width: 730px; margin: 0 auto 30px; } #Structure #Durability .ls30 p.txt { text-align: center; font-size: clamp(1rem, 0.938rem + 0.31vw, 1.25rem); } #Structure .contents_whitebox_wrapper { padding: 60px 0 0; } #Structure .contents_whitebox_wrapper .ttl { text-align: center; font-size: clamp(1rem, 0.938rem + 0.31vw, 1.25rem); margin-bottom: 60px; } #Structure .contents_whitebox { background: rgba(255, 255, 255, 0.8); padding: 30px; box-sizing: border-box; } #Structure .contens_ttl_flex { display: flex; align-items: center; gap: 30px; margin-bottom: 20px; } #Structure .contens_ttl_flex img { max-width: 140px; } #Structure .contens_ttl_flex p.contens_ttl { font-size: clamp(1.125rem, 0.859rem + 1.33vw, 2.188rem); } #Structure #Durability .yane { margin-bottom: 60px; } #Structure #Durability .contents_inner_flex { display: flex; justify-content: space-between; gap: 10px; } #Structure #Durability .contents_inner_flex .durability_yane_ls30 { max-width: 80px; } #Structure #Durability .durability_yane_img p { font-size: 30px; margin-bottom: 10px; } #Structure #Durability .durability_yane_img picture { max-width: 435px; width: 100%; } #Structure #Durability .contents_inner_flex .txt_wrap { max-width: 285px; width: 100%; } #Structure #Durability .contents_inner_flex .ttl { text-align: left; margin-bottom: 20px; } #Structure #Durability .durability_ari_img { margin-bottom: 20px; } #Structure #Durability .durability_ari_img picture { margin-bottom: 10px; } /* Thermal */ /*#Structure #Thermal .ttlblock picture {max-width:279px; width:100%;}*/ /*#Structure #Thermal .lead { background: url("../img/structure/thermal_bg.png") no-repeat; background-size: cover; background-position: right bottom; }*/ #Structure #Thermal .intro_flex { display: flex; justify-content: center; gap: 40px; margin-bottom: 65px; } #Structure #Thermal .intro_flex picture { max-width: 425px; width: 100%; } #Structure #Thermal .intro_flex p.ttl { font-size: clamp(1.25rem, 1.141rem + 0.55vw, 1.688rem); } #Structure #Thermal .intro_flex p.ttl span { font-size: clamp(1.688rem, 1.484rem + 1.02vw, 2.5rem); } #Structure #Thermal .intro_flex p.txt20 { font-size: 20px; } #Structure #Thermal picture.thermal_main_ttl { max-width: 445px; margin: 0 auto 60px; } #Structure #Thermal picture.thermal_main { width: 100vw; margin: 0 calc(50% - 50vw); } #Structure #Thermal picture.thermal_sec_ttl { max-width: 750px; margin: 0 auto 40px; } #Structure #Thermal .sec { max-width: 900px; width: 100%; margin: 0 auto 65px; background: rgba(255, 255, 255, 0.8); } #Structure #Thermal .sec:last-child { margin-bottom: 0; } #Structure #Thermal .sec_inner { max-width: 800px; padding: 50px; } #Structure #Thermal .sec.sec01 .sec_inner { padding-bottom: 20px; } #Structure #Thermal .sec_ttl { display: flex; align-items: stretch; margin-bottom: 35px; } #Structure #Thermal .sec_ttl p.num { font-size: clamp(1.5rem, 0.938rem + 2.81vw, 3.75rem); background: #716864; text-align: center; width: 95px; height: 95px; color: #fff; display: flex; align-items: center; justify-content: center; } #Structure #Thermal .sec_ttl p.ttl { font-size: clamp(1.125rem, 0.906rem + 1.09vw, 2rem); background: #A08572; color: #fff; margin-bottom: 0; width: 100%; display: flex; align-items: center; padding-left: 30px; box-sizing: border-box; } #Structure #Thermal .sec .sec_txt { font-size: clamp(1rem, 0.891rem + 0.55vw, 1.438rem); margin-bottom: 5px; } #Structure #Thermal .sec picture.thermal_sec03_img01 { margin-bottom: 50px; } #Structure #Thermal .bg_color { background: #E0D8CB; width: 100vw; margin: 0 calc(50% - 50vw) 70px; padding: 70px 5%; box-sizing: border-box; } #Structure #Thermal .sec04 { max-width: 900px; margin: 0 auto; } #Structure #Thermal .sec04 article:not(:last-child) { margin-bottom: 50px; } #Structure #Thermal .sec04 .sec04_ttl { font-size: clamp(1.5rem, 1.328rem + 0.86vw, 2.188rem); margin-bottom: 30px; } #Structure #Thermal .sec04 .txt20 { margin-bottom: 40px; } #Structure #Thermal .sec04 picture.thermal_sec04_img01 { margin-bottom: 40px; } #Structure #Thermal .sec04 .features { display: flex; gap: 10px; justify-content: space-between; } #Structure #Thermal .sec04 .features_box { width: calc(90% / 3); position: relative; } #Structure #Thermal .sec04 .features_box:not(:last-child)::after { content: ''; width: 4px; height: 100%; position: absolute; top: 0; right: -9%; background-image: radial-gradient(circle, #666 2px, transparent 2px); background-repeat: repeat-y; background-size: 4px 12px; } #Structure #Thermal .sec04 .features_box .features_icon { max-width: 105px; margin: 0 auto 10px; } #Structure #Thermal .sec04 p.features_ttl { font-size: clamp(1.125rem, 1.063rem + 0.31vw, 1.375rem); margin-bottom: 10px; } /* 60-Years Guarantee */ /*#Structure #Years60 .ttlblock picture {max-width:335px; width:100%;}*/ /*#Structure #Years60 .lead { background: url("../img/structure/years60_bg.png") no-repeat; background-size: cover; background-position: right bottom; }*/ #Structure #Years60 .contents { background: #f0f0ea; padding: 60px 0; overflow: hidden; padding-bottom: 180px; } #Structure #Years60 .contents_whitebox_wrapper { padding-top: 0; } #Structure #Years60 .contents_whitebox { margin-bottom: 130px; } #Structure #Years60 .years60_hosyo_img { margin: 40px 0 20px; } #Structure #Years60 .after_service_img { max-width: 270px; width: 100%; margin: 0 auto 30px; } #Structure #Years60 .obi { text-align: center; color: #fff; background:#B8A395; padding: 15px; box-sizing: border-box; font-size: clamp(1.125rem, 1.031rem + 0.47vw, 1.5rem); margin-bottom: 25px; line-height: 1; } #Structure #Years60 p.af_txt01 { text-align: center; font-size: clamp(1.688rem, 1.563rem + 0.63vw, 2.188rem); margin-bottom: 25px; line-height: 1; } #Structure #Years60 p.af_txt02 { text-align: center; } #Structure #Years60 .years60_af { margin: 35px 0; } /*----------------------------------------------------- Map & Outline ----------------------------------------------------- */ /*#Map { margin: 90px 0 170px; }*/ #Map #main { margin-bottom: 80px; padding-top: 80px; } #Map #main.pages { background: #fafaf9; margin-bottom: 140px; } #Map { padding-top: 120px; margin-bottom: 100px; } #Map .head { text-align: center; } #Map p.ttl { font-size: clamp(0.938rem, 0.752rem + 0.93vw, 1.563rem); letter-spacing: .2em; color: #BB915C; margin-bottom: 100px; border-bottom: 1px solid #BB915C; display: inline-block; padding-bottom: 5px; } #Map h3 { font-size: clamp(1.25rem, 1.172rem + 0.39vw, 1.563rem); text-align: center; margin-bottom: 90px; } #Map .address { display: flex; align-items: center; background: #fff; font-size: clamp(0.813rem, 0.688rem + 0.63vw, 1.313rem); color: #3c3c3c; margin-bottom: 100px; border: 1px solid #f4edd8; box-sizing: border-box; } #Map .address picture { max-width: 546px; width: 50%; } #Map .address p { width: 50%; font-size: clamp(1rem, 0.938rem + 0.31vw, 1.25rem); text-align: center; } #Map .map_img01 { max-width: 1000px; margin: 0 auto 40px; } #Map .btn_wrap { max-width: 600px; margin: 0 auto 90px; } #Map .btn_wrap .flex { display: flex; justify-content: space-between; gap: 40px; } #Map .btn_wrap a.btn { max-width: 280px; width: 100%; font-size: clamp(1rem, 0.938rem + 0.31vw, 1.25rem); transition: 0.3s ease-in-out; background: var(--blown); color: #fff; padding: 20px 30px; text-align: center; } #Map .btn_wrap a.btn:hover { opacity: .6; } /* Outline */ #Outline { padding-top: 120px; } #Outline [data-size="w900"] { width: 90%; margin-bottom: 130px; } #Outline .h3_wrap { display: block; text-align: center; } #Outline h3{ font-size:clamp(1.25rem, 1.172rem + 0.39vw, 1.563rem); text-align:center; margin:0 0 60px; color:var(--blown); } #Outline h4 { color: #464646; letter-spacing: 0; margin-bottom: 15px; font-size: clamp(1rem, 0.906rem + 0.47vw, 1.375rem); text-align: center; } #Outline table { width: 100%; margin-bottom: 70px; border-collapse: collapse; border-top: 1px solid #b8a395; color: #464646; } #Outline table:nth-of-type(2) { margin-bottom: 20px; } #Outline table tr{ border-bottom:1px solid #B8A395; } #Outline table th{ background:#E0D8CB; width:30%; padding: 8px 20px; font-weight:normal; font-size: clamp(0.688rem, 0.625rem + 0.31vw, 0.938rem); box-sizing: border-box; line-height: 1.6; } #Outline table td{ padding: 8px 20px; font-size:clamp(0.688rem, 0.625rem + 0.31vw, 0.938rem); line-height:26px; background: #ffffffcc; } #Outline .date { font-size:clamp(0.688rem, 0.625rem + 0.31vw, 0.938rem); line-height:26px; text-align: right; } #Outline .btn{ width: 192px; background: #B08F71; color: #fff; text-align: center; font-size: clamp(1rem, 0.87rem + 0.65vw, 1.438rem); padding: 15px 0 12px; display:block; margin: 50px auto 30px; transition: .5s; } #Outline .btn img { width: 7px; vertical-align: 2px; margin-left: 7px; } #Outline .btn:hover { opacity: .5; } #Outline .yokoku { margin-bottom: 50px; } #Outline .yokoku p.ttl { font-size: clamp(1rem, 0.969rem + 0.16vw, 1.125rem); color: var(--blown); } #Outline .yokoku p.txt { font-size: clamp(0.875rem, 0.859rem + 0.08vw, 0.938rem); } /* .bc-iframe, .bc-iframe body, .bc-player-default_default, .bc-player-default_default .vjs-poster { background-color: #151B17; } .vjs-control-bar,.vjs-dock-text { display: none !important; } */ @media print { header , footer { display: none!important; } } /*ノートPC*/ @media (max-width: 1600px) and (max-height: 900px) { } /*DynaBook*/ @media (max-width: 1263px) and (max-height: 569px) { } @media only screen and (max-width: 1023px){ .tab { display: block; } .pages .intro .ph_wrap { right: 0; } #Slider_wrap { padding-top: 80px; } #Slider_wrap .logo_mark { top: 62%; } #Index .yokoku_wrap { width: 100%; } #Index .point_area_txt { margin: 30px auto 40px; } #Map { padding-top: 60px; margin-bottom: 60px; } } @media only screen and (max-width: 834px){ #Index .contents_links .contents_img { width: 60%; } #Quality ul.menu li { width: calc(95% / 4); } #Quality ul.menu::after { content: '';width: calc(95% / 4);display: block; } } /*　600pxからレスポンシブ*/ @media only screen and (max-width: 600px){ .pc { display: none; } .sp { display: block; } .annotation { line-height: 16px; } .mgn10 { margin-bottom: 5px; } #Slider_wrap { padding-top: 0; } #Slider_wrap .logo_mark { max-width: 150px; top: 60%; } #Index .yokoku_wrap { margin-top: 10px; display: block; } #Index .yokoku_wrap span.ttl { width: 100%; margin-right: 0; margin-bottom: 5px; } #Index .common_area .catch_copy { max-width: 237px; } #Index .common_area .catch_copy img { max-width: 160px; } #Index .fg_name_wrap { margin-bottom: 40px; } #Index .cv_area { padding: 40px 5%; margin-bottom: 0; } #Index .cv_area .cv_area_ttl { font-size: clamp(2.188rem, 1.797rem + 1.95vw, 3.75rem); margin-bottom: 20px; } #Index .cv_area .cv_btn a { padding: 15px 5%; } #Index .information { width: 70%; margin-bottom: 40px; } #Index .information h3.head_en { left: -10%; } #Index .information h3.head_en img { max-width: 150px; } #Index .information .information_content { padding: 60px 20px 40px; } #Index .information dl { height: 100px; padding-right: 20px; } #Index .information .info-item dt { margin-right: 10px; padding-top: 0; } #Index .concept_area { padding-bottom: 40px; } #Index .concept_area .concept_ttl { background: url(../img/top/cencept_bg_sp.png) no-repeat; background-size: cover; height: 150px; margin-bottom: 40px; } #Index .concept_area h3.head_en { max-width: 92px; } #Index .color_bg h4 { margin-bottom: 30px; } #Index .color_bg .section_inner { display: block; } #Index .color_bg .section_inner .txt_wrap { width: 100%; margin-bottom: 20px; } #Index .color_bg .section_inner.sec01 { margin-bottom: 40px; } #Index .common_area02 { margin-top: 40px; } #Index .common_area02 .catch_copy { margin-bottom: 40px; } #Index .common_area02 .annotation { left: 5%; right: 5%; } #Index .contents_area { padding: 40px 0 80px; } #Index .contents_area h3 img { width: 32%; margin-bottom: 40px; } #Index .contents_links { width: 100%; padding: 20px 20px 90px; } #Index .contents_links:nth-child(even) { flex-direction: initial; } #Index .contents_links:not(:last-of-type) { margin-bottom: 90px; } #Index .contents_links .contents_img, #Index .contents_links:nth-child(even) .contents_img { width: 90%; right: 0; left: 0; margin: auto; bottom: -60px; } #Index .contents_links_txtarea { max-width: inherit; } #Index .contents_links_txt { margin-bottom: 10px; } #Index .last .cv_area { margin-bottom: 0; } .pages .head_area { height: 150px; margin-bottom: 50px; } .pages .head_area h3 img { margin: 0 auto 10px; } .pages .head_area h3 { max-width: 200px; width: 100%; padding: 10px 20px; } .pages .intro { flex-wrap: wrap; margin-bottom: 0; } .pages .intro_inner { display: block; } .pages .intro .txt_wrap , .pages .intro .ph_wrap { width: 100%; margin-bottom: 40px; } .pages .intro p.intro_ttl { line-height: 1.5; margin-bottom: 20px; } .pages .intro p.txt { line-height: 26px; } .pages .intro_inner::before { width: 70px; height: 24px; top: -3%; left: 0; } .floor_kind_wrap { flex-wrap: wrap; } .floor_kind_wrap .kind_item { width: 100%; } .floor_kind_wrap .kind_item:not(:first-of-type) .txt_wrap::before{ content: none; } .floor_kind_wrap .kind_item:not(:last-child) { margin-bottom: 20px; } #Plan h3 img { max-width: 40px; } #Plan .landplan .en { max-width: 190px; margin: 0 auto 30px; } #Plan ul.menu { gap: 15px; } #Plan ul.menu li { width: 48%; } #Plan .landplan , #Plan .housedesign { padding: 40px 0; } #Plan .landplan .kukaku { margin-bottom: 30px; } #Plan .housedesign .en { max-width: 260px; margin: 0 auto 40px; } #Plan .wood .obi_ttl .en { max-width: 60px; } #Plan .sec .obi_ttl { min-height: 100px; } #Plan .sec_inner { padding: 40px 0; } #Plan .ttl_flex { display: block; } #Plan .ttl_img { max-width: 65px; margin: 0 auto 20px; display: block; } #Plan article:first-of-type { margin-bottom: 40px; } #Plan .color .obi_ttl .en { max-width: 62px; } #Plan .sec_inner .head { margin-bottom: 40px; } #Plan .comfortable .obi_ttl .en { max-width: 124px; } #Plan .laundry_blk { margin: 40px auto 30px; } #Plan .laundry_blk::before {background:url(../img/quality/laundry_bg01_sp.png) no-repeat;background-size:contain;top:40px;right:-5px;width:180px;height:197px;} #Plan .laundry_blk .laundry::after {background:url(../img/quality/laundry_bg02_sp.png) no-repeat;background-size:contain;bottom: 1%;width:202px;height:216px;} #Plan .laundry_blk .flex { display: block; } #Plan .laundry_blk .laundry .laundry_img01 , #Plan .laundry_blk .item { width: 100%; } #Plan .laundry_blk .laundry .laundry_img01 { margin-bottom: 20px; } #Plan .laundry_blk .laundry_inner { padding-bottom: 60px; } #Plan .bathtime_blk .bathtime_inner { padding: 20px; } #Plan .bels_blk .bels_inner { padding: 20px; } #Plan .bels_blk .txt_area { text-align: left; } #Plan .bels_blk { margin-bottom: 40px; } #Plan .bnr_link p.txt20 { margin-bottom: 15px; } #Plan .exterior_blk .exterior_inner { padding: 40px 0; } #Plan .exterior_blk .en { max-width: 150px; margin-bottom: 30px; } #Plan .exterior_blk .point_wrap .point_flex { display: block; } #Plan .exterior_blk .point_wrap .box { width: 100%; } #Plan .exterior_blk .point_wrap .box:not(:last-child) { margin-bottom: 30px; } #Plan .exterior_blk .point_wrap { width: 100vw; margin: 0 calc(50% - 50vw) 40px; padding: 55px 20px 20px; } #Plan .exterior_blk .point_wrap .en_point { max-width: 120px; } #Plan .exterior_blk .point_wrap .box:first-child::after { border-right: none; border-bottom: 1px solid #A08572; width: 100%; height: 1px; top: initial; bottom: -15px; left: 0; } #Plan .exterior_blk { background: #D6DBCB url(../img/plan/exterior_bg_sp.png) no-repeat; background-position: top center; background-size: 100%; } #Plan .plant_blk .plant_wrap { gap: 10px; } #Plan .plant_blk .plant_item { width: calc( 97% / 2); padding: 15px 10px 10px; } #Plan .plant_blk .plant_item p.flowering { padding: 5px 10px; } #Plan #Madori_anchor { padding: 40px 0 80px; } #Plan #Madori_anchor .en { max-width: 105px; margin-bottom: 40px; } #Plan #Madori_anchor .plan_detail .plan_num img { max-width: 65px; } #Plan #Madori_anchor .plan_detail { padding: 40px 20px; } #Plan #Madori_anchor .plan_detail:not(:last-of-type) { margin-bottom: 40px; } #Plan #Madori_anchor .plan_detail .madori { width: 100%; } #Plan .bels_blk .blk_ttl { height: 55px; } #Plan .laundry_blk h5 { height: 30px; } #Location .pages .intro .ph_wrap {margin-bottom:0;} #Location .pages .intro_inner {padding:40px 0;} #Location .head_area h3 img {max-width:250px;} #Location ul.menu {gap:10px;} #Location ul.menu li {max-width:140px;} #Location ul.menu li a {line-height:1.2;} #Location .anchor_menu_wrap {padding-bottom:40px;} #Location .sec {margin-bottom:15px;} #Location .sec_head {height:100px!important;margin-bottom:30px!important;} #Location .sec_head .sec_head_ttl {width:210px;height:62px;} #Location .sec_ttl {margin-bottom:20px;} #Location .anchor_obi {height:98px;overflow:hidden;} #Location .anchor_obi h4 {text-align:center;} #Location .anchor_obi h4 img {width:80%;} #Location .anchor_inner {margin-bottom:40px;} #Location .anchor_inner .txt23 {text-align:center;margin-bottom:20px;} #Location .anchor_inner .flex {display:block;} #Location .anchor_inner .flex .box {width:100%;margin-bottom:20px;} #Location .anchor_inner .sp_flex {gap:initial;margin-bottom:0;} #Location .anchor_inner .sp_flex .box {width:calc(96% / 2);margin-bottom:15px;} #Location .anchor_inner .sp_flex::after {width:calc(94% / 2);} #Location .anchor_inner .sp_flex.column4 .box {width:calc(96% / 2);margin-bottom:15px;} /* Access */ #Location #Access_anchor .anchor_obi h4 {max-width:120px;} #Location #Access_anchor .anchor_intro {display:block;} #Location #Access_anchor .anchor_intro_inner {display:block;padding:40px 0;} #Location #Access_anchor .anchor_intro_inner .txt_wrap {width:100%;} #Location .anchor_intro .txt_wrap {width:100%;margin-bottom:20px;} #Location .train .train_img01, #Location .train .train_img03 {margin-bottom:30px;} #Location .train .train_img01 > img {max-width:initial;width:initial;height:340px;} #Location .train .train_img03 > img {max-width:initial;width:initial;height:185px;} #Location .train .txt15 {margin-bottom:20px;} #Location .train .sec_head .sec_head_ttl img {max-width:63px;} #Location .renewal_wrap {padding-bottom:60px;} #Location .renewal_inner {padding:0 20px 30px 20px;} #Location .renewal_wrap .sec {margin-bottom:40px;} #Location .renewal_wrap .sec:last-of-type {margin-bottom:30px;} #Location .renewal_wrap .renewal_img {margin-bottom:0;} #Location .renewal_wrap .renewal_intro {margin-bottom:30px;} #Location .renewal_wrap .renewal_sec02_img, #Location .renewal_wrap .sec .box {margin-bottom:30px;} #Location .car .car_img01 {margin-bottom:20px;} #Location .car .sec_head .sec_head_ttl img {max-width:47px;} /* Location */ #Location_anchor .tanabata {padding-bottom:30px;} #Location_anchor .tanabata .tanabata_main {margin-bottom:30px;} #Location_anchor .tanabata .tanabata_inner .flex {display:block;} #Location_anchor .tanabata .tanabata_inner .flex .box {margin-bottom:30px;} #Location_anchor .tanabata .tanabata_inner .flex .box:last-child {margin-bottom:0;} #Shopping_anchor .anchor_obi {margin-bottom:40px;} #Location .anchor_inner .spot { margin-top: 30px; } #Location .shopping .sec_head .sec_head_ttl img {max-width:70px;} #Location .gourmet .sec_head .sec_head_ttl img {max-width:70px;} #Location .park .sec_head .sec_head_ttl img {max-width:35px;} #Location .education .sec_head {margin-bottom:0!important;} #Location .education .sec_head .sec_head_ttl img {max-width:80px;} #Location #Location_anchor .tanabata .tanabata_inner .flex { display: block; } #Location #Location_anchor .tanabata .tanabata_main { margin-bottom: 30px; } #Location #Location_anchor .tanabata { padding-bottom: 40px; } #Location #Education_anchor [data-size="w900"] {padding:40px 0 0;} #Location #Education_anchor .park_contents_inner {padding:30px 20px;} #Location #Education_anchor .park_contents_flex {display:block;} #Location #Education_anchor .park_contents_flex:not(:last-child) {margin-bottom:30px;} #Location #Education_anchor .leftbox, #Location #Education_anchor .rightbox {width:100%;} #Location #Education_anchor .leftbox {margin-bottom:30px;} #Location #Education_anchor .leftbox .phwrap {margin-bottom:10px;} #Location #Education_anchor .rightbox {padding:10px;} #Location #Education_anchor .rightbox .ph {margin-bottom:0;} #Location #Education_anchor .rightbox .txt12 {margin-top:5px;padding:5px 0;} #Location #Education_anchor .kosodate_wrap {background:#EFE5E4 url(../img/location/kosodate_bg_sp.png) no-repeat;background-size:50%;padding:20px;} #Location #Education_anchor .kosodate_wrap .mainimg {margin-bottom:5px;} #Location #Education_anchor .kosodate_wrap .kosodate_flex {display:block;} #Location #Education_anchor .kosodate_flex .txt_wrap {width:100%;} #Location #Education_anchor .kosodate_wrap p.kosodate_ttl {text-align:right;} #Location #Education_anchor .kosodate_wrap p.kosodate_ttl + .annotation {text-align:left;} #Location #Education_anchor .kosodate_wrap .detail p.kosodate_ttl {text-align:center;} #Location #Education_anchor .mimamori_flex {display:block;} #Location #Education_anchor .mimamori_flex .blk {width:100%;margin-bottom:30px;} #Location #Education_anchor .kosodate_wrap .link_btn {max-width:inherit;width:100%;} #Location .hospital .sec_head .sec_head_ttl img {max-width:62px;} #Hospital_anchor .anchor_inner, #Bank_anchor {margin-bottom:40px;} #Hospital_anchor .hospital_detail {padding:20px;} #Quality .head_area {background:url("../img/quality/head_sp.png") no-repeat;background-size:cover;} #Quality h3 img {max-width:53px;} #Quality h5 {padding:10px 7px;} #Quality p.anchor_ttl {margin-bottom:20px;} #Quality p.txt12 {margin-bottom:10px;} #Quality p.txt16 {margin-bottom:0;} #Quality p.txt21 {font-size:16px;line-height:24px;text-align:left;margin-bottom:10px;} #Quality p.gothic_ttl {margin-bottom:5px;} #Quality .mgn20 {margin-bottom:10px;} #Quality .flex {display:block;} #Quality .quality_flex {display:block;} #Quality .harf48 {width:inherit;margin-bottom:15px;} #Quality .harf48 > div:not(:last-child) {margin-bottom:10px;} #Quality .item {width:100%;margin-bottom:15px;} #Quality .con_txt_wrap {margin-bottom:10px;} #Quality .box_img {max-width:inherit;} #Quality .ttl_area {margin-bottom:20px;} /* Anchor Menu */ #Quality .anchor_menu_wrap {padding:40px 0;} #Quality .anchor_menu_wrap .en_contents {margin-bottom:20px;} #Quality ul.menu li {width:48%;flex:initial;} #Quality ul.menu li a {padding:10px 20px 10px 10px;line-height:1.2;} /* FloorBeam */ #FloorBeam_anchor {padding:70px 0 40px;} #FloorBeam_anchor .ttl_flex {display:block;} #FloorBeam_anchor .ttl_img {max-width:100px;margin:0 auto 20px;display:block;} #FloorBeam_anchor article:first-of-type {margin-bottom:30px;} /* Kitchen */ #Kitchen_anchor {margin-bottom:40px;padding-top:40px;} #Kitchen_anchor .head {display:block;} #Kitchen_anchor .img_area {max-width:inherit;margin-left:0;} #Kitchen_anchor .dairiseki {background:url(../img/quality/dairiseki_bg_sp.png) no-repeat;background-size:cover;padding:30px 5%;width:100vw;margin:40px calc(50% - 50vw) 30px;} #Kitchen_anchor .dairiseki .flex { display: block; } #Kitchen_anchor .dairiseki .flex .item:first-child {margin-bottom:30px;} #Kitchen_anchor .dairiseki .flex .item:first-child::after {content:none;} #Kitchen_anchor p.obi {line-height:1.2;padding:10px 5px;margin-bottom:10px;} #Quality .cookingtime {margin-bottom: 30px;} #Quality .flex_go:not(:last-child) {margin-bottom:0;} #Kitchen_anchor .item_wrap .flex {display:flex;} #Kitchen_anchor .quality_flex .flex {display:flex;} #Kitchen_anchor .quality_flex .flex .harf_flex {width:48%;} /* Laundry */ #Quality #Laundry_anchor[data-size="w900"] {margin:40px auto;} #Quality #Laundry_anchor p.anchor_ttl {margin-bottom:60px;} #Quality #Laundry_anchor[data-size="w900"]::before {background:url(../img/quality/laundry_bg01_sp.png) no-repeat;background-size:contain;top:60px;right:-5px;width:180px;height:197px;} #Quality #Laundry_anchor .laundry::after {background:url(../img/quality/laundry_bg02_sp.png) no-repeat;background-size:contain;bottom:-50px;width:202px;height:216px;} #Quality #Laundry_anchor .laundry .laundry_img01 {margin-bottom:10px;width:100%;} #Quality .dressing {margin-top:20px;} #Quality .dressing .item_wrap {width:100%;} #Quality .dressing .ttl_area {text-align:left;} /* Bathroom */ #Quality #Bathroom_anchor {margin-bottom:40px;} #Quality #Bathroom_anchor .bathtime {padding:30px 20px;} #Quality #Bathroom_anchor .bathtime::after {background:url(../img/quality/bathtime_img02_sp.png) no-repeat;background-size:contain;width:170px;height:100px;} #Quality #Bathroom_anchor .bathtime .ttl_area p.txt15 {text-align:left;} #Quality #Bathroom_anchor .ttl_area {text-align:left;} /* Toilet */ #Quality .toilet {margin-top:20px;} #Quality #Toilet_anchor {padding-bottom:40px;} #Quality #Toilet_anchor .ttl_area {text-align:left;} #Quality .toilet .item {width:48%;} #Quality #Toilet_anchor .flex {display:flex;} #Quality .toilet .item_wrap {width:100%;} /* Entrance */ #Quality #Entrance_anchor {margin-top:40px;} #Quality #Entrance_anchor .ttl_area {text-align:left;} #Quality #Entrance_anchor .box_img {width:70%;margin:10px auto 0;} /* Other */ #Quality #Other_anchor {margin-bottom:40px;} #Quality #Other_anchor .ttl_area {text-align:left; margin-bottom: 20px;} #Quality .glas_wrap {background:url(../img/quality/others_bg_sp.png) no-repeat;background-size:cover;margin-bottom:30px;padding:25px 15px;} #Quality .glas_wrap p.glas_ttl {line-height:28px;margin-bottom:20px;} #Quality .glas_wrap p.obi {margin-bottom:10px;} #Quality .glas_wrap .others_img {margin-bottom:20px;max-width:initial;width:100%;} #Quality .glas_wrap .inner_flex {display:block;} #Quality .glas_wrap .glas_wrap_syanetu_img {margin:10px auto;} #Quality .glas_wrap .others_img, #Quality .glas_wrap .con_txt_wrap { width: 100%; } #Quality .cp_wrap {padding:10px 10px 30px;} #Quality .cp_wrap .image_flex {width:100%;} #Quality .cp_wrap .flex_harf {width:100%;} #Quality .point_wrap {padding:20px 10px;} #Quality .point_wrap p.point_ttl {font-size:16px;margin-bottom:13px;} #Quality .point_wrap .flex p.point_sec_ttl {font-size:13px;} #Quality .point_wrap .harf {width:100%;} #Quality .point_wrap .harf:first-child {margin-bottom:70px;} #Quality .point_wrap .harf:first-child::after {transform:rotate(90deg);top:inherit;right:0;left:0;margin:0 auto;} #Quality .point_wrap p.mark_ttl {text-align:left;line-height:17px;} #Quality .point_wrap .mark {max-width:70px;margin:0 auto 10px;} #Structure p.txt12 { margin-bottom: 10px; } #Structure .head_area {background:url("../img/structure/head_sp.png") no-repeat;background-size:cover;background-position:center;} #Structure .tab_box .tab_btn { width: 88px; height: 88px; } #Structure .tab_box .btn_area { gap: 10px; margin-bottom: 40px; } #Structure #Fire-resistance p.sec_ttl, #Structure #Fire-resistance p.sec_txt { margin-bottom: 10px; } /* #Structure #Fire-resistance .lead { max-height:152px; background-size: 100%; } #Structure #Earthquake-resistant .lead { background-image: url(../img/structure/earthquake-resistant_bg_sp.png); background-size: 100%; } #Structure #Fire-resistance .lead { background-image: url(../img/structure/fireresistance_bg_sp.png); background-size: 100%; } #Structure #Durability .lead { background-image: url(../img/structure/durability_bg_sp.png); background-size: 100%; } #Structure #Thermal .lead { background-image: url(../img/structure/thermal_bg_sp.png); background-size: 100%; } #Structure #Years60 .lead { background-image: url(../img/structure/years60_bg_sp.png); background-size: 100%; } */ #Structure #Earthquake-resistant .contents { padding: 40px 0; margin-bottom: 0; } #Structure #Earthquake-resistant .contents.bf { margin-bottom: 100px; } #Structure .lead_ttl { margin-bottom: 30px; } #Structure .lead_txt { margin-bottom: 25px; } #Structure .lead_box .lead_box_inner .contents_flex { flex-direction: column; } #Structure .lead_box .lead_box_inner { padding: 20px; } #Structure .lead_box .txt_wrap { width: 100%; } #Structure .contents { padding: 40px 0; margin-bottom: 0; } #Structure #Fire-resistance .lead_ttl { margin-bottom: 30px; } #Structure #Fire-resistance .lead_txt { margin-bottom: 25px; } #Structure #Fire-resistance .contents { padding: 40px 0; margin-bottom: 50px; } #Structure #Fire-resistance .kozo .flex { display: block; } #Structure #Fire-resistance .kozo .box { width: 100%; margin-bottom: 40px; } #Structure #Fire-resistance .lead_box .lead_box_inner { padding: 20px; } #Structure #Fire-resistance .lead_box .txt_wrap { width: 100%; } #Structure #Earthquake-resistant .bf .contents_flex { flex-direction: column; margin-bottom: 40px; padding-bottom: 40px; } #Structure #Earthquake-resistant .bf .contents_flex > div { width: 100%; } #Structure #Earthquake-resistant .bf .sec03.contents_flex { flex-direction: column-reverse; gap: 20px; } #Structure #Earthquake-resistant .bf .sec03.contents_flex picture { margin-bottom: 0; } #Structure #Earthquake-resistant .bf .sec04 .contents_flex { flex-direction: column-reverse; gap: 20px; margin-bottom: 0; } #Structure #Earthquake-resistant .bf .sec04 .bf_sec04_img { margin-bottom: 10px; } #Structure #Fire-resistance .contents_flex { flex-direction: column; } #Structure #Fire-resistance .lead_box .contents_flex { margin-bottom: 40px; padding-bottom: 40px; } #Structure #Fire-resistance .contents_flex > div:first-of-type { width: 100%; } #Structure #Fire-resistance .contents_flex .txt_wrap { width: 100%; } #Structure #Fire-resistance .lead_box .lead_box_inner .sec01.contents_flex { flex-direction: column-reverse; margin-bottom: 0; padding-bottom: 0; } #Structure #Fire-resistance .sec02 .head_border { padding: 15px; margin-bottom: 30px; } #Structure #Fire-resistance .sec02 .contents_flex { flex-direction: column; } #Structure #Fire-resistance .sansyutu { padding: 20px; } #Structure #Fire-resistance .sansyutu .sansyutu_flex { flex-direction: column; gap: 15px; margin-bottom: 15px; } #Structure #Fire-resistance .sansyutu p.annotation { margin-top: 15px; } #Structure #Fire-resistance .sec03 .fireresistance_sec03_img01 { width: 100%; } #Structure .contents_whitebox_wrapper { padding: 40px 0 0; margin-bottom: 40px; } #Structure .contents_whitebox_wrapper .ttl { margin-bottom: 40px; } #Structure .contents_whitebox { padding: 20px; } #Structure #Fire-resistance #Durability .lead_ttl { margin-bottom: 0; } #Structure #Durability .ls30 { padding: 40px 0; } #Structure #Durability .yane { margin-bottom: 40px; } #Structure #Durability .contents_inner_flex { display: block; } #Structure .contens_ttl_flex img { width: 33%; } #Structure #Thermal .intro_flex { margin-bottom: 50px; } #Structure #Thermal picture.thermal_main_ttl { margin-bottom: 40px; } #Structure #Thermal .intro_flex { display: block; } #Structure #Thermal .intro_flex picture { margin: 20px auto 0; } #Structure #Thermal .sec { margin-bottom: 40px; } #Structure #Thermal .sec.sec01 { margin-bottom: 40px; } #Structure #Thermal .sec_inner { padding: 20px; } #Structure #Thermal .sec_ttl { margin-bottom: 15px; } #Structure #Thermal .sec_ttl p.num { width: 35px; height: 35px; } #Structure #Thermal .sec_ttl p.ttl { padding-left: 10px; } #Structure #Thermal .sec picture.thermal_sec03_img01 { margin-bottom: 20px; } #Structure #Thermal .sec04 .sec04_ttl { margin-bottom: 0; } #Structure #Thermal .sec04 .features { display: block; } #Structure #Thermal .sec04 .features_box { width: 100%; padding: 10px 0; box-sizing: border-box; } #Structure #Thermal .sec04 .features_box:not(:last-child)::after { width: 100%; background-repeat: repeat-x; background-size: 12px 9px; right: 0; top: initial; bottom: -100%; } #Structure #Thermal .bg_color { margin-bottom: 40px; padding: 20px 5% 40px; } #Structure #Thermal .sec04 .txt20 { margin-bottom: 20px; } #Structure #Thermal picture.thermal_sec_ttl { margin-bottom: 30px; } #Structure #Thermal .contents { margin-bottom: 60px; } #Structure #Fire-resistance #Years60 .contents { padding-bottom: 60px; } #Structure #Years60 .contents_whitebox { margin-bottom: 50px; } #Structure #Years60 p.af_txt01 { margin-bottom: 15px; } #Structure #Years60 .years60_af { margin: 25px 0; } #Structure #Years60 .contents { padding: 40px 0; } #Structure #Years60 .years60_hosyo_img { margin: 20px 0; } #Structure #Years60 .after_service_img { max-width: 160px; } #Structure #Years60 .contents_whitebox_wrapper { margin-bottom: 60px; } #Map #main { padding-top: 40px; } #Map h3 { margin-bottom: 40px; } #Map p.ttl { margin-bottom: 20px; } #Map .address { display: block; margin-bottom: 30px } #Map .address picture { max-width: initial; width: 100%; } #Map .address p { width: 100%; padding: 5px 0; } #Map .btn_wrap { margin-bottom: 35px; } #Map .btn_wrap .flex { justify-content: center; } #Map .btn_wrap a.btn { max-width: 233px; padding: 15px 20px; } #Map #main.pages { margin-bottom: 110px; } #Outline { padding-top: 60px; margin-bottom: 100px; } #Outline h4 { margin-bottom: 20px; } #Outline table:nth-of-type(2) { margin-bottom: 20px; } #Outline #main { padding-top: 60px; } #Outline .yokoku p.ttl { margin-bottom: 10px; } #Outline table{ border-bottom: 1px solid #b8a395; margin-bottom: 40px; } #Outline table tr{ display:flex; flex-direction:column; border:none; } #Outline table tr th{ text-align:center; border-top:1px solid #b8a395; border-bottom:1px solid #b8a395; width:100%; } #Outline table tr:first-of-type th{ border-top:none; } #Outline table td{ padding:8px 0; width:100%; text-align:center; line-height: 16px; } #Outline table td　{ line-height:20px; } #Outline .date{ margin: 20px 0 0; line-height: 20px; } #Outline .btn{ display:none; } #Outline .yokoku { margin-bottom: 50px; } #Outline .ttl { margin-bottom: 20px; } #Outline .yokoku p { width: 100%; line-height: 16px; } #Outline h3 { margin-bottom: 40px; } #Outline .yokoku { flex-wrap: wrap; } #Outline .yokoku p.ttl { width: 100%; margin-right: 0; } } @media only screen and (max-width: 414px){ }