@charset "utf-8";


body,div,dl,dt,dd,ul,li,h1,h2,h3,h4,h5,h6,form,input,p{
	margin: 0;
	padding: 0;
	list-style: none;
}
table {
}
address,caption,h1,h2,h3,h4,h5,th {
	font-style: normal;
	font-weight: normal;
}
caption,th {
	text-align: left;
}
object,
embed {
	vertical-align: top;
}
hr {
	display: none;
}
a:hover {
	cursor: pointer;
}
img {width: 100%;height: auto;}




html {
}

body {font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
	color: #444444;width: 100%;
	font-size: 16px;
line-height: 2.5;
	text-align: center;
	background-color: #ffefe3;
}
img {
	border: none;
	vertical-align: top;
}




/* リンク部分
----------------------------------------------------------------------------------------------------------------------*/

a {
	color: #000;
	text-decoration: underline;
}
a:visited {
	text-decoration: none;
}
a:hover {
	/*color: #34A7E0;*/
	text-decoration: none;
}
a:active {
	text-decoration: none;
}

/* フロート
----------------------------------------------------------------------------------------------------------------------*/


.fL {float:left;}
.fR {float:right;}


/* マージン
----------------------------------------------------------------------------------------------------------------------*/

.mb5 {margin-bottom:5px;}
.mb10 {margin-bottom:10px;}
.mb20 {margin-bottom:20px;}
.mb30 {margin-bottom:30px;}
.mb40 {margin-bottom:40px;}
.mb50 {margin-bottom:50px;}

.mt5 {margin-top:5px;}
.mt10 {margin-top:10px;}
.mt20 {margin-top:20px;}
.mt30 {margin-top:30px;}
.mt40 {margin-top:40px;}
.mt50 {margin-top:50px;}

.ml5 {margin-left:5px;}
.ml10 {margin-left:10px;}
.ml20 {margin-left:20px;}
.ml30 {margin-left:30px;}
.ml40 {margin-left:40px;}
.ml50 {margin-left:50px;}

.mr5 {margin-right:5px;}
.mr10 {margin-right:10px;}
.mr20 {margin-right:20px;}
.mr30 {margin-right:30px;}
.mr40 {margin-right:40px;}
.mr50 {margin-right:50px;}



/* パディング
----------------------------------------------------------------------------------------------------------------------*/

.pb5 {padding-bottom:5px;}
.pb10 {padding-bottom:10px;}
.pb20 {padding-bottom:20px;}
.pb30 {padding-bottom:30px;}
.pb40 {padding-bottom:40px;}
.pb50 {padding-bottom:50px;}

.pt5 {padding-top:5px;}
.pt10 {padding-top:10px;}
.pt20 {padding-top:20px;}
.pt30 {padding-top:30px;}
.pt40 {padding-top:40px;}
.pt50 {padding-top:50px;}

.pl5 {padding-left:5px;}
.pl10 {padding-left:10px;}
.pl20 {padding-left:20px;}
.pl30 {padding-left:30px;}
.pl40 {padding-left:40px;}
.pl50 {padding-left:50px;}

.pr5 {padding-right:5px;}
.pr10 {padding-right:10px;}
.pr20 {padding-right:20px;}
.pr30 {padding-right:30px;}
.pr40 {padding-right:40px;}
.pr50 {padding-right:50px;}


/*----------------------textstyle------------------------------*/

strong { color:#C00;}
em {}
b {}

.red {color:#C00;}
.small {font-size:80%;}

.clear {clear:both;}


.pagetop {
	width: 50px;
	height: 50px;
	background: url(images-sun/common/pagetop.png) no-repeat top left;
}

.fcwt {
	color: #ffffff;
}
.fcgr {
	color: #666;
}
.fclb {
	color: #7c80f4;
}
.fcdb {
	color: #1d2088;
}


/* common
----------------------------------------------------------------------------------------------------------------------*/

#header {
	width: 100%;
	background-position: center top;
	background-repeat: repeat-x;
}
#header_IN {
	height:135px;
	position:relative;
	margin:0 auto;
	text-align:center;
	background-repeat: no-repeat;
}
@media print, screen and (min-width: 900px) {
/*pc-style*/
#header_IN {width:960px;}
}
@media print, screen and (min-width: 511px) and (max-width: 899px) {
/*tablet-style*/
#header_IN {width:100%;}
} 
/* smartPhone */
@media print, screen and (max-width: 580px) {
/*smart-style*/
#header_IN {width:100%;}
}



