@charset "UTF-8";

/* 基本設定 */
*{ margin: 0; padding: 0; box-sizing: border-box;}
html{ scroll-behavior:smooth; }/* 未対応多い(らしい) */
body{ font-family:
  "Hiragino Kaku Gothic ProN",
  "Hiragino Sans",
  Meiryo,
  "Helvetica Neue",
  Arial,
  sans-serif; font-size: 62.5%; }
a{ text-decoration: none; color: #000; }
a:hover{ color: #0068b6; }
img{ border-style: none; }
ul{ list-style-type: none; }
.empha{ color: #ff1493;}
.empha2{ color: #1e90ff;}
.empha3{ color: #ff8c00;}

/* フォント設定 */
@font-face{
  font-family: 'NotoSerifBold';
  src: url(fonts_css/NotoSerifJP-Bold.otf);
}
@font-face{
  font-family: 'NotoSerifR';
  src: url(fonts_css/NotoSerifJP-Regular.otf);
}
@font-face{
  font-family: 'RocknRoll';
  src: url(fonts_css/RocknRollOne-Regular.ttf);
}
@font-face{
  font-family: 'KosugiMaru';
  src: url(fonts_css/KosugiMaru-Regular.ttf);
}
@font-face{
  font-family: 'ZenMaruGothicM';
  src: url(fonts_css/ZenMaruGothic-Medium.ttf);
}
@font-face{
  font-family: 'SawarabiGothicR';
  src: url(fonts_css/SawarabiGothic-Regular.ttf);
}
@font-face{
  font-family: 'Satisfy';
  src: url(fonts_css/Satisfy-Regular.ttf);
}

.font80{ font-size: 80%; }
.font60{ font-size: 60%; }
.font40{ font-size: 40%; }

.page{ width: 80%; max-width: 1200px; margin: 0 auto;}
section{ padding-top: 200px;}/* header分 */

/* fontawesome用 */
.fa-solid{ font-weight: 900; }
.fa-regular{ font-weight: 400;}

/* ページトップへ戻るボタン */
#page_top{
  position: fixed;
  bottom: 30px;
  right: 15px;
  
  text-align: center;
  color: #aaa;
  
  filter:alpha(opacity=50);
  -moz-opacity: 0.5;
  opacity: 0.5;
  
  cursor: pointer;
}
#page_top:hover{
  filter:alpha(opacity=50);
  -moz-opacity: 0.8;
  opacity: 0.8;
}
#page_top span{
  display: block;
  font-size: 2.0rem;
}

/* 小見出し */
h2{
  font-size: 2.4rem;
  font-family: 'KosugiMaru';
  margin-bottom: 2em;
  padding: .6em;
  padding-left: 2.5em;

  background: transparent url(../images/icon.png) no-repeat 0 0;
  background-size: contain;

  position: relative;
}

h2::before{
  content: '';
  position: absolute;

  width: 100%;
  height: 10px;
  border-radius: 5px;
  background-color: #e4dc8a;

  left: 0;
  top: 120%;
}

/* === header === */
header{
  background-color: rgba(255,255,255,0.9);
  overflow: hidden;/* marginではみ出し対策 */
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 100;
}
header .header_info{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
header .header_info .header_logo a{
  display: block;
  width: 50%;
  min-width: 450px;
  height: 150px;

  text-indent:100%;
  white-space:nowrap;
  overflow:hidden;

  background: transparent url(../images/header_logo.svg) no-repeat 0 50%;
  background-size: contain;

  transition: 0.5s;/* 縮小時スムーズに */
}
header .header_info .header_tel{
  font-family: 'SawarabiGothicR',Arial, Helvetica, sans-serif;
  font-weight: bold;
  font-size: 2.8rem;

  padding-left: 1.3em;
  position: relative;
  
  transition: 0.5s;
}
header .header_info .header_tel::before{
  font-family: "Font Awesome 6 Free";
  content: '\f098';
  color: #df7163;
  margin-top: -1.5rem;

  position: absolute;
  top: 50%;
  left: 0;
}

/* スクロール時 */
.is_small .header_info .header_logo a{
  height: 80px;
}
.is_small .header_info .header_tel{
  font-size: 2.0rem;
}
.is_small .header_info .header_tel::before{
  margin-top: -1.0rem;
}

header nav{
  background: rgb(87,138,61);
  background: linear-gradient(0deg, rgba(87,138,61,1) 0%, rgba(103,158,74,1) 50%, rgba(87,138,61,1) 50%, rgba(87,138,61,1) 100%);
  padding-top: 2px;
  padding-bottom: 2px;
}
header nav ul{
  display: flex;
  justify-content: space-between;

  width: 80%; max-width: 1200px; margin: 0 auto;
}
header nav ul li{
  width: 16.6%;
  border-left: 1px solid #fff;
}
header nav ul li.mb{
  display: none;
}
header nav ul li:nth-last-of-type(2){/* 最後から2番目 */
  border-right: 1px solid #fff;
}
header nav ul li a{
  display: block;

  font-size: 1.2rem;
  text-align: center;
  color: #fff;
  font-weight: bold;

  padding: 1rem 0;

  transition: all .3s;
}
header nav ul li a:hover,header nav ul li a:active{
  background-color: rgba(170,207,83,0.6);
  color: #fff;
}
.is_small nav ul li a{ font-size: 1.0rem; padding: .6em 0;}

header .menu_btn{ /* スマホメニュー用 */
  position: fixed;
  z-index: 12;
  top: 20px;
  right: 5px;
  width: 40px;
  height: 40px;
  color: #666;
  cursor: pointer;
  display: none;
}
header .menu_btn span{ 
  display: block;
  position: absolute;
  
  width: 30px;
  height: 4px;
  background: #666;
  border-radius: 10px;
  -webkit-transition: all 400ms;
  transition: all 400ms;
}
header .menu_btn span:nth-child(2) { top: 10px; }
header .menu_btn span:nth-child(3) { top: 20px; }
header .menu_btn p{ 
  position: absolute;
  bottom: 0;
  width: 100%;
}
header .active span:nth-child(1){ /* xを描く */
  top: 10px;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
header .active span:nth-child(2),
header .active span:nth-child(3){
  top: 10px;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg);
}

header .to_engineer{
  position: absolute;
  top: 10px;
  right:10px;
}
header .to_engineer a{
  display: block;
  font-size: .8rem;
  padding: 5px;
  border: 1px solid #2f5d50;
  color: #2f5d50;

  border-radius: 10px;
}
header .to_engineer a:hover{
  background-color: #82ae46;
  border-color: #82ae46;
  color: #fff;
}

#simple_inquiry{
  display: none;
  z-index: 99;
  
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
}
#simple_inquiry ul{
  width: 100%;
  background-color: #fff;
  border-top:1px solid #9ba88d;
  display: flex;
  justify-content: center;
}
#simple_inquiry ul li{
  width: 50%;
}
#simple_inquiry ul li:first-of-type{
  border-right: 1px solid #9ba88d;
}
#simple_inquiry ul li a{
  display: block;
  font-size: 1.0rem;
  color: #9ba88d;
  text-align: center;
  padding: 6px;
}
#simple_inquiry ul li a p{
  font-size: .6rem;
}

