@charset "utf-8";

#contents{
position:relative;
}

body{
color:#333;
}

.under-c{
font-size:36px;
padding-bottom:200px;
padding-top:50px;
}


/*
-----------------------------------------------
TAB 横
----------------------------------------------- */
@media (orientation: landscape) and (max-device-width: 1024px){
body {
width: 100%;
}

}


/*
-----------------------------------------------
ヘッダー
----------------------------------------------- */
.en{font-family: 'Jost', sans-serif;}
.min{font-family: 'Noto Serif JP', serif;}

.main{
overflow:hidden;
}

#head{
width:1120px;
margin-left:auto;
margin-right:auto;
position:relative;
}

header{
padding-top:20px;
width:100%;
}

.top-h1{
display:block;
width:206px;
}
.top-h1 img{
width:100%;
height:auto;
}

.head-txt{
position:absolute;
font-size:16px;
top:10px;
letter-spacing:3px;
right:10px;
}

/*
-----------------------------------------------
TAB 横
----------------------------------------------- */
@media (orientation: landscape) and (max-device-width: 1024px){
#head{
width:100%;
padding-left:6%;
padding-left:6%;
}
}

/*
-----------------------------------------------
ヘッダー TAB SP
----------------------------------------------- */
@media screen and (max-width: 768px) {
#head{
width:100%;
padding-left:0;
padding-left:0;
}

.sub-nav,
.txt-nav{
display:none;
}

.top-h1{
width:190px;
margin-left:20px;
}


.head-txt{
font-size:16px;
top:4px;
letter-spacing:3px;
right:80px;
}

}

/*
-----------------------------------------------
ヘッダー SP
----------------------------------------------- */
@media screen and (max-width: 767px) {

.top-h1{
width:150px;
margin-left:10px;
}

}

/*
-----------------------------------------------
TOPナビ
----------------------------------------------- */
.main-navi{
display:block;
position:absolute;
top: 10px;
left:260px;
z-index:100;
}

.main-navi ul{
display:inline-block;
}

.navi > li{
font-size:15px;
display:inline-block;
margin-left:5px;
position:relative;
}

.navi > li > a {
/*   padding: 0.3em 0.8em !important; */
  background-image: linear-gradient(to right, rgba(0,199,172,0) 50%, rgba(0,199,172,1) 50%);
  background-position: 0 0;
  background-size: 200% auto;
  transition: .4s;
}
.navi > li > a:hover {
  background-position: -100% 0;
  color: #fff;
}

.navi > li > a{
color:#333;
line-height:1.1;
padding:0.4em 0.9em;
font-weight:500;
text-decoration:none;
}



/* ドロップダウンメニュー */
.main-navi li ul{
  list-style: none;
  position: absolute !important;
  z-index: 200;
  top: 120%;
  margin: 0;
  padding: 0;
}

.sub-ul01{
left:-10px;
width:120px;
}

.main-navi li ul li{
  width: 100%;
}
.main-navi li ul li a{
  line-height:1.4 !important;
  padding: 8px 8px;
  border-bottom: 1px solid #ccc;
  background-color: rgba(216,214,213,0.8);
  text-align: center;
  text-decoration:none;
  display:block;
  color:#333;
  font-size:13px;
}


.main-navi li ul li{
  overflow: hidden;
  height: 0;
  transition: .2s;
}
.main-navi li:hover ul li{
  overflow: visible;
  height: 35px;
}
/* 
.main-navi ul li a:hover{
  background-color: rgba(78,168,49,0.9);
  color:#fff;
  } */

/*
-----------------------------------------------
TAB SP用ナビゲーション
----------------------------------------------- */
@media screen and (max-width: 768px) {
.main-navi{
display:none;
}
}


/*
-----------------------------------------------
GATE ナビ
----------------------------------------------- */
.ita{
font-style: italic;
}
.gate-h{
padding:20px 0;
letter-spacing:3px;
text-align:center;
font-weight:300;
font-size:35px;
}

.gate-h a{
text-decoration:none;
color:#333;
}

.gate-h a:hover{
text-decoration:none;
color:#ccc;
}

.top-img{
position:relative;
}

.under-navi{
position: absolute;
top: 15px;
right: 0;
bottom: 0;
left: 0;
margin: auto;
width:1200px;
}

.under-navi a{
color:#fff;
font-size:15px;
}

.under-navi a {
padding: 0.3em 0.8em !important;
  background-image: linear-gradient(to right, rgba(0,199,172,0) 50%, rgba(0,199,172,1) 50%);
  background-position: 0 0;
  background-size: 200% auto;
  transition: .4s;
}
.under-navi a:hover {
  text-decoration:none;
  background-position: -100% 0;
  color: #fff;
}

.black-menu .under-navi a{
color:#000 !important;
}

.black-menu .under-navi a:hover{
color:#fff !important;
}

.under-navi-wrap{
position:absolute;
top:0;
width:100%;
height:55px;
background-color: rgba(153,153,153,.5);
}

/*
-----------------------------------------------
TAB 横
----------------------------------------------- */
@media (orientation: landscape) and (max-device-width: 1024px){
.under-navi{
width:100%;
padding-left:15px;
padding-right:15px;
}
}