#header_IN .logo {
	position:absolute;
}
@media print, screen and (min-width: 900px) {
/*pc-style*/
#header_IN .logo {top:22px;left:0px;width: 208px;}
}
@media print, screen and (min-width: 511px) and (max-width: 899px) {
/*tablet-style*/
#header_IN .logo {top:12px;left:0px;width: 170px;}
} 
/* smartPhone */
@media print, screen and (max-width: 580px) {
/*smart-style*/
#header_IN .logo {top:12px;left:0px;width: 150px;}
}



#header_IN h1 {
	top:5px;
}
@media print, screen and (min-width: 900px) {
/*pc-style*/
#header_IN h1 {font-size:10px;}
}
@media print, screen and (min-width: 511px) and (max-width: 899px) {
/*tablet-style*/
#header_IN h1 {font-size:10px;}
} 
/* smartPhone */
@media print, screen and (max-width: 580px) {
/*smart-style*/
#header_IN h1 {font-size:8px;}
}


#header_IN h2 {
	top:20px;
}
@media print, screen and (min-width: 900px) {
/*pc-style*/
#header_IN h2 {font-size:11px;}
}
@media print, screen and (min-width: 511px) and (max-width: 899px) {
/*tablet-style*/
#header_IN h2 {font-size:11px;}
} 
/* smartPhone */
@media print, screen and (max-width: 580px) {
/*smart-style*/
#header_IN h2 {font-size:9px;}
}




#header_IN .GL1 {
	position:absolute;
	top:72px;
	z-index: 100;
	left: 605px;
}
#header_IN .mail2 {
	position:absolute;
}
@media print, screen and (min-width: 900px) {
/*pc-style*/
#header_IN .mail2 {top:25px;width: 23%;right: 0;}
}
@media print, screen and (min-width: 511px) and (max-width: 899px) {
/*tablet-style*/
#header_IN .mail2 {top:25px;width: 25%;right: 0;}
} 
/* smartPhone */
@media print, screen and (max-width: 580px) {
/*smart-style*/
#header_IN .mail2 {top:25px;width: 30%;right: 0;}
}





#header_IN .fb {
	position:absolute;
	top:72px;
	left: 492px;
}
#header_IN .sns1 {
	position:absolute;
	top:72px;
	left: 256px;
}
#header_IN .sns2 {
	position:absolute;
	top:72px;
	left: 380px;
}
#header_IN .tel {
	position:absolute;
}
@media print, screen and (min-width: 900px) {
/*pc-style*/
#header_IN .tel {top:26px;width: 10%;right: 27%;}
}
@media print, screen and (min-width: 511px) and (max-width: 899px) {
/*tablet-style*/
#header_IN .tel {top:26px;width: 12%;right: 29%;}
} 
/* smartPhone */
@media print, screen and (max-width: 580px) {
/*smart-style*/
#header_IN .tel {top:26px;width: 14%;right: 32%;}
}






#header_IN .menu {
	position:absolute;
	top:130px;
	left: 0px;
	height: 134px;
}
#header_IN .submenu {
	position:absolute;
}
@media print, screen and (min-width: 900px) {
/*pc-style*/
#header_IN .submenu {top:26px;width: 100%;left: 25%;text-align: left;}
}
@media print, screen and (min-width: 511px) and (max-width: 899px) {
/*tablet-style*/
#header_IN .submenu {top:80px;width: 100%;left: 0;;text-align: center;}
} 
/* smartPhone */
@media print, screen and (max-width: 580px) {
/*smart-style*/
#header_IN .submenu {top:80px;width: 100%;left: 0;;text-align: center;}
}



