@charset "utf-8";


/* ======================================================================================================================
  セクション01
====================================================================================================================== */
#section01 {
	background-image: url(../img/section01_bg_pc.jpg);
	background-repeat: no-repeat;
	background-position: center;
 -webkit-background-size: cover;
 -moz-background-size: cover;
 -o-background-size: cover;
 background-size: cover;
	position: relative;
 }
/********* mb *********/
@media only screen and (max-width: 690px) {
#section01 {
	background-image: url(../img/section01_bg_mb.jpg);
 }
}
/********* mb(landscape) *********/
@media only screen and (orientation: landscape) and (max-width: 690px) {
#section01 {
	background-image: url(../img/section01_bg_pc.jpg);
 }
}

/* メインコピー */
#section01 .copyBox {
	width: 90%;
	position: absolute;
	top: 105px;
	left: 30px;
 }
/********* mb *********/
@media only screen and (max-width: 690px) {
#section01 .copyBox {
	max-width: 630px;
	width: 90%;
	top: 10%;
	left: 5%;
 }
}
/********* mb(landscape) *********/
@media only screen and (orientation: landscape) and (max-width: 690px) {
#section01 .copyBox {
	width: 60%;
	top: 20%;
	left: 4%;
 }
}


/* ====================================
  movie playボタン
==================================== */
#section01 .btnPlay {
	width: 320px;
	position: absolute;
	bottom: 110px;
	right: 30px;
	display: none;
 }
/********* mb *********/
@media only screen and (max-width: 690px) {
#section01 .btnPlay {
	width: 56%;
	left: 50%;
	margin-left: -28%;
	bottom: 70px;
 }
}
/********* mb(landscape) *********/
@media only screen and (orientation: landscape) and (max-width: 690px) {
#section01 .btnPlay {
	width: 28%;
	left: inherit;
	right: 4%;
	margin: 0;
	bottom: 60px;
 }
}


/* 詳細メニューボタン */
#section01 .detailMenu ul {
	max-width: 600px;
	width: 100%;
	}
/********* mb *********/
@media only screen and (max-width: 690px) {
#section01 .detailMenu ul {
	max-width: none;
	width: 100%;
	}
}

#section01 .detailMenu li {
	width: 33.33%;
 }

/* 詳細コンテンツ */
/* OPERATIONS */
#section01_detailBoxA .detailImg {
 width: 90%;
	max-width: 1140px;
	margin:0 auto;
	}

/* AWARDS ＆ SAFETY */
.detailPh {
	width: 90%;
	max-width: 842px;
	margin: 0 auto;
	overflow: hidden;
	}

/* 拡大 */
.detailPh .phView {
	width: 74.82%;
	float: right;
	position: relative;
	}
/********* mb *********/
@media only screen and (max-width: 690px) {
.detailPh .phView {
	width: 100%;
	float: none;
	}
}

.detailPh .phView img {
	position: absolute;
	top: 0;
	right: 0;
	}

.detailPh .phView .ph02,
.detailPh .phView .ph03 {
	display: none;
	}

/* サムネイル */
.detailPh .phThumbnail {
	width: 21.61%;
	float: left;
	overflow: hidden;
	}
/********* mb *********/
@media only screen and (max-width: 690px) {
.detailPh .phThumbnail {
	width: 100%;
	float: none;
	overflow: hidden;
	margin-top: 77%;
	}
}

.detailPh .phThumbnail li {
	width: 100%;
	}
/********* mb *********/
@media only screen and (max-width: 690px) {
.detailPh .phThumbnail li {
	width: 30%;
	float: left;
	}
}

.detailPh  li.phThum02 {
	padding:16.7% 0;
	}
/********* mb *********/
@media only screen and (max-width: 690px) {
.detailPh  li.phThum02 {
	padding:0 5%;
	}
}

.detailPh  li a {
	display: block;
	}

/* オンマウスで拡大 */
.detailPh .phThumbnail li img,
.detailPh  li a:focus {
 -webkit-transition: 0.3s ease-in-out;
 -moz-transition: 0.3s ease-in-out;
 -o-transition: 0.3s ease-in-out;
 transition: 0.5s;
	}

.detailPh .phThumbnail li img:hover,
.detailPh  li a:focus {
 -moz-transform: scale(1.1,1.1);
 -webkit-transform: scale(1.1,1.1);
 -o-transform: scale(1.1,1.1);
 -ms-transform: scale(1.1,1.1);
	}

/* アクティブで透過 */
.detailPh .phThumbnail .phBtnOn {
 filter: alpha(opacity=60); 
 -ms-filter: "alpha(opacity=60)";
 -moz-opacity: 0.6;
 -khtml-opacity: 0.6;
 opacity: 0.6;
	}