/* === footer === */
footer{
  background: #2f5d50 url(../images/wall.png) no-repeat 100% 100%;
  background-size: 20%;
  overflow: hidden;/* marginではみ出し対策 */
}
footer .footer_info{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;

  margin: 100px auto;
}
footer .footer_info > div{
  width: 30%;
  font-size: .8rem;
  color: #fff;
}
footer .footer_info .footer_logo{
  background: transparent url(../images/logo_wh.svg) no-repeat 0 50%;
  background-size: contain;
}
footer .footer_info .tt{
  font-weight: bold;
  font-size: 1.0rem;
  margin-bottom: 1.5em;

  border-bottom: 1px solid #9ba88d;
  color: #9ba88d;
}
footer .footer_info .about .cc_name,footer .footer_info .about .adress{
  margin-bottom: 1em;
}
footer .footer_info .about .tel{
  font-size: 1.2rem;
}
footer .footer_info .footer_sitemap ul li{
  margin-bottom: .5em;
}
footer .footer_info .footer_sitemap ul li a{
  color: #fff;
}
footer .footer_info .footer_sitemap ul li a:hover{
  text-decoration: underline;
}

footer .copy{
  text-align: center;
  font-size: .8rem;
  padding: 1em;

  background-color: #fff;
}


/* === TOP === */
#top .top_img{
  background: transparent url(../images/top_wall.jpg) no-repeat 0 50%;
  background-size: cover;
}
#top .top_img img{
  width: 20%;
  margin: 3vw auto 50px 10vw;
}
#top h1{
  text-align: center;
  font-weight: normal;
  background: rgb(87,138,61) url(../images/wall.png) no-repeat 100% 100%;
  background-size: contain;

  display: flex;
  justify-content: center;
  padding: 2vw;

  overflow: hidden;
}
#top h1 p{
  font-family: 'KosugiMaru';
  font-size: 1.4rem;
  color: #f2f2b0;
  padding: 1em;

  position:relative;
}