#header_IN .an1 {
	position:absolute;
	top:265px;
	text-align: center;
	left: 0px;
}
#header_IN .an2 {
	position:absolute;
	top:265px;
	text-align: center;
	left: 252px;
}
#header_IN .an3 {
	position:absolute;
	top:265px;
	text-align: center;
	left: 502px;
}
#header_IN .an4 {
	position:absolute;
	top:265px;
	text-align: center;
	right: 0px;
}

#section {
	width:100%;
	overflow: hidden;
	margin: 0 auto;
	clear: both;
	text-align: center;
}
.contents {
	margin: 0 auto;
}
@media print, screen and (min-width: 900px) {
/*pc-style*/
.contents {width: 960px;}
}
@media print, screen and (min-width: 511px) and (max-width: 899px) {
/*tablet-style*/
.contents {width: 100%;}
} 
/* smartPhone */
@media print, screen and (max-width: 580px) {
/*smart-style*/
.contents {width: 100%;}
}




#footer {
	width:100%;
	clear: both;
	overflow: hidden;
	margin: 0 auto;
	background-position: 0 0;
	background-repeat: no-repeat;
	padding: 50px 0 0 0;
	font-size: 16px;
}
#footer_menu {
	clear: both;
	margin: 0 auto 50px;
	overflow: hidden;
}
@media print, screen and (min-width: 900px) {
/*pc-style*/
#footer_menu {width: 960px;}
}
@media print, screen and (min-width: 511px) and (max-width: 899px) {
/*tablet-style*/
#footer_menu {width: 100%;}
} 
/* smartPhone */
@media print, screen and (max-width: 580px) {
/*smart-style*/
#footer_menu {width: 100%;}
}


#footer_menu_logo {
	float: left;
	width: 180px;
}
.footer_box {
	overflow: hidden;
	text-align: left;
	margin: 0 0 30px 0;
}
.footer_box p {
	margin: 0 0 8px 0;
	clear: both;
	overflow: hidden;
	border-bottom: 1px solid #c2c5ba;
	padding: 0 0 6px 0;
}
.footer_box_title {
	margin: 0 0 30px 0;
	clear: both;
	overflow: hidden;
	padding: 0 0 30px 0;
	background-image: url(images-sun/bdbd.png);
	background-position: left bottom;
	background-repeat: no-repeat;
}
#footer_profile {
	clear: both;
	overflow: hidden;
	text-align: left;
	font-size: 9px;
	padding: 20px 25px 0;
	background-image: url(images-sun/footerbg.png);
	background-repeat: no-repeat;
	background-position: left bottom;
}
#footer_profile_l {
	overflow: hidden;
	text-align: left;
}
@media print, screen and (min-width: 900px) {
/*pc-style*/
#footer_profile_l {width: 78%;float: right;}
}
@media print, screen and (min-width: 511px) and (max-width: 899px) {
/*tablet-style*/
#footer_profile_l {width: 100%;float: none;}
} 
/* smartPhone */
@media print, screen and (max-width: 580px) {
/*smart-style*/
#footer_profile_l {width: 100%;float: none;}
}






#footer_profile_l ul {
	margin: 0 0 0 -12px;;padding: 0;
}
#footer_profile_l ul li {
	width: 150px;
	margin: 0 0 20px 12px;
	float: left;
	text-align: center;
}

#footer_profile_r {
	margin: 0 auto;
	background-image: url(images-sun/footerbg2.png);
	background-repeat: no-repeat;
	clear: both;
}
@media print, screen and (min-width: 900px) {
/*pc-style*/
#footer_profile_r {width: 840px;padding: 0 0 0 130px;}
}
@media print, screen and (min-width: 511px) and (max-width: 899px) {
/*tablet-style*/
#footer_profile_r {width: 100%padding: 0 0 0 0;;}
} 
/* smartPhone */
@media print, screen and (max-width: 580px) {
/*smart-style*/
#footer_profile_r {width: 100%;padding: 0 0 0 0;}
}




