@charset "UTF-8";
/* CSS Document */

body{
	-webkit-text-size-adjust: 100%;
	font-size:14px;
	position:relative;
	background:#000;
	color:#fff;
}

body::before{
	content:"";
	display:block;
	left:0;
	top:0;
	width:100%;
	height:100%;
	position:absolute;
	background:url(css_img/bgBody.svg);
	background-size:5px;
	opacity:0.2;
}

strong {
	color:#FFC559;
}

.clear{
clear:both;
}

.clearfix:after{
	clear:both;
	display:block;
	visibility:hidden;
	content:" ";
	height:0;
}

.photo {
	margin-bottom:35px;
}

img {
	max-width:100%;
	height:auto;
}

.btm{
	display:block;
	padding:0.72em 0.92em;
	text-align:center;
	background:#666666;
	color:#fff;
	cursor:pointer;
	font-size:1.1em;
	transition-property:background-color;
	transition-duration:0.3s;
	transition-timing-function:ease-in-out;
	transition-delay:0s;
}
.btm:hover{
	background:#048F80;
}

/*テキスト強調*/
.txtImpact01 {
	text-align:center;
	font-weight:bold;
	font-size:2.2em!important;
	color:#FFC559;
}

/*テキストの右寄り*/
.txtRight {
	text-align:right;
}

/*フォーム設定*/

input{}

input.formDisa {
	background-color:#999999!important;
}
input.check {
	background:#FFD383!important;
}

input[type="text"],
input[type="tel"],
input[type="email"],
input[type="password"],
input[type="button"],
input[type="reset"],
input[type="submit"],
input[type="search"],
select,
button,
textarea,
input[type="radio"]{
	background:#f1f3f5;
	-webkit-appearance:none;
	box-sizing:border-box;
	transition-property:background-color;
	transition-duration:0.3s;
	transition-timing-function:ease-in-out;
	transition-delay:0s;
}

input{}
input[type="text"],
input[type="tel"],
input[type="email"],
input[type="password"],
input[type="button"],
input[type="reset"],
input[type="submit"],
input[type="search"],
select,
button,
textarea{
	width:100%;
	padding:0.8em 1em;
	border-radius: 0px;        /* CSS3草案 */  
	-webkit-border-radius: 0px;    /* Safari,Google Chrome用 */
	-moz-border-radius: 0px;   /* Firefox用 */

}

select {
	background-image:url(css_img/partsSelectIcn.svg);
	background-repeat:no-repeat;
	background-position:right center;
}

input[type="radio"] {
	width:35px;
	height:35px;
	border-radius: 35px;        /* CSS3草案 */  
	-webkit-border-radius: 35px;    /* Safari,Google Chrome用 */
	-moz-border-radius: 35px;   /* Firefox用 */
}


form{}

form .itemContact{
	padding:23px 0;
}
form .itemContact .line_2 {
	float:left;
	width:50%;
	padding:0 0.5em;
	box-sizing:border-box;
}
form .itemContact p{
	font-size:0.98em!important;
	margin-bottom:10px!important;
}
form .itemContact li{
	float:left;
	margin-right:25px;
}

form .itemContact li input[type="radio"]{
	float:left;
	position:relative;
}
form .itemContact li input[type="radio"].checked::before{
	content:"";
	position:absolute;
	width:21px;
	height:21px;
	background:#209E91;
	left:7px;
	top:7px;
	border-radius: 21px;        /* CSS3草案 */  
	-webkit-border-radius: 21px;    /* Safari,Google Chrome用 */
	-moz-border-radius: 21px;   /* Firefox用 */
}
form .itemContact .txtLine {
	height:35px;
	line-height:35px;
	display:block;
	float:left;
	padding-left:10px;
	font-size:1.1em;
}
form input[type="button"],
form input[type="reset"],
form input[type="submit"],
button {
	background:#209E91;
	color:#fff;
	text-align:left;
	padding-left:35px;
	background-repeat:no-repeat;
	background-position:right center;
	cursor:pointer;
}
form input[type="submit"],
form button[type="submit"]{
	background-image:url(css_img/iconBtmMail_submit.svg);
}


