@charset "utf-8";

/* write 20150512 */

/* all */

html { font-size: 62.5%; }
body {
width:100% !important;
font-size: 1.4rem;
font-family: "メイリオ", sans-serif;
margin: 0;
padding: 0;
color: #333333;
background:url(../images/body_bk.png) center top;
line-height:1.6em;
}

ul, ol, dl {
padding: 0;
margin: 0;
}
li {
list-style:none;
}
h1, h2, h3, h4, h5, h6, p {
margin-top: 0;
}
a {
color: #2cb0c3;
text-decoration: underline;
}
a:visited {
text-decoration: underline;
}
a:hover, a:active, a:focus {
text-decoration: none;
}
a img {
border: none;
-webkit-transition: 0.3s ease-in-out;  
-moz-transition: 0.3s ease-in-out;  
-o-transition: 0.3s ease-in-out;  
transition: 0.3s ease-in-out;
}
a img:hover{
opacity: 0.6;  
filter: alpha(opacity=40); 
}
.left {
float:left;
}
.right {
float:right;
}

.brown {
color:#663300;
}
.bold {
font-weight:bold;
}
.big {
font-size:1.6rem;
}

.small {
margin:5px 0;
font-size:1.2rem;
}
.bxslider {
background:#ffffff;
}

/* all contents */

h4 img{
margin-bottom:10px;
}
h5 {
background:url(../images/h5_mark.jpg) left top no-repeat;
min-height:20px;
height:auto;
margin:0 0 8px 0;
padding:0 0 0 25px;
font-size:1.6rem;
font-weight:bold;
color:#663300;
line-height:1.3em;
}

header {
width:1000px;
padding:0 15px;
margin:0 auto;
}
header h1{
padding:10px 0 5px 0;
float:left;
}
header h2, header p{
width:700px;
font-size:1.2rem;
padding-top:20px;
float:right;
text-align:right;
line-height:1.5em;
}

#groval_nav{
height:54px;
padding:5px 15px 10px 15px;
overflow:hidden;
clear:both;
min-width:1000px;
width:auto;
background:url(../images/nav_bk.png) center top repeat-x;
}
#groval_nav ul{
width:1000px;
margin:0 auto;
}
#groval_nav ul li{
float:left;
}

#container {
padding:0 15px;
width: 1000px;
margin: 0 auto;
}

#side {
float: right;
width: 220px;
padding-bottom: 10px;
}
#side ul li{
margin-bottom:20px;
}

#content {
padding: 30px;
margin-bottom:40px;
width: 690px;
float: left;
background:#ffffff;
}
#content section{
margin-bottom:30px;
}
#content section h3, #content_long section h3{
margin-bottom:15px;
background:url(../images/h3_bk.jpg) left top;
height:38px;
}

#content .banner{
display:block;
}
#content .banner img{
margin-top:20px;
}

#content_long {
padding: 30px;
margin-bottom:40px;
width: 940px;
background:#ffffff;
}
#content_long section{
margin-bottom:30px;
}
#content_long section h3{
margin-bottom:20px;
}

#content_long .banner{
display:block;
}
#content_long .banner img{
margin-top:20px;
}

footer {
font-size:1.2rem;
padding:10px 15px;
clear: both;
min-width:1000px;
width:auto;
background:url(../images/footer_bk.jpg) center top;
}
#footer_inner {
width:1000px;
margin:0 auto;
padding:15px 0;
text-align:center;
}
#footer_inner #footer_nav{
color:#663300;
overflow:hidden;
}
#footer_inner #footer_nav a{
color:#663300;
text-decoration:none;
}
#footer_inner #footer_nav a:hover{
text-decoration:underline;
}
#footer_inner #footer_nav li{
display: -moz-inline-box;  
display: inline-block;  
padding-bottom:10px;
}

#page-top {
position: fixed;
bottom: 70px;
right: 20px;
}
#page-top a {
text-decoration: none;
width: 105px;
display: block;
}
#page-top2 {
display:none;
}

/* index */

#top_news {
display:block;
}
#top_news .left{
width:400px;
}
#top_news .left li{
width:400px;
border-bottom:1px dotted #ecddb9;
padding-bottom:10px;
padding-top:10px;
}
#top_news .left li:first-child {
padding-top:0;
}
#top_news .left li p.title{
background:url(../images/top/listmark.png) left center no-repeat;
padding:0 0 0 20px;
margin-bottom:5px;
}
#top_news .left .small_txt{
font-size:12px;
}
#top_news .right{
width:260px;
}

