@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.2
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/


*{box-sizing: border-box;}
body{font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif; font-weight: 500; margin: 0; padding: 0; color: #707070; background-color: #fff;}

a:hover{
-webkit-filter: brightness(0.6);
-moz-filter: brightness(0.6);
-o-filter: brightness(0.6);
-ms-filter: brightness(0.6);
filter: brightness(0.6);
}

img{max-width: 100%; vertical-align:top;}

.header-container{display: none;} 
header.article-header{display: none;}
div.content{margin: 0; padding: 0;}

div.tagline{text-align:left;}

article{ width: 100%; margin: 0; padding: 0;}
article section{width: 98%; max-width: 1200px; padding: 10px 0; margin:0 auto 60px auto;}
article section.w750{max-width: 750px;}
article section.w900{max-width: 900px;}
article section.w1000{max-width: 1000px;}
article section.full{width: 100%; max-width: none; padding: 10px 0; margin: 0 auto 60px auto;}
article section.bgb{width: 100%; color: #fff; max-width: none; padding: 10px 0; margin: 0 auto 60px auto; background-color: #000;}
article section.gmap{width: 100%; max-width: none; padding: 0; margin: 30px auto 0;}
article section div.secinn{width: 100%; margin: 0; padding: 0;}
article section div.secinn02{width: 100%; max-width: 1000px; margin: 0 auto; padding: 0;}

article.content_inn{width:100%; margin:0 auto;}
article.gray{background-color: #f2f0f0; padding: 30px 0 0 0; margin: 0 auto 60px auto;}
article.nonegap{width: 100%; display: inline-block; padding: 0; margin: 0;}


article section#lease p{width: 100%; max-width: 850px; font-size: 17px; margin: 15px auto; padding: 0;}

/*--- ヘッダー ---*/
.entry-content{ margin:0; padding: 0;}
div#head{width: 100%; background-color: rgba(255,255,255,0.7); position: fixed; left: 0; top: 0; z-index: 9999;}
div#navwrap{width:100%; max-width: 1200px; padding:10px; margin:0 auto;}
div.logo{width:60%; max-width: 290px; padding:8px 15px 0 0;}

div#navwrap #nav-drawer{width: calc(100%); display: block !important; }
#nav-drawer{ position: relative; }
.nav-unshown { display:none; }

/*アイコンのスペース*/
#nav-open {
  position: absolute;
  display: inline-block;
  right: 15px;
  top: 0;
  width: 40px;
  padding:15px;
}

/*ハンバーガーアイコンをCSSだけで表現*/
#nav-open span{
  height: 40px;/*線の太さ*/
  width: 40px;/*長さ*/
  background: url("https://www.inp-ad.com/nippo-housing/img/Nav.png") right top no-repeat;
  background-size: 100%;
  display: block;
  cursor: pointer;
}
#nav-open:hover{
-webkit-filter: brightness(0.6);
-moz-filter: brightness(0.6);
-o-filter: brightness(0.6);
-ms-filter: brightness(0.6);
filter: brightness(0.6);

}

/*閉じる用の薄黒カバー*/
#nav-close {
  display: none;/*はじめは隠しておく*/
  position: fixed;
  z-index: 99;
  top: 0;/*全体に広がるように*/
  left: 0;
  width: 100%;
  height: 100%;
  background: black;
  opacity: 0;
  transition: .3s ease-in-out;
}

/*中身*/
#nav-content {
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;/*最前面に*/
  width: 90%;/*右側に隙間を作る（閉じるカバーを表示）*/
  max-width: 400px;/*最大幅（調整してください）*/
  height: 100%;
  background: rgba(255,255,255,0.8);/*背景色*/
  transition: .3s ease-in-out;/*滑らかに表示*/
  -webkit-transform: translateX(-105%);
  transform: translateX(-105%);/*左に隠しておく*/
}

/*チェックが入ったらもろもろ表示*/
#nav-input:checked ~ #nav-close { display: block; opacity: .5; }
#nav-input:checked ~ #nav-content {
  -webkit-transform: translateX(0%);
  transform: translateX(0%);/*中身を表示（右へスライド）*/
  box-shadow: 6px 0 25px rgba(0,0,0,.15);
}

#nav-content ul{padding-top: 1em; padding-bottom: 100px;}
#nav-content ul li{padding:16px 0 10px 0.5em; font-size: 18px; line-height: 22px; list-style:none; margin: 0; border-bottom:1px dashed #999;}
#nav-content ul li:first-child{}
#nav-content ul li:last-child{border: none;}
#nav-content ul li a{text-decoration:none; display:block; color:#000;}
#nav-content ul li a span{font-size: 14px;}

div#mainslide{width: 100%; padding: 0; margin: 0 0 60px 0; position: relative;}