/*メールフォーム確認画面*/

form .boxFormCheck{
	padding:1.0em 1.3em;
	border:solid 1px #ccc;
	margin-bottom:35px;
	background:#000000;
}

form .boxFormCheck dl{
	border-bottom:solid 1px #999;
	padding:1.3em 0;
}

form .boxFormCheck dt{
	color:#68CAC0;
	margin-bottom:5px;
}
form .boxFormCheck dd{
	padding-left:1.1em;
}

/*エラー項目表示設定*/
form .listErrorForm {
	margin-bottom:35px;
	border:solid 1px #FE8A33;
	background:#000;
	padding:0.8em 1.3em;
}

form .listErrorForm li {
	color:#FE8A33;
	padding:1.2em 0 1.2em 35px;
	position:relative;
	font-size:1.11em;
}
form .listErrorForm li::before {
	content:"!";
	text-align:center;
	line-height:25px;
	color:#fff;
	font-size:1.08em;
	font-family:'Questrial', sans-serif;
	font-weight:bold;
	display:block;
	background:#FE8A33;
	width:25px;
	height:25px;
	position:absolute;
	left:0;
	top:1em;
	border-radius: 25px;        /* CSS3草案 */  
	-webkit-border-radius: 25px;    /* Safari,Google Chrome用 */
	-moz-border-radius: 25px;   /* Firefox用 */
}

#wrap {
	position:relative;
}

/* ウィンドウ幅が768px以下の場合に適用するCSS */
@media screen and ( max-width:768px ){
	
	form .itemContact .line_2 {
		float:none;
		width:auto;
		padding:0.5em 0;
	}
	
}

/*********************************************************************
#scrNavSm
*********************************************************************/

#scrNavSm {
	position:fixed;
	left:0;
	top:0;
	width:100%;
	z-index:45;
	display:none;
}
#scrNavSm.show {height:100%;}

#scrNavSm .btmScr {
	position:absolute;
	cursor:pointer;
	right:20px;
	top:17px;
	width:42px;
	height:42px;
	/*background:#ffffffee;*/
	border-radius: 42px;        /* CSS3草案 */  
	-webkit-border-radius: 42px;    /* Safari,Google Chrome用 */
	-moz-border-radius: 42px;   /* Firefox用 */
	z-index:48;
}

#scrNavSm .btmScr li {
	width:20px;
	height:0;
	padding-top:2px;
	background:#ccc;
	position:absolute;
	left:11px;
	transition-property: top -moz-transform -webkit-transform -o-transform -ms-transform transform;
	transition-duration:0.3s;
	transition-timing-function:ease-in-out;
	transition-delay:0s;
}
#scrNavSm .btmScr.close li {
	background:#fff;
}

#scrNavSm .btmScr li.p01 {
	top:11px;
}
#scrNavSm .btmScr li.p02 {
	top:20px;
}
#scrNavSm .btmScr li.p03 {
	top:29px;
}

#scrNavSm .btmScr.close {
	background:#68CAC0;
}

#scrNavSm .btmScr.close li.p01 {
	top:20px;
	-moz-transform:    rotate( 45deg );  /* Firefox用 */
	-webkit-transform: rotate( 45deg );  /* Chrome,Safari,新しいOpera用 */
	-o-transform:      rotate( 45deg );  /* 古いOpera用 */
	-ms-transform:     rotate( 45deg );  /* IE9用 */
	transform:         rotate( 45deg );  /* CSS3の書き方 */
}

#scrNavSm .btmScr.close li.p02 {
	-moz-transform:    rotateY( 90deg );  /* Firefox用 */
	-webkit-transform: rotateY( 90deg );  /* Chrome,Safari,新しいOpera用 */
	-o-transform:      rotateY( 90deg );  /* 古いOpera用 */
	-ms-transform:     rotateY( 90deg );  /* IE9用 */
	transform:         rotateY( 90deg );  /* CSS3の書き方 */
}

