@charset "utf-8";
a {
-webkit-tap-highlight-color: rgba(0,0,0,0);
}

body{
color:#303030;
font-family:"游ゴシック Medium", "Yu Gothic Medium","游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", YuGothic,'Lato','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
font-size:87.5%;
line-height:1.8;
background:#fff;
-webkit-text-size-adjust: 100%;
font-weight:500;
}
@media all and (-ms-high-contrast:none) {
body {
font-family:'メイリオ',Meiryo,"游ゴシック Medium", "Yu Gothic Medium","游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", YuGothic,'Lato','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
}
}
.robot{
font-family: 'Roboto', "游ゴシック Medium", "Yu Gothic Medium","游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", YuGothic,'Lato','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
font-weight:500;
}
.robot.bold{
font-weight:700;
}
.robot-con{
font-family: 'Roboto Condensed', "游ゴシック Medium", "Yu Gothic Medium","游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", YuGothic,'Lato','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
font-weight:400;
}
.crimson{
font-family: 'Crimson Text', "游ゴシック Medium", "Yu Gothic Medium","游ゴシック", "Yu Gothic", "游ゴシック体", "YuGothic", YuGothic,'Lato','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
font-weight:400;
}
.pc{
display:block !important;
}
.tab-pc{
display:block !important;
}
.tab{
display: none !important;
}
.sp-tab{
display:none !important;
}
.sp{
display:none !important;
}
@media screen and (max-width:980px){
.pc{
display:none !important;
}
.tab{
display:block !important;
}
.sp-tab{
display:block !important;
}
}
@media screen and (max-width:767px){
body{
font-size:11pt;
}
.tab-pc{
display: none !important;
}
.tab{
display: none !important;
}
.sp{
display:block !important;
}
}
h1,h2,h3,h4,h5,h6 {
font-size:100%;
font-weight:normal;
}
/*---------------------------------------*/
/* header */
/*---------------------------------------*/
#headerupper{
width:100%;
padding:5px 0;
background:#e1041b;
color:#fff;
line-height:1.4;
}
#headerupper .areaInner{
width:95%;
}
@media screen and (max-width:767px){
#headerupper{
height:auto;
font-size:9pt;
padding:3px 0;
}
#headerupper .areaInner{
width:98%;
}
}
header{
height:105px;
}
@media screen and (max-width:980px){
header{
height:90px;
}
}
@media screen and (max-width:767px){
header{
height:70px;
border-bottom:1px solid #dbdbea;
}
header .areaInner{
width:96%;
}
}
header .logo{
position:absolute;
top:26px;
left:0;
}
@media screen and (max-width:767px){
header .logo{
top:10px;
}
}
@media screen and (max-width:374px){
header .logo{
top:7px;
}
}
header .logo img{
width:auto;
height:24px;
position:relative;
}
@media screen and (max-width:1100px){
header .logo img{
height:20px;
}
}
@media screen and (max-width:767px){
header .logo img{
height:14px;
}
}
@media screen and (max-width:374px){
header .logo img{
width:175px;
height:auto;
}
}
header .logo .ttl{
color:#000;
font-weight:bold;
display:block;
text-align:center;
margin-top:5px;
}
@media screen and (max-width:767px){
header .logo .ttl{
font-size:9px;
}
}
header .telArea{
position:absolute;
top:15px;
right:205px;
}
@media screen and (max-width:1100px){
header .telArea{
right:195px;
}
}
header .telArea .note{
color:#000;
font-size:100%;
font-weight:bold;
text-align:center;
letter-spacing:0.07em;
}
@media screen and (max-width:1100px){
header .telArea .note{
letter-spacing:0;
}
}
header .telArea .tel .icon-tel-2{
font-size:38px;
color:#e1041b;
margin-right:5px;
}
@media screen and (max-width:1100px){
header .telArea .tel .icon-tel-2{
font-size:29px;
}
}
header .telArea .tel .robot{
font-size:322%;
color:#000;
line-height:1;
}
@media screen and (max-width:1100px){
header .telArea .tel .robot{
font-size:295%;
}
}

