@charset "utf-8";

	.blocks {
		display: none;
	}

	#block-01 {
		display: block;
	}

#headline .wrap {
	padding-bottom: 90px;
	border-bottom: 1px solid #d2d2d2;
	font-size: 14px;
	line-height: 2.286;
	text-align: center;
}
#headline .text {
	margin: 0 0 55px;
	color: #a78237;
	font-size: 24px;
	letter-spacing: .5em;
	text-align: center;
}

#headline .title {
	height: auto;
	background: none;
	box-shadow: none;
	margin-bottom: 25px;
	padding: 0;
}

.sNav {
	text-align: center;
}
.sNav li {
	display: inline-block;
	margin: 0 0 0 56px;
}
.sNav li:first-child {
	margin: 0;
}
.sNav a,
.sNav strong {
	display: inline-block;
	padding:  15px 24px 30px;
	position: relative;
	font-size: 15px;
	font-weight: normal;
	text-decoration: none;
	line-height: 1;
	transition: 0.5s;
}
.sNav a:hover,
.sNav strong {
	color: #a78237;
}
.sNav a:after,
.sNav strong:after {
	content: '';
	display: block;
	width: 100%;
	height: 2px;
	position: absolute;
	left: 0;
	bottom: 0;
	background: #a78237;
	transform: scaleX(0);
	transition: 0.5s;
}
.sNav a:hover:after,
.sNav strong:after {
	transform: scaleX(1);
}
.sNav.foot {
	border-top: 1px solid #d2d2d2;
	padding-top: 55px;
}

section ,
#headline {
    padding: 0 4.688%;
}
section .wrap {
	padding: 100px 0 90px;
}
#headline .wrap {
	padding: 0px 0 90px;
}
section + section .wrap {
	border-top: 1px solid #d2d2d2;
}
@media screen and (max-width:999px) and (min-width:768px) {
	section .wrap {
		margin: 0 auto;
	}
}

.rMore {
	width: 100%;
	position: absolute;
	left: 0;
	bottom: 40px;
	color: #222;
	font-size: 15px;
	text-align: center;
}
.rMore i {
	margin: 0 8px 0 0;
	transition: transform 1s;
}
 a:hover .rMore i {
	transform: translateX(5px);
}
.rMore span {
	position: relative;
	transition: color 1s;
}
a:hover .rMore span {
	color: #a78237;
}
a .rMore span::after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 0;
  width: 100%;
  height: 2px;
  -webkit-transform: scaleX(0);
  -ms-transform: scaleX(0);
  transform: scaleX(0);
  background-color: #a78237;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
}
a:hover .rMore span::after {
  -webkit-transform: scaleX(1);
  -ms-transform: scaleX(1);
  transform: scaleX(1);
}

	.sp {
		display: none;
	}
@media only screen and (max-width:640px) {
	.pc {
		display: none;
	}
	.sp {
		display: block;
	}

	#headline {
		padding: 0 4.688%;
	}
	#headline .wrap {
		padding: 9.375% 0 12.5%;
		font-size: 12px;
	}
	#headline .wrap .mb60 {
		margin-bottom: 28px;
	}
	#headline .wrap .mb40 {
		margin-bottom: 0px;
	}
	#headline .text {
		margin: 0 0 10.345%;
		font-size: 16px;
	}
	#headline .wrap .clmBox.clm2 {
		margin-top: 0;
	}

	#headline .title {
		margin: 0 0 35px;
		padding: 0;
		background-image: none;
	}
	#pageTitle {
