@charset "utf-8";
@import "contact-s.css?v=2";

/*=====================================================================================
	
	Document    : common-s.css
	Description : 共通css スマホ用（幅640px以下）

	1-1. Header
	1-2. Nav
	1-3. Contents
	1-4. Footer
 
=====================================================================================*/

#wp {
	max-width:640px;
	margin:0 auto;
	text-align:left;
}

#wp-ov0 {
	position:fixed;
	margin:0;
	padding:0;
	top:0;
	left:0;
	z-index:998;
	width:100%;
	height:100%;
	background:url(../image/bg-brack-op50.png) repeat left top;
}



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

   1-3. Contents

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

.ct {
	padding-top:4%;
}

.hnone-box {
	margin-bottom:4%;
}


/*-------------------------------------------------------
   コラム・施工実績一覧
-------------------------------------------------------*/

.kiji-list {
	margin-left:-2.7%;
	margin-right:-2.7%;
	padding-left:3%;
	padding-right:3%;
	padding-bottom:4%;
}

.kiji-list h2 {
	padding:5% 0 2.5% 0;
}

.kiji-list > .list li {
	width:49%;
	margin-left:1%;
	margin-top:1%;
}

.kiji-list > .list li .imgLiquid {
	height:115px;
}

@media screen and (max-width:480px) {
	.kiji-list > .list li .imgLiquid {
		height:85px;
	}
}

/*
@media screen and (max-width:360px) {
	.kiji-list > .list li {
		width:100%;
		margin-left:0;
		margin-top:2.7%;
	}

	.kiji-list > .list li .imgLiquid {
		height:115px;
	}
}
*/


/*-------------------------------------------------------
   コラム・施工実績詳細
-------------------------------------------------------*/

.kiji-title {
	margin-left:-2.7%;
	margin-right:-2.7%;
	padding:3%;
}


/*-------------------------------------------------------
   記事
-------------------------------------------------------*/

.kiji-box {
	padding-top:6%;
	padding-left:0;
	padding-right:0;
}

.kiji-box .photo-l,
.kiji-box .photo-r {
	display:block;
	margin-right:auto;
	margin-left:auto;
	float:none;
	text-align:center;
	padding-bottom:4%;
}

.kiji-box .photo-c {
	padding-bottom:4%;
}


/*-------------------------------------------------------
   記事見出し
-------------------------------------------------------*/

.or_md,
.or_mdic {
	margin-bottom:4%;
}


/*-------------------------------------------------------
   side サムネイル
-------------------------------------------------------*/

.sl-thumb {
	margin-left:-2.7%;
	margin-right:-2.7%;
}

.sl-thumb h3,
.sl-thumb h4,
.sl-thumb h5,
.sl-thumb h6 {
	padding-top:4%;
	padding-left:3%;
	padding-right:3%;
}

@media screen and (max-width:400px) {
	.sl-thumb .thumb {
		width:60px;
		margin-right:12px;
	}
	
	.sl-thumb li .imgLiquid {
		height:45px;
	}

	.sl-thumb p {
		margin-left:72px;
	}

	.sl-thumb li a {
		padding:4% 11% 4% 4%;
	}
}


/*-------------------------------------------------------
   side 一覧
-------------------------------------------------------*/

.sl-list {
	margin-left:-2.7%;
	margin-right:-2.7%;
	margin-bottom:-4.5%;
}

.sl-list .dnone {
	padding:3%;
}

.sl-list h3,
.sl-list h4,
.sl-list h5,
.sl-list h6 {
	padding-top:4%;
	padding-left:3%;
	padding-right:3%;
}

.sl-list li a {
	padding:3% 10% 3% 3%;
}

.sl-list li:last-child {
	border-bottom:none;
}


/*-------------------------------------------------------
   ページ見出し
-------------------------------------------------------*/

@media screen and (max-width:530px) {
	.pmd .ct {
    padding-top: 0;
	}
	.pmd .ct h1 img {
		max-width: 100px;
    height: auto;
	}
}


/*-------------------------------------------------------
   パンくず
-------------------------------------------------------*/

.pan {
	display:none;
}


/*-------------------------------------------------------
   改ページ
-------------------------------------------------------*/

.kpage {
	padding:3% 0 3.5% 0;
}


/*-------------------------------------------------------
   ページ移動
-------------------------------------------------------*/