/*
-----------------------------------------------
TAB GATE ナビ
----------------------------------------------- */
@media screen and (max-width: 768px) {
.under-navi{
width:100%;
}

.gate-h{
padding:10px 0;
letter-spacing:3px;
text-align:center;
font-weight:300;
font-size:28px;
}

.gate-inner{
background:#00c8ac;
padding:15px;
}

.gate-inner h2{
color:#fff;
font-size:20px;
}

.gate-inner .drawer-menu a{
color:#fff !important;
}

.gate-inner .drawer-menu a:hover{
background:#00c8ac; !important;
}

}

/*
-----------------------------------------------
TAB GATE ナビ
----------------------------------------------- */
@media screen and (max-width: 768px) {
.under-navi-wrap,
.under-navi{
display:none;
}

.gate-h{
padding:10px 0;
letter-spacing:3px;
text-align:center;
font-weight:300;
font-size:22px;
}
}




/*
-----------------------------------------------
幅・共通設定
----------------------------------------------- */
.in-box0{
max-width:1210px;
margin-left:auto;
margin-right:auto;
}

.in-box01{
max-width:990px;
margin-left:auto;
margin-right:auto;
}



/*
-----------------------------------------------
TAB 横
----------------------------------------------- */
@media (orientation: landscape) and (max-device-width: 1024px){
.in-box0,
.in-box01,
.in-box02,
.in-box03{
position:relative;
width:100%;
padding-left:5%;
padding-right:5%;
}
}


/*
-----------------------------------------------
幅・共通設定 TAB
----------------------------------------------- */
@media screen and (max-width: 768px) {
.in-box0,
.in-box01,
.in-box02,
.in-box03{
position:relative;
width:100%;
padding-left:5%;
padding-right:5%;
}

}


/*
-----------------------------------------------
幅・共通設定 SP
----------------------------------------------- */
@media screen and (max-width: 767px) {
.in-box0,
.in-box01,
.in-box02,
.in-box03{
position:relative;
width:100%;
padding-left:18px;
padding-right:18px;
}

}

/*
-----------------------------------------------
パンクズ
----------------------------------------------- */
.pk{
font-size:14px;
padding:18px 0 60px 0; 
}
.pk a{
color:#333;
}

/*
-----------------------------------------------
パンクズ SP
----------------------------------------------- */
@media screen and (max-width: 767px) {
.pk{
font-size:13px;
padding:10px 0 20px 0; 
}
}


/*
-----------------------------------------------
フッター
----------------------------------------------- */
footer{
background:#00c8ac;
padding-left:5%;
padding-right:5%;
color:#fff;
padding-top:15px;
padding-bottom:15px;
}

.foot-ul li{
display:inline-block;
font-size:14px;
}

.foot-ul li:before{
content:"｜"
}

.foot-ul li:first-child:before{
content:" ";
}


.foot-ul li a{
display:inline-block;
padding:0 5px;
color:#fff;
}



/*
-----------------------------------------------
flex box
----------------------------------------------- */
.container01{
display:flex;
flex-wrap:wrap;
}

.container02{
display:flex;
flex-wrap:nowrap;
}

.container03{
display:flex;
flex-wrap:wrap-reverse;
}

.al-item01{
align-items:flex-end;
}

.al-item02{
align-items:center;
}

.c-type01{
justify-content:space-between;
}

.c-type02{
justify-content:space-around;
}

.c-type03{
justify-content:flex-start;
}

.c-type04{
justify-content:center;
}

/*
-----------------------------------------------
flex-box TAB
----------------------------------------------- */
@media screen and (max-width: 768px) {
.c-type04{
justify-content:space-between;
}
}

/*
-----------------------------------------------
下層
----------------------------------------------- */
.gate-logo{
position:absolute;
top:10px;
right:7%;
}

/*
-----------------------------------------------
下層 SP
----------------------------------------------- */
@media screen and (max-width: 767px) {
.gate-logo{
position:absolute;
top:4px;
right:10px;
}
.gate-logo img{
width:150px;
height:auto;
}

}


/*
-----------------------------------------------
施工事例
----------------------------------------------- */
.h-type01{
font-size:40px;
font-weight:400;
}

.area{
font-size:17px !important;
margin:15px 0;
}

.h-type02{
margin-top:120px;
font-size:26px;
margin-bottom:24px;
}

.con{
font-size:18px;
line-height:1.8 !important;
}

.spec-list{
width:60%;
}

.spec-tag{
width:30%;
}

.spec-list dl{
display:flex;
flex-wrap:wrap;
width:100%;
border-bottom:solid 1px #333;
}

.spec-tag a{
display:block;
width:9em;
font-size:13px;
border:solid 1px #666;
border-radius:6px;
text-align:center;
padding:10px 0.2em;
margin-bottom:15px;
color:#666;
}

.spec-tag a:hover{
text-decoration:none;
background:#efefef;
}


.spec-list dt{
width:28%;
padding-top:7px;
padding-bottom:7px;
}
.spec-list dd{
padding-top:7px;
padding-bottom:7px;
border-left:solid 1px #333;
width:72%;
padding-left:2%;
}

.main-kiji{
font-size:14px;
}

.tate-main,
.main-02{
width:600px;
margin-left:auto;
margin-right:auto;
}


.movie-wrap {
     position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
}
 
.movie-wrap iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}

.link-btn01{
display:inline-block;
}