#footer_profile p {
	clear: both;
	padding: 0;
	margin:0;
	font-size: 11px;
}
#footer_copy {
	clear: both;
	text-align: right;
	font-size: 8px;
	margin: 20px 0 0 0;
}



.def {
	clear: both;
	overflow: hidden;
}







/*------------------------------------*\
    SuperBox
\*------------------------------------*/
*,
*:after,
*:before {
	margin:0;
	padding:0;
	box-sizing:border-box;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-font-smoothing:antialiased;
	-moz-font-smoothing:antialiased;
	-o-font-smoothing:antialiased;
	font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}
/* SuperBox */
.superbox-list {
	display:inline-block;
	*display:inline;
	zoom:1;
	width:50%;
}
.superbox-img {
	max-width:95%;
	width:95%;
	cursor:pointer;
}
.superbox-show {
	text-align:center;
	position:relative;
	width:100%;
    float:left;
	padding:50px 25px 25px 25px;
	display:none;
}
.superbox-current-img {
	max-width:100%;
}

.superbox-float {
	float:left;
}
.superbox-close {
	opacity:0.5;
	cursor:pointer;
	position:absolute;
	top:15px;
	right:50px;
	background:url(js/close.gif) no-repeat center center;
	width:40px;
	height:40px;
}
.superbox-close:hover {
}






#Price {
	overflow: hidden;
	background-image: url(images-sun/bg-price.png);
	background-position: 0 0;
}
#Garage {
	overflow: hidden;
	background-image: url(images-sun/bg-garage.png);
	background-position: 0 0;
}
#Safety {
	overflow: hidden;
	background-image: url(images-sun/bg-safety.png);
	background-position: 0 0;
}
#Pickup {
	overflow: hidden;
	background-image: url(images-sun/bg-pickup.png);
	background-position: 0 0;
}

.gunma {
	overflow: hidden;
	background-position: 0 0;
	padding: 50px 0 30px 0;
	background-repeat: no-repeat;
}
.expl-out {
	overflow: hidden;
	margin: 0 0 0 -20px;
	clear: both;
}
.expl {
	float: left;
	width: 294px;
	margin: 0 0 0 30px;
	text-align: left;
}
.custome {
	overflow: hidden;
	background-image: url(images-sun/garage_30b.png);
	background-repeat: no-repeat;
	background-position: left bottom;
	padding: 0 0 50px 0;
	margin: 0 0 70px 0;
}
.radius {
	-moz-border-radius: 10px; /* Firefox */
	-webkit-border-radius: 10px; /* Safari and Chrome */
	border-radius: 10px;
	behavior: url(border-radius.htc); /* IE */
	background-color: #FFF;
	margin: 0 15px 50px;
	padding: 30px;
	overflow: hidden;
}
.g-photo {
	float: left;
	width: 410px;
}
.g-add {
	float: right;
	width: 417px;
	text-align: left;
}
.g-tel {float: left;width: 484px;text-align: left;}
@media print, screen and (min-width: 900px) {
/*pc-style*/
.g-tel {float: left;width: 50%;text-align: left;}
}
@media print, screen and (min-width: 511px) and (max-width: 899px) {
/*tablet-style*/
.g-tel {float: left;width: 50%;text-align: left;}
} 
/* smartPhone */
@media print, screen and (max-width: 580px) {
/*smart-style*/
.g-tel {float: none;width: 100%;text-align: left;}
}



.g-form {
	float: right;
	width: 417px;
}
@media print, screen and (min-width: 900px) {
/*pc-style*/
.g-form {float: right;width: 44%;text-align: left;margin: 0;}
}
@media print, screen and (min-width: 511px) and (max-width: 899px) {
/*tablet-style*/
.g-form {float: right;width: 44%;text-align: left;margin: 0;}
} 
/* smartPhone */
@media print, screen and (max-width: 580px) {
/*smart-style*/
.g-form {float: none;width: 100%;text-align: center;margin: 30px 0 0;}
}