header .mailArea .btn{
position:absolute;
top:26px;
right:0;
width:195px;
height:55px;
background:#91041b;
}
header .mailArea .btn a{
position:absolute;
top:-5px;
left:-5px;
width:195px;
height:55px;
line-height:55px;
text-align:center;
background:#e1041b;
font-weight:bold;
}
header .mailArea .btn a:hover{
top:0;
left:0;
}
header .spNavi{
position:absolute;
top:23px;
right:0;
}
@media screen and (max-width:767px){
header .spNavi{
top:12px;
}
}
header .spNavi li{
float:left;
width:82px;
text-align:center;
}
@media screen and (max-width:767px){
header .spNavi li{
width:60px;
}
}
header .spNavi li a{
display:block;
border-left:1px solid #dbdbea;
}
header .spNavi li:last-child a{
border-right:1px solid #dbdbea;
}
header .spNavi li .note{
font-size:78.5%;
font-weight:bold;
}
@media screen and (max-width:767px){
header .spNavi li .note{
font-size:7pt;
}
}
header .spNavi li .icon{
font-size:20px;
}
@media screen and (max-width:767px){
header .spNavi li .icon{
font-size:16px;
}
}
/*---------------------------------------*/
/* fixBar */
/*---------------------------------------*/
#fixBar{
position:fixed;
top:0;
left:0;
width:100%;
height:100px;
background:#e1041b;
color:#fff;
z-index:999;
}
.tabContent #fixBar{
top:inherit;
bottom:0;
}
@media screen and (max-width:980px){
#fixBar{
top:inherit;
bottom:0;
height:80px;
}
}
@media screen and (max-width:767px){
#fixBar .areaInner{
width:94%;
}
}
@media screen and (max-width:374px){
#fixBar .areaInner{
width:96%;
}
}
#fixBar .blockLeft{
width:48%;
}
#fixBar .blockRight{
width:52%;
}
@media screen and (max-width:980px){
#fixBar .blockLeft,
#fixBar .blockRight{
float:left;
width:auto;
}
#fixBar .blockLeft{
margin-right:20px;
margin-top:5px;
}
#fixBar .blockRight{
margin-top:13px;
}
}
@media screen and (max-width:767px){
#fixBar .blockLeft{
margin-right:75px;
float:none;
}
}
@media screen and (max-width:374px){
#fixBar .blockLeft{
margin-right:60px;
}
}
@media screen and (max-width:767px){
#fixBar .blockRight{
position:absolute;
top:-18px;
right:0;
width:90px;
float:none;
margin-top:0;
}
}
@media screen and (max-width:374px){
#fixBar .blockRight{
top:5px;
width:65px;
}
}
#fixBar .blockLeft li{
float:left;
width:auto;
position:relative;
}
#fixBar .blockLeft li:first-child{
margin-right:15px;
}
@media screen and (max-width:374px){
#fixBar .blockLeft li:first-child{
margin-right:5px;
}
}
#fixBar .blockLeft li .icon{
margin-top: 8px;
display: inline-block;
height:85px;
width:85px;
border-radius:50%;
background:#fff;
}
@media screen and (max-width:980px){
#fixBar .blockLeft li .icon{
margin-top:6px;
height:60px;
width:60px;
}
}
@media screen and (max-width:767px){
#fixBar .blockLeft li .icon{
margin-top:4px;
height:50px;
width:50px;
}
}
#fixBar .blockLeft li .icon .txt{
color:#e1041b;
font-size:128.5%;
font-weight:bold;
line-height:1;
text-align:center;
display:block;
padding-top:20px;
}
@media screen and (max-width:980px){
#fixBar .blockLeft li .icon .txt{
padding-top:13px;
font-size:100%;
}
}
@media screen and (max-width:767px){
#fixBar .blockLeft li .icon .txt{
padding-top:10px;
font-size:8pt;
}
}
#fixBar .blockLeft li:nth-child(2) .icon .txt{
padding-top:15px;
line-height: 1.2;
letter-spacing: 0.07em;
}
@media screen and (max-width:980px){
#fixBar .blockLeft li:nth-child(2) .icon .txt{
padding-top:9px;
}
}
#fixBar .blockLeft li .icon .txt .num{
font-size:166%;
letter-spacing: -0.04em;
}
@media screen and (max-width:980px){
#fixBar .blockLeft li .icon .txt .num{
font-size:130%;
}
}
@media screen and (max-width:767px){
#fixBar .blockLeft li .icon .txt .num{
font-size:150%;
}
}
#fixBar .blockLeft li .icon .txt .small{
font-size:77%;
}
@media screen and (max-width:767px){
#fixBar .blockLeft li .icon .txt .small{
font-size:7pt;
margin-top: 2px;
display: inline-block;
}
}
#fixBar .blockLeft li .icon .txt .big{
font-size:127%;
}
@media screen and (max-width:980px){
#fixBar .blockLeft li .icon .txt .big{
}
}
#fixBar .blockLeft li .note{
display:inline-block;
font-size:178.5%;
font-weight:bold;
line-height:1.2;
letter-spacing:0.07em;
position:relative;
top:4px;
margin-left:3px;
}
@media screen and (max-width:980px){
#fixBar .blockLeft li .note{
font-size:128%;
}
}
@media screen and (max-width:767px){
#fixBar .blockLeft li .note{
font-size:10pt;
top:3px;
margin-left:0;
}
}
#fixBar .blockLeft li:nth-child(2) .note{
display:inline-block;
font-size:157%;
font-weight:bold;
line-height:1.2;
position:relative;
margin-left:3px;
top:0;
}
@media screen and (max-width:980px){
#fixBar .blockLeft li:nth-child(2) .note{
font-size:114%;
}
}
@media screen and (max-width:767px){
#fixBar .blockLeft li:nth-child(2) .note{
font-size:9pt;
top:-2px;
margin-left:0;
}
}
.note-sp{
font-size:8pt;
margin-top:1px;
}
@media screen and (max-width:374px){
.note-sp{
font-size:7pt;
}
}
#fixBar .blockRight .note{
font-size:114%;
font-weight:bold;
line-height: 1;
margin: 15px 0 5px;
}
@media screen and (max-width:980px){
#fixBar .blockRight .note{
font-size:86%;
margin: 3px 0 5px;
}
}
#fixBar .blockRight .tel .icon-tel-2{
font-size:43px;
color:#fff;
margin-right:5px;
}
@media screen and (max-width:980px){
#fixBar .blockRight .tel .icon-tel-2{
font-size:30px;
}
}
#fixBar .blockRight .tel .robot{
font-size:400%;
color:#fff;
line-height:1;
}
@media screen and (max-width:980px){
#fixBar .blockRight .tel .robot{
font-size:238%;
}
}
#fixBar .blockRight .telIcon a{
width:90px;
height:90px;
display:block;
border-radius:50%;
background:#fff;
text-align:center;
font-weight:bold;
line-height:1.2;
font-size:7pt;
position:relative;
}
@media screen and (max-width:374px){
#fixBar .blockRight .telIcon a{
width:65px;
height:65px;
border-radius:15px;
}
}
#fixBar .blockRight .telIcon a:hover{
background:#fff109;
}
#fixBar .blockRight .telIcon a:after{
position:absolute;
width:82px;
height:82px;
top:3px;
left:3px;
border-radius:50%;
border:1px solid #e1041b;
content:"";
display:block;
-webkit-transition: border 0.3s ease;
-moz-transition: border 0.3s ease;
-o-transition: border 0.3s ease;
transition: border 0.3s ease;
}
@media screen and (max-width:374px){
#fixBar .blockRight .telIcon a:after{
display:none;
}
}
#fixBar .blockRight .telIcon a .txt{
padding-top: 18px;
display: inline-block;
}
@media screen and (max-width:374px){
#fixBar .blockRight .telIcon a .txt{
padding-top:7px;
}
}
#fixBar .blockRight .telIcon a .big01{
font-size:8pt;
}
#fixBar .blockRight .telIcon a .big02{
font-size:8pt;
}
#fixBar .blockRight .telIcon a .big03{
font-size:11pt;
}
@media screen and (max-width:374px){
#fixBar .blockRight .telIcon a .big03{
font-size:9pt;
}
}
@media screen and (max-width:374px){
#fixBar .blockRight .telIcon a .small{
font-size:6pt;
}
}
#fixBar .blockRight .telIcon a .icon-tel{
font-size:11pt;
margin-top: 2px;
display: block;
}
@media screen and (max-width:374px){
#fixBar .blockRight .telIcon a .icon-tel{
font-size:9pt;
}
}
/*---------------------------------------*/
/* layout */
/*---------------------------------------*/
.blockLeft{
float:left;
}

