@charset "UTF-8";
/*
	Theme Name: door.ai-life.co.jp-sp
	Author: eSales System Laboratory Inc.
	Author URI: http://www.e-uru.biz/
	Version: 1.0.0
*/

/****************************************
          General Setting
*****************************************/
html {
}

html, body {
	margin: 0 auto!important;
}
header,
body {
	min-width: 100%;
}
body {
	letter-spacing: 0px;
	font-size: 14px;
}
img {
	max-width: 100%;
	height: auto;
}

.col-04 .wrapper,
.wrapper { width: 96%; }
.sponly { display: block; }
.pconly { display: none; }

.spbr { display: block; }
.pcbr { display: inline; }
.spcenter { text-align: center; }
.spimgblock { display: block; margin-left: auto; margin-right: auto; margin-bottom: 10px; float: none!important; }

#sp_menu_btn {
    position: absolute;
    display: block;
    cursor: pointer;
    width:55px;
    height:55px;
    right:0px;
    top:4px;
    margin-right:10px;
	z-index: 100;
	background: #fff;
}

header { position: inherit !important; height: auto; }
h2.ttl { font-size: 24px; letter-spacing: 1px; line-height: 1.5em; margin-bottom: 0px; }
.ttl02 {
	padding: 20px 10px;
}	

.ttl02 h2 { font-size: 22px; }
.ttl02 span { letter-spacing: 0px; font-size: 14px; }
.ttl03 h2 { font-size: 20px; margin-bottom: 20px; padding: 10px; letter-spacing: 0px; }
#headerL img.logo { width: calc(100% - 80px); margin-top: 5px; margin-left: 10px; float: none; }
#header h1 { float: none; line-height: 1.5em; font-size: 11px; margin-right: 70px; margin-left: 5px; margin-top: 10px; }
.spmenu { text-align: right; }
.htoi { display: none; float: none; }

img.ftel { width: 170px; margin-top: 10px; }
.col-03 { padding: 40px 0px 10px; }

.fcompay img { width: 250px; }
.fcompay .font20 { font-size: 18px; }

ul.top-work  { padding: 0px 0px 0px; margin-top: 0px; }
ul.top-work  li { width: 49%; margin-right: 0px; margin-bottom: 20px; }
ul.top-work  li h2 { text-align: left; font-size: 13px; }
ul.top-work  li .img { text-align: center;}
ul.top-work  li span.img { height: 150px; }
ul.top-work  li .img img {
	max-width: 100%;
	object-fit: cover;
	height: 200px;
	width: 100%;
}
ul.top-work li .catlabel {
    position: absolute;
    top: -10px;
    left: -7px;
}
ul.top-work li a { padding-bottom: 30px; }
.more-button {
    position: absolute;
    bottom: -15px;
    left: 35%;
    width: 30px;
    height: 30px;
}
#header {
	position: relative;
    top: 0px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    z-index: 10;
    width: 100%;
	background: #fff;
	min-height: 55px;
}
#headerL.fixed #header { position: fixed; }
#header .sitetitle { padding: 10px 10px 0px; font-size: 12px; }
.gmenu { border: 0px; }
.menu_bg {
	background: #fff;
	height: 100%;
}

.menu {
	position: fixed;
	top: 90px;
	left: 0px;
	padding: 0px 0px 15px;
	float: none;
	display: none;
	margin-top: 0px;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	height: 100%;
	background: #fff;
	z-index: 100;
}

.menu li.sponly { display: block;}

.menu ul{
  list-style-type: none;
  margin: 0px 0px 20px 0px;
  padding: 0 2px;
	display: block;
}
.menu li.item04,
.menu li {
	display: block;
width: 98%;
text-indent: initial;
height: auto;
}
.menu li.sponly { display: blcok; }

.menu span.spanmenu,
.menu a{
  font-size: 14px;
  display: block;
  padding: 11px 0px 11px 20px;
  margin: 0 0 0px 0;
  text-align: left;
  width:auto;
  height: auto;
  text-decoration: none;
  position: relative;
  border-bottom: 2px solid #fff;
	background: #E285A0;
}

.menu span.spanmenu:after,
.menu a:after {
	content: ">";
	position: absolute;
	right: 10px;
	top: 30%;
}