.link-btn01 a{
font-size:34px;
display:block;
width:10em;
padding:14px 0;
color:red;
border-radius:8px;
border:solid 4px #ff0000;
}

.link-btn01 a:hover{
text-decoration:none;
background:#f7ebeb;
}

.work-ul li{
width:31%;
margin-right:3.5%;
overflow:hidden !important;
}

.work-ul li:nth-of-type(3n){
margin-right:0;
}

.work-ul li p{
margin-top:5px;
}

.work-ul li img{
transition:1s all;
}

.work-ul li img:hover{
opacity:0.5; 
transition:1s all;
}

.sekoujirei{
font-weight:400;
font-size:24px;
margin-top:20px;
}

.cate-name{
width:20%;
color:#888;
font-size:24px;
font-weight:bold;
}

.cate-list{
width:80%;
color:#888;
text-align:left;
}


.cate-list li{
display:inline-block;
margin-bottom:15px;
}

.cate-list li a{
display:block;
text-align:center;
line-height:1.01;
color:#888;
border-radius:6px;
border:solid 1px #888;
margin-right:10px;
font-size:13px;
padding: 0.7em 1.5em;
}

.cate-list li a:hover{
text-decoration:none;
background:#efefef;
}

.cate-box{
margin-bottom:16px;
}

.cate-wrap{
margin-top:50px;
margin-bottom:100px;
}



/*
-----------------------------------------------
TOP TAB 横
----------------------------------------------- */
@media (orientation: landscape) and (max-device-width: 1024px){
.sekoujirei{
margin-top:15px;
font-weight:400;
font-size:18px;
}
}

/*
-----------------------------------------------
施工事例 TAB
----------------------------------------------- */
@media screen and (max-width: 768px) {
.sekoujirei{
margin-top:10px;
font-weight:400;
font-size:15px;
}

.h-type01{
font-size:33px;
}

}

/*
-----------------------------------------------
施工事例 SP
----------------------------------------------- */
@media screen and (max-width: 767px) {


.sekoujirei{
font-weight:400;
font-size:17px;
margin-top:0px;
margin-bottom:10px;
}

.h-type01{
font-size:25px;
font-weight:500;
margin-top:10px;
}

.area{
font-size:15px !important;
margin:5px 0;
}

.h-type02{
margin-top:40px;
font-size:20px;
margin-bottom:24px;
}

.con{
font-size:15px;
line-height:1.7 !important;
}

.spec-list{
width:100%;
margin-bottom:20px;
}

.spec-tag{
width:100%;
}

.spec-list dl{
font-size:13px;
}

.spec-list dt{
width:32%;
padding-top:7px;
padding-bottom:7px;
padding-right:1%;
}
.spec-list dd{
padding-top:7px;
padding-bottom:7px;
border-left:solid 1px #333;
width:68%;
padding-left:2%;
}

.spec-tag a{
display:inline-block;
vertical-align:top;
width:8.7em;
font-size:12px;
margin-right:8px;
}

.tate-main,
.main-02{
width:85%;
margin-left:auto;
margin-right:auto;
}

.link-btn01 a{
font-size:20px;
display:block;
width:10em;
padding:14px 0;
color:red;
border-radius:8px;
border:solid 4px #ff0000;
}

.cate-name{
width:100%;
font-size:20px;
margin-bottom:5px;
}

.cate-list{
width:100%;
text-align:left;
}

.work-ul li{
width:48%;
margin-right:4%;
overflow:hidden !important;
}

.work-ul li:nth-of-type(3n){
margin-right:4% !important;
}

.work-ul li:nth-of-type(2n){
margin-right:0% !important;
}


}


/* --------------------------
        ページャー
---------------------------*/

.pager{
	text-align:center;
}
a.page-numbers,
.pager .current{
	background:rgba(0,0,0,0.02);
	border:solid 1px rgba(0,0,0,0.1);
	border-radius:5px;
	padding:5px 8px;
	margin:0 2px;
}
.pager .current{
	background:rgba(0,0,0,1);
	border:solid 1px rgba(0,0,0,1);
	color:rgba(255,255,255,1);
}

/*
-----------------------------------------------
TOPページ
----------------------------------------------- */
.gate-catch{
position: absolute;
top: 120px;
right: 0;
bottom: 0;
left: 0;
margin: auto;
width:400px;
}

.gate-h02{
font-size:50px;
margin-bottom:20px;
}

.gate-h02 span{
font-size:20px;
margin-left:20px;
}

.con2 img,
.con3 img,
.con4 img,
.mx-img{
max-width:100%;
height:auto;
}

.con3{
width:31.6%;
}

.recommend .con3{
margin-bottom:40px;
}

.con4{
width:23%;
}

.con-p{font-size:20px;}
.more-p{font-size:16px;}