#top h1 p::before{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 5px solid #e4dc8a;
  border-radius: 10px;

  transform: skewX(-20deg);
}
#top h1 p .strong{
  font-size: 160%;
  margin: 0 3px;
}

/* === サービス === */
#service h2 span{
  color: #e95464;
}
#service h2 span.com_name{
  color: #82ae46;
}
#service .service_list{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
#service .service_list li{
  width: 28%;
  margin-bottom: 5em;
}
#service .service_list li .service_tt{
  text-align: center;
  font-size: 1.4rem;
  font-weight: bold;
  margin-bottom: 10px;
}
#service .service_list li .service_img img{
  width: 100%;
}
#service .service_list li .service_msg{
  font-size: .8rem;
  margin-top: 1em;
}

#service .service_basic{
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
#service .service_basic li{
  width: 18%;
  text-align: center;
  font-size: 1.2rem;
  font-family: 'KosugiMaru';
  color: #028760;

  border-right: 1px solid #7ebeab;
  padding: 1em 0;
}
#service .service_basic li:last-of-type{
  border-right: 0;
}
#service .service_basic li i{
  display: block;
  font-size: 2.4rem;
  color: #7ebeab;
  margin-bottom: 20px;
}

/* === 料金 === */
#price h3{
  position: relative;
  display: inline-block;
  height: 64px;
  margin: 50px auto 50px 30px;
  padding: 1rem 2rem 1rem 3rem;
  color: #fff;
  font-size: 1.4rem;
  background: #df7163;
}
#price h3:before {
  position: absolute;
  top: 0;
  left: -30px;
  content: '';
  border-width: 32px 30px 32px 0;
  border-style: solid;
  border-color: transparent #df7163 transparent transparent;
}
#price h3:after {
  position: absolute;
  top: calc(50% - 7px);
  left: -10px;
  width: 14px;
  height: 14px;
  content: '';
  border-radius: 50%;
  background: #fff;
}

#price .prive_msg{
  font-size: 1.6rem;
}
#price .prive_msg p{
  font-weight: bold;
  color: #c53d43;
}
#price .price_notice{
  margin: 30px auto;
  border: 1px solid #7ebeab;
  padding: 20px;
}
#price .price_notice li{
  font-size: 1.0rem;
  margin-bottom: .5em;
  padding-left: 2.0em;
  position: relative;
}
#price .price_notice li::before{
  font-family: "Font Awesome 6 Free";
  content: '\f14a';
  color: #7ebeab;
  font-size: 1.2rem;
  margin-top: -0.6rem;
  font-weight: bold;
  position: absolute;
  top: 50%;
  left: 0;
}

#price .plan_list_1{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
#price .plan_list_1 > li{
  width: 30%;
  margin-bottom: 50px;

  background-color: #fff;
  border: 1px solid #ccc;
  box-shadow: 3px 3px 0 #aaa;

  padding: 20px;
  font-size: 1.0rem;
}
#price .plan_list_1 .base_services ul{
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin-top: 10px;
}
#price .plan_list_1 .base_services ul li{
  font-size: 0.8rem;
  border: 1px solid #92b5a9;
  color: #92b5a9;
  padding: .5em;
  margin: 5px 5px 0 0;
}
#price .plan_list_2{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
#price .plan_list_2 li{
  width: 25%;
  font-size: 1.0rem;
  border-right: 1px solid #92b5a9;

  padding: 16px;
}
#price .plan_list_2 li:last-of-type{
  border-right: 0;
}

