@charset "utf-8";
/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

MainVisual CSS

_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/*/

html, body {
	/*overflow: hidden;*/
}
html.scroll, body.scroll {
	overflow: auto;
}

section.about,
section.topics,
section.news,
aside,
footer {
	display:none;
}

section.main {
	/* min-height: 650px; */
}

.mtg-main_visual_area {
	width: 100%;
	padding: 66.66% 0 0;
	position: relative;
	background: #FFF;
	overflow: hidden;
}

/* レイヤー設定 */
.mtg-layer {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* オープニング 1page */
.mtg-logo_text,
.mtg-brand_logo {
	position: fixed;
	top: 50%;
	left: 0;
	z-index: 1;
	height: auto;
	padding: 40px 0;

	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}

.mtg-img_gallery {
	z-index: 3;
	height: 100%;
}

/* MTGロゴ */
.mtg-logo_text .mtg-logo {
	position: relative;
	width: 694px;
	margin: 0 auto;
	padding: 0 0 65px;
	opacity: 0;
}

/* キャッチコピー */
.mtg-logo_text .mtg-copy {
	width: 585px;
	margin: 0 auto;
	opacity: 0;
}
.mtg-logo_text .mtg-copy .sp {
	display: none;
}

/* ブランド一覧 */
.mtg-brand_logo {
	z-index: 2;
	opacity: 0;
}
.mtg-brand_logo .mtg-logo {
	width: 301px;
	margin: 0 auto -6px;
	padding: 0;
}
.mtg-brand_logo .mtg-brands {
	width: 1346px;
	margin: 0 auto;
}
.mtg-brand_logo .mtg-brands ul {
	width: 100%;
}
.mtg-brand_logo .mtg-brands ul.sp {
	display: none;
}
.mtg-brand_logo .mtg-brands li {
	width: 25%;
	padding: 86px 24px 0;
	float: left;
}
.mtg-brands img {
	width: 100%;
	height: auto;
}

/* ビジュアルギャラリー */
.mtg-img_gallery .mtg-panel {
	width: 50%;
	height: 100%;
	float: left;
	position: relative;
}
.mtg-img_gallery .mtg-panel.mtg-sp {
	display: none;
}
.mtg-img_gallery .mtg-panel li {
	width: 0;
	height: 100%;
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;

	-webkit-transition: width .5s;
	-moz-transition: width .5s;
	-o-transition: width .5s;
	transition: width .5s;
}
.mtg-img_gallery .mtg-panel.mtg-right li {
	top: 0;
	left: 0;
}
.mtg-img_gallery .mtg-panel li.show {
	width: 100%;
	z-index: 3;
}
.mtg-img_gallery .mtg-panel li.select {
	width: 100%;
	z-index: 2;
}

.mtg-img_gallery .mtg-panel li .mtg-visual {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 50vw;
	height: 100%;
}

.mtg-img_gallery .mtg-panel li .mtg-visual span {
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;

	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

.mtg-img_gallery .mtg-panel li .mtg-visual .visual_logo {
	display: block;
	position: absolute;
	bottom: 20px;
	left: 50%;
	width: 212px;
	height: 65px;
	margin: 0 0 0 -106px;

	z-index: 2;
}

.mtg-img_gallery .mtg-sp-txt {
	display: none;
}

/* ホバー時に表示するオーバーレイ */
.mtg-img_gallery .mtg-panel-hover {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 5;
}
.mtg-img_gallery .mtg-panel-hover li {
	width: 50%;
	height: 100%;
	float: left;
}
.mtg-img_gallery .mtg-panel-hover li .hover_trigger {
	display: block;
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
}
.mtg-img_gallery .mtg-panel-hover li .hover_trigger::before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: rgba(0, 0, 0, .5);
	opacity: 0;

	-webkit-transition: opacity .5s;
	-moz-transition: opacity .5s;
	-o-transition: opacity .5s;
	transition: opacity .5s;
}
.mtg-img_gallery .mtg-panel-hover li .hover_trigger:hover::before {
	opacity: 1;
}

.mtg-img_gallery .mtg-panel-hover li .hover_trigger .hover_panel {
	display: block;
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
	opacity: 0;

	-webkit-transition: opacity .5s;
	-moz-transition: opacity .5s;
	-o-transition: opacity .5s;
	transition: opacity .5s;
}
.mtg-img_gallery .mtg-panel-hover li .hover_trigger:hover .hover_panel {
	opacity: 1;
}

.mtg-img_gallery .mtg-panel-hover li .hover_trigger .hover_panel .panel_content {
	display: block;
	width: 50vw;
	position: absolute;
	top: 50%;
	left: 0;
	padding: 0 10px 5px;
	color: #FFF;
	font-family: "Baskerville", "Baskerville-Book", "A-OTF Ryumin Pro KL", "Ryumin Regular KL", "リュウミン R-KL", HiraMinProN-W3, HiraMinPro-W3, "ヒラギノ明朝 ProN W3", "ヒラギノ明朝 Pro W3", "ＭＳ 明朝", serif;
	text-align: center;

	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}
.mtg-img_gallery .mtg-panel-hover li .hover_trigger .hover_panel .panel_content h1 {
	font-size: 5rem;
	line-height: 1;
	letter-spacing: -0.3rem;
	margin: 0;
}
.mtg-img_gallery .mtg-panel-hover li .hover_trigger .hover_panel .panel_content h1::after {
	display: none;
}
.mtg-img_gallery .mtg-panel-hover li .hover_trigger .hover_panel .panel_content .desc {
	font-size: 1.8rem;
	letter-spacing: .05rem;
	padding: 30px 0 41px;
}
.mtg-img_gallery .mtg-panel-hover li .hover_trigger .hover_panel .panel_content .ghost_more {
	width: 180px;
	font-size: 1.6rem;
	padding: 12.5px 10px 15.5px;
	margin: 0 auto;
	line-height: 1;
	border: #FFF 1px solid;
	transition:all 0.3s;
}
.mtg-img_gallery .mtg-panel-hover li .hover_trigger .hover_panel .panel_content .ghost_more:hover {
	background:rgba(255,255,255,0.5);
	color:#000;
}

/* SP用パーツ */
.mtg-img_gallery .icon_scroll,
.mtg-img_gallery .mtg-panel-timer,
.mtg-img_gallery .mtg-scroll-icon {
	display: none;
}

/* Youtube動画 */
#movie .movie_wrap{
	display:none;
}



