@charset "UTF-8";
/*数値の設定
------------------------------------------*/
/*上記数値の設定を呼び出しているmixin
------------------------------------------*/
/*
よく使用するmixin
------------------------------------------*/
@media only screen and (max-width: 767px) { #pageContents #sideMenu { display: block; position: static; width: auto; height: auto; padding: 0 30px; }
  #pageContents #sideMenu .sideMenu_inner { position: static; height: auto; padding: 0; }
  #pageContents #sideMenu .sideMenu_inner ul { display: flex; flex-wrap: wrap; justify-content: center; }
  #pageContents #sideMenu .sideMenu_inner ul li { width: 50%; padding: 1px; }
  #pageContents #sideMenu .sideMenu_inner ul li a { display: block; background: #7A6A56; color: #fff; text-align: center; padding: 5px; }
  #pageContents #sideMenu .sideMenu_inner li + li { margin: 0; } }

#pageContents #sideMenu .sideMenu_list li a::before { display: none; }

#pageContents #mainContent .sectionWrap { padding-top: 110px; }
#pageContents #mainContent .contentTitle h2 + p { font-size: 28px; margin: 0 0 35px; }

@media only screen and (max-width: 991px) { #pageContents #mainContent .contentTitle h2 + p { font-size: 28px; margin: 0 0 15px; } }
@media only screen and (max-width: 767px) { #pageContents #mainContent .sectionWrap { padding-top: 50px; }
  #pageContents #mainContent .contentTitle { padding: 0 30px; }
  #pageContents #mainContent .contentTitle h2 { font-size: 24px; padding-left: 30px; }
  #pageContents #mainContent .contentTitle h2:before { width: 35px; left: 0; }
  #pageContents #mainContent .contentTitle h2 + p { font-size: 18px; margin: 0 0 15px; } }
/* kitchen */
#kitchen .kitchen_content { padding: 80px 30px 0 0; }
@media only screen and (max-width: 991px) { #kitchen .kitchen_content { padding: 50px 30px 0 0; } }
@media only screen and (max-width: 767px) { #kitchen .kitchen_content { padding: 30px 30px 0; } }
#kitchen .kitchen_wrap { margin: 0 -15px; }
#kitchen .kitchen_wrap .kitchen_box { width: calc(100% / 4); padding: 0 15px; margin: 0 0 30px; }
#kitchen .kitchen_wrap .kitchen_box h3 { font-size: 20px; margin: 20px 0 10px; border-bottom: 1px solid #000; }
#kitchen .kitchen_wrap .kitchen_box h3 + p { line-height: 1.8; }
@media only screen and (max-width: 991px) { #kitchen .kitchen_wrap .kitchen_box { width: calc(100% / 2); } }
@media only screen and (max-width: 767px) { #kitchen .kitchen_wrap { margin: 0 -5px; }
  #kitchen .kitchen_wrap .kitchen_box { padding: 0 5px; margin: 0 0 20px; }
  #kitchen .kitchen_wrap .kitchen_box h3 { font-size: 15px; } }

/* storage */
#storage .storage_content { padding: 80px 30px 0 0; }
@media only screen and (max-width: 991px) { #storage .storage_content { padding: 50px 30px 0 0; } }
@media only screen and (max-width: 767px) { #storage .storage_content { padding: 30px 30px 0; } }
#storage .storage_closetWrap { align-items: center; }
#storage .storage_closetWrap .closet_img { width: 55%; }
#storage .storage_closetWrap .closet_text { width: 45%; padding-left: 80px; }
#storage .storage_closetWrap .closet_text h3 { font-size: 28px; margin: 0 0 20px; }
#storage .storage_closetWrap .closet_text h3 + p { font-size: 18px; }
#storage .storage_closetWrap .closet_text ul { margin: 30px 0 0; }
#storage .storage_closetWrap .closet_text ul li { position: relative; padding-left: 25px; }
#storage .storage_closetWrap .closet_text ul li::before { content: "◆"; position: absolute; top: 0; left: 0; }
@media only screen and (max-width: 991px) { #storage .storage_closetWrap .closet_img { width: 100%; margin: 0 0 20px; }
  #storage .storage_closetWrap .closet_text { width: 100%; padding-left: 0; } }
@media only screen and (max-width: 767px) { #storage .storage_closetWrap .closet_text h3 { font-size: 18px; margin: 0 0 20px; }
  #storage .storage_closetWrap .closet_text h3 + p { font-size: 15px; }
  #storage .storage_closetWrap .closet_text ul li { font-size: 13px; padding-left: 20px; }
  #storage .storage_closetWrap .closet_text ul li::before { top: 3px; } }
#storage .storage_storeroomWrap { padding: 80px 30px 0 0; max-width: 1200px; margin: 0 auto; }
#storage .storage_storeroomWrap .storeroom_box { width: calc(100% / 2); padding: 0 15px; }
#storage .storage_storeroomWrap .storeroom_box h3 { font-size: 20px; margin: 20px 0 10px; border-bottom: 1px solid #000; }
#storage .storage_storeroomWrap .storeroom_box h3 + p { line-height: 1.8; }
@media only screen and (max-width: 991px) { #storage .storage_storeroomWrap { padding: 50px 0 0 0; } }
@media only screen and (max-width: 767px) { #storage .storage_storeroomWrap { padding: 30px 0 0 0; margin: 0 -5px; }
  #storage .storage_storeroomWrap .storeroom_box h3 { font-size: 15px; }
  #storage .storage_storeroomWrap .storeroom_box { padding: 0 5px; } }
#storage .storage_outletArea { margin: 80px 30px 0 0; padding: 30px; background: #7A6A56; color: #fff; }
#storage .storage_outletArea .storage_outletInner { border: 1px solid #C9BC9C; padding: 30px; }
#storage .storage_outletArea .storage_outlet_title { margin: 0 0 20px; }
#storage .storage_outletArea .storage_outlet_title h4 { font-size: 28px; }
#storage .storage_outletArea .storage_outlet_wrap { margin: 0 -15px; }
#storage .storage_outletArea .outlet_box { width: calc(100% / 4); padding: 0 15px; }
#storage .storage_outletArea .outlet_box p { text-align: center; font-size: 18px; line-height: 1.5; margin: 10px 0 0; }
@media only screen and (max-width: 991px) { #storage .storage_outletArea { margin: 80px 0 0 0; padding: 15px; }
  #storage .storage_outletArea .storage_outletInner { padding: 15px; }
  #storage .storage_outletArea .outlet_box { width: calc(100% / 2); margin: 0 0 15px; } }
@media only screen and (max-width: 767px) { #storage .storage_outletArea { margin: 30px 0 0 0; }
  #storage .storage_outletArea .storage_outlet_title h4 { font-size: 18px; margin: 0 0 15px; }
  #storage .storage_outletArea .storage_outlet_wrap { margin: 0 -5px; }
  #storage .storage_outletArea .outlet_box { padding: 0 5px; }
  #storage .storage_outletArea .outlet_box p { font-size: 13px; } }

/* bathroom */
#bathroom .bathroom_content { padding: 80px 30px 0 0; }
@media only screen and (max-width: 991px) { #bathroom .bathroom_content { padding: 50px 30px 0 0; } }
@media only screen and (max-width: 767px) { #bathroom .bathroom_content { padding: 30px 30px 0; } }
#bathroom .bathroom_wrap { margin: 0 -15px; }
#bathroom .bathroom_wrap .bathroom_box { width: calc(100% / 4); padding: 0 15px; margin: 0 0 30px; }
#bathroom .bathroom_wrap .bathroom_box h3 { font-size: 20px; margin: 20px 0 10px; border-bottom: 1px solid #000; }
#bathroom .bathroom_wrap .bathroom_box h3 + p { line-height: 1.8; }
@media only screen and (max-width: 991px) { #bathroom .bathroom_wrap .bathroom_box { width: calc(100% / 2); } }
@media only screen and (max-width: 767px) { #bathroom .bathroom_wrap { margin: 0 -5px; }
  #bathroom .bathroom_wrap .bathroom_box { padding: 0 5px; margin: 0 0 20px; }
  #bathroom .bathroom_wrap .bathroom_box h3 { font-size: 15px; } }
#bathroom .bathroom_wrap_bigImage .bigImage_left { width: calc(100% / 2); }
#bathroom .bathroom_wrap_bigImage .bigImage_left .bathroom_box { width: calc(100% / 2); }
#bathroom .bathroom_wrap_bigImage .bigImage_right { width: calc(100% / 2); }
#bathroom .bathroom_wrap_bigImage .bigImage_right .bathroom_box { width: calc(100% / 2); }
@media only screen and (max-width: 991px) { #bathroom .bathroom_wrap_bigImage .bigImage_left { width: 100%; }
  #bathroom .bathroom_wrap_bigImage .bigImage_right { width: 100%; } }

/* sanitary */
#sanitary .sanitary_content { padding: 80px 30px 0 0; }
@media only screen and (max-width: 991px) { #sanitary .sanitary_content { padding: 50px 30px 0 0; } }
@media only screen and (max-width: 767px) { #sanitary .sanitary_content { padding: 30px 30px 0; } }
#sanitary .sanitary_wrap { margin: 0 -15px; }
#sanitary .sanitary_wrap .sanitary_box { width: calc(100% / 4); padding: 0 15px; margin: 0 0 30px; }
#sanitary .sanitary_wrap .sanitary_box h3 { font-size: 20px; margin: 20px 0 10px; border-bottom: 1px solid #000; }
#sanitary .sanitary_wrap .sanitary_box h3 + p { line-height: 1.8; }
@media only screen and (max-width: 991px) { #sanitary .sanitary_wrap .sanitary_box { width: calc(100% / 2); } }
@media only screen and (max-width: 767px) { #sanitary .sanitary_wrap { margin: 0 -5px; }
  #sanitary .sanitary_wrap .sanitary_box { padding: 0 5px; margin: 0 0 20px; }
  #sanitary .sanitary_wrap .sanitary_box h3 { font-size: 15px; } }
#sanitary .sanitary_wrap_bigImage .bigImage_left { width: calc(100% / 2); }
#sanitary .sanitary_wrap_bigImage .bigImage_left .sanitary_box { width: calc(100% / 2); }
#sanitary .sanitary_wrap_bigImage .bigImage_right { width: calc(100% / 2); }
#sanitary .sanitary_wrap_bigImage .bigImage_right .sanitary_box { width: calc(100% / 2); }
@media only screen and (max-width: 991px) { #sanitary .sanitary_wrap_bigImage .bigImage_left { width: 100%; }
  #sanitary .sanitary_wrap_bigImage .bigImage_right { width: 100%; } }

/* comfort */
#comfort .comfort_content { padding: 80px 30px 0 0; }
@media only screen and (max-width: 991px) { #comfort .comfort_content { padding: 50px 30px 0 0; } }
@media only screen and (max-width: 767px) { #comfort .comfort_content { padding: 30px 30px 0; } }
#comfort .comfort_line + .comfort_line { padding: 80px 0 0; }
#comfort .comfort_line > h2 { font-size: 28px; margin: 0 0 10px; }
#comfort .comfort_line > h2 span { color: #7A6A56; font-size: 150%; padding-right: 20px; display: inline-block; }
#comfort .comfort_line > h2 span::after { content: "|"; margin-left: 20px; }
@media only screen and (max-width: 991px) { #comfort .comfort_line + .comfort_line { padding: 40px 0 0; }
  #comfort .comfort_line > h2 span { font-size: 130%; } }
@media only screen and (max-width: 767px) { #comfort .comfort_line > h2 { font-size: 18px; }
  #comfort .comfort_line > h2 span { padding-right: 10px; }
  #comfort .comfort_line > h2 span::after { margin-left: 10px; } }
#comfort .comfort_wrap { margin: 0 -15px; }
#comfort .comfort_wrap .comfort_box { width: calc(100% / 4); padding: 0 15px; margin: 0 0 30px; }
#comfort .comfort_wrap .comfort_box h3 { font-size: 20px; margin: 20px 0 10px; border-bottom: 1px solid #000; }
#comfort .comfort_wrap .comfort_box h3 + p { line-height: 1.8; }
@media only screen and (max-width: 991px) { #comfort .comfort_wrap .comfort_box { width: calc(100% / 2); } }
@media only screen and (max-width: 767px) { #comfort .comfort_wrap { margin: 0 -5px; }
  #comfort .comfort_wrap .comfort_box { padding: 0 5px; margin: 0 0 20px; }
  #comfort .comfort_wrap .comfort_box h3 { font-size: 15px; } }
#comfort .comfort_wrap_bigImage .bigImage_left { width: calc(100% / 4); }
#comfort .comfort_wrap_bigImage .bigImage_left .comfort_box { width: 100%; }
#comfort .comfort_wrap_bigImage .bigImage_right { width: calc((100% / 4) * 3); }
#comfort .comfort_wrap_bigImage .bigImage_right .comfort_box { width: calc(100% / 3); }
@media only screen and (max-width: 991px) { #comfort .comfort_wrap_bigImage .bigImage_left { width: 100%; }
  #comfort .comfort_wrap_bigImage .bigImage_left .comfort_box { display: flex; flex-wrap: wrap; }
  #comfort .comfort_wrap_bigImage .bigImage_left .comfort_box figure { width: calc(100% / 2); padding: 0 15px; }
  #comfort .comfort_wrap_bigImage .bigImage_left .comfort_box figure + div { width: calc(100% / 2); padding: 0 15px; }
  #comfort .comfort_wrap_bigImage .bigImage_right { width: 100%; }
  #comfort .comfort_wrap_bigImage .bigImage_right .comfort_box { width: calc(100% / 2); } }
@media only screen and (max-width: 767px) { #comfort .comfort_wrap_bigImage .bigImage_left .comfort_box figure { padding: 0 5px; }
  #comfort .comfort_wrap_bigImage .bigImage_left .comfort_box figure + div { padding: 0 5px; } }

/* zeh */
#zeh { padding: 0 0 80px; }
#zeh .zeh_content { padding: 80px 30px 0 0; }
#zeh .zeh_line + .zeh_line { padding: 80px 0 0; }
@media only screen and (max-width: 991px) { #zeh .zeh_content { padding: 50px 30px 0 0; }
  #zeh .zeh_line + .zeh_line { padding: 50px 0 0; } }
@media only screen and (max-width: 767px) { #zeh { padding: 0 0 40px; }
  #zeh .zeh_content { padding: 30px 30px 0; } }
#zeh .zeh_quality_housing .quality_housing_title { width: 45%; }
#zeh .zeh_quality_housing .quality_housing_title h3 { font-size: 28px; margin: 0 0 30px; }
#zeh .zeh_quality_housing .quality_housing_title h3 span { color: #7A6A56; font-size: 150%; padding-right: 20px; display: block; }
#zeh .zeh_quality_housing .quality_housing_standard { width: 55%; padding-left: 40px; }
#zeh .zeh_quality_housing .quality_housing_standard .standard_inner { background: #E6DFD0; padding: 30px; }
#zeh .zeh_quality_housing .quality_housing_standard h4 { background: #006934; color: #fff; text-align: center; padding: 5px 10px; font-size: 22px; letter-spacing: 2px; margin: 0 0 20px; }
#zeh .zeh_quality_housing .quality_housing_standard h5 { color: #006934; text-align: center; position: relative; margin: 20px 0 10px; font-size: 20px; }
#zeh .zeh_quality_housing .quality_housing_standard h5::before { content: ""; width: 100%; height: 1px; background: #006934; display: block; position: absolute; top: 50%; left: 0; }
#zeh .zeh_quality_housing .quality_housing_standard h5 span { background: #E6DFD0; position: relative; z-index: 2; padding: 0 20px; }
#zeh .zeh_quality_housing .quality_housing_standard ul li { width: calc(100% / 3); color: #006934; }
#zeh .zeh_quality_housing .quality_housing_standard ul li.col2 { width: calc((100% / 3) * 2); }
@media only screen and (max-width: 991px) { #zeh .zeh_quality_housing .quality_housing_title h3 span { font-size: 130%; }
  #zeh .zeh_quality_housing .quality_housing_title { width: 100%; margin: 0 0 20px; }
  #zeh .zeh_quality_housing .quality_housing_standard { width: 100%; padding-left: 0; } }
@media only screen and (max-width: 767px) { #zeh .zeh_quality_housing .quality_housing_title h3 { font-size: 18px; margin: 0 0 15px; }
  #zeh .zeh_quality_housing .quality_housing_standard .standard_inner { padding: 15px; }
  #zeh .zeh_quality_housing .quality_housing_standard h4 { font-size: 20px; }
  #zeh .zeh_quality_housing .quality_housing_standard h5 { font-size: 16px; }
  #zeh .zeh_quality_housing .quality_housing_standard h5 span { padding: 0 15px; }
  #zeh .zeh_quality_housing .quality_housing_standard ul li { width: calc(100% / 2); } }
#zeh .zeh_environmentImg { padding: 40px 10% 0; }
@media only screen and (max-width: 767px) { #zeh .zeh_environmentImg { padding: 30px 0 0; } }