#price .truck_img{
  width: 80%;
  margin: 0 auto;
}
#price .truck_img img{
  width: 100%;
}
#price .sq{
  color: #aaa;
  font-size: .6rem;
}

#price .truck_tt{
  text-align: center;
  color: #82ae46;
  font-size: 1.2rem;
  font-weight: bold;
}

#price .plan_info_tt{
  background-color: #4682b4;
  color: #fff;
  display: inline-block;
  width: 40%;
  text-align: center;
  font-weight: bold;
  margin: 0 5px 3px 0;
}
#price .amount{
  font-weight: bold;
  color: #c53d43;
  font-size: 1.4rem;
}
#price .plan_free{
  width: 80%;
  font-size: 0.8rem;
  margin: 30px auto 0;
}

/* === 流れ === */
#flow ul.flow_list{
  position:relative;
  counter-reset: num 0;
 
  background: #cee4ae url(../images/wall.png) no-repeat 100% 100%;
  background-size: 300px;

  padding: 50px;
}
#flow ul.flow_list::before{
  content: '';
  position: absolute;
  top: 50px;
  left: 7.0rem;
  width: 4px;
  height: 90%;
  background-color: #82ae46;
}
#flow ul.flow_list li{
  position: relative;
  margin-bottom: 80px;

  background-color: #fff;
  box-shadow: 3px 3px 0 #82ae46;
  font-size: 1.4rem;
  padding: 2em;
  padding-left: 5em;

  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
#flow ul.flow_list li:last-of-type{
  margin-bottom: 0;
}
#flow ul.flow_list li::before{
  counter-increment: num 1;
  content: counter(num) ".";
  position: absolute;
  top: 50%;
  left: 20px;
  font-size: 4.0rem;
  margin-top: -3.0rem;
  font-family: Arial Black;
  color: #82ae46;
}
#flow ul.flow_list li p.notices{
  display: block;
  width: 100%;
  font-size: 1.0rem;
  color: #c53d43;
}

/* === 会社概要 === */
#company .com_info{
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  font-size: 1.0rem;
}
#company .com_info dt{
  width: 20%;
  font-weight: bold;
  margin-bottom: 1.5em;
}
#company .com_info dd{
  width: 80%;
  margin-bottom: 1.5em;
}
#company .policy{
  border: 1px solid #ccc;
  box-shadow: 0px 0px 3px rgba(0,0,0,0.4);

  font-family: 'NotoSerifR','游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;

  padding: 40px;
  margin-bottom: 50px;
}
#company .policy .seirishi_tt{
  font-size: 1.4rem;
  text-align: center;
  margin-bottom: 1em;
}
#company .policy .seirishi_tt .soul{
  color: #c53d43;
}
#company .policy > ul{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}
#company .policy > ul > li{
  font-size: 1.0rem;
  width: 40%;
  padding-top: 6rem;

  position: relative;
}
#company .policy > ul > li::before{
  content: '一、';
  display: block;
  position: absolute;
  font-size: 2.0rem;
  top: 2rem;
  left: 50%;
  margin-left: -1.0rem;
}
#company .policy > ul > li ul{
  list-style-type: '・';
  list-style-position: inside;
  margin-top: .5em;
  font-size: 90%;
}

