@charset "UTF-8"; html { user-select: none; /* CSS3 */ -moz-user-select: none; /* Firefox */ -webkit-user-select: none; /* Safari、Chromeなど */ /* font-size: 100%; */ box-sizing: border-box; } ul li{ text-decoration: none; display: block; } li{ list-style: none; } a{ display: block; text-decoration: none; /* color: #333333; テーマ指定のリンクカラーに干渉するため、この指定は廃止 */ transition: .3s; } header a, .header a, .mainvisual a, .recommend_office_area a, .service-list-wrap a, .ranking a, .faqblock a, article.select a, .office_information a, .popular a, .detail_property a { color:#333; } a:hover{ cursor: pointer; opacity: .7; transition: .3s; } img { max-width: 100%; vertical-align: bottom; } img.srcrolls { opacity: 0; transition: all .5s; } body{ font-size: 62.5%; margin: 0; padding: 0; -webkit-text-size-adjust: 100%; text-size-adjust: none; font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif; /* overflow: hidden; */ } h1,h2,h3,h4,h5,h6,p,ul,ol,li{ margin: 0; padding: 0; } *,*::before,*::after{ box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } /* 横幅 */ .wrapper{ max-width: 1200px; margin: 0 auto; } /* スマホのみ表示 */ .sp-only{ display: none; } @media (max-width: 768px) { .sp-only{ display: block; } } /* PCのみ表示 */ @media (max-width: 768px) { .pc-only{ display: none !important; } } /* header(後からニョキ) */ .top { background-color: #fff; top: -97px; /* left: 0; */ height: 103px; width: 100%; margin: 0 auto; /* padding-top:30px; */ padding-bottom: 10px; position: fixed; opacity:0; z-index: 1000; /* 他のアイテムに対して最上位のレイヤーになるように */ } .top .header{ width: 100%; max-width: 1400px; height: 103px; margin-right: auto; margin-left: auto; display: flex; align-items: center; justify-content: space-between; position: fixed; } .top .header .top-title .title{ /* font-size: 52px; line-height: 39px; */ margin-left: 12px; min-width: 133px; /* margin-top: -30px; */ margin-top: -10px; } .top .header .top-title .title a img{ /* width:200px; */ width:170px; } .top .header .top-title .title span{ font-size: 23px; } .top .header .nav_ver{ padding-top: 5px; padding-right: 21px; width: auto; display: flex; justify-content: space-around; align-items: center; font-size: 16px; font-weight: bold; /* padding-top: 120px; */ /* margin-left: -38px; */ } .top .header .nav_ver .nav_item1{ margin-right: 37px; } .top .header .nav_ver .account_click{ margin-right: 55px; } .top .header .nav_ver .nav_item2{ margin-right: 55px; } .top .header .contact_info{ width: 234px; padding-top: 1px; /* padding-bottom: 10px; */ } .top .header .number{ font-size: 33px; padding-top: 0; /* padding-bottom: 0; */ } .top .header .number img{ width: 23px; padding-top: 5px; padding-right: 0; margin-right: 3px; } .top .header .time{ font-size: 13px; } .header_main{ max-width: 1220px; margin-right: auto; margin-left: auto; display: flex; justify-content: space-between; align-items: center; margin-top: -40px; } .top-title{ /* width: 240px; */ } .top-title .title{ /* font-size: 87px; */ font-family: 'Oswald', sans-serif; /* line-height: 65px; */ font-weight: bold; /* margin-left: -22px; */ /* margin-top: 71px; */ margin-top:40px; /* margin-right: 25px; */ /* padding-right: 15px; */ position:relative; } .top-title .title p { width: 170px !important; } .top-title .title span.let{ /* font-size: 38px; */ font-size: 26px; padding-left: 5px; line-height: 1.3; } .top-title .title h1{ color:#999; font-size:100%; font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif; position:absolute; top:-10px; left:0; white-space:nowrap; } @media screen and (max-width: 500px) { .top-title .title h1 { top: -5px; left: 7px; } } .jap { position:absolute; left:0; bottom:20px; width:100%; text-align:center; color:#fff; text-shadow:1px 1px 0px #333,-1px 1px 0px #333,1px -1px 0px #333,-1px -1px 0px #333; font-weight:bold; font-size:25%; line-height:1; } /* nav_ver */ .nav_ver{ /* width: 50%; */ width:64%; display: flex; justify-content: space-around; align-items: center; font-size: 16px; font-weight: bold; /* padding-top: 120px; */ padding-top:60px; margin-left: -38px; } .nav_ver .listlink { display:block; } .nav_ver .arealink { position:relative; border:0; } .nav_ver a{ text-align: center; } .nav_ver .search_area{ margin-left: 15px; } .nav_ver .account_click{ background-color: #000; color: #fff; min-width: 129px; text-align: center; display: flex; justify-content: center; font-size: 16px; padding: 9px; /* margin-left: -50px; */ margin-right: 21px; } .nav_ver .account_click .account{ padding-right: 13px; } .nav_ver .member_register_btnarea a, .nav_ver .header_contact_btnarea a{ color:#fff; } .contact_info{ /* width: 269px; */ width: auto; text-align: center; /* padding-top: 102px; */ /* padding-top: 60px; */ padding:40px 0px 10px; } .contact_info .info-title{ background-color: #000; font-size: 16px; color: #fff; height: 30px; border-radius:40px; margin-top: -1px; padding-top: 0px; /* padding-bottom: 3px; */ /* margin-bottom: 5px; */ margin-left: -5px; display: flex; align-items: center; justify-content: center; } .contact_info_detail_wrapper { display: flex; } .contact_info .number{ display: flex; align-items: center; justify-content: center; /* font-size: 39px; */ font-size: 30px; font-family: 'Oswald', sans-serif; font-weight: bold; margin-top: -8px; color: #000; } .contact_info .number img{ padding-top: 4px; padding-right: 7px; } .contact_info .time{ background-color: #F8F8F8; font-weight: bold; margin-left: 10px; margin-top: 0px; /* font-size: 16px; */ font-size:14px; display: flex; align-items: center; justify-content: center; } @media screen and (max-width:1233px){ .top-title .title{ margin-left: 0; } } @media screen and (max-width:1060px){ .contact_info{ width: auto; } } @media screen and (max-width:1044px){ .top .header .nav_ver .nav_item1{ margin-right: 20px; } .top .header .nav_ver .nav_item2{ margin-right: 20px; } .top .header .nav_ver .account_click{ margin-right: 20px; } } @media screen and (max-width:970px){ /* .contact_info .number{ font-size: 33px; } */ } /* @media screen and (max-width:800px){ */ @media screen and (max-width: 1044px) { .header_main { /* flex-wrap: wrap; */ /* margin-top: 30px; */ margin-top: 10px; margin-bottom: 10px; } .header{ margin-top: 0; height: 130px; } .header_main+.top{ display: none; } .nav_ver{ /* display: none; */ width:100%; padding-top:20px; display:flex; justify-content:space-evenly; margin:0 auto; } .nav_ver .listlink { display:none; } .nav_ver .arealink { border:1px solid #333; } .nav_ver .search_area { margin:0; padding:8px 16px; } .nav_ver .account_click { margin-right:0; } .contact_info{ display: none; } .top-title{ width: 100%; display: flex; align-items: center; justify-content: center; margin-top: -30px; } .jap { bottom:12px; } } @media screen and (max-width:500px){ .nav_ver { flex-wrap: wrap; } .logins { margin-top: 10px; } .first-v{ margin-top: 20px; } .top-title{ /* margin-top: -25px; */ } .top-title .title{ font-size: 10px; line-height: 40px; margin-left: 0; position:static; } .top-title .title h1{ font-size:10px; } .top-title .title p.logos { width:150px !important; } .top-title .title span.let{ /* font-size: 30px; */ /* font-size: 24px; */ font-size: 21px; } .nav_ver .arealink { display:none; } } #menu-silde{ width: 400px; height: 100%; background-color: #fff; position: fixed; top: 0; right: 0; z-index: 10; transform: translateX(400px); transition: all .6s; /* ← 追加 */ overflow-y: auto; z-index: 9999; } #menu-silde.open{ transform: translateX(0); } .menu-background { position: fixed; top: 0; left: 0; content: ""; display: block; width: 0; height: 0; background-color: rgba(0, 0, 0, 0.5); z-index: 2; opacity: 0; /* 透明度を0にすることで隠す */ transition: opacity 0.5s; /* 透明度の0→1になる速度 */ } .menu-background.open { width: 100%; height: 100%; opacity: 1; /* メニューが表示されているときには背景が表示 */ } .nab_global_title{ background-color: #464646; color: #fff; display: flex; justify-content: center; align-items: center; font-size: 16px; font-weight: bold; height: 60px; } .menu a{ color: #000; font-weight: bold; } .menu-link{ border-bottom: 1px solid #E1E1E1; } .menu-link ul li p{ color: #262626; } .menu-link-officetar{ text-align: center; padding: 25px 0; border-bottom: 1px solid #E1E1E1; } .menu-link-officetar a p{ padding-bottom: 8px; } .menu-link-officetar a img{ width: 185px; } .menu-logo{ display: flex; border-bottom: 1px solid #E1E1E1; } .menu-logo a{ width: 50%; padding: 20px 0; display: flex; flex-direction: column; align-items: center; } .menu-logo a p{ padding-bottom: 10px; font-size: 15px; font-weight: bold; } .menu-logo a img{ width: 150px; } .menu-logo .border{ border-right: 1px solid #E1E1E1; } .office-first{ width: 90%; margin: 0 auto; } .office-first a{ display: flex; align-items: center; justify-content: center; padding: 10px 0; } .office-first a img{ width: 37px; height: 37px; } .office-first a p{ font-size: 15px; font-weight: bold; } .conpre-title{ background-color: #464646; text-align: center; padding: 20px 0; } .conpre-title-text{ font-size: 16px; font-weight: bold; color: #fff; } .conpre-number{ background-color: #8A8A8A; width: 90%; margin: 10px auto; display: flex; justify-content: center; align-items: center; border-radius: 11px; } .conpre-number-img{ padding-right: 20px; } .conpre-number-img img{ width: 35px; } .number{ color: #fff; line-height: 25px; padding-top: 13px; padding-bottom: 7px; } .number .free-number{ font-size: 31px; font-weight: bold; } .number .time{ font-size: 16px; font-weight: bold; } .other-contact{ width: 90%; margin: 10px auto; display: flex; align-items: center; justify-content: space-between; } .other-contact a{ width: 48%; } .contact-line{ background-color: #3FCE2F; width: 100%; text-align: center; padding: 20px 0; border-radius: 11px; } .contact-line p{ font-size: 21px; font-weight: bold; color: #fff; } .contact-web{ background-color: #0E7AC4; width: 100%; text-align: center; padding: 20px 0; border-radius: 11px; } .contact-web p{ font-size: 21px; font-weight: bold; color: #fff; } /* ======================================= wrap_breadcrumb ======================================= */ #wrap_breadcrumb{ background-color: #D2D2D2; height: 55px; display: flex; align-items: center; /* margin-top: 40px; */ /* margin-top:20px; */ } #breadcrumb{ text-align: left; width: 100%; max-width: 1260px; margin-right: auto; margin-left: auto; display: flex; /* justify-content: space-between; */ } #breadcrumb li a{ color: #756558; font-size: 130%; font-weight: bold; text-decoration: underline; } #breadcrumb li.slash{ margin: 0 10px; font-size: 12px; font-weight: bold; padding-top: 1px; } #breadcrumb li:last-child a{ color: #333; text-decoration: none; } #breadcrumb li span.np { font-size:130%; padding-right:15px; } @media (max-width: 1300px) { #wrap_breadcrumb{ padding-left: 10px; } } @media (max-width: 800px){ #breadcrumb{ overflow-x: auto; white-space: nowrap; } } @media screen and (max-width:500px){ #wrap_breadcrumb{ /* margin-top: 23px; */ } #breadcrumb{ margin-left: 15px; } } /* 横からスライドする */ @media screen and (max-width:500px){ #menu-silde{ width: 300px; } .menu-logo a p{ font-size: 12px; } .menu-logo a img{ width: 100px; } .office-first a p{ font-size: 12px; } .number .free-number{ font-size: 25px; } .number .time{ font-size: 12px; } } /* 横からスライドするメニュー終わり */ /* ======================================= footer ======================================= */ .footer{ /* padding-top: 115px; */ padding-top: 155px; background-color: #2E2E2E; padding-bottom: 141px; } .footer_link{ max-width: 929px; margin: 0 auto; display: flex; /* justify-content: space-between; */ justify-content: space-evenly; /* font-weight: bold; */ margin-top: 60px; margin-bottom: -100px; } .footer_link .link_cord .time{ background-color: #F8F8F8; max-width: 271px; margin-right: auto; margin-left: auto; font-size: 16px; font-weight: bold; } .link_cord{ width: 32%; max-width: 297px; height: 139px; text-align: center; background-color: #fff; padding-top: 10px; padding-bottom: 12px; border: 1px solid #DEDEDE; box-shadow: 0 2px 3px 1px rgba(0, 0, 0, .1); } .link_cord_title{ background-color: #000; color: #fff; max-width: 271px; width: 90%; margin-right: auto; margin-left: auto; padding-top: 3px; padding-bottom: 3px; font-size: 16px; border-radius: 40px; } .link_number{ display: flex; align-items: center; justify-content: center; } .link_number img{ padding-top: 5px; padding-right: 5px; } .link_number .tell_number{ font-family: 'Oswald', sans-serif; font-size: 39px; display: flex; align-items: center; justify-content: center; font-weight: bold; } .line_info{ font-size: 15px; margin-top: 7px; margin-bottom: 8px; } .link_cord a{ display: flex; justify-content: space-around; align-items: center; } .mt-only{ margin-top: -5px; } .link_cord a .line{ color: #25CF2A; font-size: 39px; font-weight: bold; font-family: 'Oswald', sans-serif; margin-right: -30px; } .link_cord a .line_get{ background-color: #25CF2A; font-size: 20px; font-weight: bold; color: #fff; border-radius: 5px; width: 155px; height: 49px; display: flex; align-items: center; justify-content: center; } .account_get{ background-color: #E5BF00; width: 90%; padding-top: 10px; padding-bottom: 10px; color: #fff; font-size: 20px; font-weight: bold; border-radius: 5px; height: 49px; } .footer_logos{ display: flex; align-items: center; justify-content: center; /* padding-left: 12px; */ } .footer_logo{ width: 200px; font-size: 64px; font-family: 'Oswald', sans-serif; font-weight: bold; color: #fff; line-height: 50px; /* padding-left: 10px; */ } .footer_logo span{ font-size: 28px; /* padding-left: 10px; */ } .copyright{ text-align: center; margin-top: 40px; color: #fff; font-size: 12px; font-weight: bold; padding-top: 10px; } @media (max-width: 950px) { .footer_link{ width: 95%; } } @media screen and (max-width:800px){ .footer_link{ display: block; margin-bottom: 50px; } .link_cord{ width: 100%; margin-right: auto; margin-left: auto; margin-bottom: 30px; } .footer{ padding-top: 32px; padding-bottom: 72px; } } @media screen and (max-width:500px){ .copyright{ margin-top: 18px; } .footer_link{ margin-top: 41px; margin-bottom: 62px; } .footer_logos{ /* padding-left: 20px; */ } .link_cord a{ justify-content: center; } .link_cord a .line{ margin-right: 20px; padding-bottom: 5px; } } @media (max-width: 376px) { .link_cord{ width: 90%; } } /* sp-menu */ .sp-menu{ display: none; } @media screen and (max-width:800px){ .sp-menu{ background-color: #2E2E2E; position: sticky; z-index: 9998; bottom: 0; display: flex; justify-content: space-between; align-items: center; color: #fff; text-align: center; border-top: 1px solid #707070; height: 100px; padding-bottom:35px; } .sp-menu a{ color: #fff; /* padding-bottom: 10px; */ height: 100%; } .search_btn{ width: 22%; font-size: 11px; border-right: 1px solid #707070; padding-top: 13px; margin: 0; text-align: center; } .search_btn1{ width: 21%; font-size: 11px; border-right: 1px solid #707070; padding-top: 13px; margin: 0; text-align: center; padding-right: 10px; } .search_btn:first-of-type{ padding-right: 0; } .sp-menu-text{ padding-top: 5px; } .contact_number{ width: 38%; font-size: 12px; text-align-last: left; padding-left: 10px; padding-top: 5px; } .sp-tell{ font-family: 'Oswald', sans-serif; font-size: 20px; display: flex; align-items: center; } .sp-tell img{ padding-top: 3px; padding-right: 3px; } .menu-sp{ width: 15%; border-left: 1px solid #707070; padding-top: 10px; padding-bottom: 10px; display: flex; align-items: center; justify-content: center; } .menu-icon img{ width: 33px; margin-right: auto; margin-left: auto; } } @media screen and (max-width:500px){ .search_btn1{ padding-right: 5px; } } @media (max-width: 320px) { .fv-img h2 .fv-text1{ padding-right: 0; padding-left: 0; font-size: 30px; } .fv-img h2 .fv-text2{ font-size: 30px; width: 170px; } } /* 20220224 korenaga */ .members { color: crimson; } /* 20231113 korenaga */ .citylinkbox { width:100%; max-width:1200px; margin:0 auto; padding:0 10px 50px; } .citylinkbox .citylinkbtns { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:start; } .citylinkbox .citylinkbtns li { margin-bottom:8px; width:12%; } .citylinkbox .citylinkbtns li a { display:block; width:100%; padding:12px 5px; text-align:center; border-radius:7px; background-color:#333; transition:all 0.3s; font-size:140%; color:#fff; font-weight:bold; } .citylinkbox .citylinkbtns li a:hover { color:#222; background-color:#FFC743; } .only-pc{ display:block; } @media screen and (max-width: 768px) { .citylinkbox .citylinkbtns li { width:24%; } .only-pc{ display:none; } .citylinkbox .citylinkbtns li a { font-size:115%; } } /* ログイン */ .loginname { display:flex; align-items:center; padding:0 10px; } .loginname i { margin-right:5px; } .loginname span.comname { display:none; } .post_content a{ display: inline-block; }