.blockRight{
float:right;
}

.txtRight{
text-align:right;
}

.txtCenter{
text-align:center;
}
/*-------------------------------------------*/
/* A */
/*-------------------------------------------*/
a:link,
a:visited
{
color:#e1041b;
text-decoration:none;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}

a:hover,
a:active
{
color:#e1041b;
text-decoration:none;
}

a[name]:hover {
color:#000000;
text-decoration:none;
}

/*-------------------------------------------*/

a.line:link,
a.line:visited
{
text-decoration:underline;
}

a.line.line:hover,
a.line.line:active
{
text-decoration:none;
}

/*-------------------------------------------*/

header .mailArea .btn a:link,
header .mailArea .btn a:visited
{
color:#fff;
}

header .mailArea .btn a:hover,
header .mailArea .btn a:active
{
color:#fff;
}

/*-------------------------------------------*/

#fixBar .blockRight .telIcon a:link,
#fixBar .blockRight .telIcon a:visited
{
color:#e1041b;
}

#fixBar .blockRight .telIcon a:hover,
#fixBar .blockRight .telIcon a:active
{
color:#e1041b;
}
/*---------------------------------------*/
/* 共通 */
/*---------------------------------------*/
.areaInner{
width:90%;
max-width:980px;
margin:0 auto;
position:relative;
z-index:10;
}
.areaBase{
margin:0 auto 90px;
overflow:hidden;
}
/*---------------------------------------*/
/* toparea */
/*---------------------------------------*/
#topArea{
position:relative;
}
#topArea .topVisual{
	position:relative;
}
@media screen and (max-width:980px){
#topArea .topVisual .topVisualInner{
position:relative;
width:100%;
padding-top:63.2653%;
}
}
@media screen and (max-width:767px){
#topArea .topVisual .topVisualInner{
padding-top:73.46%
}
}
#topArea .topVisual .topVisualInner{
width:100%;
height:620px;
background:url(../images/common/img-slide.jpg) center top;
background-size:cover;
font-size:0;
-webkit-animation: bgscroll 300s linear infinite;
animation: bgscroll 300s linear infinite;
}
@media screen and (max-width:980px){
#topArea .topVisual .topVisualInner{
height:100%;
}
}
@-webkit-keyframes bgscroll {
0% {background-position: 0 0;}
100% {background-position:-4976px 0;}
}