.pmove {
	padding:3% 0;
}


/*-------------------------------------------------------
   youtube iframe
-------------------------------------------------------*/

.iframeYoutube {
  display:block;
  position:relative;
  height:0;
  padding:30px 0 56.25%;
  overflow:hidden;
}

.iframeYoutube iframe {
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
}


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

   ページ下部　お問い合わせ

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

.contactB {
	background:none;
	margin-left:0;
	margin-right:0;
}

.contactB li {
	float:none;
	width:100% !important;
}

.contactB li:first-child {
	margin-bottom:3%;
}


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

   pageup

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

.up {
	bottom:70px;
}


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

   1-4. Footer

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

footer {
	background-color:#fff;
}


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

footer .ic-menu {
	border-top:8px solid #dcdcdc;
	border-bottom:none;
	padding:0;
}

footer .list-menu {
	padding:0;
}

footer nav ul {
	width:100%;
	text-align:left;
}

footer a {
	text-decoration:none !important;
}

footer nav li a {
	padding:6% 20% 6% 6%;
	display:block;
	background:url(../image/lmS.png) no-repeat center right;
}

footer nav li a span {
	display:table-cell;
	vertical-align:middle;
}

footer .ic-menu li,
footer .list-menu li {
	width:50%;
	float:left;
	border-bottom:1px solid #dcdcdc;
	display:block;
	margin:0;
	padding:0;
	background:none;
	background-color:#fff;
}

footer .ic-menu li img {
	vertical-align:middle;
	margin-left:-60px;
}
footer .ic-menu li a {
	padding-left:60px;
}

footer .ic-menu li:nth-child(odd),
footer .list-menu li:nth-child(even) {
	border-right:1px solid #dcdcdc;
	margin-left:-1px;
}
footer .ic-menu li:first-child {
	display:block;
}
footer .ic-menu li:last-child {
	width:100%;
	border-right:none;
	margin-left:0;
}
footer .ic-menu li:last-child a {
	padding:3% 10% 3% 3%;
	box-sizing: border-box;
}

footer .ic-menu li:last-child img {
	vertical-align:middle;
	margin-left:-30px;
}

footer .ic-menu li:last-child a {
	padding-left:30px;
}

footer .list-menu li:first-child {
	display:none !important;
}

/*
footer .list-menu li:last-child,
footer .list-menu li:nth-last-child(2) {
	border-bottom:none;
}
*/

@media screen and (max-width:480px) {
	footer .ic-menu li {
		width:100%;
	}
	
	footer .ic-menu li a {
		padding-top:3%;
		padding-bottom:3%;
	}

	footer .ic-menu li:nth-child(2n) {
		border-left:none;
		margin-left:0;
	}
}


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

.ft {
	text-align:center;
	background-color:#b4b4b4;
	margin-left:0;
	margin-right:0;
	padding-left:2.7%;
	padding-right:2.7%;
	padding-top:20px;
	padding-bottom:20px;
  margin-bottom: 60px;
}

.ft p {
	display:block;
}

.ft .cname img {
	display:none;
}

.ft .cname,
.ft .copy {
	width:inherit;
	height:auto;
	background:none;
}

.ft .copy {
	margin-top:8px;
}

.contact-link {
  position: fixed;
  bottom: 0;
  left: 0;
	display: flex;
  align-items: center;
  text-align: left;
  width: 100%;
  height: 60px;
  background-color: #e0e0e0;
  opacity: 0;
  visibility: hidden;
  transition: .2s;
}

.contact-link a {  
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  width: 50%;
  height: 60px;
  box-sizing: border-box;
  padding: 0 1em;
  color: #fff;
  font-size: 87.5%;  
  letter-spacing: 1pt;
  transition: .2s;
}
.contact-link a:nth-child(1) { background-color: #E45257; padding: 0 1em 0 24px; }
.contact-link a:nth-child(2) { background-color: #00B900; }
.contact-link a:hover { opacity: .8; }

.contact-link a strong {
  display: block;
  width: 100%;
  font-size: 150%;
}
.contact-link a span {
  display: block;
  width: 100%;
}

.contact-link a .icon {
  width: 42px;
  margin-right: 12px;
}
.contact-link a .icon img {
  width: 100%;
  height: auto;
}
.contact-link a:nth-child(2) div { width: calc(100% - 54px); }