#scrNavSm .btmScr.close li.p03 {
	top:20px;
	-moz-transform:    rotate( -45deg );  /* Firefox用 */
	-webkit-transform: rotate( -45deg );  /* Chrome,Safari,新しいOpera用 */
	-o-transform:      rotate( -45deg );  /* 古いOpera用 */
	-ms-transform:     rotate( -45deg );  /* IE9用 */
	transform:         rotate( -45deg );  /* CSS3の書き方 */
}

#scrNavSm .navMenu {
	z-index:45;
	position:relative;
	display:none;
}

#scrNavSm.show .navMenu {
	display:block;
	overflow-y:scroll;
	max-height:100%;
}

#scrNavSm .navMenu ul {
	padding:35px 10px 10px 20px;
	width:100%;
	max-height:100%;
	oveflow-y:scroll;
	box-sizing:border-box;
	font-family: 'Questrial', sans-serif;
}
#scrNavSm .navMenu > ul {
}
#scrNavSm .navMenu li {
	padding:15px 0;
	font-weight:bold;
	font-size:1.21em;
}
#scrNavSm .navMenu li a {
	color:#68CAC0;
}
#scrNavSm .navMenu li li {
	font-size:0.91em;
	padding:0.3em 0;
}
#scrNavSm .navMenu li li a{
	color:#fff;
}

#scrNavSm .navMenu ul ul {
	padding:0px 10px 0px 30px;
	margin:10px 0 20px 1em;
	border-left:solid 1px #209E91;
}

#scrNavSm .wall {
	background:#000000ee;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	display:none;
}

#scrNavSm.show .wall {
	display:block;
}

/* ウィンドウ幅が992px以下の場合に適用するCSS */
@media screen and ( max-width:992px ){
	#scrNavSm {
		display:block;
	}
}


/* ウィンドウ幅が768px以下の場合に適用するCSS */
@media screen and ( max-width:768px ){
	
	#scrNavSm .btmScr {
		right:10px;
		top:3px;
		width:42px;
		height:42px;
		border-radius: 42px;        /* CSS3草案 */  
		-webkit-border-radius: 42px;    /* Safari,Google Chrome用 */
		-moz-border-radius: 42px;   /* Firefox用 */
	}
	
}

/*********************************************************************
#header
*********************************************************************/

#header {
	height:93px;
	/*position:relative;*/
	position:fixed;
	left:0;
	top:0;
	width:100%;
	z-index:30;
	background:#006E63ff;
	border-bottom:solid 1px #fff;
	transition-property: height top;
	transition-duration:0.3s;
	transition-timing-function:ease-in-out;
	transition-delay:0s;
}

#header.pageTop{}

#header h1 {
	position:absolute;
	left:25px;
	top:25px;
	width:170px;
	height:45px;
	opacity:0.7;
	transition-property: width padding-top top;
	transition-duration:0.6s;
	transition-timing-function:ease-in-out;
	transition-delay:0s;
}
#header h1 a {
	background:url(css_img/siteLog.svg) no-repeat left top;
	background-size:100%;
	display:block;
	width:100%;
	height:0;
	padding-top:45px;
	overflow:hidden;
}

#header.pageTop h1 {
}

#header #gnavi {
	position:absolute;
	right:20px;
	top:30px;
	font-family: 'Questrial', sans-serif;
}
#header #gnavi li {
	float:left;
	padding:0 15px;
	font-size:1.3em;
	position:relative;
}
#header #gnavi li a {
	color:#fff;
	display:block;
	padding:0.3em 1.1em;
	transition-property: background-color, color;
	transition-duration:0.3s;
	transition-timing-function:ease-in-out;
	transition-delay:0s;
}
#header #gnavi li a:hover {
	background:#3DB1A5dd;
}
#header.pageTop #gnavi li a {
	color:#ffffff;
}