#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 77%;
}
#page-top a {
    background: #fff;
    text-decoration: none;
    color: #666;
    width: 100px;
    padding: 30px 0;
    text-align: center;
    display: block;
    border-radius: 50px;
}

.hito1 {
	overflow: hidden;
	background-image: url(images-sun/hito1.png);
	background-repeat: no-repeat;
	background-position: 0 0;
	height: 450px;
}
.hito2 {
	float: left;
	width: 331px;
	margin: 0 0 0 70px;
}
.hito3 {
	float: right;
	width: 470px;
	margin: 100px 70px 0 0;
	text-align: left;
}





@media print, screen and (min-width: 900px) {
/*pc-style*/
.kr {width: 50%; float: left; margin: 0 0 2% 0;}
}
@media print, screen and (min-width: 511px) and (max-width: 899px) {
/*tablet-style*/
.kr {width: 50%; float: left; margin: 0 0 2% 0;}
} 
/* smartPhone */
@media print, screen and (max-width: 580px) {
/*smart-style*/
.kr {width: 100%; float: none; margin: 0 0 2% 0;}
}



@media print, screen and (min-width: 900px) {
/*pc-style*/
.kns-out {width: 100%; overflow: hidden; margin: 0 -2% 4% 0;}
}
@media print, screen and (min-width: 511px) and (max-width: 899px) {
/*tablet-style*/
.kns-out {width: 100%; overflow: hidden; margin: 0 -2% 4% 0;}
} 
/* smartPhone */
@media print, screen and (max-width: 580px) {
/*smart-style*/
.kns-out {width: 100%; overflow: hidden; margin: 0 -2% 3% 0;}
}
@media print, screen and (min-width: 900px) {
/*pc-style*/
.kns {width: 31%; float: left; margin: 0 2% 3% 0;}
}
@media print, screen and (min-width: 511px) and (max-width: 899px) {
/*tablet-style*/
.kns {width: 31%; float: left; margin: 0 2% 3% 0;}
} 
/* smartPhone */
@media print, screen and (max-width: 580px) {
/*smart-style*/
.kns {width: 31%; float: left; margin: 0 2% 2% 0;}
}





.fsb {
	font-size: 150%;
	line-height: 1;
}

ul.navi {
	width: 100%;display:table;
	margin: 0 auto;table-layout: fixed;
	
}
ul.navi li {
	list-style-type: none;
	display: table-cell;
}




.bg-pink {
	overflow: hidden;
	background-color: #ddd3bc;
	padding: 7% 0;
}
.bg-beige {
	overflow: hidden;
	background-color: #f3f5e8;
	padding: 7% 0;
}
.bg-pink2 {
	overflow: hidden;
	background-color: #eed7d6;
	padding: 7% 0;
}

.room-l {
	float: left;
	width: 49%;margin: 0 0 30px 0;
}
.room-r {
	float: right;
	width: 49%;margin: 0 0 30px 0;
}
.txt-gr {
	color: #666;
	margin: 0 0 30px 0;
	line-height: 1.5;
}
@media print, screen and (min-width: 900px) {
/*pc-style*/
.txt-gr {font-size: 110%;font-weight: 400;}
}
@media print, screen and (min-width: 511px) and (max-width: 899px) {
/*tablet-style*/
.txt-gr {font-size: 110%;font-weight: 400;}
} 
/* smartPhone */
@media print, screen and (max-width: 580px) {
/*smart-style*/
.txt-gr {font-size: 55%;font-weight: 700;}
}



@media print, screen and (min-width: 900px) {
/*pc-style*/
.txt-h {font-size: 80%; line-height: 1.4;}
}
@media print, screen and (min-width: 511px) and (max-width: 899px) {
/*tablet-style*/
.txt-h {font-size: 80%; line-height: 1.4;}
} 
/* smartPhone */
@media print, screen and (max-width: 580px) {
/*smart-style*/
.txt-h {font-size: 45%;; line-height: 1.4;}
}