/* page  */

#main_image {
margin-bottom:30px;
}
.box {
background:#f3ede3;
padding:15px 10px;
margin:0 0 30px 0;
overflow:hidden;
text-align:center;
border-radius: 3px; 
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
}
.box li{
display: -moz-inline-box;  
display: inline-block;  
}
.box li a{
margin-left:3px;
margin-right:0;
}
.box2 {
border:1px solid #f3ede3;
padding:15px 0;
margin:0 0 15px 0;
}
.box2 p{
margin-bottom:0 !important;
font-weight:bold;
font-size:1.6rem;
text-align:center;
}
.box2 p span{
display:block;
font-weight:bold;
font-size:1.6rem;
text-align:center;
color:#663300;
}
.box3 {
background:#f3ede3;
padding:13px;
margin:0 0 30px 0;
overflow:hidden;
border-radius: 3px; 
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
}
.box3 p{
margin-bottom:0 !important;
color:#663300;
font-weight:bold;
}

/* page service */

#service_list h4 {
background:url(../images/service/h4_titlebk.png) bottom center repeat-x;
margin-bottom:30px;
height:44px;
}

#service_list p {
padding-bottom:20px;
margin-bottom:20px;
border-bottom:1px dotted #ecddb9;
}
#service_list p.last {
margin-bottom:30px;
}
#service_flow_text {
list-style: none;
margin-left: 0;
margin-top:10px !important;
margin-bottom:10px !important;
padding-left: 1em;
text-indent: -1em;
}
#service_flow_text span{
color:#663300;
}

#service_flow {
margin:20px 0 0 0;
}
#service_flow .list{
background:url(../images/service/arrow.jpg) bottom center no-repeat;
padding-bottom:22px;
margin-bottom:10px;
}
#service_flow .last{
background:none;
}
#service_flow .box{
margin-bottom:0;
padding:15px 20px;
}
#service_flow h4{
color:#663300;
font-weight:bold;
text-align:left;
font-size:1.6rem;
margin-bottom:6px;
}
#service_flow p{
text-align:left;
}
#service_flow a{
margin:10px 0 0 0;
float:left;
}

/* page price */

#price_list h4{
margin-bottom:30px;
height:44px;
background:url(../images/price/h4_titlebk.png) bottom center repeat-x;
}
#price_list p{
margin-bottom:30px;
}

/* page inquiry */

#inquiry_table table {
width:100%;
}
#inquiry_table table th{
color:#663300;
width:27%;
vertical-align:top;
}
#inquiry_table table td{
text-align:left;
width:73%;
}
#inquiry_table table td p span{
display:block;
margin-left:14px;
}

/* 20210402 form */
.must{
color: #990000;
}
.mailform{
font-size: 14px;
text-align: left;
width: auto;
padding: 15px 40px 0 40px;
}
.mailform .mailform_line{
display: flex;
}
.mailform .mailform_line .mfp{
width: 73%;
padding: 0 0 20px 0;
}
.mailform .mailform_line .title{
width: 27%;
padding: 7px 0 20px 0;
}
.mailform input[type="text"],
.mailform input[type="email"],
.mailform textarea{
font-size: 16px;
max-width: 320px !important;
width: 76% !important;
border: none;
padding: 7px;
}
.mailform textarea{
max-width: 420px !important;
width: 100% !important;
min-height: 240px;
height: auto;
}
.mfp_buttons{
padding: 0 !important;
text-align: center;
margin: 0 auto 15px;
clear: both;
}
.mfp_buttons button{
font-size: 16px;
padding: 8px 37px 8px 17px;
color: #ffffff;
background-color: #663300;
position: relative;
border: none;
}
.mfp_buttons button:hover{
opacity: 0.8;
}
.mfp_buttons button::after {
position: absolute;
content: '';
width: 0;
height: 0;
border: solid 4px transparent;
border-left: solid 6px #ffffff;
top: 50%;
right: 5px;
margin-top: -4px;
}
.mail_subtext{
margin-bottom: 15px;
}
.mailform_area{
margin-bottom: 45px;
}
.thanks_content{
width: 94% !important;
padding: 3% 3% 3% 3% !important;
}
.thanks {
padding: 150px 20px 110px 20px;
}
.thanks p {
font-size: 14px;
text-align: center;
margin: 0 0 20px 0;
}

/* page info */