#header #gnavi li.linkLogin {
	position:relative;
}
#header #gnavi li.linkLogin a {
	position:absolute;
	right:75px;
	top:-9px;
	width:55px;
	height:0;
	padding:55px 0 0 0;
	overflow:hidden;
	background:url(css_img/btmMenuLogin.svg) no-repeat left top;
	background-size:100%;
	opacity:0.6;
	transition-property: opacity;
	transition-duration:0.3s;
	transition-timing-function:ease-in-out;
	transition-delay:0s;
}
#header #gnavi li.linkLogin a:hover {
	opacity:1;
}

#header #gnavi li ul {
	position:absolute;
	right:25px;
	top:2.2em;
	width:250px;
	background:#000000cc;
	display:none;
}
#header #gnavi li.show > ul {
	display:block;
}

#header #gnavi li li {
	float:none;
	padding:0;
	font-size:0.9em;
	text-align:center;
}
#header #gnavi li li a {
	padding:0.8em 0.5em;
	border-bottom:solid 1px #ffffff99;
	overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#header #gnavi li ul ul {
	right:250px;
	top:0;
}
#header #gnavi li li li {
	font-size:1.0em;
}


/* ウィンドウ幅が992px以下の場合に適用するCSS */
@media screen and ( max-width:992px ){
	#header {
		height:80px;
	}
	
	#header #gnavi{
		display:none;
	}
	
	#header h1 {
		width:140px;
		/*padding-top:35px;
		top:23px;*/
	}
}


/* ウィンドウ幅が768px以下の場合に適用するCSS */
@media screen and ( max-width:768px ){
	
	#header {
		height:50px;
	}
	
	#header h1 {
		width:77px;
		/*padding-top:22px;*/
		top:14px;
		left:10px;
	}
	
}


/*********************************************************************
#contents
*********************************************************************/

#contents {
	padding-top:93px;
}

#contents p {
	margin-bottom:2.5em;
	font-size:1.15em;
}

#contents .boxTtl {
	margin-bottom:35px;
}

#contents h2 {
	text-align:center;
	margin-bottom:15px;
	color:#3DB1A5;
	font-family: 'Questrial', sans-serif;
	font-size:2.12em;
}


#contents h3 {
	text-align:center;
	margin-bottom:65px;
	color:#ccc;
	font-family: 'Questrial', sans-serif;
	font-size:1.81em;
}

#contents .frameContbox {
	padding-top:55px;
	padding-bottom:55px;
}

#contents .wideFrame {
	width:992px;
	margin-left:auto;
	margin-right:auto;
}

/*下層ページタイトル*/
#contents #ttlPage {
	position:relative;
	padding-top:19%;
	overflow:hidden;
}
#contents #ttlPage .photo{
	width:100%;
	position:absolute;
	left:0;
	bottom:0;
}
#contents #ttlPage h2{
	position:absolute;
	left:0;
	bottom:0;
	width:100%;
	font-size:1.57em;
	padding:10px 10px;
	margin:0;
	box-sizing:border-box;
	color:#fff;
	/*background:#006E63cc;*/
	background:#006E63cc;
	z-index:10;
}

#contents .listIcon {
	width:992px;
	margin-left:auto;
	margin-right:auto;
	padding:30px 0;
}
#contents .listIcon li,
#contents .listIcon dl {
	text-align:center;
	width:25%;
	float:left;
}
#contents .listIcon li a,
#contents .listIcon li .frame,
#contents .listIcon .icon .frame {
	display:block;
	background:#3DB1A5;
	width:150px;
	height:150px;
	margin:0 auto 15px;
	box-sizing:border-box;
	padding:25px;
	border-radius: 150px;        /* CSS3草案 */  
	-webkit-border-radius: 150px;    /* Safari,Google Chrome用 */
	-moz-border-radius: 150px;   /* Firefox用 */
}
#contents .listIcon li a img,
#contents .listIcon li .frame img,
#contents .listIcon .icon .frame img {
	width:100%;
	height:auto;
}

#contents .listIcon li .ttl {}