/* === 問い合わせ === */
#inquiry .inquiry_tt{
  text-align: center;
  font-size: 2.8rem;
  color: #fff;
  margin-bottom: 50px;
  padding: 20px;
  background: #2f5d50 url(../images/wall.png) no-repeat 100% 100%;
  background-size: contain;
}
#inquiry .inquiry_info{
  padding-top: 50px;
  padding-bottom: 50px;
}
#inquiry .inquiry_info .inq_cts_tt{
  text-align: center;
  color: #82ae46;
  font-size: 1.8rem;
  border-bottom: 1px solid #82ae46;
  margin-bottom: 50px;
}
#inquiry .inquiry_info .inq_tel{
  font-size: 2.8rem;
  text-align: center;
  font-family: 'SawarabiGothicR',Arial, Helvetica, sans-serif;
  font-weight: bold;
}
#inquiry .inquiry_info .inq_tel i{
  color: #e4dc8a;
}
#inquiry .inquiry_info .inq_tel p{
  font-size: 1.4rem;
  margin-bottom: 50px;
  font-weight: normal;
}
#inquiry .inquiry_info .inq_email{
  font-size: 2.8rem;
  text-align: center;
  font-family: 'SawarabiGothicR',Arial, Helvetica, sans-serif;
  font-weight: bold;
}
#inquiry .inquiry_info .inq_email i{
  color: #e4dc8a;
}
#inquiry .inquiry_info .inq_email p{
  font-size: 1.4rem;
  margin-bottom: 50px;
  font-weight: normal;
}
#inquiry .inquiry_info .contact_privacy{
  font-size: 1.2rem;
  text-align: center;
  margin-top: 50px;
}
#inquiry .inquiry_info .contact_privacy a{
  text-decoration: underline;
}

/* === 技術者採用サポート === */
#engineer{
  font-size: .8rem;
  background: #cee4ae url(../images/wall.png) no-repeat 100% 100%;
  background-size: 20%;

  padding-top: 200px;
  padding-bottom: 100px;

  margin-bottom: -200px; /* お問い合わせのpadding分 */
}
#engineer .eng_top{
  background: transparent url(../images/engineer_top_wall.jpg) no-repeat 0 0;
  background-size: cover;
  text-align: center;
}
#engineer .eng_top .eng_top_img{
  background: transparent url(../images/engineer_top_img.jpg) no-repeat 50% 0;
  background-size: auto 100%;

  width: 100%;
  height: 60vh;
}
#engineer .eng_top .msg{
  font-size: 3.0rem;
  color: #fff;

  padding: 10px;
  background-color: rgba(30,80,162,0.8);
  width: 100%;
}
#engineer .eng_info{
  background-color: #fff;
  margin-top: 40px;

  padding: 50px;

  position: relative;
  overflow: hidden;
}
#engineer .eng_info::after{
  content: '';
  position: absolute;
  width: 100px;
  height: 150px;
  top: -80px;
  right: -50px;
  background-color: #cee4ae;

  transform: rotate(-45deg);
}
#engineer h4{
  text-align: center;
  font-size: 2.0rem;
  background-color: #028760;
  color: #fff;
  padding: .3em;
  border-radius: 50px;
  margin-bottom: 1em;
}
#engineer .eng_msg{
  text-align:center;
  font-size: 1.2rem;
}
#engineer .eng_point{
  width: 80%;
  margin: 50px auto 0;
  border: 1px solid #ccc;
  padding: 50px;

  display: flex;
  justify-content: center;
  align-items: center;
}
#engineer .eng_point ul{
  width: 55%;
}
#engineer .eng_point ul li{
  font-size: 1.4rem;
  padding-left: 2.4rem;
  margin-bottom: 1em;

  position: relative;
}
#engineer .eng_point ul li:last-of-type{
  margin-bottom: 0;
}
#engineer .eng_point ul li::before{
  font-family: "Font Awesome 6 Free";
  content: '\f00c';
  color: #82ae46;
  font-size: 2.0rem;
  margin-top: -1.0rem;
  font-weight: bold;
  position: absolute;
  top: 50%;
  left: 0;
}
#engineer .eng_point img{
  width: 40%;
}
#engineer .eng_msg_2{
  text-align: center;
  margin-top: 50px;
  font-size: 1.6rem;
  font-weight: bold;

  position: relative;
}
#engineer .eng_msg_2::before{
  font-family: "Font Awesome 6 Free";
  content: '\f358\f358\f358\f358';
  color: #82ae46;
  font-size: 2.0rem;
  letter-spacing: 1.0rem;
  margin-top: -1.0rem;
  position: absolute;
  top: 50%;
  left: 0;
}
#engineer .eng_msg_2::after{
  font-family: "Font Awesome 6 Free";
  content: '\f358\f358\f358\f358';
  color: #82ae46;
  font-size: 2.0rem;
  letter-spacing: 1.0rem;
  margin-top: -1.0rem;
  position: absolute;
  top: 50%;
  right: 0;
}