/* PC 1399~
------------------------------------------------------ */
@media screen and (max-width: 1399px) {

	/* MTGロゴ */
	.mtg-logo_text .mtg-logo {
		width: 555px;
		padding: 0 0 52px;
	}

	/* キャッチコピー */
	.mtg-logo_text .mtg-copy {
		width: 468px;
	}

	/* ブランド一覧 */
	.mtg-brand_logo .mtg-logo {
		width: 241px;
		padding: 0 0 19px;
	}
	.mtg-brand_logo .mtg-brands {
		width: 1088px;
	}
	.mtg-brand_logo .mtg-brands li {
		padding: 69px 20px 0;
	}

}


/* PC 1199~
------------------------------------------------------ */
@media screen and (max-width: 1199px) {

	/* MTGロゴ */
	.mtg-logo_text .mtg-logo {
		width: 486px;
		padding: 0 0 46px;
	}

	/* キャッチコピー */
	.mtg-logo_text .mtg-copy {
		width: 410px;
	}

	/* ブランド一覧 */
	.mtg-brand_logo .mtg-logo {
		width: 211px;
		padding: 0 0 17px;
	}
	.mtg-brand_logo .mtg-brands {
		width: 952px;
	}
	.mtg-brand_logo .mtg-brands li {
		padding: 60px 18px 0;
	}

}


/* PC 1023~
------------------------------------------------------ */
@media screen and (max-width: 1023px) {

	/* キャッチコピー */
	.mtg-logo_text .mtg-copy {
		width: 301px;
	}
	.mtg-logo_text .mtg-copy .pc {
		display: none;
	}
	.mtg-logo_text .mtg-copy .sp {
		display: block;
	}

	/* ブランド一覧 */
	.mtg-brand_logo .mtg-logo {
		width: 180px;
		padding: 0 0 15px;
	}
	.mtg-brand_logo .mtg-brands {
		width: 800px;
	}
	.mtg-brand_logo .mtg-brands li {
		padding: 50px 15px 0;
	}

}


/* PC 1023~
------------------------------------------------------ */
@media screen and (max-width: 800px) {

	/* キャッチコピー */
	.mtg-logo_text .mtg-copy {
		width: 301px;
	}
	.mtg-logo_text .mtg-copy .pc {
		display: none;
	}
	.mtg-logo_text .mtg-copy .sp {
		display: block;
	}

	/* ブランド一覧 */
	.mtg-brand_logo .mtg-brands {
		width: 100%;
	}

}


