.pc {display: none;}
.tab {display: block!important;}
.sp {display: block;}
.sp_only {display: none;}

/*header*/
.menu_tab {display: flex;justify-content: space-between;background-color: #000;height: 60px;position: fixed;top: 0;z-index: 100;width: 100%;}
.menu_pc, .menu_sp {display: none;}

header h1 {width: 100px;}
header h1 a {width: 100px;}
header h1 img {width: 100%; height: auto;}

section {padding: 60px 0;}
section h2 {margin: 0 auto 30px;}

/*news,event*/
.top_info h2 {height: 91px;}
.top_info .info_con a {flex-basis: 300px;}
.top_info .info_con p {font-size: 14px;height: 100px;overflow: hidden;}
.top_info .info_con span {display: block;}
.top_info .info_con .news {width: 60px;background-color:#4169e1; color: #fff; padding: 3px;text-align: center;}
.top_info .info_con .event {width: 60px;background-color:#008080; color: #fff; padding: 3px;text-align: center;}
.top_info figure {margin-right: 10px;flex-basis: 150px;}
.top_info figure img {width: 100%;height: auto;}

/*works*/
.top_works h2 {height: 80px;}
.work_flex {display:block;width: 95%;margin: 0 auto;}
.workbox {width: 100%; margin: 0 auto;}

.slide_prev{position: absolute;top: 0;bottom: 0;left: 5px;margin: auto;height: 30px;z-index: 1;color: #ccc;}
.slide_next{position: absolute;top: 0;right: 5px;bottom: 0;margin: auto;height: 30px;z-index: 1;color: #ccc;}


/*オンライン、LINE*/
.top_contact .inbox {width: 90%;}
.webp .top_contact .inbox {width: 90%;}
.top_contact .here {position: absolute;bottom: -30px; right: 50%;-webkit-transform : translateX(50%);transform : translateX(50%);z-index: 1;}
.line_img img {box-shadow: 25px 25px 1px 1px rgba(0, 0, 0, .2);}


/*about*/
.aboutbox {width: 100%; margin: 0 auto;position: relative;text-align: center;max-width: 640px;}
.top_about img {width: 100%; height: auto; margin-bottom: 30px;}
.top_about a img {width: 100%; height: auto; margin-bottom: 30px;}
.top_about a.toabout {display: block;}
.top_about a.toviewmore {display: block;margin-left: 20px;}
.top_about button.transformbw {margin: 0 auto;}
/*howto faq*/
.howto_faq_flex {display: block;}
.howto,.faq {margin: 0 auto 60px;}
.howto {width: 100%; max-width: 580px;}
.howto h2 {height: 80px;}

.faq {width: 100%; max-width: 580px;}
.faq h2 {height: 80px;}

/*voices*/
.voices h2 {height: 80px;}
.voices_flex {display: block;}
.voice_box {width: 50%;}
.voice_box div img {margin:0 auto; width: 30%; height: auto;}


/*insta*/
.insta {text-align: center;}
.insta h2 {height: 80px;}
.insta ul {display: flex; margin-bottom: 60px;}


/*company*/
.company_bg {background: url(../images/footer.jpg) no-repeat top center / cover;margin: 0 calc(50% - 50vw); padding: 50px calc(50vw - 50%);}
.webp .company_bg {background: url(../images/footer.webp) no-repeat top center / cover;margin: 0 calc(50% - 50vw); padding: 50px calc(50vw - 50%);}
.officeadd {color: #fff; line-height: 1.4;margin: 20px 0;}
.gmap {padding-bottom: 30%;}


/*footer*/
footer {border-top: 0;}
.footer_flex {display: flex; justify-content: center; width: 100%; margin: 0 auto;}
.footer_logo {width: 160px;margin: 0;}
.sitemap {width: 100%;max-width: 320px;margin: 0 0 0 40px;}
.sitemap ul {height: 200px;}
.sitemap ul li {width: 160px; height: 30px; font-size: 16px;}
.footer_sns {height: 120px; margin-top: 0;}
.footer_sns ul li {height: 120px;}

.office_img {display: none;}

.footer_menu {display: flex;}

/*-------中ページ-------*/
/*about*/
.head_title_about {background: url("../images/inner_header_bg01.jpg") no-repeat center / contain;padding-bottom: calc(100%*600/1920);margin: 0 auto;position: relative;}
.head_title_about h2 {background:url(../images/inner_tit_aboutus.png) no-repeat center / contain;width: 494px; height: 51px;position: absolute; bottom: 0; left: 15%;margin: 0 auto 30px; padding:0;}
.philosophy_cont {width: 90%;}
.philosophy_cont p {text-align: center; line-height: 2;letter-spacing: 5px;padding: 20px 0;}
.philosophy_cont p span{font-size: 24px;}
.about_logo {width: 140px;float: right;}

.staff {width: 95%;margin: 0 auto;}
.staff h3 {margin:0;background:url(../images/staff.png) no-repeat center / contain; height: 30px;}
.staff_box{display: flex; flex-wrap: wrap; border-bottom: 1px solid #555;padding: 60px 0;}
.staff_box:first-of-type {padding: 30px 0 60px;}
.staff_box:last-child {border-bottom: 0px; margin-bottom: 60px;}
.staff_box figure {flex-basis: 30%;}
.staff_box figure img {width: 100%; height: auto;}
.staff_box figcaption {padding: 0 30px;line-height: 1.8;font-size: 14px;flex-basis: 60%;}
.staff_box figcaption i{margin: 10px 0;display: block;font-style: normal;font-weight: 700;font-size: 18px;}

.staff_movie {width:100%;padding-bottom: 56.25%;height:0px;position: relative;flex-basis: 100%;margin-top: 20px;}
.staff_movie iframe{position: absolute;top: 0;left: 0;width: 100%;height: 100%;}


/*company*/
.head_title_company {background: url("../images/inner_header_bg01.jpg") no-repeat center / contain;padding-bottom: calc(100%*600/1920);margin: 0 auto;position: relative;}
.head_title_company h2 {background:url(../images/inner_tit_company.png) no-repeat center / contain;width: 492px; height: 34px;position: absolute; bottom: 0; left: 15%;margin: 0 auto 30px; padding:0;}
.company_overview_cont {padding: 0 50px;}
.company_img {flex-basis: 50%;}

.history_info{width: 95%; margin:100px auto 0;}
.comp_history {width: 100%;margin: 0 auto 30px;}
.comp_history ul li {height: 40px; letter-spacing: 1px;font-size: 14px;}
.comp_history ul li i {font-style: normal; margin-right: 30px;}
.comp_history p {font-size: 12px;}

.comp_info {width: 100%; margin:0 auto;}
.comp_info h3 {background:url(../images/comp_info.png) no-repeat center / contain; width:325px; height: 29px;margin: 0 0 15px;}
.comp_info ul li {height: 33px; letter-spacing: 1px;font-size: 14px;white-space: nowrap;}
.comp_info p {font-size: 20px;font-weight: 700;}

/*info*/
.head_title_info {background: url("../images/inner_header_bg03.jpg") no-repeat center / contain;padding-bottom: calc(100%*600/1920);margin: 0 auto;position: relative;}
.head_title_info h2 {background:url(../images/inner_tit_info.png) no-repeat center / contain; width: 557px; height: 39px;position: absolute; bottom: 0; left: 15%;margin: 0 auto 30px; padding:0;}
.info_list {width: 95%; margin:100px auto;}
.info_list_con {display: flex; margin-bottom: 60px;}
.info_list_con figure {width: 100%; max-width: 240px; display: block;}
.info_list_con figure img {width: 100%; height: auto;}
.info_right {padding: 0 60px;}
.info_list_flex {width: 95%;margin: 100px auto;}


/*info detail*/
.info_detail {width: 95%;}

/*howto*/
.head_title_howto {background: url("../images/inner_header_bg04.jpg") no-repeat center / contain;padding-bottom: calc(100%*600/1920);margin: 0 auto;position: relative;}
.head_title_howto h2 {background:url(../images/inner_tit_howto.png) no-repeat center / contain; width: 491px; height: 34px;position: absolute; bottom: 0; left: 15%;margin: 0 auto 30px; padding:0;}
.step_box {width: 95%;margin: 60px auto 0; display: flex;}
.mt_240 {margin-top: 240px;}
.step_left {max-width: 320px;}
.step_icon {width: 60px; height: 60px; position: absolute; top: 3%; left: 5px;}
.arrow, .arrow_l{position: absolute; top: 105%; left: 50%; transform: translateX(-50%);display: block;}
.step_right {width: 100%;max-width: 460px; height: auto; position: relative;}
.step_right>div{position: absolute;top: 50%; left:50%; transform: translate(-50%,-50%);width: 90%;text-align: left;}
.step_right div a img {width: 100%; height: auto;}
.step_title {font-size: 20px; font-weight: 700;}
.howto_online {top: 100%;}
.howto_online img {width: 100%; height: auto;}


/*online*/
.head_title_online {background: url("../images/inner_header_bg06.jpg") no-repeat center / contain;padding-bottom: calc(100%*600/1920);margin: 0 auto;position: relative;}
.head_title_online h2 {background:url(../images/inner_tit_online.png) no-repeat center / contain; width: 434px; height: 34px;position: absolute; bottom: 0; left: 15%;margin: 0 auto 30px; padding:0;}
.h3_online {width: 100%;}
.h3_online h3 {height:330px;}

.online_form {width: 100%;margin:0 auto;}
.online_form ul {width: 90%;margin: 30px auto 0;}
.online_form ul li {font-size: 14px;}

.online_flow {width: 100%; background: #f3f3f3; margin:60px auto; padding: 60px 0; text-align: center;}
.online_flow h3 {background:url(../images/online_flow.png) no-repeat center / contain; width: 458px; height: 58px;margin: 0 auto 5px;}
.online_flow p{text-align: center;width: 90%;margin: 0 auto;line-height: 1.8;letter-spacing: 2px;}
.online_flow p a {color: #0087ff}
.online_flow div {width: 95%; margin: 0 auto;}
.online_flow img {width: 100%; height: auto;}

.online_contact {width: 95%;margin: 60px auto;text-align: center;}
.online_contact div {margin: 30px 10px 0;}
.online_contact div a img {width: auto;}

/*faq*/
.head_title_faq {background: url("../images/inner_header_bg05.jpg") no-repeat center / contain;padding-bottom: calc(100%*600/1920);margin: 0 auto;position: relative;}
.head_title_faq h2 {background:url(../images/inner_tit_faq.png) no-repeat center / contain; width: 356px; height: 34px;position: absolute; bottom: 0; left: 15%;margin: 0 auto 30px; padding:0;}

.accbox {margin: 2em 0;padding: 0 0 0 30px;max-width: 700px;border-left: 1px solid;}
/*ラベル*/
.accbox label {width:220px;}
/*チェックは隠す*/
.accbox input {display: none;}
/*中身を非表示にしておく*/
.accbox .accshow {height: 0;padding: 0;overflow: hidden;opacity: 0;transition: 0.8s;}
/*クリックで中身表示*/
.cssacc:checked + .accshow {height: auto;padding: 5px;opacity: 1;}
.question {margin: 30px 0 5px;}

.new_house_bg {display: block;margin-bottom: 60px;}
.new_house_bg h4 {height: 60px;}
.left_img {display: none;}
.faq_new_house {margin-left: 20px;}

.renovate_bg {display: block;background: #eee;padding: 60px 0;}
.renovate_bg h4 {background:url(../images/renovate.png) no-repeat center / contain; width: 260px; height: 60px;}
.faq_renovate {margin-left: 20px;}

.faq_line {margin: 20px auto;}


/*voice*/
.head_title_voice {background: url("../images/inner_header_bg07.jpg") no-repeat center / contain;padding-bottom: calc(100%*600/1920);margin: 0 auto;position: relative;}
.head_title_voice h2 {background:url(../images/inner_tit_voice.png) no-repeat center / contain; width: 598px; height: 34px;position: absolute; bottom: 0; left: 15%;margin: 0 auto 30px; padding:0;}
.h3_voice h3 {background:url(../images/owners_voice.png) no-repeat center / contain; width: 200px; height: 60px;margin: 30px auto;}

#voicedata {width: 95%; margin: 0 auto;}
.voice_box_inner {width: 100%;display: flex;margin: 0 10px;padding: 30px 0;}
.voice_box_inner .img_zoom {width: 290px;}
.voice_box_inner img {width: 100%; height: auto;}
.owners_comment {width: 100%; max-width: 690px; padding: 0 10px 0 0;}
.voice_title_inner {background: #E3E3E3;font-weight: 700;padding: 13px 33px 25px 13px;margin: 0;}
.voice_title_inner i {display: block;font-style: normal;font-weight: 400;font-size: 0.8em;color: #808080;}
.voice_box_inner p {font-size: 14px; line-height: 1.8; margin-bottom: 30px;padding: 5px;}
.moreBtn {margin: 0 auto;width: 220px;}

/*works*/
.head_title_works {background: url("../images/inner_header_bg08.jpg") no-repeat center / contain;padding-bottom: calc(100%*600/1920);margin: 0 auto;position: relative;}
.head_title_works h2 {background:url(../images/inner_tit_works.png) no-repeat center / contain; width: 426px; height: 34px;position: absolute; bottom: 0; left: 15%;margin: 0 auto 30px; padding:0;}

#worksdata {width: 95%; margin:0 auto;display: flex;flex-wrap: wrap;}
.works_box {width: calc((100% / 2) - 10px); margin:0 5px 20px;}
.owners_name {font-size: 18px; font-weight: 700; text-align: center;}
.finished {color: #ccc;}
.works_box .viewmore:before {background: #fff;}
.works_box .viewmore:after{background: #fff;}


/*worksdetails*/
.property_data {margin: 0 auto 100px;}
.property_data figure {width: 100%;}
.data {text-align: center;}
.data p {font-size: 50px;}
.data ul li {letter-spacing: 1px;line-height: 2;}

.points h4 {font-size: 50px;}
.point_box {width: 95%;}
.point_box figure img {width: 100%; height: auto;margin: 0 auto;}
.point_box p {width: 90%;line-height: 1.6;}

/*contact*/
.head_title_contact {background: url("../images/inner_header_bg02.jpg") no-repeat center / contain;padding-bottom: calc(100%*600/1920);margin: 0 auto;position: relative;}
.head_title_contact h2 {background:url(../images/inner_tit_contact.png) no-repeat center / contain;width: 465px; height: 34px;position: absolute; bottom: 0; left: 15%;margin: 0 auto 30px; padding:0;}
.contact_line p {text-align: center;}

/*thanks*/
.thanks h2 {font-size: 28px;}

/*recruit*/
.head_title_recruit {background: url("../images/inner_header_bg09.jpg") no-repeat center / contain;padding-bottom: calc(100%*600/1920);margin: 0 auto;position: relative;}
.head_title_recruit h2 {background:url(../images/inner_tit_recruit.png) no-repeat center / contain;width: 438px; height: 34px;position: absolute; bottom: 0; left: 15%;margin: 0 auto 30px; padding:0;}
.recruit-inside h3 {background:url(../images/recruit.png) no-repeat center / contain; width: 315px; height: 62px;padding:0;}

.col-rec{width: 180px;}
.rec_list table{border: 1px solid #ccc;border-collapse: collapse;margin: 0 auto;padding: 0;table-layout: fixed;width: 100%;max-width: 800px;}
.rec_list table caption{font-size: 1.5em;margin: .5em 0 .75em;}
.rec_list table tr{display: inherit;background-color: #f8f8f8;border: 1px solid #ddd;padding: .35em;margin-bottom: 0}
.rec_list table th,.rec_list table td{line-height: 28px;padding: .625em;display: revert;font-size: 1em;}
.rec_list table th{border-bottom: none;font-size: .85em;letter-spacing: .1em;text-transform: uppercase;}