/*
		background-image: url(../imgs/quality/bg-headline.jpg);
		background-position: right;
		box-shadow: inset 0 5px 5px rgba(0,0,0,.2);
*/
	}

	.sNav li {
		width: 27.586%;
		margin: 12.069% 0 0 4.31%;
	}
	.sNav li:nth-child(3n+1) {
		margin-left: 2.155%;
	}
	.sNav li:nth-child(-n+3) {
		margin-top: 0;
	}
	.sNav a,
	.sNav strong {
		display: block;
		padding: 6.25% 0 calc(6.25% + 10px);
		font-size: 12px;
	}
	.sNav a:hover:after {
		transform: scaleX(1);
	}
	#headline .title {
		margin: 0;
		padding: 0;
		background-image: none;
	}
	#pageTitle {
		background-image: url(../imgs/quality/bg-headline.jpg);
		background-position: right;
		box-shadow: inset 0 5px 5px rgba(0,0,0,.2);
	}

	section {
		padding: 0 4.688%;
	}
	section .wrap {
		padding: 13.793% 0;
	}
	section .wrap.last {
		padding-bottom: 13.793%;
	}

	.rMore {
		margin: 5.172% 0 0;
		position: static;
		font-size: 15px;
	}
	 a:hover .rMore i {
		transform: translateX(0);
	}

	.sNav.foot {
		margin:  0 4.688%;
		padding-top: 16.379%;
	}
}

	.pNav {
		text-align: center;
	}
	.pNav.top {
		margin-bottom: 70px;
		border-bottom: solid 1px #d8d8d8;
	}
	.pNav.btm {
		border-top: solid 1px #d8d8d8;
	}
	.pNav li {
		position: relative;
		display: inline-block;
		width: auto;
	}
	.pNav.top li {
		vertical-align: bottom;
	}
	.pNav li:before {
		content: "";
		position: absolute;
		left: 0;
		width: 100%;
		height: 1px;
		border-left: solid 1px #ededed;
		border-right: solid 1px #ededed;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
			transition: 0.5s;
	}
	.pNav li.on:before,
	.pNav li:hover:before {
		background: #fff;
		border: none;
	}
	.pNav.top li:before {
		bottom: -1px;
	}
	.pNav.btm li:before {
		top: -1px;
		transition: 0.5s;
	}
	.pNav li.e4ldk {
		margin-left: 30px;
	}
	.pNav li a {
		position: relative;
		display: inline-block;
		background: #ededed;
		transition: 0.5s;
	}
	.pNav li.on a {
		cursor: default;
	}
	.pNav li.on a,
	.pNav li a:hover {
		background: #fff;
	}
	.pNav.top li a {
		border-top: solid 1px #ededed;
		border-left: solid 1px #ededed;
		border-right: solid 1px #ededed;
		vertical-align: bottom;
	}
	.pNav.top li.on a,
	.pNav.top li a:hover {
		border-top: solid 1px #d8d8d8;
		border-left: solid 1px #d8d8d8;
		border-right: solid 1px #d8d8d8;
	}
	.pNav.btm li a {
		border-bottom: solid 1px #ededed;
		border-left: solid 1px #ededed;
		border-right: solid 1px #ededed;
	}
	.pNav.btm li.on a,
	.pNav.btm li a:hover {
		border-bottom: solid 1px #d8d8d8;
		border-left: solid 1px #d8d8d8;
		border-right: solid 1px #d8d8d8;
	}
	.pNav li img {
		vertical-align: top;
	}
	.pNav.top li img {
		vertical-align: bottom;
	}
@media screen and (max-width:959px) {
	.pNav li.e4ldk {
		margin-left: 0.7%;
	}
	.pNav li {
		max-width: 308px;
		width: 49%;
	}
}
@media only screen and (max-width:700px) {
	.pNav {
		padding-left: 10px;
		padding-right: 10px;
	}
	.pNav li {
		width: 49%;
	}
	.pNav li.e4ldk {
		margin-left: 0.7%;
	}
	.pNav li a img {
		width: 100%;
	}
}

	.image img {
		vertical-align: top;
	}

	.logo {
		position: relative;
		padding-top: 65px;
	}
	.logo::before {
		content: url("../imgs/img-01.png");
		position: absolute;
		top: -20px;
		right: 50%;
		margin-right: 187px;
	}
@media only screen and (max-width: 640px) {
	.logo {
		padding-top: 20px;
	}
	.logo::before {
		content: url("../imgs/img-01.png");
		display: block;
		position: static;
		margin-top: 0px;
		margin-bottom: 10px;
		margin-left: auto;
		margin-right: auto;
	}
}

	.mw660 {
		max-width: 660px;
		margin-left: auto;
		margin-right: auto;
	}
	.mw920 {
		max-width: 920px;
		margin-left: auto;
		margin-right: auto;
	}

	.Stg {
		position: relative;
		margin-bottom: 10px;
		padding-top: 65px;
		padding-left: 110px;
		font-size: 22px;
		font-weight: bold;
		line-height: 1;
		vertical-align: bottom;
	}
	section#common .Stg {
		margin-top: -35px;
		margin-bottom: 20px;
	}
	#mainContent section p.Stg {
		color: #aa8420;
	}

	.Stg:after {
		position: absolute;
		top: 0;
		right: 20px;
	}
	.Stg.Numb1 { background: url(../imgs/h-01.png) no-repeat top left;}
	.Stg.Numb1:after { content: url("../imgs/icn-01.png");}
	.Stg.Numb2 { background: url(../imgs/h-02.png) no-repeat top left;}
	.Stg.Numb2:after { content: url("../imgs/icn-02.png");}
	.Stg.Numb3 { background: url(../imgs/h-03.png) no-repeat top left;}
	.Stg.Numb3:after { content: url("../imgs/icn-03.png");}
	.Stg.Numb4 { background: url(../imgs/h-04.png) no-repeat top left;}
	.Stg.Numb4:after { content: url("../imgs/icn-04.png");}

	.mw920 .Stg.Numb1:after { top: 20px; right: 55px;}
	.mw920 .Stg.Numb2:after { top: 20px; right: 20px;}
	.mw920 .Stg.Numb3:after { top: 20px; right: 10px;}
	.mw920 .Stg.Numb4:after { top: 20px; right: 40px;}