.menu span.spanmenu:before, .menu a:before { height: 0px; }

.menu a span { /*display: inline; */}

.menu .child {
	top: 0px;
	width: auto;
	position: relative;
	border: 0px;
	padding-bottom: 5px;
             max-width: 100%;
}
.menu .child li { padding: 2px 0px; width: auto; margin: 0px 0px; border-bottom: 0px; }
.menu .child li:last-child {
	border-bottom: 0px #ddd solid;
}
.menu .child a { color: #fff;  background: #E285A0; }
.menu .child a:before {
	content: "・";
	position: static;
	bottom: 0;
	left: 0;
	width: auto;
	height: auto;
	background: none;
	-webkit-transition: .3s ease-out;
	transition: .3s ease-out;
	-webkit-transform: translate(0,4px);
	transform: translate(0,4px);
}

.menu li:last-child a {
/*  border-bottom: 1px solid #fff; */
}
.gmenu .child a:hover {
	color: #fff;
	background: #E285A0;
}

.contactform th,
.contactform td { display: block; width: auto; padding: 10px 0px 10px 10px; }
.wpcf7-form textarea { width: 95%; }
.contactform .spw { width: auto; padding-right: 0px !important; }
.contactform div { margin-left: 0px !important; }
span.wpcf7-list-item { margin-left: 0px !important; }
.wpcf7-form input[type=text],
.wpcf7-form input[type=email],
.wpcf7-form input[type=tel]
{width: 100%; box-sizing: border-box;} /*名前、メール、題名*/

.newtopic ul {
    padding: 20px 10px;
    font-size: 15px;
}
.newtopic h3 { display: block;font-size: 13px; line-height: 1.5em; }
footer .fbox01 {
	float: none;
	width: 280px;
	margin:0px auto 20px;
}
footer .fbox02 {
	float: none;
	width: auto;
}
footer .fbox02 ul {
	display: block;
	width: 96%;
	margin: auto;
}
footer .fbox02 ul li {
	width: 47%;
	display: inline-block;
	margin: 2px 1%;
}
footer .fbox02 ul li a {
	display: block;
	padding: 5px 5px;
	font-size: 13px;
}
footer .fbox02 ul li a:before {
	content: ">";
	padding-right: 5px;
}

footer .fbox02 ul.bana li a:before {
	display: none;	
}
footer .fbox02 ul.bana li {
	width: auto;
	display: block;
	text-align: center;
}
footer .fbox02 ul.bana li a {
}
footer .fbox02 { margin-bottom: 0px;  }
#copyright { line-height: 1.2em; padding-bottom: 50px; }
#footer01 {
    padding: 0px 0 0px;
    position: fixed;
    bottom: 0px;
    width: 100%;
	z-index: 10000;
}

#footer_fixed_sp li a i{
	font-size: 24px;
	color: #fff;
}

#footer_fixed_sp {
	margin: 0;
	float: none;
	display: table;
	width: 100%;
	border-top: 1px solid #fff;
}
#footer_fixed_sp li {
	display: table-cell;
	width:33%;
	color:#fff;
	background-color:#E285A0;
}

#footer_fixed_sp li#ft_sptoi { background-color:#E285A0; }
#footer_fixed_sp li#ft_sptel { background-color:#E285A0; }


#footer_fixed_sp li a:after {
	content:"";
	position:absolute;
	top:0;
	right:0;
	bottom:0;
	display:block;
	width:1px;
	background:#ffffff;
}

#footer_fixed_sp li a {
	position:relative;
	display:block;
	padding:8px 0 5px;
	font-size: 0.9em;
	color:#fff;
	text-align:center;
	text-decoration:none;
	background-position:center 8px;
	background-position:center 17px;
	background-repeat:no-repeat;
	width: auto;
	margin-top: 0px;
}
#gotop { display: none; }

.subHeader {
    padding-top: 20px;
    padding-bottom: 30px;
    background: url(/home/images/title-bg.png) no-repeat top center;
    background-size: cover;
}

#maincon { padding-top: 20px; }

