﻿@charset "UTF-8";
html {
  font-size: 62.5%;
}

body {
	font-family:"游明朝","YuMincho","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
	width:100%;
	font-size: 1.8rem;
	line-height: 1.6;
	color:#FFF;
	position:relative;
	background:#1c1c1c;
}

.pc{display:block;}
.sp{display:none!important;}
.inner{
	width:1000px;
	margin:0 auto;
}
.t-center{
	text-align:center;
}
.t-center img{
	display:inline;
}

.t-left{
	text-align:left;
}
.t-right{
	text-align:right;
}
.left{
	float:left;
}
.right{
	float:right;
}
.rl{
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
}
.none{
	display:none;
}
#to-top{
	position:fixed;
	right:0;
	bottom:0;
	z-index:999;
}
#to-top.to-top-foot{
	position:absolute;
	top:124px;
	right:0;
}
.logo{
	position:absolute;
	right:0;
	z-index:998;
}
.gem-box{
	margin-bottom:-75px;
}
.gem-box h2{
	padding:15px 0;
}
.gem-box .inner{
	padding-bottom:70px;
	border-bottom:1px solid #252525;
}
.gem{
	width:925px;
	margin:0 auto;
}
.gem td{
	vertical-align:top;
}
.gem h3{
	padding:20px 0;
}
.gem td.text-box{
	width:484px;
	position:relative;
}
.gem td.text-box span{
	font-size:1.2rem;
	vertical-align:top;
	padding-left:3px;
}
.gem td.text-box .gem-btn-l a{
	position:absolute;
	bottom:0;
	left:0;
}
.gem td.text-box .shop-access a{
	width:145px;
	background:#FFF;
	color:#1c1c1c;
	text-align:center;
	padding:16px 0;
	border:1px solid #1c1c1c;
	box-sizing:border-box;
}
.gem td.text-box .shop-access a:hover{
	opacity:1;
	background:#1c1c1c;
	color:#FFF;
	border:1px solid #FFF;
	box-sizing:border-box;
}
.gem td.text-box .gem-btn-r{
	position:absolute;
	bottom:0;
	right:0;
}

/*こだわり*/

.top-area{
	width:100%;
	min-width:1000px;
}
.top-bg{
	background:url(/cms/marutaka/images/vision/top.png)no-repeat center top;
	background-size:cover;
	width:100%;
	min-width:1000px;
	height:300px;
}
.news-h1{
	margin:-80px auto 0;
}
section{
	padding:75px 0
}

h2{
	padding:0 0 75px;
	font-size:3.6rem;
	font-weight:normal;
}
.text-area{
	padding:50px 0;
}
.box .left{
	width:565px;
}
.bg {
	background-color:#252525;
}
.blessing {
	margin:5px auto 75px;
}
.blessing .blessing-box{
	width:410px;
}
.blessing .blessing-box ul{
	width:300px;
}
.blessing .blessing-box ul li{
	padding:12px 0;
}
.blessing .blessing-box.right{
	margin-top:40px;
}
.box2{
	margin:30px auto;
}
.box2 .text-box{
	width:565px;
}
.last{
	/*margin-bottom:50px;*/
	position:relative;
}

.last .rl{
	position:absolute;
	top:75px;
	left:50%;
	display:inline;
	transform:translate(-50%, 0%);
}

.last table td{
	vertical-align:top;
	width:320px;
}
.last .rl p{
	padding:100px 10px 0;
}
.last .rl .catch-title{
	font-size:3.6rem;
	padding:0;
}
.last .left p:last-child{
	padding-top:50px;
}
.last .right p:last-child{
	padding-top:50px;
}

.inner .box .right {
  width: 400px;
}
.inner .box .right img {
  width: 400px;
  height: 270px;
}
.inner {
  position: relative;
}
.bg_red {
  width: 100%;
  height: 80px;
    background: url(/cms/marutaka/images/vision/bg01.jpg) no-repeat top center;
  position: absolute;
  top: -114px;
  left: 0;
}
.matena{
	margin:75px auto;
 position: relative;
 padding: 0;
}
.matena h3{
	/*background:url(/cms/marutaka/images/shop/h3-bg.png)no-repeat;*/
	text-align:center;
	font-size:3.2rem;
	font-weight:normal;
	/*padding-top:60px;*/
}
.matena table{
	margin:75px auto 40px;
}
.matena table td{
	vertical-align:top;
}
.matena .text-area{
	padding-left:40px;
}
.matena .big{
	font-size:3.2rem;
}
.matena .title-area{
	font-size:2.4rem;
	padding-bottom:30px;
}

.breadcrumb{
	font-size:1.4rem;
	margin-bottom:75px;
	margin-left:305px !important;
}
.breadcrumb a{
	color:#FFF;
}
.breadcrumb a:hover{
	opacity:1;
	text-decoration:underline;
}

footer{
	background:url(/cms/marutaka/images/common/footer-bg.png)no-repeat center top;
	padding-top:124px;
	position:relative;
}
.footer-box{
	position:relative;
	background:#2e2e2e;
	min-width:1000px;
	margin:0 auto;
}
footer .f-menu{
	position:absolute;
	left:0;
	padding:85px 20px;
	line-height:2.4;
}
footer a{
	color:#FFF;
	font-size:1.6rem;
}
footer .f-bnr{
	padding-top:150px;
	padding-right:50px;
}
footer .f-bnr li{
	display:inline-block;
	padding:0 20px;
}
footer .copy{
	font-size:1.4rem;
	padding:25px 50px 25px 0;
	color:#6b6b6b;
}
footer a:hover{
	opacity:0.7;
}
.fadeInUp {
    -webkit-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    animation-fill-mode:both;
    -webkit-animation-duration:1s;
    -ms-animation-duration:1s;
    animation-duration:1s;
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
    visibility: visible !important;
}
@keyframes fadeInUp {
    0% { opacity: 0; -webkit-transform: translateY(50px); -ms-transform: translateY(50px); transform: translateY(50px); }
    100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}

.fadeInDown {
    -webkit-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    animation-fill-mode:both;
    -webkit-animation-duration:1s;
    -ms-animation-duration:1s;
    animation-duration:1s;
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
    visibility: visible !important;
}
@keyframes fadeInDown {
    0% { opacity: 0; -webkit-transform: translateY(-50px); -ms-transform: translateY(-50px); transform: translateY(-50px); }
    100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }
}
.fadeInRight {
    -webkit-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    animation-fill-mode:both;
    -webkit-animation-duration:1s;
    -ms-animation-duration:1s;
    animation-duration:1s;
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight;
    visibility: visible !important;
}
@keyframes fadeInRight {
    0% { opacity: 0; -webkit-transform: translateX(-50px); -ms-transform: translateX(-50px); transform: translateX(-50px); }
    100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateY(0); transform: translateX(0); }
}
.fadeInLeft {
    -webkit-animation-fill-mode:both;
    -ms-animation-fill-mode:both;
    animation-fill-mode:both;
    -webkit-animation-duration:1s;
    -ms-animation-duration:1s;
    animation-duration:1s;
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
    visibility: visible !important;
}
@keyframes fadeInLeft {
    0% { opacity: 0; -webkit-transform: translateX(50px); -ms-transform: translateX(50px); transform: translateX(50px); }
    100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateY(0); transform: translateX(0); }
}