@charset 'utf-8';


body { color:#333366;}
#PAGE { width:100%; }
#PAGE section { width:100%; height:auto; text-align:center; background: rgba(247,242,228);background-size: auto;}
#PAGE section .logo { width:100%; text-align:left; background: white;}
#PAGE section .logo img { margin: 5px 0 5px 20px; }
#PAGE section .top img { width: 100%; }
.sp { display:none; }
.pc { display:inline-block; }

#PAGE section .PAGE_IN { width:100%; height:auto; margin:0px auto; position: relative; overflow: visible;}
#PAGE section h1 { width:100%; text-align:center; margin-top: 0;}
h1{position: relative;}
h2 { width:100%; font-size:40px; letter-spacing:0.1em; text-align:center; line-height:2em; font-family: source-han-sans-japanese, sans-serif;font-weight: 700;font-style: normal;}
img.border { margin-bottom:20px; }
strong { width:100%; text-align:center; display:inline-block; font-size:18px; }
strong span { font-size:28px; }
.center { width:100%; text-align:center; }
.box_wrap{width: 100%;}
.box { width:1200px; height:auto; display:block;   margin:0 auto; position:relativie; overflow: visible;}

.PAGE_IN h3 { width:100%; }
.PAGE_IN strong { width:100%; display:block; margin: 20px 0 -20px 0; font-weight:bold; color: #46361B; line-height:2em;  }
.PAGE_IN .contact　　{ width:100%; display:flex; flex-wrap:wrap; }
.PAGE_IN .contact strong { width:100%; display:inline-block;}
.PAGE_IN .contact div { width:30%; }
.PAGE_IN .contact div label { border:2px solid #666666; background:#fff; }

.button{ position:relative; right:auto; width:242px; height:60px; display:block; margin:0 auto; border:none; background:url(../img/send.png) no-repeat; background-size:100%; color:#fff; text-align:center; font-weight:bold; font-size:16px; line-height:60px; box-shadow:none; border-radius:0; }

.satei { width:100%; display:flex; justify-content: space-between;margin:50px 0; }
.satei label {position: relative;display: block;width: 30%;height:50px;border: 2px solid #666666;background: #fff;}
.satei select {cursor: pointer;position: relative;-webkit-appearance: none;appearance: none;display: block;width: 200px;padding: 0 1em;line-height:46px;color: #000;border: none;background: transparent;font-size:16px;}
.satei ::-ms-expand {display: none;}

.detail { width:1100px; margin:0 auto; }
.detail_in { width:660px; margin:0 220px; }
.detail dl.RESERVE { width:660px; margin:0 auto 30px auto; clear:none; background:none; border-bottom:none; }
dl.RESERVE dt { width:100%; padding:0; float:left; clear:none; font-size:13px; line-height:1.4em; background:none; }
dl.RESERVE dt em { float:left; }

dl.RESERVE dd { width:100%; padding:0; float:left; clear:none; background:none; }
dl.RESERVE dd.NESS { background:#ff0; }
dl.RESERVE dd .wsNo	{ width:160px; float:left; }
dl.RESERVE dd .NAIYO { width:100%; float:left; clear:none; margin:0 0 10px 0; }
dl.RESERVE dd .NAIYO label { width:100%; float:left; clear:none; margin:0 10px 0 0; font-size:14px; }
dl.RESERVE dd .NAIYO label.AMPM { width:100%; }
dl.RESERVE dd p { width:100%; float:left; clear:none; margin:0 0 5px 0; }
dl.RESERVE dd span { width:100%; float:left; clear:none; }
dl.RESERVE dd span.BUKKEN { width:100%; float:left; clear:none; margin:10px 0 0 0; }
dl.RESERVE dd span.VISIT { width:auto; float:left; clear:none; margin:5px 10px 0 0; line-height:36px; }
dl.RESERVE dd input[type="checkbox"] { width:20px; height:20px; margin:5px 5px 0 0; }
dl.RESERVE dd input[type="radio"] { width:20px; height:20px; margin:5px 5px 0 0; vertical-align:middle; }
dl.RESERVE dd span.ZIP { width:auto; float:left; clear:none; margin:10px 10px 0 0; }
dl.RESERVE dd select { width:auto; float:left; clear:none; margin:0px 10px 0 0; font-size:14px; }
dl.RESERVE dd select option { padding:0px; }
dl.RESERVE dd textarea { width:420px; height:100px; font-size:16px; }
dl.RESERVE dd a.PASS{ float:left; clear:both; margin:0; color:#0af; }
dl.RESERVE dd a.PASS:hover{ text-decoration:underline; }
dl.RESERVE dd a.PASS:active{ text-decoration:underline; }
dl.RESERVE dd em.LOGIN_ERROR{ display:block; float:left; width:100%; color:#ff775d; }

dl.RESERVE dd span.TANI { width:auto; float:left; }
dl.RESERVE dd span.TANI img { width:auto; float:none; margin:0 5px 0 0; vertical-align:middle; }
dl.RESERVE dd span.KEIJO { width:auto; float:none; margin:0 20px 0 5px; line-height:20px; }
dl.RESERVE dd span.KEIJO img { margin:0 5px 0 0; vertical-align:middle; }
input.INPUT_SS { width:100px; height:17px; margin:0 10px 0 0;float:left;font-size:14px; line-height:2em; border:3px solid #666;
padding:1em 1em; }


/*フォーム*/
.selectbox {width:90%;margin:1em auto;position:relative;}
select{  -webkit-appearance:none;appearance:none;width:100%;padding:1em 1em;box-sizing:border-box;font-size:1em;border-radius:0;background:#fff;border: #ccc 1px solid;width: 355px;}
select.time{width: 349px;}
.selectbox::after{content:"";display:block;width:10px;height:10px;position:absolute;right:5%;top:35%;border-bottom:#333 2px solid;border-right:#333 2px solid;transform:rotate(45deg)translateY(-30%);}
.color.selectbox select{background:blue;color:#fff;border-radius:2em;}
.color.selectbox::after{border-bottom:#fff 5px solid;border-right:#fff 5px solid;}
div.container img.hissu { width:25px; }
div.container img.hissu2 { width:25px; margin-top:13px;}
label.form_input input .hissu { margin-top:10px; }

/*トップ*/
.top { width:100%; display:flex; justify-content: space-between; margin:0 0 0px 0; }
.top_text{position: absolute;top: 0;right: 0;left: 0;margin: 0 auto;width: 88vw;}

/*実際のリフォームモデルハウスをみて*/
.box1{position: relative;}
.map {width: 838px;position: absolute;top: 580px;right: 0;left: 0;margin: 0 auto;}
.map iframe{width: 100%;}
.map a{display: inline-block;width: 100%;text-align: left;text-decoration: underline;color: blue;}
.map_address{width: 100%;text-align: left;margin-top: 5px;}


/*来店予約*/
.yoyaku{background: white;position: relative;background: #46361B;padding-top: 40px;padding-bottom: 190px;}
.yoyaku_tytle{position: absolute;top: -60px;right: 0;left: 0;margin: 0 auto;}
.brown_back{background: #46361B;}
.box_contact{margin-bottom: -90px;}



/*固定バー*/
.kotei {padding: 15px 0;position: fixed;bottom: 0; left:0; z-index: 1;width: 100vw;background: #3BADDE;}
.kotei div {margin: 0 auto;}
.button_tel{width: 260px;}
.button_matome{display: flex;justify-content: center;width: 680px;align-items: center;}
.kotei {display: inline-block;}
.kotei a {display: inline-block;}
.kotei a:hover {opacity: 0.8;}


@media screen and (max-width: 740px){
#PAGE section { padding-bottom: initial;}
#PAGE section .PAGE_IN { width:100vw; margin:0 auto; padding:0px 0;}
#PAGE section .logo img {width: 40vw;}

.sp { width:100%; display:block; }
.pc { display:none; }
.scroll { width:10%; margin:0 0 30px 0; }
.box { width:90vw; height:auto; display:block; border:none; margin:0 auto; position:relativie; overflow: visible;}
h1 { width:90%; margin:20px 5% 0 5%; margin: 0;}
h2 { font-size:1.46rem; color:#333366; }
.PAGE_IN h3 img { width:100%; }
strong { width:100%; text-align:center; display:inline-block; font-size:1rem; line-height:2em; }
strong span { font-size:1.2rem; }
.space { width:100%; height:100px; display:inline-block;}
.box .box_en { width:110px; height:110px; border-radius: 50%; border:3px solid #333366; background:#ff3900; position: absolute; top:-90px; left:1%;text-align: center; display: flex;justify-content: center;align-items: center; flex-wrap:wrap; font-weight:bold; }
.border { width:100%; }
.PAGE_IN strong { font-size:0.9rem; }
.top { width:100%; display: initial; margin:0 0 0px 0; flex-wrap: initial;}
.top_pc { display:none; }
div.container img.hissu { width:25px; }
div.container img.hissu2 { width:25px; }
div.container img.hissu2 { width:25px; margin-top:10px;}


/*実際のリフォームモデルハウスをみて*/
.white_back{background: white;}

.map {width: 90vw;top: 710px;}

/*来店予約*/
.yoyaku_tytle img{width: 100%;}
.contents {margin-top: -50px;}
select{ width: 85vw;}
.yoyaku {padding-bottom: 0px;}
.box_contact{margin-bottom: 30px;}


/*固定バー*/
.kotei {z-index: 2;padding: 5px 0;padding: 2px 0;}
.kotei img {width: 100%;}
.button_matome{display: flex;flex-direction: row;}

.footer{z-index: 1;}

}






@media screen and (max-width: 740px){
  .map {top: 810px;}
}

@media screen and (max-width: 375px){
  .map {top: 710px;}
}