/* SmartPhone
------------------------------------------------------ */
@media screen and (max-width: 640px) {

	header.top {
		/*
		background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0))) !important;
		background: -moz-linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)) !important;
		background: -ms-linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)) !important;
		background: linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)) !important;
		*/
	}

	header.top + article {
		padding: 64px 0 0;
	}

	section.main {
		min-height: 1px;
	}

	.mtg-main_visual_area {
		padding: 132.2% 0 0;
		overflow: visible;
	}

	/* MTGロゴ */
	.mtg-logo_text .mtg-logo {
		width: 60%;
		min-width: 320px;
		padding: 0 5px 20px;
	}

	/* キャッチコピー */
	.mtg-logo_text .mtg-copy {
		width: 45%;
		min-width: 240px;
		padding: 0 10px;
	}

	/* ブランド一覧 */
	.mtg-brand_logo .mtg-logo {
		width: 100px;
		margin: 0 auto -15px;
	}
	.mtg-brand_logo .mtg-brands {
		width: 100%;
		padding: 0 5px;
	}
	.mtg-brand_logo .mtg-brands ul.pc {
		display: none;
	}
	.mtg-brand_logo .mtg-brands ul.sp {
		display: block;
	}
	.mtg-brand_logo .mtg-brands li {
		width: 50%;
		padding: 10px 15px 0;
	}
	.mtg-brand_logo .mtg-brands li:nth-child(3),
	.mtg-brand_logo .mtg-brands li:nth-child(4) {
		padding: 5px 15px 0;
	}
	.mtg-brand_logo .mtg-brands li:nth-child(5),
	.mtg-brand_logo .mtg-brands li:nth-child(6) {
		padding: 16px 15px 0;
	}
	.mtg-brand_logo .mtg-brands li:nth-child(7),
	.mtg-brand_logo .mtg-brands li:nth-child(8) {
		padding: 8px 15px 0;
	}
	.mtg-brand_logo .mtg-brands li:nth-child(9),
	.mtg-brand_logo .mtg-brands li:nth-child(10) {
		padding: 4px 15px 0;
	}

	/* ビジュアルギャラリー */
	.mtg-img_gallery .mtg-panel {
		display: none;
	}
	.mtg-img_gallery .mtg-panel.mtg-sp {
		display: block;
		width: 100%;
		height: 42.9%;
		float: none;
	}
	.mtg-img_gallery .mtg-panel li .mtg-visual {
		width: 100vw;
		height: 100%;
	}

	/* スマホ用テキスト */
	.mtg-img_gallery .mtg-sp-txt {
		display: block;
		width: 0;
		height: 7.2%;
		background: #000;
		overflow: hidden;

		-webkit-transition: width .5s;
		-moz-transition: width .5s;
		-o-transition: width .5s;
		transition: width .5s;
	}
	.mtg-img_gallery .mtg-sp-txt.on {
		width: 100%;
	}
	.mtg-img_gallery .mtg-sp-txt .mtg-sp-txt_inner {
		width: 100vw;
		height: 100%;
		color: #FFF;
		display: table;
		text-align: center;
	}
	.mtg-img_gallery .mtg-sp-txt .desc {
		font-size: 1rem;
		line-height: 1.6;
		margin: 0;
		display: table-cell;
		vertical-align: middle;
		text-align: center;
	}
	.mtg-img_gallery .mtg-sp-txt .desc h1 {
		font-size: 1.6rem;
		font-family: "Baskerville", "Baskerville-Book", "A-OTF Ryumin Pro KL", "Ryumin Regular KL", "リュウミン R-KL", HiraMinProN-W3, HiraMinPro-W3, "ヒラギノ明朝 ProN W3", "ヒラギノ明朝 Pro W3", "ＭＳ 明朝", serif;
		line-height: 1;
		margin: 0;
		padding: 0 15px 0 0;
		display: inline-block;
		vertical-align: middle;
	}
	.mtg-img_gallery .mtg-sp-txt .desc p {
		display: inline-block;
		vertical-align: middle;
		padding: 1px 0 0;
	}

	/* ホバー時に表示するオーバーレイ */
	.mtg-img_gallery .mtg-panel-hover {
		display: none !important;
	}

	/* SP用タイマーバー */
	.mtg-img_gallery .mtg-panel-timer {
		position: absolute;
		bottom: -3px;
		left: 0;
		display: block;
		width: 0;
		height: 3px;
		background: #DDD;
		overflow: hidden;

		-webkit-transition: all .5s;
		-moz-transition: all .5s;
		-ms-transition: all .5s;
		-o-transition: all .5s;
		transition: all .5s;
	}
	.mtg-img_gallery .mtg-panel-timer span {
		display: block;
		width: 0;
		height: 100%;
		background: #BBB;
	}

	/* スクロールアイコン */
	.mtg-img_gallery .mtg-scroll-icon {
		position: absolute;
		bottom: -55px;
		left: 50%;
		margin: 0 0 0 -27.5px;
		display: block;
		width: 55px;
		opacity: 0;

		-webkit-transition: all .5s;
		-moz-transition: all .5s;
		-ms-transition: all .5s;
		-o-transition: all .5s;
		transition: all .5s;
	}
	.mtg-img_gallery .mtg-scroll-icon.on {
		opacity: 1;
	}

}