/* ウィンドウ幅が992px以下の場合に適用するCSS */
@media screen and ( max-width:992px ){
	
	#contents {
		padding-top:81px;
	}

	#contents .wideFrame {
		width:auto;
		box-sizing:border-box;
		padding:10px 15px;
	}
	#contents #ttlPage .photo{
		width:150%;
		left:-25%;
		bottom:0;
	}
	
	#contents .listIcon {
		width:auto;
	}
	
	#contents .listIcon li {
		width:50%;
		margin-bottom:25px;
	}
	
	/*下層ページタイトル*/
	#contents #ttlPage {
		padding-top:23%;
	}
	#contents #ttlPage .photo{
		width:200%;
		left:-50%;
		bottom:0;
	}
	
	

	#contents .frameContbox {
		padding-top:25px;
		padding-bottom:25px;
	}
	
}

/* ウィンドウ幅が768px以下の場合に適用するCSS */
@media screen and ( max-width:768px ){

	#contents {
		padding-top:51px;
	}
	
	#contents .boxTtl {
		margin-bottom:45px;
	}
	
	#contents .listIcon li {
		width:auto;
		float:none;
	}
	
	/*下層ページタイトル*/
	#contents #ttlPage {
		padding-top:41%;
	}
}

/*********************************************************************
#footer
*********************************************************************/

#footer {
	height:543px;
	color:#cfd0d0;
	background:rgba(0,0,0,1) url(css_img/bgFooter.png) no-repeat right bottom;
	position:relative;
}


#footer #groupAddress {
	position:absolute;
	left:95px;
	top:148px;
}

#footer #groupAddress h2 {
	width:214px;
	height:0;
	overflow:hidden;
	padding-top:55px;
	margin-bottom:20px;
	background:url(css_img/logoFoter.svg) no-repeat left top;
	background-size:100%;
	opacity:0.4;
}
#footer #groupAddress p {
	font-size:1.2em;
}


#footer #btmTop,
#footer .dammy {
	position:absolute;
	right:111px;
	top:237px;
}
#footer #btmTop {
	transition-property: opacity top;
	transition-duration:0.6s;
	transition-timing-function:ease-in-out;
	transition-delay:0s;
}
#footer #btmTop.hide {
	top:287px;
	opacity:0;
}
#footer .dammy {
	display:block;
	opacit:0;
}
#footer #btmTop a {
	display:block;
	width:89px;
	height:0;
	overflow:hidden;
	padding-top:99px;
	background:url(css_img/btmScrollTop.svg) no-repeat left top;
	background-size:100%;
}



/* ウィンドウ幅が992px以下の場合に適用するCSS */
@media screen and ( max-width:992px ){
	
	
	#footer #groupAddress {
		left:50%;
		top:100px;
		width:380px;
		margin-left:-190px;
	}
	
	#footer #groupAddress h2 {
		width:100%;
		padding-top:51px;
		margin-bottom:20px;
		background-position:center top;
		background-size:180px;
	}
	#footer #groupAddress p {
		font-size:1.01em;
		text-align:center;
	}
	
	#footer #btmTop,
	#footer .dammy {
		right:auto;
		left:50%;
		top:auto;
		bottom:10px;
		margin-left:-39px;
	}
	#footer #btmTop.hide {
		bottom:-13px;
		opacity:0;
	}
	#footer #btmTop a {
		width:78px;
		padding-top:99px;
	}
	
}

/* ウィンドウ幅が768px以下の場合に適用するCSS */
@media screen and ( max-width:768px ){
	
	#footer {
		height:295px;
		background:rgba(0,0,0,1) url(css_img/bgFooter.png) no-repeat right top;
	}
	
	#footer #groupAddress {
		top:50px;
		width:250px;
		margin-left:-125px;
	}
	#footer #groupAddress h2 {
		padding-top:45px;
	}
	#footer #groupAddress p {
		font-size:0.81em;
		padding-left:1.0em;
	}
	
	#footer #btmTop,
	#footer .dammy {
		left:50%;
		bottom:5px;
		margin-left:-39px;
	}
	#footer #btmTop.hide {
		bottom:-15px;
		opacity:0;
	}
	#footer #btmTop a {
		width:65px;
		padding-top:71px;
	}
	
}