@media only screen and (max-width: 960px) {
	.Stg:after {
		position: absolute;
		top: 0;
		right: 0;
	}
	.mw920 .Stg.Numb1:after,
	.mw920 .Stg.Numb2:after,
	.mw920 .Stg.Numb3:after,
	.mw920 .Stg.Numb4:after {
		top: 20px;
		right: 0;
	}
}
@media only screen and (max-width: 640px) {
	.Stg {
		padding-top: 55px;
		padding-bottom: 55px;
		padding-left: 0;
		text-align: center;
		font-size: 16px;
	}
	.Stg:after {
		display: block;
		/*position: static;*/
		margin-top: 15px;
	}
	.Stg.Numb1 { background: url(../imgs/h-01.png) no-repeat center left;}
	.Stg.Numb2 { background: url(../imgs/h-02.png) no-repeat center left;}
	.Stg.Numb3 { background: url(../imgs/h-03.png) no-repeat center left;}
	.Stg.Numb4 { background: url(../imgs/h-04.png) no-repeat center left;}
	.Stg.Numb1:after,
	.Stg.Numb2:after,
	.Stg.Numb3:after,
	.Stg.Numb4:after {
		top: 20px;
		right: 0;
	}
}

	.boxA {
		padding: 20px;
		background: #fff;
	}

	.clmBox {
		/*overflow: hidden;*/
		letter-spacing: -0.4em;
	}
	.clmBox > div {
		display: inline-block;
		letter-spacing: normal;
		vertical-align: bottom;
		-webkit-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}

	.clmBox.clm2 {
		margin-top: -50px;
		margin-left: -2.5%;
	}
	.clmBox.clm2 > div.first {
		max-width: 1000px;
		width: 97.5%;
	}
	.clmBox.clm2 > div {
		width: 47.5%;
		margin-top: 30px;
		margin-left: 2.5%;
	}
	.clmBox.clm2 > div .sp {
		display: none;
	}
	.clmBox.clm2 > div h5 {
		line-height: 1.5;
	}
	.clmBox.clm2 > div h5 span {
		font-size: 12px;
	}

	.clmBox.Iclm2 {
		margin-top: -20px;
		margin-left: -2.5%;
	}
	.clmBox.Iclm2 > div {
		width: 47.5%;
		margin-top: 20px;
		margin-left: 2.5%;
	}

	.clmBox.clm4 {
		margin-top: -30px;
		margin-left: -2.5%;
	}
	.clmBox.clm4 > div {
		width: 22.5%;
		margin-top: 30px;
		margin-left: 2.5%;
	}

	.clmBox > div.cl {
		clear: left;
	}
@media only screen and (max-width: 640px) {
	.boxA {
		padding: 10px;
		background: #fff;
	}

	.clmBox.clm2 {
		margin-left: 0;
	}
	.clmBox.clm2 > div {
		float: none;
		width: auto;
		margin-left: 0;
	}

	.clmBox.clm4 > div {
		width: 47.5%;
	}

	.clmBox > div.cl {
		clear: none;
	}
	.clmBox > div.clsp {
		clear: left;
	}
	.clmBox.clm2 > div .pc {
		display: none;
	}
	.clmBox.clm2 > div .sp {
		display: inline;
		vertical-align: bottom;
	}
}
@media only screen and (max-width: 480px) {
	.clmBox.Iclm2 {
		margin-left: 0;
	}
	.clmBox.Iclm2 > div {
		float: none;
		width: auto;
		margin-left: 0;
	}
}
.boxA.kakomi {
	text-align: left;
}
#anc2 .clmBox.clm4 {
	padding-bottom: 20px;
}
video {
	width: 100%;
}
video::-internal-media-controls-download-button {
    display:none;
}
.movie > div {
	position: relative;
}
.movie > div a {
	background-size: 100% auto;
	margin-bottom: 10px;
	border: 1px solid #dfded7;
}
.movie > div:nth-child(1) a {
	background: url(../imgs/movie_thmb01_ov.png) top center no-repeat;
	display: inline-block;
	background-size: 100% auto;
}
.movie > div:nth-child(2) a {
	background: url(../imgs/movie_thmb02_ov.png) top center no-repeat;
	display: inline-block;
	background-size: 100% auto;
}
.movie > div:nth-child(3) a {
	background: url(../imgs/movie_thmb03_ov.png) top center no-repeat;
	display: inline-block;
	background-size: 100% auto;
}
.movie > div:nth-child(4) a {
	background: url(../imgs/movie_thmb04_ov.png) top center no-repeat;
	display: inline-block;
	background-size: 100% auto;
}
.movie > div:nth-child(5) a {
	background: url(../imgs/movie_thmb05_ov.png) top center no-repeat;
	display: inline-block;
	background-size: 100% auto;
}
.movie > div a img {
	transition: 1s;
	display: block;
	width: 100%;
	height: auto;
}
.movie > div a:hover img {
	opacity: 0;
}