.entry {
overflow:hidden;
}
.entry .left{
width:430px;
}
.entry .right{
width:250px;
}
.info_title {
background:#f4e5c5;
min-height:38px;
height:auto;
margin:0 0 20px 0;
}

.info_title h3{
color:#663300;
background:url(../images/info/h3_title.png) left top no-repeat !important;
float:left;
font-size:1.8rem;
font-weight:bold;
line-height:38px;
padding:0 0 0 38px;
}
.info_title p{
color:#663300;
float:right;
font-size:1.2rem;
line-height:38px;
padding:0 10px 0 0;
}

/* media smart */

#smart-nav {
display:none !important;
}

@media screen and (max-width:767px){
#smart-nav{
display:inline !important;
}
body {
overflow:hidden !important;
}
img{
max-width: 100%;
height: auto;
width:auto;
}
h1 {
width:165px;
padding-top:5px !important;
}
h2 {
display:none;
}
#container #main_image {
margin:10px 0 5px 0 !important;
}
#container #main_image h2{
display:inline !important;
}
header p, #groval_nav, #page-top{
display:none !important;
}
#page-top2{
font-size:10px;
float:right;
display:inline !important;
margin:0 10px 10px 0;
}
#page-top2 a{
color:#663300;
text-decoration:none;
}
h3, h3 img{
height:30px !important;
padding-left:0 !important;
font-size:12px !important;
margin-bottom:10px !important;
}
header, footer, #footer_inner, #footer_nav, #container, #content, ul, #content_long{
max-width: 100%;
min-width: 100%;
width:100%;
margin:0 !important;
padding:0 !important;
}
h5 {
margin-top:10px !important;
font-size:14px !important;
}
table td:last-child {
padding-bottom:20px;
}
header{
padding:0 10px 5px 10px !important;
background-repeat:repeat-x;
background-position:bottom center;
background-image:url(../images/smart/head_bk.png);
background-size:50%;
overflow:hidden;
}
footer{
padding:20px 0 !important;
line-height:1em !important;
}
#content {
padding: 30px;
float:none !important;
background-repeat:repeat-x;
background-position:bottom center;
background-image:url(../images/smart/head_bk.png);
background-size:50%;
overflow:hidden;
}
#content section, #content_long section{
overflow:hidden;
padding: 15px;
margin-bottom:10px;
background:#ffffff;
}
#side {
float: none;
width: 100%;
margin:20px auto 0;
text-align:center;
}
#side ul li:last-child{
margin:0 0 10px 0;
}
#side img{
width:95% !important;
margin:0 auto;
}
#top_news .left{
width: 100%;
}
#top_news .left li{
width: 100%;
border-bottom:1px dotted #ecddb9;
padding-bottom:10px;
padding-top:10px;
}
#top_news .right{
margin-top:20px;
width: 100%;
}
section, section div {
margin-bottom:5px !important;
padding-bottom:0 !important;
}
p.left, p.right {
width:100% !important;
margin-bottom:10px !important;
}
.info_title h3{
background-image:none !important;
padding-left:10px !important;
}
.box{
height:auto;
padding:10px !important;
font-size:12px;
line-height:1.5em;
}
.box2{
padding:10px 5px 10px 5px !important;
font-size:12px;
line-height:1.5em;
}
.box2 p, .box2 p span {
font-size:1.2rem !important;
}
.box3{
min-height:46px;
height:auto;
padding:5px 5px 5px 5px;
font-size:12px !important;
line-height:1.8em;
}
#service_list h4, #price_list h4{
height:30px;
margin-bottom:10px !important;
background-size:70%;
}
#service_list h4 img, #price_list h4 img{
height:30px;
}
#price_list p{
font-size:12px !important;
}
.ui-group {
margin:15px !important;
}
.ui-group h3{
height:20px !important;
margin:0 !important;
}
.ui-group h3 img{
height:16px !important;
}
.ui-group button{
padding:5px !important;
font-size:10px !important;
margin:2px !important;
}
.isotope {
padding-bottom:20px !important;
width:100% !important;
text-align:center;
margin:0 auto;
}
.works-item{
width:98px !important;
height:62px !important;
margin:3px !important;
}
.works-item img{
width:89% !important;
height:auto !important;
}
.works-item p{
display:none;
}
#inquiry_table table tr{
display: block;
margin-bottom: 1.5em;
}
#inquiry_table table th{
width:100%;
display: list-item;
border: none;
font-size:14px;
padding:5px 0 3px 0;
border-bottom:1px solid #ddc184;
}
#inquiry_table table td{
width:100%;
display: list-item;
border: none;
font-size:12px;
padding:6px 0 0 0 !important;
}
#inquiry_table table td span{
margin-left:0 !important;
}
#content_long {
margin-bottom:20px !important;
}