/*--- フッター ---*/
footer#footer{width: 100%; color: #222; padding: 15px 0 10px 0; margin: 0 auto 25px; background-color: #D7E6D0;}
footer#footer a{text-decoration: none; color: #666;}
div.ftinn{width: 100%; max-width: 1200px; margin: 0 auto; padding: 0;}
ul.ftnav{width: 100%; text-align: center; font-size: 14px;}
ul.ftnav li{list-style-type: none; margin: 0; padding: 0 5px; border-right: 1px solid #fff; display: inline;}
ul.ftnav li:last-child{border: none;}

div.ftcon{ width: 100%; margin:25px auto; padding: 0; flex-wrap: wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;}
div.ftcon div.fcl{width:calc(65%); margin:0 auto;}
div.ftcon div.fcl img.ftlogo{max-width: 300px;}
div.ftcon div.fcl p.ftadd{font-size: 14px;}
div.ftcon div.fcl p.ftmes{font-size: 14px; line-height: 20px;}
div.ftcon div.fcr{width:calc(25%); margin:0 auto;}
div.ftcon div.fcr p{text-align: center; margin-bottom: 20px;}
div.ftcon div.fcr img{width: 25%; max-width: 50px;}
div.ftcon div.fcr ul{list-style: none; padding: 20px 0 0 50px;}
div.ftcon div.fcr ul li{font-size: 14px; line-height: 18px; margin: 0; padding: 2px 0;}
div.ftcon div.fcr ul li img{width: 14px;}

.foottel{font-size: 30px; line-height: 30px; font-weight: bold;}
.foottel a{color: #000; text-decoration: none;}
.foottel a img{width: 22px; margin: 5px 8px 8px 0}

div.ftsnsmb{display: none;}

#contact_mb{text-align: center; margin: 0; padding:20px 0; background-color: #c3c3c3; font-family: 'ヒラギノ角ゴ Pro W2','ヒラギノ角ゴ W2', 'メイリオ', 'ＭＳ Ｐゴシック',sans-serif; font-weight: bold;}
#contact_mb a{ color: #707070; text-decoration: none;}
#contact_mb ul{ width: 80%; margin: 0 auto; padding: 0;}
#contact_mb ul li{ width: 100%; list-style-type: none; margin: 0 0 15px 0; padding:20px 0; background-color: #fff;}
#contact_mb ul li a{display: block;}

#footcon_mb{width: 100%; margin: 20px 0 0 0; padding: 0;}
#footcon_mb h4{font-size: 16px; width: 90%; margin: 10px auto; font-weight: bold;}
#ftmbadd{width:90%; margin:0 auto; font-size:13px; flex-wrap: wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;}
#ftmbadd div.ftmbaddl{width: calc(50%);}
#ftmbadd div.ftmbaddr{width: calc(45%);}

#mhicon{width:90%; margin:25px auto 0 auto; font-size:13px; flex-wrap: wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;}
#mhicon div{width: calc(30%); text-align: center;}
#mhicon div a{ text-decoration: none; color: #707070;}
#mhicon div img{width: 50%;}

#footer_mb{text-align: center; margin: 0; padding:20px 0;}
#footer_mb a{ color: #fff; text-decoration: none;}
#footer_mb ul{ width: 80%; margin: 0 auto; padding: 0;}
#footer_mb ul li{ width: 100%; list-style-type: none; margin: 0 0 5px 0; padding:10px 0; background-color: #101010;}
#footer_mb ul li a{display: block;}
#footer_mb div#addmb{margin: 0; padding:45px 0;}
#footer_mb div#addmb div#facebook_mb{width:calc(15%); margin:0 auto; padding:0;}
#footer_mb div#addmb div#logo_mb{width:calc(20%); margin: 0 auto; padding: 35px 0 0 0;}

#footlink{text-align: center; font-size: 12px; font-weight: bold; color: #333; background-color: #fff;}
#footlink img{width: 60%; max-width: 150px;}
#copyright{ width:100%; font-size:12px; color:#666; text-align:center; padding:20px 0; float:none; clear:both; background-color: #fff;}


div#mainimage{width:calc(100%); position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: -9999;
  }
div#mainimage img{width:calc(100%);}
div#mainimage_mb{display: none !important;}
div#mainimage_mb div.mimgmbinn{ width: 100%; margin: 0 0 1px 0; padding: 0; position: relative;}
div#mainimage_mb div.mimgmbinn div.mimgmbcon{ position: absolute; left: 50%; top: 50%;}

div.simgw{width: 100%; background-color: #98CE17; margin: 0; padding: 5px 0;}
div.simgwinn{width: 100%; max-width: 1200px; margin: 0 auto; background-size: contain; position: relative; padding-top: 10%;}
div.simgw h1.simg{width: 100%; max-width: 1200px; text-align: left; font-size: 35px; color: #fff; text-shadow: 1px 2px 3px #808080; position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
}
.simgwbg01{ background: url("../../../img/SubImage01.png") right top no-repeat;}
.simgwbg02{ background: url("../../../img/SubImage02.png") right top no-repeat;}
.simgwbg03{ background: url("../../../img/SubImage03.png") right top no-repeat;}


div.mcap{font-size: 12px; font-weight: normal; text-align: center; line-height: 2.0em; margin: 0; padding:10px 0;}
div.mcap span{ font-size: 20px; font-weight: bold; font-family: 'ヒラギノ角ゴ Pro W2','ヒラギノ角ゴ W2', 'メイリオ', 'ＭＳ Ｐゴシック',sans-serif;}

div.bc{ width: 100%; max-width: 1200px; font-size: 14px; margin: 0 auto; padding:0;}
div.bc02{ width: 100%; margin: 0; padding:0;}
div.bc03{ width: 100%; margin: 0; padding:0; border-bottom: 1px solid #707070;}

div.breadcrumbs{ font-size:12px; width:100%; max-width:1280px; margin:0 auto; padding: 6px 0;}
div.breadcrumbs a{color:#000; font-weight: normal;}
div.bc02 div.breadcrumbs a{color:#000; font-weight: normal;}
div.breadcrumbs a:hover{color:#707070;}


/*--- 見出し ---*/
h1 , h2 , h3 , h4{font-family: 'ヒラギノ角ゴ Pro W2','ヒラギノ角ゴ W2', 'メイリオ', 'ＭＳ Ｐゴシック',sans-serif; font-weight: bold; margin: 0; padding: 0; line-height: 100%; background-color: none;}
h1{margin: 0 auto; padding: 0; font-weight: bold; text-align: center; font-size: 36px; border: none; color: #707070;}
h2{width: 100%; max-width: 750px; margin:10px auto 35px; padding: 0; font-weight: bold; text-align: center; font-size: 35px; border-bottom: 2px solid #707070; color: #707070; background-color: #fff;}
h2.h201{width: 100%; max-width: 750px; margin:10px auto 35px; padding: 0; font-weight: bold; text-align: center; font-size: 35px; border-bottom: 2px solid #707070; color: #707070; background-color: #fff;}
div.entry-content h3{text-align:center; font-size:20px; line-height: 30px; font-weight: bold; color:#707070; border:none; padding:0; margin:15px auto;}
div.entry-content h3.h301{width: 100%; max-width: 820px; color:#fff; padding: 8px 0; margin: 0px auto; background-color: #066B14;}
h4{text-align:left; font-size:25px; font-weight: normal; color:#707070; border:none; padding:0; margin:0;}
p.titlecap , span.titlecap{ font-size: 25px; line-height: 120%; margin: 0; padding: 0;}

div.entry-content h2 img,h2.h201 img{width: 8%; vertical-align: middle; max-width: 30px;}

div#maincontents{margin: 0; padding: 70px 0 0 0; box-sizing: border-box;}

main#newsdetail img{width: inherit; max-width: 100%;}
main#eventdetail img{width: inherit; max-width: 100%;}

.text01{width: 100%; max-width: 1280px; margin: 50px auto;}

/*--- メッセージ ---*/
p.mes01{text-align: center; line-height: 300%;}
p.mes02{text-align: center; line-height: 250%; margin: 30px auto;}
div.img30{ text-align: center;}
div.img30 img{width: 25%;}

#topevent{width:100%; margin:30px auto; padding: 30px 0;}
div.entry-content .h3wrap{text-align: center;}
div.entry-content .h3wrap h3{display: inline-block; font-size: 35px; padding-bottom: 4px; margin: 0 auto 25px; border-bottom: 1px solid #066B14;}
#topnews{width:100%; margin:30px auto; padding: 30px 0;}

section#news{width:100%; margin:30px auto; padding: 30px 0;}
section#news div#newsinn{
    width:96%;
    max-width:1280px;
    margin:30px auto;
    padding: 0;
	flex-wrap: wrap;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
div#newsinn div{width:calc(49%); font-size:15px; margin:10px 0; padding: 15px; background-color: #fff; border-radius: 5px; box-shadow: 3px 3px #555; box-sizing: border-box;}
div#newsinn div h3{text-align: left; font-size: 16px; margin: 0; padding: 0;}
div#newsinn div dl{
    width:100%;
    margin:0 auto;
    padding: 0;
	flex-wrap: wrap;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
div#newsinn dl dt{width:calc(25%); margin: 0; padding: 5px 0; box-sizing: border-box; border-bottom: 1px dashed #666;}
div#newsinn dl dd{width:calc(75%); margin: 0; padding: 5px 0; box-sizing: border-box; border-bottom: 1px dashed #666;}


div#top_main img{display:block; width:100%; margin:0; padding:0;}
div#title_main{width:100%; background-color:#021F4D;}
div#title_main div{font-size:30px; width:100%; max-width:1200px; font-weight:bold; padding:80px 0 100px 2%; margin:0 auto;}

/*--- よくある質問 ---*/
div.faq{width: 96%; max-width: 700px; margin: 50px auto; box-sizing: border-box;}
div.faq .su-spoiler-title{font-size:16px; color: #707070;}

dl#faq{width: 96%; max-width: 700px; margin: 50px auto; box-sizing: border-box;}
dl#faq dt{background: url("https://my-joyhome.jp/img/plus2.png") right top no-repeat;}


div#slidewrap{margin:0; padding:0; text-align:center; position:relative;}
div#slideinn{width:100%; margin:0 auto;}
div#slidenews{width:100%; position:absolute; bottom:0; background-color: rgba(0,0,0,0.6); margin:0; padding:0;}
div#slidenewsinn{width:100%; color:#fff; line-height:60px; vertical-align:middle; max-width:1000px; text-align:left; margin:0 auto; padding:0;}
div#slidenewsinn img{vertical-align:middle;}
div#slidenewsinn img.newslist{ width:25%; max-width:140px; min-height:60px; vertical-align:top; margin:0; padding:0; float:right;}

dl.newsdl{width:100%; max-width:900px; margin:0 auto;
	font-size:14px;
	flex-wrap: wrap;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
dl.newsdl dt{width:calc(30%); margin:3px 0; padding:2px 0; box-sizing:border-box;}
dl.newsdl dd{width:calc(70%); margin:3px 0; padding:2px 0 2px 15px; box-sizing:border-box;}
dl.newsdl dd h3{font-size:18px; color:#000; margin-bottom:10px; text-align:left; border-left:8px solid #021F4D; padding-left:12px;}
dl.newsdl dt span.newscat{border: 1px solid #707070; padding:2px 10px; box-sizing: border-box;}

/*--- トップページ最新情報 ---*/
div.tnwrap{width: 96%; max-width: 750px; font-size: 14px; margin: 15px auto; padding: 0;}
div.llink{text-align: right;}
div.llink a{text-decoration: none; color: #707070;}
dl.topnews{
    color: #707070;
    width: 100%;
	margin:10px auto;
	flex-wrap: wrap;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
dl.topnews dt{width:calc(13%); padding:0 0 8px 0; margin: 0 0 10px 0; box-sizing: border-box; border-bottom: 1px dashed #707070;}
dl.topnews dd{width:calc(87%); padding:0 0 0 10px; margin: 0 0 10px 0; box-sizing: border-box; border-bottom: 1px dashed #707070;}

dl.topnews a{text-decoration: none; color: #707070;}
dl.topnews a:hover{color: #444;}
dl.topnews dt div.listthumbs { width: 100%; margin: 0; padding: 0; position: relative;}
dl.topnews dt div.listthumbs::before { content: ""; display: block; padding-top: 100%;}
dl.topnews dt div.listthumbs img { width: 100%; height: 100%; position: absolute; top: 0; object-fit: cover;}

dl.topnews dd h3{text-align: left; font-size: 20px; font-weight: bold; margin: 0; padding:10px 0;}
dl.topnews dd span.newscat{border: 1px solid #707070; padding:2px 10px; box-sizing: border-box;}
dl.topnews dd span.newscat_{border: 1px solid #707070; padding:2px 10px; box-sizing: border-box;}
dl.topnews dd span.newscat_EVENT{color: #fff; font-weight: bold; padding:2px 10px; margin-right: 15px; background-color: #F50000; box-sizing: border-box;}
dl.topnews dd span.newscat_TOPICS{color: #fff; font-weight: bold; padding:2px 10px; margin-right: 15px; background-color: #009945; box-sizing: border-box;}
div.entry-content dl.topnews dd h3{font-size: 24px; color: #066B14; margin: 0; padding: 5px 0;}

div.plink{text-align: center; margin-top: 30px;}
div.plink a{text-decoration: none; font-size: 14px; color: #fff; background-color: #9c9c9c; padding: 8px 10px; margin: 0 5px; border-radius: 5px;}

/*--- メーカー一覧 ---*/
#maker{background-color: #EAEBE4; padding: 35px 0;}
#maker #mkinn{width: 98%; max-width: 1120px; margin: 0 auto;}
#maker #mkinn p.mmess{text-align: center;}
.mklist{width:100%; margin:15px auto; flex-wrap:wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;}
.mklist div{width: 49%; background-color: #fff; padding: 10px; margin:10px auto; flex-wrap:wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; box-shadow: 0px 0px 5px rgba(0,0,0,0.4);}
.mklist div div.mkll{width: 54%; box-shadow: none;}
.mklist div div.mklr{width: 45%; box-shadow: none;}
.mklist div div.mklr h4{font-size: 16px; line-height: 2em; margin: 0; padding: 0; border: none;}
.mklist div div.mklr h4 span{font-size: 24px; font-weight: normal;}
.mklist div div.mklr p.mkldet{width: 100%;}
.mklist div div.mklr p.mkldet a{width: 100%; color: #fff; text-decoration: none; text-align: center; font-size: 14px; font-weight: bold; background-color: #066B14; padding: 5px; border-radius: 5px; display: block; margin: 15px auto;}

.mklres{width: 100%; text-align: right; font-size: 14px; line-height: 18px;}
.makerdetail .mklres{margin-top: 25px;}

.mklres a{color: #333; text-decoration: none;}
.mklres img{width: 18px;}

/*--- メーカー詳細 ---*/
#mtitle{width: 98%; max-width: 1200px; margin: 25px auto; padding: 0; position: relative;}
h2#mname{width: 100%; max-width: inherit; text-align: left; font-size: 20px; margin: 0; padding: 0 0 0 0.5em; background-color: #fff; border-bottom: 1px solid #066B14;
position: relative;}
h2#mname::before{content: "";
    display: block;
    width: 30%;
    border-bottom: 3px solid #066B14;
    position: absolute;
    bottom: -2px;
    left: 0;}
.mttlr{position: absolute; font-size: 16px; line-height: 18px; right: 0; top: 0;}
.mttlr img{width: 20px;}
.mttlr a{color: #333; text-decoration: none;}
#makercontents{width: 98%; max-width: 1200px; margin: 15px auto; padding: 10px; flex-wrap:wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;}
.houseimg{width: 60%;}
.makerdetail{width: 38%;}
.makerdetail .logo{width: 40%;}
div.entry-content .makerdetail h3{text-align: left; font-weight: normal; font-size: 30px; margin:25px 0; padding: 0;}
div.entry-content .makerdetail h3 span{font-size: 18px;}
div.entry-content .makerdetail h4{width: 100%; color: #fff; text-align: center; font-size: 18px; background-color: #066B14; margin:10px 0; padding: 5px; border: none;}

/*--- アクセス ---*/
#access{width: 100%; max-width: 1200px; margin: 25px auto; padding: 0; flex-wrap:wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;}
#access .googlemap{width: 50%;}
#access .outline{width: 49%;}
#access .outline dl{width: 100%; margin: 0; padding: 0; flex-wrap:wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;}
#access .outline dl dt{width: 25%; font-weight: bold; margin: 0; padding: 1em 0 0 5px; border-bottom: 1px dashed #ababab; box-sizing: border-box;}
#access .outline dl dd{width: 75%; margin: 0; padding: 1em 0 0 0; border-bottom: 1px dashed #ababab; box-sizing: border-box;}

#accessmap{width: 80%; max-width: 820px; margin: 25px auto; padding: 0;}

/*--- 動画一覧 ---*/
.movie{width: 100%; margin: 25px auto; padding: 0; flex-wrap:wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;}
.movie .moviel{width: 35%; margin: -2em auto 25px; padding: 0; box-sizing: border-box;}
.movie .movier{width: 63%; margin: 0 auto 25px; padding: 0; box-sizing: border-box;}
.movie .moviel iframe{width: 100%; margin: 0; padding: 0;}
.movie .movier .date{font-size: 12px; margin: 0; padding: 0;}
div.entry-content .movie .movier h3{text-align: left; font-size: 20px;}
.movie .movier .youtube{text-align: right; width: 100%;}
.movie .movier .youtube img{width: 30%; max-width: 150px;}

/*--- 会社概要 ---*/
div.clmol{width:100%; margin:25px auto; flex-wrap:wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;}
div.clmol div.oll{width:calc(40%);}
div.clmol div.olr{width:calc(58%);}
div.clmol div ul.olimg{width:100%; margin:0 auto; padding: 0; flex-wrap:wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;}
div.clmol div ul li{width: 49%; list-style-type: none; margin: 0 0 10px; padding: 0;}
div.clmol div ul li:first-child{width: 100%;}
div.clmol div dl{width:100%; font-size: 14px; margin:0 auto; padding: 0; flex-wrap:wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;}
div.clmol div dl dt{ width: 20%; margin: 0; padding: 0;}
div.clmol div dl dd{ width: 80%; margin: 0; padding: 0;}
div.clmol div dl dd ul{width: 100%; margin: 0; padding: 0;}
div.clmol div dl dd ul li{width: 100%; list-style-type: inherit; margin: 0 0 0 1em; padding: 0;}

/*--- バナー類 ---*/
.topbnr{width:98%; max-width: 1200px; margin:5px auto; flex-wrap:wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;}
.topbnr div{width:calc(32%); margin: 3px auto;}

.topbnr01{width:98%; max-width: 900px; margin:25px auto 10px;}
.topbnr01 img{width: 100%;}

.topbnr02{width:98%; max-width: 1120px; margin:5px auto; flex-wrap:wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;}
.topbnr02 div{width:calc(49%); margin-bottom: 10px;}

.topbnr03{text-align: center;}
.topbnr03 img{width: 90%; max-width: 940px;}

.link01{width: 96%; max-width: 400px; margin: 15px auto; padding: 0;}
.link02{width: 96%; max-width: 600px; margin: 15px auto; padding: 0;}
.link03{width: 96%; max-width: 750px; margin: 15px auto; padding: 0;}

div.btncnt{text-align:center;}
div.btncnt a img{width:90%; max-width:339px; margin:0 auto;}
div.btncm{text-align:center; padding-bottom:80px;}
div.btncm a img{width:90%; max-width:500px; margin:0 auto;}
div.btn01{width: 100%; text-align: center; margin: 15px auto 35px;}
div.btn01 a{text-decoration: none; font-size: 25px; color: #fff; font-weight: bold; background-color: #102F98; border-radius: 10px; margin: 0; padding: 8px 0; display: block;}
div.btn02{text-align:center;}
div.btn02 a img{width:90%; max-width:437px; margin:0 auto;}
/*--- バナー類　ここまで ---*/


/*--- カラム ---*/
div.clm02,div.clm03,div.clm04,div.clm05,div.clm06,div.clm07{width:100%; margin:25px auto; flex-wrap:wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;}

div.clm02 div{width:calc(49%);}
div.clm03 div{width:calc(32%);}
div.clm04 div{width:calc(22%); margin-bottom: 15px;}
div.clm05 div{width:calc(19%);}
div.clm06 div{width:calc(16%);}
div.clm07 div{width:calc(13%);}

div.clm03 div.weather div{width: inherit;}

div.clm04 div h4.pah4{text-align: center; font-size: 17px; margin: 10px auto 5px; padding: 0; border: none;}
div.clm04 div p{font-size: 14px; line-height: 1.4em;}
div.clm04 div p span{font-size: 17px; font-weight: bold;}
div.clm02 div a,div.clm03 div a,div.clm04 div a,div.clm05 div a,div.clm06 div a{text-decoration: none; color: #707070;}
div.clm02 div.lwrap,div.clm03 div.lwrap,div.clm04 div.lwrap,div.clm05 div.lwrap,div.clm06 div.lwrap,.lwrap{width: 100%;}
article section.bgb div.clm04 div a{color: #fff;}

div.clm022{width:100%; margin:25px auto; flex-wrap:wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;}

div.clm022 div{width:calc(75%); font-size: 14px;}
div.clm022 div.clm022img{width:calc(20%);}
div.clm022 div.clm022line{width:calc(100%); height: 5px; margin: 10px auto 25px; border: 1px solid #015B0A;
background: linear-gradient(
  to right,
  #015B0A calc(40%),
  #ffffff calc(40%)
);
}
div.clm022 div h4{text-align: left; margin: 0 auto; padding: 0; border: none;}


div.clm3full{
	margin:25px auto;
	flex-wrap: wrap;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
div.clm3full div{width:calc(100% / 3);}

div.clm02bb{
	margin:25px auto;
	flex-wrap: wrap;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
div.clm02bb div.clm02bbinn{
    width:calc(49%);
    border: 1px solid #707070;
	margin:0 auto;
    padding:20px 3%;
    box-sizing: border-box;
	flex-wrap: wrap;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
div.clm02bb div.clm02bbinn a{margin: 0; padding: 0;}
div.clm02bb div.clm02bbinn div.clm02bbl{width:calc(25%); border: none; margin: 0; padding: 0; box-sizing: border-box;}
div.clm02bb div.clm02bbinn div.clm02bbr{width:calc(70%); border: none; margin: 0; padding: 0; box-sizing: border-box;}
div.clm02bb div.clm02bbinn div.clm02bbr h3{ font-size: 40px; margin: 0; padding: 0; background-color: none;}
div.clm02bb div.clm02bbinn div.clm02bbr h3 span{font-size: 25px;}
div.clm02bb div.clm02bbinn div.clm02bbr p{margin: 0; padding: 0;}
div.clm02bb div.clm02bbinn div.clm02bbr div.plus{ width: 100%; border: none; padding: 0; margin: 0; text-align: right;}
div.clm02bb div.clm02bbinn div.clm02bbr div.plus img{width: 10%;}
div.clm02bb div a{ color: #707070;  text-decoration: none;}

div.clm03bb{
	margin:25px auto;
	flex-wrap: wrap;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
div.clm03bb div{width:calc(30%); text-align: center;padding:10px 3%; border: 1px solid #707070; box-sizing: border-box;}
div.clm03bb div p{ text-align: left;}
div.clm03bb div img{ width: 60%;}
div.clm03bb div div.plus{ width: 100%; border: none; padding: 0; margin: 0; text-align: right;}
div.clm03bb div div.plus img{width: 10%;}
div.clm03bb div a{ color: #707070;  text-decoration: none;}

div.clm04ch{
    width: 96%;
	margin:25px auto;
	flex-wrap: wrap;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
div.clm04ch div{width:calc(20%); margin-bottom:25px; text-align: center;}
div.clm04ch div p{ margin: 0; padding: 0;}
div.clm04ch div a{color:#000; font-weight:bold; text-decoration:none;}
div.clm04ch div img{ width:100%;}
div.clm04ch div a:hover{color:#666;}
/*--- カラム　ここまで ---*/


/*--- 読み込み遅延用 ---*/
.sa {opacity: 0; transition: all .5s ease;}
.sa.show { opacity: 1; transform: none;}
.sa--lr { transform: translate(-100px, 0);}
.sa--rl { transform: translate(100px, 0);}
.sa--up { transform: translate(0, 100px);}
.sa--down { transform: translate(0, -100px);}
.sa--scaleUp { transform: scale(.5);}
.sa--scaleDown { transform: scale(1.5);}
.sa--rotateL { transform: rotate(180deg);}
.sa--rotateR { transform: rotate(-180deg);}


/*--- 最新情報一覧 ---*/
div.liwrap{width: 100%; max-width: 1160px; margin: 25px auto; padding: 0;}
div.liwrap a{text-decoration: none; color: #707070;}
div.listinfo{
    width: 100%;
	margin:25px auto;
	flex-wrap: wrap;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
div.listinfo div.listinfol{width:calc(13%); padding:0; margin: 0 auto;}
div.listinfo div.listinfor{width:calc(85%); padding:0; margin: 0 auto;}

div.listinfo div.listinfor div.usercase{ padding: 0 12px; margin-top: 5px; border: 1px solid #707070; display: inline-block;}
div.listinfo div.listinfor p.owner{font-weight: bold; font-size: 18px; margin: 0; padding: 0;}
div.listinfo div.listinfor h3{text-align: left; font-size: 26px; font-weight: normal; margin: 0; padding: 0;}
div.listinfo div.listinfol div.listthumbs { width: 100%; margin: 0; padding: 0; position: relative;}
div.listinfo div.listinfol div.listthumbs::before { content: ""; display: block; padding-top: 100%;}
div.listinfo div.listinfol div.listthumbs img { width: 100%; height: 100%; position: absolute; top: 0; object-fit: cover;}


/*--- グーグルマップ ---*/
div.googlemap{width: 100%;}
div.googlemap iframe{width: 100%; height: 450px;}

/*--- 会社概要 ---*/
div#company{width: 100%; padding-top: 80vh;  background: url("https://my-joyhome.jp/img/company/main-img.jpg") left top no-repeat; background-size: 100%;}
div.greeting{
    width: 96%;
    max-width: 1000px;
	margin:60px auto 20px auto;
	flex-wrap: wrap;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
div.greeting div.greeting_left{width:calc(65%); padding-right: 2%; box-sizing: border-box;}
div.greeting div.greeting_right{width:calc(35%);}
div.greeting div.greeting_right img{width: 100%;}
div.greeting div.greeting_right p{text-align: center; margin: 0; padding: 0;}


div#wbcon{ width: 100%; max-width: 1280px; color: #707070; margin: 0 auto; background-color: rgba(255, 255, 255, 0.8);}
p.ptitle{font-size: 50px; font-weight: bold; text-align: center;}
p.p01{font-size: 30px; text-align: center;}
p.p02{font-size: 17px; line-height: 250%; text-align: center; max-width: 1000px; margin-left: auto; margin-right: auto;}
p.p03{font-size: 40px; text-align: center; font-weight: bold;}
p.p04{font-size: 30px; text-align: center; line-height: 180%;}
p.p04 span{font-weight: bold;}
p.p04 a{ text-decoration: none; color: #333;}
p.p04 a:hover{ color: #707070;}

p.pcap{font-size: 17px; text-align: center;}

dl.tablestyle{
    width: 100%;
    color: #707070;
    border-bottom: 2px solid #ccc;
	margin:20px auto;
	padding:0;
	flex-wrap: wrap;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
dl.tablestyle dt{width:calc(30%); border:2px solid #ccc; font-weight: bold; border-bottom: none; margin:0; padding:10px 20px;}
dl.tablestyle dd{width:calc(70%); border-top:2px solid #ccc; border-right:2px solid #ccc; margin:0; padding:10px 20px;}

dl.tablestyle02{
	width:100%;
    color: #707070;
    border-bottom: 1px solid #ccc;
	margin:0 auto;
	padding:0;
	flex-wrap: wrap;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
dl.tablestyle02 dt{width:calc(20%); border:1px solid #ccc; border-bottom: none; background-color: #f9f6f6; margin:0; padding:10px 20px; box-sizing:border-box;}
dl.tablestyle02 dd{width:calc(80%); border-top:1px solid #ccc; border-right:1px solid #ccc; margin:0; padding:10px 20px; box-sizing:border-box;}

dl.tablestyle03{
    width: 100%;
    color: #707070;
    border-top: 2px solid #ccc;
	margin:0 auto 20px;
	padding:0;
    box-shadow: 2px 2px 4px #ccc;
}
dl.tablestyle03 dt{width:calc(100%); color: #fff; font-weight: bold; border-right:2px solid #ccc; border-left:2px solid #ccc; margin:0; padding:10px 20px; background-color: #102F98;}
dl.tablestyle03 dd{width:calc(100%); border-right:2px solid #ccc; border-left:2px solid #ccc; margin:0; padding:10px 20px;}
dl.tablestyle03 dd:last-child{border-bottom: 2px solid #ccc;}

dl.tablestyle04{
    width: 100%;
    color: #707070;
    border-bottom: 2px solid #ccc;
	margin:0 auto 15px;
	padding:0;
    box-shadow: 2px 2px 4px #ccc;
	flex-wrap: wrap;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
dl.tablestyle04 dt{width:calc(30%); color: #fff; font-weight: bold;border:2px solid #ccc; font-weight: bold; border-bottom: none; margin:0; padding:10px 20px; background-color: #102F98;}
dl.tablestyle04 dd{width:calc(70%); border-top:2px solid #ccc; border-right:2px solid #ccc; margin:0; padding:10px 20px;}

dl.dl001{
	width:100%;
	font-size:14px;
	margin:0 auto;
	padding:20px 0 0 0;
	flex-wrap: wrap;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
dl.dl001 dt{width:calc(30%); border-bottom:1px solid #ccc; margin:0; padding:5px 0; box-sizing:border-box;}
dl.dl001 dd{width:calc(70%); border-bottom:1px solid #ccc; margin:0; padding:5px 0; box-sizing:border-box;}


div.rb{border:5px solid #021F4D; box-sizing:border-box; padding:30px;}
div.rb h4{border:none; color:#021F4D; margin:0; padding:0;}
div.rb p{margin-bottom:0;}


table.tbl01{text-align:center; border:none; margin:20px auto;}
table.tbl01 td{background-color:#fff; border:none; padding:15px 10px; border-bottom:5px solid #F7F4F9; border-right:5px solid #F7F4F9;}
table.tbl01 td.td01{background-color:#E7E4EE; font-weight:bold; border-bottom:5px solid #fff; border-right:5px solid #fff;}
table.tbl01 td.td02{text-align:left; background-color:#F7F4F9; font-weight:bold; border-bottom:5px solid #fff; border-right:5px solid #fff;
box-sizing: border-box;}
table.tbl01 td.td03{width:50%; line-height:120%; text-align:left; padding:5px;}
table.tbl01 td.td04{width:30%; line-height:120%; text-align:left; padding:5px;}





ul.tag-list{margin:0 0 25px 0; padding:0;}
ul.tag-list li{margin:0; padding:3px 10px; list-style:none; border-bottom:1px solid #666;}
ul.tag-list li a{text-decoration:none; color:#000; display:block;}
ul.tag-list li a:hover{ color:#999;}
ul.tag-list li span{font-size:14px; font-weight:bold;}


div.ect-entry-card article{border-bottom:1px dashed #666; padding:15px 10px; margin:0;}
div.ect-entry-card article.entry-card h3.entry-card-title{padding:0; margin:0;}
div.ect-entry-card article.entry-card span.post-date{padding:0; margin:0;}

div.evecat{font-size:14px; padding-bottom:10px;}
div.evetag{ text-align:right;}

div.list-common{width:100%;}
div.list-common ul{width:100%; margin:0; padding:0;}
div.list-common ul li:first-child{border-top:1px solid #999;}
div.list-common ul li{border-bottom:1px solid #999; list-style:none; margin:0; padding:10px;}
div.list-common ul li a{color:#000; text-decoration:none;}
div.list-common ul li a:hover{color:#999;}
div.list-common ul li div.list-thumb{width:80px; margin-right:20px; float:left;}
div.list-common ul li div.list-thumb img{width:80px; height:80px; object-fit:cover;}
div.list-common ul li div.list-con{margin-left:100px; min-height:80px; margin:0; padding:0;}
div.list-common ul li div.list-con div.list-con-in{margin-left:100px; margin:0; padding:0;}
div.list-common ul li div.list-con div.list-con-in div.post-date{width:200px; margin:0; padding:0; float:left;}
div.list-common ul li div.list-con div.list-con-in div.list-tag{text-align:right; margin:0 0 0 200px; padding:0;}
div.list-common ul li div.list-con h3{font-size:18px; line-height:120%; margin:0; padding:0; border:none;}
div.list-common ul li div.list-con div.list-cat{text-align:right; font-size:14px; margin:0; padding:10px 0 0 0;}
div.list-common ul li div.list-con div.list-txt{font-size:14px;}

ul#privacypolicy{margin:0; padding:0;}
ul#privacypolicy li{list-style:none; margin:0 0 25px 0; padding:0;}
ul#privacypolicy li h3{font-size:16px; margin:0; padding:0; border:none;}
ul#privacypolicy li ol{margin:5px 0 5px 3em; padding:0;}
ul#privacypolicy li ol li{ list-style-type:decimal; margin:0;}


img.entry-card-thumb-image {
  width: 80px;
  height: 80px;
  object-fit: cover; /* この一行を追加するだけ！ */
}



.cat-label{display: none;}
.sbbnnr{width:100%;}
.sbbnnr img{width:100%; max-width:300px;}

.center{text-align:center;}
.right{text-align:right;}
.left{text-align:left;}
.size10{font-size:10px;}
.size12{font-size:12px;}
.size14{font-size:14px;}
.size16{font-size:16px;}

.txtbdr{ width:100%; border-bottom:1px solid #666; border-top:1px solid #666; padding:10px; margin:25px auto;}
.btmbdr{border-bottom:1px solid #666; margin-bottom:15px;}

div#contact p.acceptance{text-align:center; font-weight:bold;}
div#contact p.contitle{font-weight:bold; margin:0; padding:25px 0 0 0;}
div#contact dl{width:100%; margin-top:15px; float:none; clear:both;}
div#contact dl dt{font-weight:bold; width:20%; margin:0; padding:0; float:left;}
div#contact dl dd{font-weight:bold; width:80%; margin:0 0 0 20%; padding:0;}
div#contact dl dd span{ font-size:12px;}
div#contact dl dd .txt100{width:100%;}


input[type="text"],
input[type="url"],
input[type="password"],
input[type="email"],
input[type="search"],
input[type="tel"],
textarea {
  width: auto;
}

/*横の行とテーブル全体*/
.entry-content .inquiry tr,.entry-content table{
 border:solid 1px #d7d7d7;	
}
/*必須の調整*/
.haveto{ color:#ff0000; font-weight:bold;}
/*ラジオボタンを縦並び指定*/
.verticallist .wpcf7-list-item{
 display:block;
}
/*送信ボタンのデザイン変更*/
.formbtn{
 display: block;
 padding:15px;
 width:200px;
 background:#D7D7D7;
 font-size:16px;
 font-weight:bold;	 
 border-radius:4px;
 margin:25px auto 0;
}
/*送信ボタンマウスホバー時*/
.formbtn:hover{
 background:#999;
 color:#666;
 border:2px solid #666;
}
ul.pagination li{list-style:none;}

div.usedimg{
	width:100%;
	padding:30px 0;
	margin:0;
	flex-wrap: wrap;
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
	}
div.usedimg div img{width:100%;}
div.usedimg div.usedmain{width:calc(76%); margin:0; padding:0 15px 0 0; box-sizing:border-box;}
div.usedimg div.usedthumb{width:calc(24%); margin:0; padding:0;}

.width76{width:calc(76%); padding:0 15px 0 0; margin:0;}

div.usedcon{width:100%; text-align:center; padding:50px 0 0 0;}
div.usedcon a img{width:90%; max-width:330px; margin:0 auto;}
div.usedcon a:hover img{
-webkit-filter: brightness(0.6);
-moz-filter: brightness(0.6);
-o-filter: brightness(0.6);
-ms-filter: brightness(0.6);
filter: brightness(0.6);
}


div.line{width:100%; height:1; clear:both; float:none; border-bottom:1px solid #ccc;}

.rb{width:100%; border:2px solid #021F4D; padding:10px; margin:20px auto; box-sizing:border-box;}

.content , .content-in , .main , .no-sidebar .wrap {
    width: 100%; margin-right:0; margin-left:0; padding-right:0; padding-left:0; box-sizing:border-box;
}
.breadcrumb.sbp-main-before, 
.breadcrumb.sbp-footer-before,
.breadcrumb.pbp-main-before,
.breadcrumb.pbp-footer-before {
    padding-left: 0;
    padding-right: 0;
}

.metaslider,
.slides {
overflow: hidden;
}
.btn-menu::before {
margin-right: 0;
}

.pagetop a{
  background-color: #F7F4F9;
  text-decoration: none;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  text-align: center;
  line-height: 1;
  font-size: 22px;
}
.pagetop a img{ width:100%;}
.pagetop a:hover {
  color: #333;
}

form{width:100%; max-width:1000px; margin:20px auto;}
form p{ width:100%;}
input[type="text"] , input[type="email"]{width:100%;}
textarea{ width:100%;}

.pcap div{ text-align:center;}
.pcap div p{border-left:8px solid #021F4D; font-size:14px; font-weight:bold; line-height:150%; padding-left:10px; display: inline-block;}
.pcap div a{color:#000; text-decoration:none;}
.pcap div p img{vertical-align:middle; width:15px;}

.pcap02 div{ text-align:left;}
.pcap02 div p{border-left:8px solid #021F4D; font-weight:bold; line-height:150%; padding-left:10px;}



.usedslide{margin:30px auto 0; width:90%;}
 .slide {
 position: relative;
 padding-bottom: 55%;
 width: 100%;
 height: 0;
 overflow: hidden;
}
.slide img {
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 width: 100%;
 height: auto;
 opacity: 0;
}
@keyframes thumb1 {
 0% {filter: grayscale(0%);}
 6% {filter: grayscale(100%);}
 10% {filter: grayscale(100%);}
 28% {filter: grayscale(100%);}
 37% {filter: grayscale(0%);}
 100% {filter: grayscale(0%);}
}
@keyframes thumb2 {
 0% {filter: grayscale(0%);}
 6% {filter: grayscale(100%);}
 10% {filter: grayscale(100%);}
 28% {filter: grayscale(100%);}
 37% {filter: grayscale(0%);}
 100% {filter: grayscale(0%);}
}
@keyframes thumb3 {
 0% {filter: grayscale(0%);}
 6% {filter: grayscale(100%);}
 10% {filter: grayscale(100%);}
 28% {filter: grayscale(100%);}
 37% {filter: grayscale(0%);}
 100% {filter: grayscale(0%);}
}
@keyframes slideshow1 {
 0% {opacity: 0;}
 10% {opacity: 1;}
 28% {opacity: 1;}
 38% {opacity: 0;}
 100% {opacity: 0;}
}

@keyframes slideshow2 {
 0% {opacity: 0;}
 10% {opacity: 1;}
 28% {opacity: 1;}
 38% {opacity: 0;}
 100% {opacity: 0;}
}
@keyframes slideshow3 {
 0% {opacity: 0;}
 10% {opacity: 1;}
 28% {opacity: 1;}
 38% {opacity: 0;}
 100% {opacity: 0;}
}
.thumbnail {
 display: flex;
 padding: 0;
 margin-: 0;
 justify-content: center;
}
.thumbnail li{
	position: relative;
	list-style-type:none;
	width:calc(33%);
	padding-bottom: 15%;
	height: 0;
	overflow: hidden;
}
.thumbnail img {
	display: block;
	width: 100%;
	position: absolute;
	top: calc(-15%);
	left: 0;
	object-fit: cover;
	margin: 0;
	cursor: pointer;
}
.usedslide input[type="radio"] {
 display: none;
 width:0;
 height:0;
}
/*ページを開いたとき＆一つ目のサムネイルをクリックしたとき*/
#img1:checked ~ .thumbnail label[for="img1"] img {
 animation: thumb1 24s linear infinite both;
 animation-delay: 0s;
 cursor: auto;
}
#img1:checked ~ .thumbnail label[for="img2"] img {
 animation: thumb1 24s linear infinite both;
 animation-delay: 8s;
}
#img1:checked ~ .thumbnail label[for="img3"] img {
 animation: thumb1 24s linear infinite both;
 animation-delay: 16s;
}
#img1:checked ~ .slide img {
 animation: slideshow1 24s linear infinite;
}
#img1:checked ~ .slide img:nth-child(1) {
 animation-delay: 0s;
}
#img1:checked ~ .slide img:nth-child(2) {
 animation-delay: 8s;
}
#img1:checked ~ .slide img:nth-child(3) {
 animation-delay: 16s;
}
/*二つ目のサムネイルをクリックしたとき*/
#img2:checked ~ .thumbnail label[for="img1"] img {
 animation: thumb2 24s linear infinite both;
 animation-delay: 16s;
}
#img2:checked ~ .thumbnail label[for="img2"] img {
 animation: thumb2 24s linear infinite both;
 animation-delay: 0s;
 cursor: auto;
}
#img2:checked ~ .thumbnail label[for="img3"] img {
 animation: thumb2 24s linear infinite both;
 animation-delay: 8s;
}
#img2:checked ~ .slide img {
 animation: slideshow2 24s linear infinite;
}
#img2:checked ~ .slide img:nth-child(1) {
 animation-delay: 16s;
}
#img2:checked ~ .slide img:nth-child(2) {
 animation-delay: 0s;
}
#img2:checked ~ .slide img:nth-child(3) {
 animation-delay: 8s;
}
/*二つ目のサムネイルをクリックしたとき*/
#img3:checked ~ .thumbnail label[for="img1"] img {
 animation: thumb3 24s linear infinite both;
 animation-delay: 8s;
}
#img3:checked ~ .thumbnail label[for="img2"] img {
 animation: thumb3 24s linear infinite both;
 animation-delay: 16s;
}
#img3:checked ~ .thumbnail label[for="img3"] img {
 animation: thumb3 24s linear infinite both;
 animation-delay: 0s;
 cursor: auto;
}
#img3:checked ~ .slide img {
 animation: slideshow3 24s linear infinite;
 animation-delay: 8s;
}
#img3:checked ~ .slide img:nth-child(1) {
 animation-delay: 8s;
}
#img3:checked ~ .slide img:nth-child(2) {
 animation-delay: 16s;
}
#img3:checked ~ .slide img:nth-child(3) {
 animation-delay: 0s;
}

/*--- コンタクトフォーム ---*/
dl.contact7{ width:100%; color: #707070; padding:0; margin:35px auto; flex-wrap: wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; }
dl.contact7 dt{width:calc(25%); margin:0 0 25px 0; padding:0; box-sizing:border-box;}
dl.contact7 dd{width:calc(75%); margin:0 0 25px 0; padding:0; box-sizing:border-box;}
dl.contact7 dt span{font-size: 12px;}
dl.contact7 dt.contact7full{width: 100%;}
dl.contact7 dd.contact7full{width: 100%; padding-left: 25%;}
dl.contact7 dd.contact7clm2 , dl.contact7 dd.contact7clm3 , dl.contact7 dd.contact7clm4{ padding:0; margin:0 auto; flex-wrap: wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; }
dl.contact7 dd.contact7clm2 div{width:calc(50%); margin:0; padding:0 10px 0 0; box-sizing:border-box;}
dl.contact7 dd.contact7clm3 div{width:calc(33%); margin:0; padding:0 10px 0 0; box-sizing:border-box;}
dl.contact7 dd.contact7clm4 div{width:calc(25%); margin:0; padding:0 10px 0 0; box-sizing:border-box;}
dl.contact7 dd.contact7clm2 div:last-child , dl.contact7 dd.contact7clm3 div:last-child , dl.contact7 dd.contact7clm4 div:last-child {padding-right: 0;}

dl.faq{width:100%; max-width:1050px; margin:0 auto;}
dl.faq dt{font-size:20px; background-color:#f7f7f7; font-weight:bold; margin:0; padding:10px;}
dl.faq dt span{font-size:30px; color:#F36;}
dl.faq dd{background-color:#f7f7f7; margin:0 0 25px 0; padding:0px 25px 25px 25px;}
dl.faq dd span{font-size:30px; font-weight:bold; color:#06F;}

.fs80{font-size:80%;}
.fs120{font-size:120%;}
.fs150{font-size:150%;}
.fs180{font-size:180%;}
.fs200{font-size:200%;}

div.entry-content img.w10{width: 10%;}
div.entry-content img.w20{width: 20%;}
div.entry-content img.w30{width: 30%;}
div.entry-content img.w40{width: 40%;}
div.entry-content img.w50{width: 50%;}
div.entry-content img.w60{width: 60%;}
div.entry-content img.w70{width: 70%;}
div.entry-content img.w80{width: 80%;}
div.entry-content img.w90{width: 90%;}
div.entry-content img.w100{width: 100%;}

div.clr{width:100%; height:0; clear:both; float:none;}
.pc{display: block !important; }
.mb{display: none !important; }
.pcv { visibility: visible; height: inherit;}
.mbv { visibility: hidden; height: 0;}

p.topmess_mb{ display: none !important;}
div.work{visibility: hidden; height: 0;}
div.work div.workl{visibility: hidden; height: 0;}
div.work div.workr{visibility: hidden; height: 0;}

.swiper-wrap {position: relative; margin:0px auto 30px auto; width: 100%; overflow: hidden;}
.swiper-container{text-align: center; cursor: grab;}
.swiper-container:active{cursor: grabbing;}
.swiper-container .swiper-slide img {max-width: 100%; width: 100%; height: auto;}
.swiper-button-next,
.swiper-button-prev {
    --swiper-navigation-color: #fff;
}
#thumbs {height: 10%; box-sizing: border-box; padding: 10px 0;}
#thumbs .swiper-slide { width: 16%; height: auto; opacity: 0.3; cursor: grab;}
#thumbs .swiper-slide:active {cursor: grabbing;}
#thumbs .swiper-slide-active {opacity: 1;}
  
.swiper-blind-left,.swiper-blind-right {
    position: absolute;
    width: 11.55%;
    height: 100%;
    display: block;
    top: 0;
    background: rgba(255,255,255,.7);
    z-index: 5;
}
.swiper-blind-left {left: 0;}
.swiper-blind-right {right: 0;}


/*--- MW WP FORM ---*/
dl.mailform{width: 100%; max-width: 1000px; margin: 0 auto 35px; padding: 0;}
dl.mailform dt{font-weight: bold; margin: 0 0 8px 0; padding: 15px 2% 0; border-top: 1px dashed #707070;}
dl.mailform dd{margin: 0 0 5px 0; padding: 0 2%;}
dl.mailform dd input{margin-bottom: 10px;}
dl.mailform dd:last-child{border-bottom: 1px dashed #707070;}

dl.mailform2{width: 100%; max-width: 1000px; margin: 0 auto 35px; padding: 0; flex-wrap: wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;}
dl.mailform2 dt{width: 25%; font-weight: bold; margin: 0 0 8px 0; padding: 10px 2% 0; border-top: 1px dashed #707070; box-sizing: border-box;}
dl.mailform2 dd{width: 75%; margin: 0 0 8px 0; padding: 10px 2%; border-top: 1px dashed #707070; box-sizing: border-box;}
dl.mailform2 dd input{margin-bottom: 10px;}

dl.mailform2 dd div.mfmes01{font-size: 12px; margin: 0; padding: 0;}
dl.mailform2 dd div.mfclm02{ margin: 0 auto; padding: 0; flex-wrap: wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;}
dl.mailform2 dd div.mfclm02 div.mfckm02l{width: 60%}
dl.mailform2 dd div.mfclm02 div.mfckm02r{width: 40%}


.attention{color: #f00; font-weight: bold;}
.mw_question{ color: #fff; padding: 3px; background-color: #066B14; border-radius: 5px;}

/*==================================================
スライダーのためのcss
===================================*/
/*画像の横幅を100%にしてレスポンシブ化*/
ul.gallery li img,ul.choice-btn li img{width: 100%; height: auto; vertical-align: bottom;}

/*メイン画像下に余白をつける*/

ul.gallery{width: 100%; margin:0; padding: 0; list-style: none;}
ul.gallery li{width: 100%; margin: 0; padding: 0;}
/*矢印の設定*/

/*戻る、次へ矢印の位置*/
.slick-prev, 
.slick-next {
    position: absolute;/*絶対配置にする*/
	z-index: 3;
    top: 42%;
    cursor: pointer;/*マウスカーソルを指マークに*/
    outline: none;/*クリックをしたら出てくる枠線を消す*/
    border-top: 2px solid #ccc;/*矢印の色*/
    border-right: 2px solid #ccc;/*矢印の色*/
    height: 25px;
    width: 25px;
}

.slick-prev {/*戻る矢印の位置と形状*/
    left:2.5%;
    transform: rotate(-135deg);
}

.slick-next {/*次へ矢印の位置と形状*/
    right:2.5%;
    transform: rotate(45deg);
}

/*選択するサムネイル画像の設定*/
ul.choice-btn{width: 100%; margin: 0; padding: 0; list-style: none;}
ul.choice-btn li{
	cursor: pointer;
	outline: none;
	width:20%!important;
	margin: 0; padding: 1px;
	box-sizing: border-box;
}

.choice-btn li img{
	opacity: 0.4;/*選択されていないものは透過40%*/
}

.choice-btn li.slick-current img{
	opacity: 1;/*選択されているものは透過しない*/
}

.choice-btn .slick-track {
	transform: unset !important;/*画面幅サイズ変更に伴うサムネイル固定*/
}



/* ------------------------------
   loopSlider
------------------------------ */
.sw-wrap{width: 100%; overflow: hidden;}
.swiper{width: calc(100% + 160px);
  margin-left: -80px;
  margin-right: -80px;}
.swiper-wrapper{transition-timing-function: linear !important;}
.swiper-slide{border: 1px solid #707070; padding: 10px; box-sizing: border-box;}
.swiper-slide a{text-decoration: none; color: #707070; font-weight: bold; line-height: 1.4em;}



@media screen and (max-width: 1200px) {
	p.tel{font-size: 40px; line-height: 44px;}
    p.tel img{ max-height: 40px; margin-right: 10px;}
}

@media screen and (max-width: 750px) {
	
	.pcv { visibility: hidden; height: 0;}
    .mbv { visibility: visible; height: inherit;}
	.pc { display: none !important; }
	.mb { display: block !important; }
	
    .swiper-blind-left,.swiper-blind-right {
    display: none;
    }
    
    main#main{widows: 100%; margin: 0; padding: 0;}
    article{ width: 100%; padding: 0; margin:0 auto 10px auto;}
    article section{margin:0 auto 25px auto;}
    article section.full{}
    article section div.secinn{width: 92%; padding: 0; margin: 0 auto;}
    article section div.secinn02{width: 92%; padding: 0; margin: 0 auto;}
    p.mes01 , p.mes02{ line-height: 170%; padding: 0; margin: 10px auto;}
    
	#nav-open {width: 25px;}

	/*ハンバーガーアイコンをCSSだけで表現*/
	#nav-open span{
	  height: 25px;/*線の太さ*/
	  width: 25px;/*長さ*/
	}


    article.gray{background-color: #fff; padding: 0; margin: 0 auto 25px auto;}
    
    div.entry-content h1{font-size: 18px;}
    div.entry-content h2{font-size: 16px;}
    div.entry-content h3{font-size: 16px;}
    div.entry-content h4{font-size: 16px; margin: 0; padding: 0;}
    div.entry-content p{font-size: 14px; margin: 0; padding: 0;}
    
    p.topmess_mb{ display: block !important; text-align: center; font-size: 14px; width: 90%; margin: 0 auto; padding:10px 0;}
    
    div.content div.content-in main.main article h1{ width: 100%; font-size: 20px; text-align: center; color: #fff; margin: 0; padding:10px 0;}
    h2.h201{ width: 100%; font-size: 20px; text-align: center; color: #fff; margin: 0 0 15px 0; padding:10px 0; background-color: #707070;}
    div.content div.content-in main.main article h3{ width: 100%; font-size: 16px; text-align: center; margin: 0; padding:10px 0;}
    div.content div.content-in main.main .h3wrap h3{width: inherit; display: inline-block; font-size: 24px; margin-bottom: 25px; padding: 4px;}
    p.titlecap , span.titlecap{ font-size: 16px; margin: 0; padding: 0;}

    div.entry-content h2 img,h2.h201 img{filter: brightness(0) invert(100%);}

    .no-sidebar .wrap { width: auto; }
    .breadcrumb.sbp-main-before,.breadcrumb.sbp-footer-before,.breadcrumb.pbp-main-before,.breadcrumb.pbp-footer-before { padding-left: 0; padding-right: 0; }	
	
	div.ftcon div.fcr ul{margin:20px auto; padding: 0;}

	div.ftsnsmb{width: 100%; margin:0; padding: 0; flex-wrap: wrap; display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between;}
	div.ftsnsmb div{width: 49%; text-align: center; font-size: 16px; margin: 0; padding: 0; box-sizing: border-box;}
	div.ftsnsmb div a{color: #000; text-decoration: none; margin: 0; padding:25px 0; display: block; background-color: #D8D8D8;}
	div.ftsnsmb div img{width: 36%;}

    div#mainimage{display: none !important;}
    div#mainimage_mb{width: calc(100%); margin: 0; padding: 0;}
    div#mainimage_mb{display:block !important;}
    div#mainimage_mb img{width: 100%; vertical-align: top;}
    
	div#top_main{display: none !important;}
	div.tagline{display: none !important;}
	div.logo{width:60%; max-width:200px; margin:0 auto; float:none;}
	div.headwrap{display: none !important;}
    
    ul.ftnav{display: none !important;}

    div.ftcon div.fcl{width:calc(90%); text-align: center; margin: 0 auto;}
    div.ftcon div.fcr{width:calc(90%); margin: 15px auto; text-align: center;}

	div.ftcon div.fcl div.ftlogo{text-align: left; width: 90%; margin: 0 auto 10px;}
	div.ftcon div.fcl p.ftadd{font-size: 17px;}
	div.ftcon div.fcl p.ftmes{font-size: 20px; line-height: 26px;}

	div.ftcon div.fcr p{text-align: center; margin-bottom: 20px;}
	div.ftcon div.fcr img{width: 25%; max-width: 50px;}
	div.ftcon div.fcr ul{display: inline-block; margin: 0 auto;}
	div.ftcon div.fcr ul li{text-align: left;}

	.foottel{font-size: 30px; line-height: 60px; font-weight: bold;}
	.foottel a{color: #000; text-decoration: none;}
	.foottel a img{width: 25px; margin: 17px 15px 8px 0}



	#integral{text-align: center;}
    
    p.mess01{font-size: 17px;}

	.topbnr div{width:calc(90%);}
    
    dl.topnews dt{width:calc(30%); padding:8px 0; margin: 0 0 10px 0; border-bottom: 1px dashed #707070;}
    dl.topnews dd{width:calc(70%); padding:8px 0 8px 2%; margin: 0 0 10px 0; border-bottom: 1px dashed #707070;}
    div.content div.content-in main.main article dl.topnews dd h3{ color: #066B14; text-align: left; font-size: 18px; font-weight: bold; margin: 0; padding: 0; background: none;}
    dl.topnews dd { font-size: 12px;}
	
	.mklist div{width: 94%; padding: 5px; margin: 5px auto;}
	.mklist div div.mklr h4{font-size: 14px;}
	.mklist div div.mklr h4 span{font-size: 16px;}

    div.content div.content-in main.main article div.eeco_feature div h3{width:calc(100%); text-align: center; font-size: 18px; color: #707070; font-weight: bold; background: none;}

    p.ptitle{font-size: 30px;}
    p.p01{font-size: 16px;}
    p.p02{font-size: 14px;}
    p.p03{font-size: 18px;}
    p.p04{font-size: 18px;}
    
    div.simgw h1.simg{font-size: 18px; text-align: center;}

	.movie .moviel{width: 100%; margin: 0;}
	.movie .movier{width: 100%;}

    div.listinfo div.listinfol{width:calc(30%); padding:8px 0; margin: 0 auto; border-bottom: 1px solid #707070;}
    div.listinfo div.listinfor{width:calc(70%); font-size: 12px; padding:8px 0 8px 2%; margin: 0 auto; border-bottom: 1px solid #707070;}
    
    div.listinfo div.listinfor div.usercase{ padding: 0 8px; margin: 0; border: 1px solid #707070;}
    div.listinfo div.listinfor p{margin: 0; padding: 0;}
    div.content div.content-in main.main article div.listinfo div.listinfor h3{ color: #707070; text-align: left; font-size: 14px; font-weight: bold; margin: 0; padding:2px 0; background: none;}
    div.listinfo div.listinfol div.listthumbs { width: 100%; margin: 0; padding: 0; position: relative;}
    div.listinfo div.listinfol div.listthumbs::before { content: ""; display: block; padding-top: 100%;}
    div.listinfo div.listinfol div.listthumbs img { width: 100%; height: 100%; position: absolute; top: 0; object-fit: cover;}

    
    div.greeting div.greeting_left{width:calc(100%);}
    div.greeting div.greeting_right{width:calc(100%); text-align: center;}
    div.greeting div.greeting_right img{width:calc(70%);}
    dl.tablestyle dt{width:calc(100%); font-weight: bold; border:none; margin:0; padding:10px 0 5px 0;}
    dl.tablestyle dd{width:calc(100%); border:none; border-bottom:1px solid #ccc; margin:0; padding:0 0 10px 0;}
    dl.tablestyle02 dt{width:calc(100%); font-weight: bold; background: none; border:none; margin:0; padding:10px 0 5px 0;}
    dl.tablestyle02 dd{width:calc(100%); border:none; border-bottom:1px solid #ccc; margin:0; padding:0 0 10px 0;}

	.houseimg{width: 98%; margin: 0 auto 5px;}
	.makerdetail{width: 90%; margin: 10px auto;}
	.makerdetail .logo{width: 40%;}
	div.content div.content-in main .makerdetail h3{text-align: left; font-weight: normal; font-size: 30px; margin:25px 0; padding: 0;}
	div.content div.content-in main .makerdetail h3 span{font-size: 18px;}
	div.content div.content-in main .makerdetail h4{width: 100%; color: #fff; text-align: center; font-size: 18px; background-color: #066B14; margin:10px 0; padding: 5px; border: none;}

    .tbs_c{ border: none;}

    div#pwinn div.pw div.pw02{width:calc(100%); font-size: 12px; font-weight: normal;}
    div#newsinn div{width:calc(96%); margin: 10px auto;}
    div#newsinn dl dt{width:calc(100%); border: none; padding-bottom: 0;}
    div#newsinn dl dd{width:calc(100%); padding-top: 0;}
    
    ul#topnews{ width:100%; max-width:none; padding:0; margin:0 auto 15px auto;}

	div.list-common ul li div.list-con div.list-con-in div.post-date{width:100%; float:none;}
	div.list-common ul li div.list-con div.list-con-in div.list-tag{text-align:left; margin:0;}

	p.tel{font-size: 30px; line-height: 34px;}
    p.tel img{ max-height: 30px; margin-right: 10px;}

	span.link{margin-left:0;}

	div.bc{ visibility:hidden; height:0; }
	div.bc02{ visibility:hidden; height:0; }
	div.bc03{ visibility:hidden; height:0; }
	
	.sbbnnr{ width:100%; max-width:300px; margin:0 auto; }
	
	#access .googlemap{width: 100%;}
	#access .outline{width: 100%;}

    
    dl.contact7 dt{width:calc(100%); margin:0; font-weight: bold;}
    dl.contact7 dd{width:calc(100%); font-size: 14px;}
    dl.contact7 dd.contact7full{width: 100%; padding-left: 0; text-align: center; font-size: 16px;}

	div#contact dl dt{width:100%; margin:0; padding:0; float:none;}
	div#contact dl dd{width:100%; margin:0; padding:0;}
	
    div.content div.content-in main.main article h3.cdh3{text-align: left; font-size: 17px;}

	div.clm01 div.clm01l{width:100%; float:none;}
	div.clm01 div.clm01r{width:100%; float:none;}
	div.clm01_2 div.clm01l{width:100%; float:none;}
	div.clm01_2 div.clm01r{width:100%; float:none;}

	div.clm02 div{width:calc(100%); margin-bottom:10px;}
	div.clm02_2 div{width:calc(100%); margin-bottom:10px;}
	div.clm02_3 div{width:calc(100%); margin-bottom:10px;}
	div.clm02_4 div{width:calc(100%); margin-bottom:10px;}
	div.clm02_5 div{width:calc(100%); margin-bottom:10px;}
	div.clm03 div{width:calc(100%);}
	div.clm03_2 div{width:calc(100%); margin-bottom:10px;}
	div.clm04 div{width:calc(49%); margin-bottom:10px;}
	div.clm04_02 div{width:calc(49%); margin-bottom:10px;}
	div.clm05 div{width:calc(49%);}
	div.clm05_2 div{width:calc(49%);}
    div.clm06 div{width:calc(49%);}
    div.clm07 div{width:calc(30%); margin-bottom: 15px;}

    ul.point li{font-size: 16px;}
    ul.point li span{font-size: 14px;}
    div.clmpoint div{width:calc(90%); margin: 0 auto 10px;}
    div.clmpoint div h4{font-size: 17px;}
    div.clmpoint div dl dt{font-size: 17px;}
	div.kbnr{text-align: center;}
    
    div.clm022 div{width:calc(100%); margin-bottom: 15px;}
    div.clm022 div.clm022img{width:calc(60%); margin: 0 auto 10px;}

    div.clmol div.oll{width:calc(80%); margin:0 auto 15px;}
    div.clmol div.olr{width:calc(100%);}
    div.clmol div.olr dl dt{width: 100%;}
    div.clmol div.olr dl dd{width: 100%; margin: 0 0 10px 0; padding: 0 0 0 1em;}

    div.clmcd div.cdl{width:calc(100%); margin:0 auto 10px;}
    div.clmcd div.cdr{width:calc(100%); margin:0 auto 10px;}

	dl.newsdl dt{width:calc(100%); border:none; margin:0; padding:2px 10px;}
	dl.newsdl dd{width:calc(100%); margin:0 0 10px 0; padding:2px 10px;}
    
    div.googlemap iframe{height: 300px;}

	.fs80{font-size:80%;}
	.fs120{font-size:100%;}
	.fs150{font-size:120%;}
	.fs180{font-size:150%;}
	.fs200{font-size:150%;}

}

/* ============［GO-SNS］============ */
.go-sns-list { position: fixed; right: 0; top: 50%; margin-top: -140px; }
/* MouseOver_Animation */
.go-sns-list a:hover { animation: flash 1s both; }
.go-sns-list li{ width: 50px;  margin: 10px 0; list-style-type: none; }
.go-sns-list li img{ width: 100%; }
.go-sns-list li.follow-me { padding: 16px 0; background: #fff; }
.go-sns-list li.follow-me { float: none; width: 100%; padding: 0; background: none; }
.go-sns-list li.follow-me img { width: 60%; height: auto; margin: 0 20% 5px; }

@keyframes flash {
	0% { opacity: 1; }
	10% { opacity: 0.3; }
	60% { opacity: 1; }
}
@media only screen and ( max-width: 959px ) {
	.go-sns-list { top: 80px; margin: 0; padding: 0; }
    .go-sns-list li{ width: 40px; }
}
@media only screen and ( max-width: 639px ) {
	.go-sns-list { margin: 0; padding: 0; }
    .go-sns-list li{ width: 30px; }
}



/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/*1023px以下*/
@media screen and (max-width: 1023px){
  /*必要ならばここにコードを書く*/
}

/*834px以下*/
@media screen and (max-width: 834px){
  /*必要ならばここにコードを書く*/
}

/*480px以下*/
@media screen and (max-width: 480px){
  /*必要ならばここにコードを書く*/
}