.mB {
    font-size: 20px;
    margin: 0px;
    padding: 25px 0px 0px;
    text-align: center;
    letter-spacing: 0px;
    line-height: 1.5em;
    font-weight: 600;
    color: #000;
    font-weight: 500;
    text-shadow: 1.5px 1.5px 2px #fff;
	height: 3em;
}
.midashi{
	font-size: 18px;
}
.midashi_1 {
    font-size: 26px;
    padding: 5px 15px;
    font-weight: 500;
    margin-bottom: 20px;
    line-height: 2em;
    font-weight: 300;
    display: inline-block;
    margin: 10px 0px 10px;
    color: #0091B9;
    letter-spacing: .1em;
}

.midashic {
    margin-bottom: 20px;
    padding: 5px 0 5px 0;
    background-color: #F9F9FA;
    font-size: 18px;
    line-height: 2em;
    margin-top: 20px;
    padding-left: 15px;
    color: #f78da7;
    position: relative;
}

.midashic:before {
    content: "";
    border-left: 5px solid #f78da7;
    height: 100%;
    padding-right: 0px;
    display: inline-block;
    top: 0px;
    margin-left: -14px;
    position: absolute;
}

ul.work_list li {
    display: inline-block;
    width: 90%;
    margin-bottom: 30px;
    margin: 0 auto 25px;
    position: relative;
    min-height: auto;
    box-sizing: content-box;
    padding: 0px 1% 0px 1%;
    background-color: #fff;
}

.kizi { padding: 30px 10px 120px; background: #fff; position: sticky; }
.breadcrumbs { padding-left: 10px; }

.kizittlsekou {
    font-size: 18px;
    padding: 5px 1px;
    font-weight: 500;
    margin-bottom: 20px;
    line-height: 1.3em;
    font-weight: 300;
    display: inline-block;
    margin: 0px 0px 0px;
    color: #e285a0;
    letter-spacing: .1em;
    text-align: center;
	letter-spacing: 0px;
}


.right_exit {
    margin: 10px 5px;
}

.right_exit .link {
    padding-left: 0px;
}

.kanren ul.list02 li,
.kanren ul.list li { width: 98%; margin: 10px auto; float: none; height: auto; }
.kanren ul.list li:after {
	clear: both;
	content: "";
	display: block;
}
.kanren .list li h3 { font-size: 14px; font-weight: 300; }
.kanren .list li img { width: 80px; height: 80px; }
.child_page { width: 48%; margin: 0px 1% 10px; }
.child_page h3 { font-size: 14px; }

.bukendata dl {
	display: block;
	width: auto;
	margin-bottom: 10px;
	font-size: 13px;
}
.bukendata dl dt { width: 24%; padding: 5px 1%; color: #555; }
.bukendata dl dd { width: 72%; padding: 5px 1%; }
.bukendata dl:after {
	clear: both;
	content: "";
	display: block;
}
.bukendata dl dd:before {
	content: "";
}

.bx-wrapper .bx-controls-direction a {
	width: 15px !important;
	height: 15px !important;
}

ul.inlink li { width: auto; margin: 5px 3px; }
ul.inlink li a { font-size: 14px; padding: 8px 5px; }
.worktags li { min-width: auto; width: 49%; }
.worktags li a {
	padding: 5px 5px;
	margin: 10px 5px 10px 0px;
	border-width: 2px !important;
	font-size: 12px;
}


.col-02 .box01,
.col-02 .box02 { width: auto; display: block; margin: 0px 10px; }
.col-02 .box01 { margin-right: 10px; }
footer .fbox01 img { float: none; display: block; max-width: 250px; margin: 0px auto 0px 0px; }
.col-06 .conttl { padding: 20px 15px; font-size: 16px; }
.col-06 .conttl img { float: none; margin-left: auto; margin-right: auto; }
.col-06 .contxt { padding: 20px 15px; font-size: 14px; }
.metaslider .flexslider { margin-bottom: 10px !important; }


/* おススメ商品 */

.kakaku {
    border-bottom: 1px solid #1e3b81;
    padding-bottom: 5px;
    font-size: 18px;
    text-align: right;
    margin-bottom: 20px;
}

/* おススメ商品 */


#fukidashi3 .says {
    display: inline-block;
    position: relative;
    margin: 5px 100px 0 5px;
    padding: 17px 10px;
    border-radius: 12px;
    background: #fdfbfb;
    border: 2px solid #fbdeda;
    width: auto;
}

#fukidashi3 .says:after {
    content: "";
    display: inline-block;
    position: absolute;
    top: 18px;
    right: -23px;
    border: 12px solid transparent;
    border-left: 12px solid #fbdeda;
    left: unset;
}

