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

.contents {
	width:100%;
	padding-top: 10px;
}

.large-8 {
    width: 100% !important; }

.ht1{
	text-align:left;
	color:#FFFFFF;
	font-size:450%;
	background: none;
	padding:0px 0 20px 30px;
	margin:30px auto 0;
	font-weight:bold;
	width: 990px;
	height: 140px;
	line-height: 90%;
}

.ht1 span.tt1{font-size: 35%;}
.ht1 span.tt2{font-size: 52%;}

.fYellow{ color: #fafd00;}
.ht2{
	padding:0px 0 30px 0;
	font-size: 170%;
	font-weight: bold;
	margin:30px;
	text-align: left;
	border-bottom: #000 solid 1px;
}

div#head{
	background:#000 no-repeat center top url(images/head_bg.jpg);

}

div.Catch{
	background:no-repeat -20px 40px url( images/head_txt.png);
	height: 36em;
}

div.Comein{
	background:#000 no-repeat center top url(images/goodrich_in.jpg);
	height: 270px;
}



div#Comments{
	background-color: #fbfbfb;
}

div#Comments .row{
	background: url(images/tire_track_17.png) no-repeat right top;
	padding: 60px 0 40px;
}

div#Comments h2{
	background: url( images/tt2.png) no-repeat center top;
	overflow: hidden;
    white-space: nowrap;
	padding-top: 52px;
	height: 0px;
}

.tt2_cap{
	color: #8f9100;
	font-size: 2.4em;
	font-weight: bold;
}

div#Comments p{
	font-size: 1.8em;
	padding: 15px 0;
	color: #484848;
}
div#Comments p strong{
	font-size: 1.4em;
}



div#Whiteletter{
	background: url(images/main_bg.jpg) no-repeat center top;
	height: 2360px;
}

div#Whiteletter .inner{
	background: url( images/main_bg2.png) no-repeat center top;
	height: 2360px;
}

/* Responsive */
@media ( min-width : 600px ){
    div#Whiteletter ul {
    	display: -webkit-flex;
    	display: flex;
	 	margin: 125px auto;

    }
}

    div#Whiteletter ul li {
		width: 420px;
		margin: 0 37PX;
		text-align: left;
    }



    div#Whiteletter ul li p{
		padding: 25px;
		font-weight: bold;
		font-size: 1.2em;

    }


    div#Whiteletter ul li a{
		background: url(images/bttn.png) no-repeat center top;
		display: block;
		overflow: hidden;
    	white-space: nowrap;
		padding-top: 71px;
		height: 0px;
		width: 347px;
		margin: 0 auto;
    }



    div#Whiteletter ul li a:hover,
    div#Whiteletter ul li a:focus {
  box-shadow: 0 5px 11px 0 rgba(0,0,0,0.18), 0 4px 15px 0 rgba(0,0,0,0.15);
  -webkit-transition: box-shadow 0.4s ease-out;
  transition: box-shadow 0.4s ease-out;
}






div#Photo{
	background-color: #000;
}

@media ( min-width : 600px ){
    div#Photo ul {
    	display: -webkit-flex;
    	display: flex;
		margin: 10px 0;
    }
}

    div#Photo ul li {
		padding: 0 2px;
    }





/******スマホ用設定全般*******/
@media only screen and (max-width: 640px) {

	
.ht1{
	padding:0px 0 10px 0px;
	height: 100%;
	font-size: 200%;
	margin-top: 80px;
}
	
.ht1 span.tt1{font-size: 45%;}
.ht1 span.tt2{font-size: 40%;}
	
div#head{
	background-size: 220% auto;
	background-position: -430px 0;
}

div.Catch{
	background:no-repeat -30px 20px url( images/head_txt.png);
	background-size: 75%;
	height: 14.8em;
}
.ht1{
	text-align:left;
	color:#FFFFFF;
	font-size:210%;
	background: none;
	font-weight:bold;
	padding: 0;
	margin: 10px 0 10px;
}
.ht1 span.tt2{font-size: 52%;}

	
div.Comein{
	background-size: 180% auto;
	height: 157px;
}



	
	
div#Comments h2{
	background: url( images/tt2.png) no-repeat center top;
	background-size: 80%;
	overflow: hidden;
    white-space: nowrap;
	padding-top: 52px;
	height: 0px;
}
.tt2_cap{
	color: #8f9100;
	font-size: 1.2em;
	font-weight: bold;
}	
div#Comments p{
	font-size: 14px !important;
	padding: 15px 0;
	color: #484848;
}
div#Comments p strong{
	font-size: 1.0em;
}



div#Whiteletter{
	background: url(images/main_bg_sp.jpg) no-repeat center top;
	height: 100%;
}

div#Whiteletter .inner{
	background: url( images/main_bg_sp2.png) no-repeat center top;
	height: 100%;
}
    div#Whiteletter ul {
    	display: block;
		margin:0;
	}
    div#Whiteletter ul li {
		width: 420px;
		margin: 90px auto;
		text-align: left;
    }
    div#Whiteletter ul li p{
		padding: 18px;
		font-weight: bold;
		font-size: 1.2em;

    }

	
    div#Photo ul {
    	display: -webkit-flex;
    	display: flex;
		flex-wrap: wrap;
		margin: 10px 0;
    }
}

    div#Photo ul li {
		padding: 4px;
		width: 50%;
    }


	
}
/******スマホ用*******/






.clearfix:after { /*floatの解除*/
	display:block;
	clear:both;
	height:0px;
	visibility:hidden;
	content:".";
	padding-bottom:15px;
}
.clearfix {
	min-height: 1px; /*IE6、7用のハック*/
}
* html .clearfix {
	height: 1px;
	/*¥*//*/ /*MAC IE5.x用のハック*/
	height: auto;
	overflow: hidden;
	/**/
}