/* smart sidemenu */

.HiddenCheckbox {
display: none;
}
.MenuContainer {
display: inline-block;
position: fixed;
right: 0;
top: 0;
padding: 10px;
width: 32%;
height: 250px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
z-index: 1;
}
.MenuIcon {
cursor: pointer;
display: block;
float: right;
height: 32px;
position: relative;
width: 32px;
z-index: 2;
padding-top:16px;
padding-left:6px;
padding-right:0;
padding-bottom:2px;
background-position:top left;
background-repeat:no-repeat;
background-image:url(../images/smart/smart-nav.png);
background-size:34px;
}
.MenuIcon::before {
-webkit-box-shadow: #fff 0 6px 0;
box-shadow: #fff 0 6px 0;
height: 3px;
width: 22px;
background: #fff;
display: block;
content: '';
position: absolute;
}
.MenuIcon::after {
bottom: 0;
height: 3px;
width: 22px;
margin-bottom:19px;
background: #fff;
display: block;
content: '';
position: absolute;
}
.Menu {
font-size:10px;
background: #663300;
bottom: 0;
right: -110%;
position: absolute;
top: 0px;
width: 110%;
-webkit-transition: right 0.4s;
transition: right 0.4s;
-ms-filter: "alpha( opacity=90 )";
filter: alpha( opacity=90 );
opacity: 0.9;
border-bottom-left-radius: 6px;
-webkit-border-bottom-left-radius: 6px;
-moz-border-bottom-left-radius: 6px;
}
.HiddenCheckbox:checked ~ .MenuHeader {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
.HiddenCheckbox:checked ~ .Menu {
right: -12%;
}
.Menu-list {
list-style-type: none;
margin: 60px 0 0 0 !important;
padding: 0;
}
.Menu-item {
margin: 0;
}
.Menu-link {
color: #fff;
display: block;
overflow: hidden;
padding: 4px 20px  4px 10px;
position: relative;
text-decoration: none;
z-index: 1;
}
.Menu-link::before {
background: #914b05;
bottom: 0;
content: '';
left: 0;
position: absolute;
right: 100%;
top: 0;
-webkit-transition: right 0.4s;
transition: right 0.4s;
z-index: -1;
}
.Menu-link::after {
display:none;
content: attr(href);
color: #fff;
float: right;
opacity: 0;
-webkit-transition: opacity 0.8s, -webkit-transform 0.4s;
transition: opacity 0.8s, transform 0.4s;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
.Menu-link:hover::before {
right: 0;
}
.Menu-link:hover::after {
opacity: 0.5;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.bx-wrapper {
margin:10px 0!important;
}
.bx-controls {
display:none;
}

/* 20210402 form */
.must{
color: #990000;
}
.mailform{
font-size: 12px;
text-align: left;
width: auto;
padding: 0 0 0 0;
}
.mailform .mailform_line{
display: block;
}
.mailform .mailform_line .mfp{
width: 100%;
padding: 0 0 6% 0;
}
.mailform .mailform_line .title{
width: 100%;
padding: 3% 0 3% 0;
}
.mailform input[type="text"],
.mailform input[type="email"],
.mailform textarea{
max-width: 96% !important;
width: 96% !important;
border: none;
padding: 2%;
}
.mailform textarea{
max-width: 96% !important;
width: 96% !important;
height: auto;
}
.mfp_buttons{
text-align: center;
margin: 3% auto 9%;
clear: both;
}
.mfp_buttons button{
font-size: 14px;
padding: 3.5% 9% 3% 6%;
color: #ffffff;
background-color: #663300;
position: relative;
border: none;
}
.mfp_buttons button:hover{
opacity: 0.8;
}
.mfp_buttons button::after {
position: absolute;
content: '';
width: 0;
height: 0;
border: solid 4px transparent;
border-left: solid 6px #ffffff;
top: 50%;
right: 5px;
margin-top: -3px;
}
.mail_subtext{
margin-bottom: 3%;
}
.mailform_area{
margin-bottom: 6% !important;
}
.thanks_content{
width: 94% !important;
padding: 3% 3% 3% 3% !important;
}
.thanks {
overflow: hidden;
padding: 6% 3% 6% 3%;
}
.thanks p {
font-size: 14px;
text-align: center;
margin: 0 0 20px 0;
}

}