.none_video {
	display: none;
}
.video_wrapper {
	max-width: 1000px;
	position: relative;
}

.video_wrapper video {
    max-width: 100%;
	display: block;
}
.video_wrapper .ctrl {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	background: white;
	display: none;
}
.featherlight-content:hover .video_wrapper .ctrl,
body.full:hover .video_wrapper .ctrl{
	display: block;
}
.video_wrapper .ctrl a {
    display: inline-block;
    vertical-align: middle;
    margin: 10px 0px;
}
.video_wrapper .ctrl a img {
	opacity: 0;
}
.video_wrapper .ctrl .play{
	margin-left: 20px;
	background: url(../imgs/video/stop.jpg) center no-repeat;
}
.video_wrapper .ctrl .play.off{
	background: url(../imgs/video/stop_ov.jpg) center no-repeat;
}
.video_wrapper .ctrl .volume{
	margin: 8px 20px 8px;
	float: right;
	background: url(../imgs/video/volume.jpg) center no-repeat;
}
.video_wrapper .ctrl .volume.off{
	background: url(../imgs/video/volume_ov.jpg) center no-repeat;
}
.video_wrapper .ctrl .full{
	margin-right: 20px;
	float: right;
	background: url(../imgs/video/full.jpg) center no-repeat;
}
.video_wrapper .ctrl .full.on{
	background: url(../imgs/video/full_ov.jpg) center no-repeat;
}
.featherlight .featherlight-content {
	background: none !important;
	padding: 0 !important;
}

.featherlight.fullscreen {
	background: black !important;
}
.featherlight.fullscreen:before {
	margin-right: 0;
}
.featherlight.fullscreen .featherlight-content,
.featherlight.fullscreen .video_wrapper,
.featherlight.fullscreen #video {
    width: 100% !important;
	max-width: 100% !important;
	max-height: 100%;
    margin: 0;
    border: none;
	max-height: inherit !important;
}
.featherlight.fullscreen .video_wrapper .ctrl {
	position: fixed;
}
.seek {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto 92px auto 52px;
	height: 10px;
	cursor: pointer;
}
.seek .seekInner {
	height: 2px;
    background: #dadada;
	margin: 4px 0;
}
.seek span {
	height: 2px;
	width: 0%;
	display: block;
	background: #4285f4;
	position: relative;
}
.seek span:after {
	content: '　';
	position: absolute;
	width: 14px;
	height: 14px;
	border-radius: 7px;
    background: #4285f4;
	right: 0;
	top: -6px;
}
@media only screen and (max-width: 567px) {
.featherlight-content .video_wrapper .ctrl {
	display: block;
	position: fixed;
	z-index: 9999;
}
}

@media screen and (max-width:640px) {
	.movie > div:nth-child(1) a {
		background: url(../imgs/movie_thmb01_sp.png) top center no-repeat;
		display: inline-block;
		background-size: 100% auto;
	}
	.movie > div:nth-child(2) a {
		background: url(../imgs/movie_thmb02.png) top center no-repeat;
		display: inline-block;
		background-size: 100% auto;
	}
	.movie > div:nth-child(3) a {
		background: url(../imgs/movie_thmb03.png) top center no-repeat;
		display: inline-block;
		background-size: 100% auto;
	}
	.movie > div:nth-child(4) a {
		background: url(../imgs/movie_thmb04.png) top center no-repeat;
		display: inline-block;
		background-size: 100% auto;
	}
	.movie > div:nth-child(5) a {
		background: url(../imgs/movie_thmb05.png) top center no-repeat;
		display: inline-block;
		background-size: 100% auto;
	}
}

@media screen and (min-width:641px) {
	.linkBtn a img {
		transition: 0.3s ease-out;
	}
	.linkBtn a:hover img {
		opacity: 0.75;
	}
}

.clmBox.clm2.movie h5{
	color: #36375e;
	margin-bottom: 10px;
	line-height: 1.2;
	font-size: 20px;
}