@keyframes bgscroll {
0% {background-position: 0 0;}
100% {background-position:-4976px 0;}
}
#topArea .topVisual .topImg{
width:100%;
height:620px;
margin-left:auto;
margin-right:auto;
background:url(../images/common/img-top-190422.png) center top no-repeat;
background-size:auto 100%;
position:absolute;
top:0;
left:0;
}
@media screen and (max-width:980px){
#topArea .topVisual .topImg{
height:100%;
}
}
@media screen and (max-width:767px){
#topArea .topVisual .topImg{
background:url(../images/common/img-top-s-190422.png) center top no-repeat;
background-size:auto 100%;
}
}
#topArea .maker{
background:#e1041b;
padding:55px 0 30px;
}
@media screen and (max-width:767px){
#topArea .maker{
padding:20px 0;
}
}
#topArea .maker .areaTtl{
font-size:200%;
text-align:center;
font-weight:bold;
color:#fff;
line-height:1.4;
margin-bottom:40px;
}
@media screen and (max-width:767px){
#topArea .maker .areaTtl{
font-size:15pt;
margin-bottom:20px;
}
}
#topArea .maker .areaTtl .small{
font-size:66%;
display:block;
}
@media screen and (max-width:767px){
#topArea .maker .areaTtl .small{
font-size:9pt;
}
}
#topArea .maker ul{
margin-left:auto;
margin-right:auto;
}
#topArea .maker ul li{
float:left;
width:30.5%;
margin-right:4.25%;
margin-bottom:25px;
}
@media screen and (max-width:767px){
#topArea .maker ul li{
margin-bottom:15px;
}
}
#topArea .maker ul li:nth-child(3n){
margin-right:0;
}
#topArea .maker ul li img{
width:100%;
height:auto;
}
/*---------------------------------------*/
/* 施工事例 */
/*---------------------------------------*/
.ticker{
background: #e1041b;
padding: 55px 0 90px;
}
@media screen and (max-width:767px){
.ticker{
padding: 20px 0 50px;
}
}
.ticker .areaTtl{
font-size:200%;
text-align:center;
font-weight:bold;
color:#fff;
line-height:1.4;
margin-bottom:40px;
}
@media screen and (max-width:767px){
.ticker .areaTtl{
font-size:15pt;
margin-bottom:20px;
}
}
.ticker .areaTtl .small{
font-size:66%;
display:block;
}
@media screen and (max-width:767px){
.ticker .areaTtl .small{
font-size:9pt;
}
}
#worksTicker_main{
max-width:700px;
margin:0 auto;
padding:30px;
background:#fff;
overflow:hidden;
}
@media screen and (max-width:767px){
#worksTicker_main{
padding:10px;
}
}
#worksTicker{
height:0;
overflow:hidden;
}
.tickerBox{
width: auto;
height: 500px;
overflow:hidden;
}
@media screen and (max-width:767px){
.tickerBox{
height:315px;
}
}
.tickerBox li{
display: block;
padding: 10px;
border-top: 2px solid #DDDDDD;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
line-height:25px;
}
@media screen and (max-width:767px){
.tickerBox li{
padding:5px;
border-top: 1px solid #DDDDDD;
font-size:8pt;
height:34px;
line-height:normal;
}
}
.tickerBox li .date{
font-weight: bold;
color: #cc0000;
margin-right:15px;
}
@media screen and (max-width:767px){
.tickerBox li .date{
	display:block;
	line-height:1.5;
}
}