/* === プライバシーポリシー === */
#privacy{
  font-size: .8rem;
  background: #666 url(../images/wall.png) no-repeat 100% 100%;
  background-size: 20%;

  padding-top: 300px;
  padding-bottom: 100px;

  margin-bottom: -200px; /* お問い合わせのpadding分 */
}
#privacy > section{
  background-color: #fff;
  padding: 50px;
}
#privacy .pp_tt{
  text-align: center;
  font-weight: bold;
  font-size: 1.4rem;
  margin-bottom: 1em;
}
#privacy .pp_tt .en{
  display: block;
  font-size: 80%;
  color: #aaa;
}
#privacy .pp_msg{
  padding: 1em;
  margin-bottom: 1em;
  border-bottom: 1px solid #ccc;
}
#privacy dt{
  font-weight: bold;
  font-size: 1.2rem;
  color: #2f5d50;
  margin-bottom: 1em;
}
#privacy dd{
  padding-left: 2em;
  margin-bottom: 2em;
}
#privacy dd a{
  color: #c53d43;
  text-decoration: underline;
}

/* ==== ページ幅が狭くなった時の措置 ==== */
@media screen and ( max-width: 1024px ){ /* タブレット基準 */
  .page{ width: 90%; }
  section{ padding-top: 140px;}/* header分 */
  h2{ font-size: 2.0rem; }
  header .header_info .header_logo{ width: 40%; }
  header .header_info .header_logo a{ width: 100%; min-width: initial; height: 80px; }
  header .header_info{ align-items: flex-end; }
  header .header_info .header_tel{ font-size: 2.0rem;}
  header .header_info .header_tel::before{ margin-top: -1.0rem; }
  header .to_engineer a{ font-size: .7rem; padding: 3px; }
  footer .footer_info > div{ width: 40%;}
  footer .footer_info .footer_logo{ width: 100%; height: 100px; background-position: 50% 50%; background-size: 50%; margin-bottom: 20px;}
  #top .top_img img{ width: 30%; margin: 20px auto 20px 5vw; }
  #top h1{ padding: 2em; }
  #top h1 p{ font-size: 1.0rem; line-height: 160%;}
  #top h1 p .br{ display: block; }
  #service .service_list li .service_tt{ font-size: 1.0rem; }
  #service .service_basic li{ padding: 1em; width: 20%;}
  #price .plan_list_1 > li{ width: 48%; }
  #price .plan_list_2 li{ width: 50%; }
  #price .plan_list_2 li:nth-child(even){ border-right: 0;}
  #price .plan_list_2 li:nth-child(1),#price .plan_list_2 li:nth-child(2){ border-bottom: 1px solid #92b5a9;}
  #company .policy{ padding: 30px; }
  #company .policy > ul > li{ width: 45%; }
  #engineer,#privacy{ margin-bottom: -140px; }
  #engineer{ padding-top: 140px; }
  #engineer .eng_top .eng_top_img{ height: 40vh;}
  #engineer .eng_top .msg{ font-size: 2.0rem; }
  #engineer .eng_msg{ font-size: 1.0rem; }
  #engineer .eng_point{ width: 100%; padding: 30px;}
  #engineer .eng_point ul{ width: 59%; }
  #engineer .eng_point ul li{ font-size: 1.2rem; }
  #engineer .eng_msg_2::before,#engineer .eng_msg_2::after{ margin-top: 0; top: 100%; }
}
@media screen and ( max-width: 767px ){ /* スマホ基準 */
  .br{display: block;}
  section{ padding-top: 80px;}/* header分 */
  #page_top{ bottom: 50px; }
  h2{ font-size: 1.4rem; padding-left: 2.3em;}
  h2::before{ height: 6px; }
  header .header_info{ display: block; }
  header .header_info .header_logo{ width: 70%;}
  header .header_info .header_tel{ display: none; }
  header .menu_btn{ display: block; }
  header .menu_btn .menu_close{ display: none; }
  header nav{ position: fixed; top: 0; left: 0; z-index: 11; width: 100%; margin: 0; padding: 0; height: 100vh; background-image: none; background-color: rgba(0,0,0,0.6); display: none;}
  header nav > ul{ display: block; background-color: #fff; width: 100%;}
  header nav > ul li{ width: 100%; border-bottom: 1px solid #ccc; font-size: 1.0rem; text-align: left; }
  header nav > ul li a{ text-indent: 1.0em; text-align: left; font-weight: normal; padding: .8em; color: #000;}
  header nav > ul > li:first-child a{ padding-top: 2em;}
  header nav ul li.mb{ display: block; }
  header .to_engineer{ display: none; }
  #simple_inquiry{ display: block; }
  footer .footer_info{ display: block; }
  footer .footer_info > div{ width: 80%; margin: 0 auto 20px; }
  footer .footer_info .footer_logo{ background-size: 80%; }
  footer .copy{ padding-bottom: 60px; font-size: .6rem; }
  #top .top_img img{ width: 25%; margin: 10px; }
  #top h1{ padding: 1em; }
  #top h1 p::before{ content: none; }
  #service .service_list li{ width: 46%; }
  #service .service_list li .service_tt{ font-size: 0.8rem; }
  #service .service_basic li{ width: 40%; margin: 1em; font-size: 1.0rem; border: 1px solid #7ebeab; }
  #service .service_basic li:last-of-type{ border-right: 1px solid #7ebeab; }
  #price h3{ font-size: 1.2rem; }
  #price .prive_msg{ font-size: 1.0rem; }
  #price .price_notice li{ font-size: .8rem; }
  #inquiry .inquiry_tt{ font-size: 2.0rem; margin-bottom: 0; }
  #price .price_notice li{ margin-bottom: 1em; }
  #price .price_notice li::before{ font-size: 1.4rem; margin-top: -0.7rem; }
  #price .plan_list_1{ display: block; }
  #price .plan_list_1 > li{ width: 90%; margin: 0 auto 20px; }
  #price .plan_list_2{ display: block; }
  #price .plan_list_2 li{  width: 90%; margin: 0 auto 20px; border-right: 0; border-bottom: 1px solid #92b5a9;}
  #flow ul.flow_list{ padding: 10px; }
  #flow ul.flow_list::before{ left: 2.0rem; height: 80%; }
  #flow ul.flow_list li{ margin-bottom: 40px; font-size: 0.9rem; padding: 1em; padding-left: 4em; }
  #flow ul.flow_list li::before{ left: 10px; font-size: 2.0rem; margin-top: -1.5rem; }
  #flow ul.flow_list li p.notices{ font-size: .6rem; }
  #company .com_info{ font-size: .8rem; }
  #company .policy > ul > li{ width: 90%; }
  #inquiry .inquiry_info .inq_cts_tt{ font-size: 1.2rem; }
  #inquiry .inquiry_info .inq_tel{ font-size: 1.8rem; }
  #inquiry .inquiry_info .inq_tel p{ font-size: 1.2rem; }
  #inquiry .inquiry_info .inq_email{ font-size: 1.4rem; }
  #inquiry .inquiry_info .contact_privacy{ font-size: 1.0rem; }
  #engineer,#privacy{ margin-bottom: -80px; }
  #engineer{ padding-top: 80px; }
  #engineer .eng_top .eng_top_img{ height: 240px;}
  #engineer .eng_top .msg{ font-size: 1.2rem; }
  #engineer .eng_info{ padding: 20px; }
  #engineer .eng_info::after{ content: none; }
  #engineer h4{ font-size: 1.2rem; }
  #engineer .eng_msg{ text-align: left; font-size: .8rem; width: 90%; margin: 0 auto;}
  #engineer .eng_point{ display: block; text-align: center;}
  #engineer .eng_point ul{ width: 100%; margin-bottom: 1em;}
  #engineer .eng_point ul li{ font-size: 1.0rem; text-align: left;}
  #engineer .eng_point img{ width: 60%; margin: 0 auto; }
  #engineer .eng_msg_2{ font-size: 1.2rem; margin-bottom: 30px;}
  #engineer .eng_msg_2::before,#engineer .eng_msg_2::after{ font-size: 1.2rem;}
  #privacy{ padding-top: 100px; }
  #privacy > section{ padding: 10px; }
  #privacy dt{ font-size: 1.0rem; }
  #privacy dd{ padding-left: 0; }
}