@media print, screen and (min-width: 900px) {
/*pc-style*/
.txt-h2 {font-size: 100%; line-height: 2;font-weight: 400;}
}
@media print, screen and (min-width: 511px) and (max-width: 899px) {
/*tablet-style*/
.txt-h2 {font-size: 100%; line-height: 2;font-weight: 400;}
} 
/* smartPhone */
@media print, screen and (max-width: 580px) {
/*smart-style*/
.txt-h2 {font-size: 47%;; line-height: 2;font-weight: 700;}
}

ul.grworks {flex-wrap: wrap; width:100%; height:auto;
	display: flex; gap: 30px 2%;
	padding: 0;list-style-type: none;
	margin: 0;
}
ul.grworks li{padding: 0;
	width: 49%;
	margin: 0;
	text-align: center;
}
ul.grworks li img{width:100%; height:auto;
	margin: 0 0 5px 0;
}



.body-bg {background: url(images/pet/bg00.png) no-repeat top center; background-size: 100%; position: fixed; left: 0%; width: 100%; z-index: 1; min-height: 900px;}

@media print, screen and (max-width: 1100px) {.body-bg { width: 110%; left: 5%; z-index: -1;}}

.p-r-z-2 {position: relative; z-index:2;}
.title-img {margin: 0 auto 30px; padding: 0; max-width:600px;}
.chara-img {margin: 0 auto 30px; padding: 0; max-width:300px;}


section {position: relative; z-index: 2;
	  padding: 2rem 1rem;
	  max-width: 1100px;
	  margin: auto;
	}
.bg-pet01 {
	  background-color: #e0e9e0;
	}
.bg-pet02 {padding: 50px 16px; position: relative; z-index:2;
	  background: #f9f9f9;
	  border-radius: 10px;
	  overflow: hidden;
	  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
	}
	h1, h2 {font-size:200%; font-weight: 700; line-height: 2;
	  color: #4a7c59;
	  margin-bottom: 1rem;
}
.wide01 {width: 100%;}
	.grid-2, .grid-3, .grid-4 {height: 100%;
	  display: grid;
	  gap: 1.5rem;
	  align-items:stretch
	}
	.grid-2 {
	  grid-template-columns: repeat(2, 1fr);
	}
	.grid-3 {
	  grid-template-columns: repeat(3, 1fr);
	}
	.grid-4 {
	  grid-template-columns: repeat(4, 1fr);
	}
	.card {padding: 50px 16px; position: relative; z-index:2;
	  background: #f9f9f9;
	  border-radius: 10px;
	  overflow: hidden;
	  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
	}
	.card img {
	  width: 76%; margin: 0 auto;
	  height: auto;
	  display: block;
	}
	.card-content {
	  padding: 1rem;
	}
	.works {position: relative; z-index:2;
	  overflow: hidden; height: 100%; min-height: 400px;
	}
	.works img{
	  border-radius: 10px;
	}
	.btn-area {
	  text-align: center;
	  margin: 2rem 0;
	}
	.btn {
	  display: inline-block;
	  background: #6ab47b;
	  color: #fff;
	  padding: 0.8rem 1.5rem;
	  border-radius: 5px;
	  text-decoration: none;
	  margin: 0.5rem;
	  transition: background 0.3s;
	}
	.btn:hover {
	  background: #4a7c59;
	}
	footer {
	  background: #333;
	  color: #fff;
	  text-align: center;
	  padding: 1rem;
	  margin-top: 2rem;
	}

	/* レスポンシブ */
	@media (max-width: 768px) {
		.wide01 {width: 86%; margin: 0 auto;}
	  .grid-2, .grid-3 {
		grid-template-columns: 1fr;
		}
	.grid-4 {
		grid-template-columns: repeat(2, 1fr);
		}
	}
.fs01 {font-weight: 700; letter-spacing: 0.05em;
	  font-size: 140%;
	}