.more-p a{color:#333;}
.more-p a:hover{color:#0066cc;}


.c-type03 .con3{
margin-right:2.6%;
}

.c-type03 .con3:nth-of-type(3n){
margin-right:0;
}


/*
-----------------------------------------------
TOPページ 追加
----------------------------------------------- */
.new_bana_type{
margin-bottom:8%;
}

.new_bana_type .gate-bana_h{
font-weight:bold;
color:#fff;
display:inline-block;
padding:0.1em 1em;
background:#000;
font-size:36px;
margin-bottom:20px;
}

/*
-----------------------------------------------
TOP TAB 横
----------------------------------------------- */
@media (orientation: landscape) and (max-device-width: 1024px){
.gate-h02{
font-size:40px;
margin-bottom:10px;
}

.top-size{
max-width:100%;
height:auto;
}

}

/*
-----------------------------------------------
TOP TAB 大
----------------------------------------------- */
@media screen and (max-width: 1024px) {
.new_bana_type .gate-bana_h{
font-size:3.8vw;
margin-bottom:20px;
}
}

/*
-----------------------------------------------
TOP TAB
----------------------------------------------- */
@media screen and (max-width: 768px) {
.gate-h02{
font-size:35px;
margin-bottom:10px;
}

.gate-h02 span{
font-size:20px;
margin-left:20px;
}

.con-p{font-size:16px;width:100%;}
.more-p{font-size:14px;width:100%;}

.con-p a{font-size:14px !important;}

.top-size{
max-width:100%;
height:auto;
}

}

/*
-----------------------------------------------
TOP SP
----------------------------------------------- */
@media screen and (max-width: 767px) {

.new_bana_type{
margin-bottom:15vw;
}

.new_bana_type .gate-bana_h{
font-size:4.3vw;
padding:0.3em 0.5em;
margin-bottom:10px;
display:block;

}

.con4 .con-p{
line-height:1.2 !important;
}

.gate-h02{
width:100%;
font-size:23px;
margin-bottom:5px;
}

.gate-h02 span{
font-size:15px;
margin-left:5px;
}

.con3{
width:100%;
}

.con3-img{
width:50%;
display:inline-block;
margin-right:3%;
}

.con3-txt{
width:45%;
display:inline-block;
vertical-align:top;
}

.recommend .con3{
width:48% !important;
}

}

/*
-----------------------------------------------
コンセプト
----------------------------------------------- */
.con-h01{
font-weight:bold;
font-size:60px;
}

.con-h02{
font-weight:bold;
font-size:70px;
margin-bottom:100px;
margin-top:100px;
letter-spacing:0.1em;
text-align:left !important;
margin-left:26%;
color:#595757;
}

.con-h02 span{
display:block;
font-weight:bold;
font-size:110px;
}

.con-p01{
font-size:17px;
line-height:1.8;
}

.con-p02{
font-size:24px;
line-height:1.8;
font-weight:500;
color:#595757;
}

.con-h03{
font-size:44px;
margin-top:30px;
margin-bottom:20px;
}

.con-h03 span{
font-size:16px;
margin-left:2px;
}

.con-h04{
font-size:19px;
color:#717071;
font-weight:400;
line-height:1.2 !important;
margin-bottom:10px;
}

.con-h06{
font-size:44px;
margin-top:5px;
margin-bottom:5px;
}

.con-cate-list{
width:100%;
color:#888;
text-align:left;
}


.con-cate-list li{
display:inline-block;
padding-bottom:15px;
}

.con-cate-list li a{
display:block;
text-align:center;
line-height:1.01;
color:#888;
border-radius:6px;
border:solid 1px #888;
margin-right:2px;
font-size:13px;
padding: 1.2em 1.5em;
}

.con-cate-list li a:hover{
text-decoration:none;
background:#efefef;
}

.concept-cate{
border-top:solid 1px #666;
padding-top:15px;
}

.mt200{
margin-top:200px;
}

.concept-red{
margin:70px 0;
}

.concept-ul{
font-size:18px;
}

.concept-ul li{
font-size:18px;
margin-bottom:9px;
padding-left:1.2em;
position:relative;
}
.concept-ul li:before{
content:"●";
position:absolute;
left:0;
top:0;
}

.con-h05{
font-size:22px;
margin-bottom:5px;
}

.con-h05:before{
  margin-left:-50px;
  content: '';
  display: inline-block;
  width: 50px;
  height: 50px;
  background-image: url(../img/concept/concept_mk01.png);
  background-size: contain;
  background-repeat:no-repeat;
  vertical-align: middle;
}

.zu001{
padding-top:50px;
padding-bottom:70px;
border-bottom:solid 1px #575757;
}

.zu002{
padding-top:50px;
padding-bottom:200px;
}

.con-bdr01{
padding-bottom:70px;
border-bottom:solid 1px #575757;
}

.con-chui{
text-align:right;
margin-top:30px;
}

.con-chui span{
font-size:12px;
display:inline-block;
text-align:left !important;
}

.con-h07{
font-size:40px;
font-weight:400;
color:#575757;
letter-spacing:0.1em;
margin-bottom:30px;
}

.con-p03{
font-size:14px;
line-height:1.8;
}

.zu003{
margin-top:30px;
margin-bottom:100px;
}

/*
-----------------------------------------------
コンセプト TAB 横
----------------------------------------------- */
@media (orientation: landscape) and (max-device-width: 1024px){
}

/*
-----------------------------------------------
コンセプト TAB
----------------------------------------------- */
@media screen and (max-width: 768px) {
.con-h01{
font-size:43px;
}

.con-h02{
font-weight:bold;
font-size:65px;
margin-bottom:70px;
margin-top:70px;
letter-spacing:0.1em;
text-align:left !important;
margin-left:15%;
color:#595757;
}

.con-h02 span{
display:block;
font-weight:bold;
font-size:85px;
}

.concept-red{
width:31.5%;
}

.mt200{
margin-top:80px;
}
}

/*
-----------------------------------------------
コンセプト SP
----------------------------------------------- */
@media screen and (max-width: 767px) {
.con-h01{
font-size:30px;
}

.con-h02{
font-size:35px;
margin-bottom:70px;
margin-top:70px;
margin-left:15%;
}

.con-h02 span{
font-size:45px;
}

.con-h06{
font-size:22px;
margin-top:5px;
margin-bottom:5px;
}

.con-h07{
font-size:22px;
}

.con-p02{
font-size:19px;
}

}

/*
-----------------------------------------------
サービス
----------------------------------------------- */
.con2{
width:48%;
}

.con2 img{
max-width:100%;
height:auto;
}

.service-box .con2{
margin-bottom:100px;
}


/*
-----------------------------------------------
サービス SP
----------------------------------------------- */
@media screen and (max-width: 767px) {
.service-box .con2{
margin-bottom:30px;
}
}


/*
-----------------------------------------------
製品紹介
----------------------------------------------- */
.product-h01{
font-size:40px;
margin-bottom:30px;
}

.product-h01 span{
margin-left:10px;
font-size:25px;
}

.product-con3 .con3{
margin-bottom:100px !important;
}

/*
-----------------------------------------------
製品紹介 TAB
----------------------------------------------- */
@media screen and (max-width: 768px) {
.product-con3 .con3{
margin-bottom:50px !important;
}

}

/*
-----------------------------------------------
製品紹介 SP
----------------------------------------------- */
@media screen and (max-width: 767px) {
.product-h01{
font-size:30px;
margin-bottom:30px;
}

.product-h01 span{
margin-left:10px;
font-size:20px;
}

.product-con3 .con3{
margin-bottom:30px !important;
width:48%;
margin-right:4%;
}

.product-con3 .con3:nth-of-type(3n){
margin-right:4%;
}

.product-con3 .con3:nth-of-type(2n){
margin-right:0 !important;
}



}



/*
-----------------------------------------------
サービス　門扉設計
----------------------------------------------- */
.service-h01{
font-size:40px;
}

.service-h02{
font-weight:bold;
font-size:70px;
text-align:left !important;
color:#4d4d4d;
}

.service-h03{
font-weight:bold;
font-size:60px;
letter-spacing:0.05em;
color:#000;
border:solid 1px #000;
display:inline-block;
line-height:1.01;
padding:5px 5px 7px 5px;
}


.service-span01{
font-size:40px;
margin-left:20px;
}

.mb200{
margin-bottom:200px;
}

.mb150{
margin-bottom:150px;
}

.service-con01-01 p{
margin-top:10px;
}

.service-p01{
font-size:17px;
border:solid 1px #333;
padding:3px 10px;
margin-bottom:20px;
}

.service-con01-03 .con3{
margin-bottom:30px;
}

.service-con01-04 .con3{
margin-bottom:30px;
}

/*
-----------------------------------------------
サービス門扉 TAB
----------------------------------------------- */
@media screen and (max-width: 768px) {
.service-h01{font-size:30px;}
.service-h02{font-size:48px;}
.service-h03{font-size:48px;}
.mb200{margin-bottom:150px;}
.mb150{margin-bottom:100px;}
}

/*
-----------------------------------------------
サービス門扉 SP
----------------------------------------------- */
@media screen and (max-width: 767px) {
.service-h01{font-size:22px;}
.service-h02{font-size:30px;}
.service-h03{font-size:34px;}
.mb200{margin-bottom:70px;}
.mb150{margin-bottom:60px;}

.service-span01{
font-size:20px;
margin-left:0px;
display:block;
}

.service-con01-01 .con3{
width:32% !important;
}

.service-con01-01 .con3 p{
font-size:12px;
}

.service-con01-02 .con2{
width:100% !important;
margin-bottom:45px;
}

}


/*
-----------------------------------------------
サービス　施工までの流れ
----------------------------------------------- */
.sv-flow{
border:solid 6px #ff0000;
background:#ffffb7;
padding:30px 60px;
border-radius:10px;
}

.sv-flow h3{
color:#fff;
font-size:32px;
background:#ff0000;
text-align:center;
line-height:1.1;
padding:11px;
border-radius:8px;
}

.sv-ya{
padding-top:40px;
padding-bottom:40px;
}

.sv-h01{
color:#ff0000;
font-size:30px;
margin-bottom:15px;
}

.sv-d01{
display:inline-block;
padding:2px;
color:#fff;
font-weight:bold;
font-size:20px;
background:#ff0000;
line-height:1.01;
margin-bottom:15px;
}

.sv01{
width:49%;
border-right:solid 1px #333;
padding-right:30px;
}

.sv02{
width:49%;
padding-left:30px;
}

.sv03{
width:48%;
}

.sv-p{
font-size:18px;
line-height:1.8;
}

.sv-li li{
	font-size:18px;
	padding-left:1.2em;
	position:relative;
	margin-bottom:7px;
}
.sv-li li:before{
	content:"□";
	position:absolute;
	left:0;
	top:0;
}

.sv-pd{
padding-right:50px;
}
.sv-pd02{
padding-left:30px;
}

.sv-li02,
.sv-li03{
font-size:20px;
}

.sv-li02 li:after{
display:block;
padding:8px 0;
content:"↓";
margin-right:2.2em;
}

.sv-li02 li:last-of-type:after{
padding:0;
content:"";
}

.sv-li03 li:after{
display:block;
padding:8px 0;
content:"↓";
margin-left:1em;
}

.sv-li03 li:last-of-type:after{
padding:0;
content:"";
}

.sv-p02{
font-size:26px;
font-weight:bold;
margin-bottom:10px;
}

.sv-p03{
font-size:18px;
font-weight:bold;
margin-bottom:10px;
}
.sv-p04{
font-size:18px;
font-weight:bold;
margin-top:20px;
color:red;
}

.sv-in01{
font-size:18px;
width:260px;
margin-left:auto;
margin-right:auto;
text-align:left;
}

.sv-h02{
color:red;
font-weight:bold;
font-size:25px;
margin-bottom:8px;
}

.sv-f02 .link-btn01 a{
font-size:18px !important;
text-align:center;
width:12em !important;
}

.sv-p05{
font-size:22px;
font-weight:bold;
}

.sv-wrap{
margin-bottom:90px;
}

.sv-ul{
margin-left:40px;
}

.sv-ul li{
list-style-type:disc !important;
font-size:18px;
margin-top:6px;
}

.sv-f01{width:50%;}

.sv-f02{width:48%;}

.sv-f03{width:69%;}

.sv-f04{width:31%;}


.sv-in02{
width:700px;
margin-left:auto;
margin-right:auto;
}

.sv-in02-box{
border:solid 1px #333;
padding:20px;
margin-top:50px;
margin-bottom:5px;
}

.btm200{
margin-bottom:200px;
}

/*
-----------------------------------------------
サービス　施工までの流れ TAB
----------------------------------------------- */
@media screen and (max-width: 768px) {
.tar{text-align:right;}
.sv-flow h3{font-size:28px;}
}

.sv-d01{padding-bottom:4px;}

.btm200{margin-bottom:150px;}


/*
-----------------------------------------------
サービス　施工までの流れ SP
----------------------------------------------- */
@media screen and (max-width: 767px) {
.btm200{margin-bottom:80px;}

.sv-flow{
border:solid 3px #ff0000;
padding:15px;
border-radius:8px;
}

.sv-flow h3{
font-size:20px;
line-height:1.4;
}

.sv-ya{
padding-top:20px;
padding-bottom:20px;
}

.sv-ya img{
width:50px;
height:auto;
}

.sv01{
width:100%;
border-bottom:solid 1px #333;
border-right:none;
padding-right:0px;
padding-bottom:15px;
margin-bottom:15px
}

.sv02{
width:100%;
padding-left:0px;
}

.sv-h01{
font-size:20px;
margin-bottom:10px;
}

.sv-li li,
.sv-p{
font-size:15px;
}

.sv-p01{font-size:14px;}

.sv-p02{font-size:18px;}

.sv-p05{font-size:17px;}

.sv-wrap{margin-bottom:40px;}

.sv-f01,
.sv-f02{width:100%;}

.sv-f01{margin-bottom:15px;}

.sv-f03{width:50%;}
.sv-f04{width:48%;}

.sv-in02{
width:100%;
}

.sv-h02{
font-size:20px;
margin-bottom:8px;
}

.ya-posi{
margin-top:33%;
}

.sv-ul li{font-size:15px;}

.sv-pd{padding-right:0px;}
.sv-pd02{padding-left:0px;}

.sp-tac .tar,
.sp-tac02{text-align:center !important;}

}


/*
-----------------------------------------------
リニューアル
----------------------------------------------- */

.con-h01 span{
font-size:25px;
margin-left:20px;
}

.renewal-type .con-h05{
font-size:40px !important;
margin-bottom:30px;
}

.renewal-li li{
	font-size:40px;
	padding-left:1.2em;
	position:relative;
	margin-bottom:7px;
	color:red;
}

.renewal-li li:before{
	content:"□";
	position:absolute;
	left:0;
	top:0;
}

.marker{
    background:linear-gradient(transparent 50%, #fda5a0 50%);
}

.renewal-p01{
font-size:40px;
font-weight:bold;
}

.renewal-p02{
font-size:33px;
font-weight:bold;
}

.renewal-p03{
font-size:33px;
line-height:1.01;
display:inline-block;
font-weight:bold;
border-radius:14px;
background:#fda5a0;
padding:0.2em 1.0em;
}

.renewal-p04{
font-size:33px;
border-bottom:solid 1px #ff0000;
font-weight:400 !important; 
margin-bottom:30px;
}

.renewal-p05{
font-size:40px;
color:red;
font-weight:bold; 
}

.renewal-p06{
font-size:16px;
display:inline-block;
border:solid 1px #333;
line-height:1.2;
padding:0.2em 0.4em;
}

.renewal-p07{
font-size:33px;
font-weight:bold;
color:red;
}


.renewal-before div{
width:50%;
}

.renewal-before{
margin-bottom:15px;
}

.btm150{
margin-bottom:150px;
}

.renewal-box{
border-bottom:solid 1px #ff0000;
margin-bottom:50px;
}

.renew-f01{width:45%;}
.renew-f02{width:52%;}

.renew-f03{width:69%;}
.renew-f04{width:25%;}

.renewal-box02{
margin-left:auto;
margin-right:auto;
width:860px;
}

.mente-tel{
width:308px;
margin-top:10px;
}

.voice-img{
width:48%;
}

/*
-----------------------------------------------
リニューアル TAB
----------------------------------------------- */
@media screen and (max-width: 768px) {
.renewal-li li{font-size:30px;}
.renewal-p02{font-size:26px;}
.renewal-box02{width:100%;}
}



/*
-----------------------------------------------
リニューアル SP
----------------------------------------------- */
@media screen and (max-width: 767px) {
.con-h01 span{
font-size:20px;
display:block;
margin-left:0px;
}

.renewal-type .con-h05{
font-size:28px !important;
margin-bottom:30px;
}
.renewal-li li{font-size:19px;}

.renewal-p01{font-size:26px;}
.renewal-p02{font-size:22px;}
.renewal-p03{font-size:19px;}
.renewal-p04{font-size:22px;}
.renewal-p05{font-size:22px;}

.renewal-p07{font-size:22px;}

.btm150{margin-bottom:60px;}

.renew-f01,
.renew-f02,
.renew-f03,
.renew-f04{
width:100%;
}
.renew-f01,
.renew-f03{
margin-bottom:15px;
}



}

/*
-----------------------------------------------
メンテナンス
----------------------------------------------- */
.mt-pt dt{
width:165px;
}

.mt-pt dd{
margin-left:20px;
}

/*
-----------------------------------------------
メンテナンス TAB
----------------------------------------------- */
@media screen and (max-width: 768px) {
.mt-pt dt{
width:100px;
}
}

/*
-----------------------------------------------
メンテナンス sp
----------------------------------------------- */
@media screen and (max-width: 767px) {
.mt-pt dt{
width:80px;
}

.mainte-info .con3{
width:48% !important;
margin-bottom:25px;
}

.mainte-info .sv-p05{font-size:15px !important;}

}

/*
-----------------------------------------------
仕上げ
----------------------------------------------- */
.finish-p01{
font-weight:bold;
font-size:30px;
}

.finish-p02{
font-weight:500;
font-size:30px;
color:red;
border-top:solid 1px red;
border-bottom:solid 1px red;
line-height:1.1;
padding:0.4em 0;
text-align:center;
}

.finish-p03{
font-size:52px;
line-height:1.1;
color:red;
display:inline-block;
vertical-align:top;
margin-top:1px;
}

.finish-p03 span{
display:inline-block;
line-height:1.2;
border:solid 4px #ff0000;
border-radius:10px;
font-size:23px;
padding:0.2em 0.2em;
margin-right:10px;
margin-top:1px;
vertical-align:top;
}

.finish-p04{
font-weight:bold;
font-size:26px;
}


.finish01{width:50%;}
.finish02{width:48%;}

.finish03{width:18%;}
.finish04{width:77%;}

.finish-box{
border-top:solid 1px red;
padding-top:50px;
}

.pattern-line{
border-top:solid 2px #999;
padding:15px 0 20px 0;
}

.pattern-line p{
font-size:18px;
font-weight:bold;
margin-left:5px;
margin-bottom:8px;
}

.pattern-img{
height:150px;
width:auto;
display:block;
}

.pattern-box{
margin-bottom:150px;
}

/*
-----------------------------------------------
仕上げ TAB
----------------------------------------------- */
@media screen and (max-width: 768px) {
.finish-p02{font-size:24px;}
}

/*
-----------------------------------------------
仕上げ SP
----------------------------------------------- */
@media screen and (max-width: 767px) {
.finish-p01{font-size:20px;}
.finish-p02{font-size:20px;line-height:1.3 !important;}
.finish-p04{font-size:20px;}

.finish01{width:100%;margin-bottom:30px;}
.finish02{width:100%;margin-bottom:30px;}

.finish-box{padding-top:30px;}

.pattern-img{height:70px;}

.finish-p03{font-size:36px;}

}

/*
-----------------------------------------------
オプション
----------------------------------------------- */
span.en-sub{
font-size:35px !important;
}

.op01{
width:46.5%;
margin-bottom:50px;
}

.op01 p{
font-size:14px;
}

.option-box{
margin-bottom:100px;
}

.option-p01{
padding:0.2em 0.5em;
font-weight:bold;
font-size:24px;
color:red;
line-height:1.1;
border-radius:8px;
display:inline-block;
border:solid 3px #ff0000;
}

.option-tbl dl{
font-size:15px;
border-bottom:solid 1px #ccc;
padding:5px 15px;
}

.option-tbl dt{
width:25%;
}

.option-tbl dd{
width:75%;
}

.option-tbl dl:nth-of-type(2n){
background:#ffecea;
}

.option-tbl h5{
text-align:center;
font-size:18px;
background:#ffddda;
border-bottom:solid 1px #ccc;
padding:8px 15px;
letter-spacing:5px;
}

/*
-----------------------------------------------
オプション TAB
----------------------------------------------- */
@media screen and (max-width: 768px) {
span.en-sub{font-size:25px !important;}
}

/*
-----------------------------------------------
オプション SP
----------------------------------------------- */
@media screen and (max-width: 767px) {
span.en-sub{font-size:17px !important;}
.option-box{margin-bottom:10px !important;}

.option-tbl dt{width:30%;}

.option-tbl dd{width:68%;}

.option-tbl dl{
font-size:14px;
padding:5px 10px;
}
}

/*
-----------------------------------------------
安定器
----------------------------------------------- */
.con-h01 .main-pd{
font-weight:bold;
font-size:60px !important;
margin-left:0 !important;
}


.lh01{
line-height:1.01 !important;
}

.sub-pd{
line-height:1.01;
font-weight:700;
font-size:18px !important;
color:#e7404b;
border:solid 1px #e7404b;
display:inline-block;
padding:0.2em 0.6em 0.3em 0.6em;
}

.antei-box01{
margin:76px 0;
}

.product-p01{
display:inline-block;
color:#fff;
line-height:1.1;
padding:0.2em 1em 0.3em 1em;
background:#ff0000;
font-weight:700;
font-size:34px;
}

.product-p02{
font-size:23px;
line-height:1.8;
}

.product-p03{
font-size:14px;
line-height:1.8;
margin:20px 0;
padding-right:40px;
}

.product-p04{
font-size:14px;
line-height:1.8;
font-weight:500;
}

.product-p05{
font-size:28px;
font-weight:500;
display:inline-block;
padding:0.3em 1em;
border:solid 1px red;
}

.antei-con01 .box1{width:56%;}
.antei-con01 .box2{width:44%;}

.antei-con01{
margin-bottom:100px;
}

.link-btn02{
display:inline-block;
}

.link-btn02 a{
display:block;
color:#333;
background:#ccc;
line-height:1.1;
padding:0.8em 2em;
font-size:17px;
}

.link-btn02 a:hover{
background:#e8e3e3;
text-decoration:none;
}

.info-div{
position:absolute;
top: auto;
right: 0;
bottom: 7%;
left: 0;
margin: auto;
width:980px;
color:#fff;
}

.info-p01{font-size:40px;margin-bottom:15px;}
.info-p02{font-size:17px;}

.img80{
padding-left:10%;
padding-right:10%;
}

.product-p06{
color:red;
font-size:25px;
margin-top:30px;
}

.slope-p01{
font-size:12px;
width:340px;
margin-top:10px;
margin-left:200px;
}

.slope01{
width:47%;
margin-bottom:40px;
}

.mask01{
width:31.5%;
margin-bottom:30px;
}

.sound-box01{
width:740px;
margin-left:auto;
margin-right:auto;
}

.sound01{width:33%;}
.sound02{width:66%;}

.sound-p01{
font-size:23px;
font-weight:700;
}

.sound-p02{
font-size:20px;
border-bottom:solid 1px #999;
padding-bottom:10px;
margin-bottom:10px;
}

.deco-p01{
font-size:24px;
margin-top:10px;
}

.upsizing-p01{
font-size:18px;
font-weight:700;
color:#fff;
background:red;
line-height:1.1;
padding:0.3em 1em;
display:inline-block;
}

.upsizing-p02{
font-size:28px;
font-weight:700;
color:#e95513;
}

.counter-box{
margin-top:70px;
}

.counter-p01{
color:red;
font-size:26px;
}

.counter-p02{
font-size:40px;
}

.counter-p03{
font-size:26px;
}

.counter01{
width:48%;
}



/*
-----------------------------------------------
安定器 SP
----------------------------------------------- */
@media screen and (max-width: 767px) {

.con-h01 .main-pd{
display:block;
font-size:34px !important;
}

.info-div{
position:relative;
top: auto;
right: auto;
bottom: auto;
left: auto;
margin-left:5%;
margin-right:5%;
width:90%;
color:#333;
margin-top:10px;
margin-bottom:30px;
}

.info-p01{font-size:19px;margin-bottom:10px;}
.info-p02{font-size:14px;}

.sub-pd{
font-size:16px;
display:inline-block !important;
}

.antei-box01{
margin:30px 0;
}

.product-p01{
font-size:22px;
}

.antei-con01 .box1{width:100%;}
.antei-con01 .box2{width:100%;}

.antei-con01{
margin-bottom:60px;
}

.product-p02{
font-size:18px;
line-height:1.8;
}

.product-p03{
font-size:14px;
line-height:1.8;
margin:20px 0;
padding-right:0px;
}

.pd-top{
padding-top:20px;
}

.product-p05{
font-size:20px;
display:block;
padding:0.3em;
border:solid 1px red;
}

.slope-p01{
font-size:12px;
width:100%;
margin-top:10px;
margin-left:0px;
}

.slope01{
width:100%;
margin-bottom:40px;
}

.sound-box01{
width:100%;
}


.sound01{
width:100%;
padding-left:15%;
padding-right:15%;
}

.sound02{width:100%;}

.sound-p01{
font-size:20px;
font-weight:700;
}

.sound-p02{
font-size:16px;
border-bottom:solid 1px #999;
padding-bottom:10px;
margin-bottom:10px;
}

.mask01{
width:47%;
margin-bottom:30px;
}

.upsizing-p02{
font-size:22px;
}

counter-p01{
color:red;
font-size:18px;
}

.counter-p02{
font-size:24px;
}

.counter-p03{
font-size:18px;
}

.counter01{
width:100%;
}


}

.wp-pagenavi{
padding-bottom:50px !important;
}

/* css_end */
