/*  基本設定 ================================== */
* {
	padding:0;margin:0;border:0;
}
html,body,ul,li {
	margin: 0;padding: 0;
}
body { 
	color:#333333;
	font-size:11.5pt; 
	line-height:160%;
    font-family: Arial,sans-serif;
	-webkit-text-size-adjust: 100%;
	vertical-align:middle;
}
img {
	vertical-align:middle;
}

/* レイアウト */
#wrapper { width: 1000px; padding:80px 0 0 0; margin: 0 auto; }

/* link */
a:link,a:visited{ color: #19548C; text-decoration:none;}
a:active,a:hover{ color: #3C79B3;text-decoration:none;}
a img{ border: none; transition: all .3s;}
a img:active, a img:hover{	opacity:0.8;}

@media (max-width: 767px) {
img {
	max-width:100%;
	height:auto;
	width:auto\9; /* ie8 */}
	
#wrapper { width: 90%; }	
}

/* 全ページ共通 ======================= */
/* 見出し */
h1{
	text-align:center;
	padding:20px;
	width:300px;
	margin:0 auto;
	margin-bottom:30px;
	font-size:25px;
	line-height:32px;
}
h2{
	text-align:center;
	padding:15px 0;
	margin-bottom:50px;
	font-size:18px;
	line-height:120%;
}
h2 span{
	font-weight:normal;
	font-size:15px;
	color:#85c023;	
}
#wrapper h2{ 
	margin-bottom:20px;
	border:solid 1px #000;
	width:350px;
	margin:0 auto 25px;
	margin-top:80px;
}
h3{
	margin-bottom:25px;
	font-size:19px;
}

/* ボタン */
.button{
	text-align:center;
	display:inline-block;
	width:150px;
	padding:8px 0;
	margin-top:20px;
	cursor: pointer;
	color:#703200;
	border:solid 2px #703200;
	border-radius:20px;
}

.button:hover{
	background:#ece4de;
}

@media (max-width: 767px) {
.button{
	width:250px;
}
}

a.button:hover,a.button:link,a.button:visited{color:#703200;}
a.button{ transition: all .3s;}

/* テーブル */
table{
	margin:0 auto;
	border-top:dotted 1px #ccc;	
}
th{
	width:100px;
}
th,td{
	border-bottom:dotted 1px #ccc;
	padding:10px;
	text-align:left;
}
.table-100{
	width:100%;
	table-layout: fixed;
}

@media (max-width: 767px) {
	th,td{
		display:block;
	}
	th{
		border-bottom:none;	
		padding:10px 5px 0 5px;
		}
	td{
		padding:0 5px 10px 15px;
		}
}

/* リスト */
li,ul,ol,dl {list-style:none;}
ol.list li{
	list-style:disc;
	margin:0 0 0 20px;
	padding:0 0 0 0px;}

/* 画像 */
img {border:0;}

/* 配置 ********************/
.no_display{ display:none;}

@media (max-width: 767px) {
	.br-pc {display:none;}
}


.clearfix:after{clear: both; content: "."; display: block; height: 0; visibility: hidden}
.floatleft { float: left; }
.floatright{ float: right; }

.center { text-align:center;}
.right { text-align:right;} 
.left { text-align:left;}

/* テキスト ********************/
.font-10 {font-size:10px;}
.font-11 {font-size:11px;}
.font-12 {font-size:12px;}
.font-13 {font-size:13px;}
.font-14 {font-size:14px;}
.font-15 {font-size:15px;}
.font-16 {font-size:16px;}
.font-18 {font-size:18px;}
.font-20 {font-size:20px;}
.font-22 {font-size:22px;}
.font-30 {font-size:30px;}

.line-s{line-height:125%;}

.bold { font-weight:bold;}

/* 空白用 */
.ma_5{margin:5px;}
.ma_10{margin:10px;}

.ma_top0{margin-top:0; }
.ma_top10{margin-top:10px; }
.ma_top20{margin-top:20px; }
.ma_top30{margin-top:30px; }
.ma_top40{margin-top:40px; }

.ma_btm0{margin-bottom:0; }
.ma_btm10{margin-bottom:10px; }
.ma_btm20{margin-bottom:20px; }
.ma_btm30{margin-bottom:30px; }
.ma_btm40{margin-bottom:40px; }

/* ヘッダー ======================= */
header{
	width:100%;
	border-bottom:solid 1px #d9d9da;
}
.header-in{
	width:1000px;
	margin:0 auto;
	padding:10px 0;
}
header li{
	display:inline-block;
	font-weight:bold;
	font-size:18px;
	width:100px;
	padding:13px;
	line-height:120%;
	margin:0;
}

header li a:active,header li a:hover,header li a:link,header li a:visited {color:#000;}

header li span{
	font-weight:normal;
	font-size:15px;
	color:#85c023;	
}

header ul{
	margin:0 20px 0 200px;
}

.header-button{
	margin-top:10px;
	margin-bottom:10px;
}

@media (max-width: 767px) {
header .logo{
	margin:5px;
	}	
/* mobile navi */
.hamburger {
	display : block;
	position: fixed;
	z-index : 3;
	right : 10px;
	top   : 15px;
	width : 56px;
	height: 54px;
	cursor: pointer;
	text-align: center;
	background:#fff;
}
.hamburger span {
 	display : block;
	position: absolute;
	width   : 40px;
	height  : 3px ;
	left    : 8px;
	background : #000;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition   : 0.3s ease-in-out;
	transition        : 0.3s ease-in-out;
}
.hamburger span:nth-child(1) {
	top: 12px;
}
.hamburger span:nth-child(2) {
	top: 26px;
}
.hamburger span:nth-child(3) {
	top: 40px;
}
	
/* スマホメニューを開いてる時のボタン */
.hamburger.active-o span:nth-child(1) {
	top : 25px;
 	left: 8px;
	background :#000;
	-webkit-transform: rotate(-45deg);
	-moz-transform   : rotate(-45deg);
	transform        : rotate(-45deg);
}

.hamburger.active-o span:nth-child(2),
.hamburger.active-o span:nth-child(3) {
  top: 25px;
  background :#000;
  -webkit-transform: rotate(45deg);
  -moz-transform   : rotate(45deg);
  transform        : rotate(45deg);
}	
	
/* メニュー背景　*/
nav.globalMenuSp {
	position: fixed;
	z-index : 2;
	top  : 0;
	left : 0;
	color: #000;
	background: rgba( 0,0,0,0.9 );
	text-align: center;
	width: 100%;
	transform: translateX(100%);
	transition: all 0.6s;
	padding-top:10px;
}

nav.globalMenuSp ul {
	margin: 0 auto;
	padding: 0;
	width: 100%;
}
nav.globalMenuSp ul li {
	padding: 0;
	width: 100%;
	transition: .4s all;
	border-bottom:solid 1px #333;
}
nav.globalMenuSp ul li:last-child {
	padding-bottom: 0;
	border-bottom:none;
}
nav.globalMenuSp ul li:hover{
	background-color: rgba(0,0,0,0.7);
}

nav.globalMenuSp ul li a {
	display: block;
	color: #fff;
	padding: 1em 0;
	text-decoration :none;
}
/* クリックでjQueryで追加・削除 */
nav.globalMenuSp.active-o {
	opacity: 100;
	display: block;
	transform: translateX(0%);
}
}

/* インデックス ======================= */
.top-image{
    height: 580px;
	width:100%;
	background:url(https://www.maruyanagi.co.jp/wp-content/uploads/ch-top-image.jpg) repeat-x top center;
	animation: loop 100s linear infinite;
	margin-bottom:80px;
	position:relative;
}
@keyframes loop {
 0% {background-position: 2000px 0;}
 25% {background-position: 1500px 0;}
 50% {background-position: 1000px 0;}
 75% {background-position: 500px 0;}
 100% {background-position: 0 0;}
}
@media (max-width: 767px) {
.movie-wrap { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; margin-bottom:30px;}
.movie-wrap iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
}

.top-message{
	text-align:center;
	font-size:40px;
	line-height:175%;
	border:solid 2px #fff;
	display:inline-block;
	padding:60px 0 60px 30px ;
	color:#fff;
	width:300px;
 	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit- transform: translateY(-50%) translateX(-50%);
}
.gray-back{
	background:#f6f6f6;
	width:100%;
	margin:50px 0 2px 0;
	padding:70px 0;
}
.gray-back img{
	width:160px;
	height:auto;
	margin-bottom:15px;
}
.top-movie{
	background:#f6f6f6;
	padding:30px 0;
}
.top-company{
	background:url(https://www.maruyanagi.co.jp/wp-content/uploads/ch-company-back.jpg) no-repeat bottom right ;
	width:100%;
	height:600px;
	padding:80px 0 0 0;
}
.top-company article{
	width:900px;
	margin:0 auto;
	padding:50px 0 0 0;
}
.top-company article div{
	line-height:200%;
}

@media (max-width: 767px) {
	.top-message{
		font-size:28px;
		width:50%;

	}
	.top-company{
		background-size: 150%;
		padding-bottom:100px;
	}
	.gray-back article{
		width:90%;
		margin:0 auto;
	}
	.top-company article{
		width:90%;
		text-align:center;
		padding:0;	
	}
}

/* フッター ======================= */
footer{
	width:100%;
	padding:0 0 15px 0;}

footer .gray-back{
	margin:0px 0 5px 0;
}
.company-name{
	padding:18px 0 5px 0;
}
.copyright{
	border-top:solid 1px #ccc;
	padding-top:15px;
	margin-top:5px;
}