/* コラム */
.concept-m { font-size: 17px; line-height: 1.8em; letter-spacing: 0px;}
.komid { font-size: 17px; line-height: 1.8em; letter-spacing: 0px; }
ul.conkanren { display: block; margin-bottom: 0px; }
ul.conkanren li { display: block; width: 95%; margin-right: auto; margin-left: auto; margin-bottom: 40px; border: 1px solid #ddd; padding: 10px; box-sizing:border-box; }
.ttlc { font-size: 16px; letter-spacing: 0px; }
.komento { font-size: 14px; }

.morebottun_p { display: block; width: 100%; box-sizing: border-box; margin-bottom: 20px; padding: 11px 40px 11px 15px }
.morebottun_l {  padding: 1.1em 2em 1.1em 1.2em; }
.midashiv { font-size: 18px; }
.con_title  { font-size: 20px; }
#columnpage .bloc_left {
    float: none;
    width: auto;
}

#columnpage .bloc_right {
    float: none;
    width: auto;
}

.gaiyou th { width: 5em; padding: 10px; text-align: left; }
.gaiyou td { padding: 10px; }
.gaiyou2 th  { width: 5em; padding: 10px; }
.gaiyou2 td { padding: 10px; }

.photos li .halfright,
.photos li .halfleft { width: auto; vertical-align: top; display: block; }
.photos li .halfleft { margin-right: auto; }
.photos li .halfright { float: none; }
#doortop,
#door_other { text-align: left; }
ul.work_list li span.img img {
  width: 100%;
  height: auto;
  object-fit: contain;
  max-height: 260px;
}
ul.work_list li .tags { text-align: center; margin-bottom: 0px !important; }
ul.work_list li h2 { font-size: 14px; }
.tags span, .tags a { margin-bottom: 0px; }
.toitxt { font-size: 22px; }
.wpcf7-form input[type=button],
.wpcf7-form input[type=submit]{ display: block; }
.foreword { padding: 20px 15px; }
.blog-thumbnail { width: 100px; height: auto; margin-right: 10px; }
.bloglist-thumbnail { width:80px; margin-right: 10px; }

.conceptwrap { display: block; }
.conceptwrap .item01 { width: 90%; margin-right: auto; margin-left: auto; margin-bottom: 30px; }
.conceptwrap .item02 { width: 90%; margin-right: auto; margin-left: auto; margin-bottom: 30px; }
.sec01 { background: #fff;}
.sec02 { background: #FAEFF3; padding: 30px 0px 30px; margin-bottom: 50px; }
.sec03 { background: #fff;margin-bottom: 50px; }
.sec08 { background: #fff;margin-bottom: 50px; }
.sec06 {
    padding: 30px 0px 30px;
    margin-bottom: 50px;
}
.ttl04 {
    color: #f45b69;
    font-size: 18px;
    line-height: 1.5em;
    font-weight: 500;
    position: relative;
}

.service-card {
    background: rgba(255, 255, 255, 0.9);
    border-radius: 50%;
    width: 200px;
    height: 200px;
    margin-bottom: 15px;
}
.service-card img { width: 80px!important; }
.service-title { font-size: 15px; }
ul.topcompany { gap: 0px; justify-content: space-between; padding: 0px 10px;}
.topcompany li { width: 46%; margin-bottom: 20px; }
.topcompany li a.card { width: 100%; height: 130px; }
.conc-m { font-size: 22px; line-height: 1.5em; }
.catch-ttl { font-size: 20px; line-height: 1.5em; }
.morebottun_rb { display: block; width: auto; margin: 0px auto 20px; }
.mid-con02  { font-size: 18px; line-height: 1.5em; }
.services-container { gap: 0px!important; }
.service-card-wrap a { margin-bottom: 30px; }
ul.kanren-work li { width: 80%; display: block; margin: 10px auto 10px; }
ul.kanren-work li .more-button { left: 45%;}