/*カラー設定
ベース［］：#;
サブ［］：#;
--------------------------------------------------------*/

* {
	margin: 0;
	padding: 0;
}
body {
	font-size: 100%;
	font-color: #444;
	font-family : "メイリオ","Meiryo","ヒラギノ角ゴ Pro W3",
 "Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック", "MS P Gothic","Osaka",
 Verdana,Arial, Helvetica, sans-serif;
	background: #FFF;
	margin: 0;
	padding: 0;
}
img {
	border: none;
}
br.floatend {
	clear: both;
}
h1 {
	height: 0;
	text-indent: -9999px;
	margin: 0;
	padding: 0;
}

/*base
--------------------------------------------------------*/
#main-visual {
	width: 100%;
	text-align: center;
	margin: 0 auto;
	padding: 0;
	background: #FFF;
	height: auto;
	max-height: 840px;
	overflow: hidden;
}
#main-visual img {
	width: 100%;
}
.menu-btn, .menu {
	display: none;
}
article {
	text-align: center;
	margin: 0 auto;
	padding: 40px 0 0 0;
	background: #FFF;
}
article a:hover img {
	opacity: 0.85;
	filter: alpha(opacity=85);
	-ms-filter: "alpha(opacity=85)";
}
article.sub {
	text-align: center;
	margin: 0 auto;
	padding: 75px 0 100px 0;
	background: #FFF;
}
article.sub a:hover img {
	opacity: 0.85;
	filter: alpha(opacity=85);
	-ms-filter: "alpha(opacity=85)";
}
.white_area {
	padding: 25px 0 40px 0;
	background: #FFF;
}
.black_area {
	padding: 10px 0 50px 0;
	background: #1A1A1A;
}
.green_area {
	padding: 50px 0;
	background: #e2e2e2;
}
.image_box {
	position: relative;
	overflow: hidden;
}
.image_box:before {
    content:"";
    display: block;
    padding-top: 70%; /* 高さを幅の75%に固定 */
}
.link_box {
	position: relative;
	width: 50%;
	height: 400px;
	background-position: center,center;
	background-repeat: no-repeat;
}
.link_box img {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	margin: auto;
	width: 100%;
	max-width: 490px;
}
.garally_img {
	float: left;
	width: 25%;
}
img.staff_photo {
	width: 33.333%;
	float: left;
}
img.right {
	float: right;
	margin: 0 0 30px 30px;
}
.po {
	font-size: .75rem;
	line-height: 1.7em;
	color: #333333;
	text-align: left;
	white-space: normal;
	padding: 15px 20px 0;
	height: 200px;
	width: 100%;
	max-width: 500px;
	overflow: auto;
	border: 1px solid #DDD;
	margin: 0 auto 50px;
}
.po p {
	margin-bottom: 15px;
}
footer {
	clear: both;
	margin: 0;
	padding: 0;
	background: #e2e2e2;
	border-top: solid 1px #bbb;
}

.link_box_L {
	width: 50%;
	float: left;
	padding: 100px 0;
	background-image: url(../images/mainphoto_106.jpg);
}
.link_box_R {
	width: 50%;
	float: right;
	padding: 100px 0;
	background-image: url(../images/mainphoto_107.jpg);
}

/*Fixed Navi
--------------------------------------------------------*/
.inner {
	width: 1024px;
	margin: 0 auto;
}
.inner:after {
	content: "";
	clear: both;
	display: block;
}
#top-head {
	position: fixed;
	width: 100%;
	margin: 0 auto;
	padding: 30px 0 0;
	line-height: 1;
	z-index: 999;
}
#top-head:after {
	content: "";
	display: block;
	height: 1px;
	background: #fff;
	width: 1024px;
	margin: 30px auto 0;
}
#top-head a, #top-head {
	color: #fff;
	text-decoration: none;
}
#top-head a.sub_glnavi {
	color: #333;
	text-decoration: none;
	text-shadow:1px 1px 0 #FFF, -1px -1px 0 #FFF,
              -1px 1px 0 #FFF, 1px -1px 0 #FFF,
              0px 1px 0 #FFF,  0-1px 0 #FFF,
              -1px 0 0 #FFF, 1px 0 0 #FFF;
}
#top-head .inner {
	position: relative;
}
#top-head .logo {
	float: left;
	width: 350px;
}
#global-nav ul {
	list-style: none;
	position: absolute;
	right: 60px;
	bottom: 28px;
	font-size: 14px;
}
#global-nav ul li {
	float: left;
	position: relative;
}
#global-nav ul li a {
	padding: 0 13px;
}
#global-nav .btn {
	position: absolute;
	right: 0;
	bottom: 28px;
}

/* Btn Hover */
#global-nav ul li:after {
	position: absolute;
	content: "";
	display: block;
	width: 100%;
	height: 3px;
	bottom: -20px;
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3 ease;
	-o-transition: all 0.3 ease;
}
#global-nav ul li:hover:after {
	background: #fff;
	bottom: -30px;
}

/* Fixed */
#top-head.fixed {
	padding-top: 15px;
	background: #fff;
	background: rgba(255,255,255,.7);
}
#top-head.fixed .logo {
	font-size: 24px;
	color: #333;
	margin-left: 10px;
}

#top-head.fixed:after {
	width: 100%;
	margin-top: 20px;
}
#top-head.fixed #global-nav ul li a {
	color: #333;
	padding: 0 15px;
}

/* Fixed Btn Hover */
#top-head.fixed #global-nav ul li:after {
	bottom: -10px;
}
#top-head.fixed #global-nav ul li:hover:after {
	background: #0b8793;
	bottom: -20px;
}

/* transition */
#top-head,
#top-head:after,
#top-head .logo,
#global-nav ul li,
#global-nav ul li a {
	transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
}

.header_imagebox {
	width: 100%;
	max-height: 230px;
	overflow: hidden;
	margin: 0 auto;
	padding: 155px 0 0 0;
}

.header_imagebox img {
	width: 100%;
	margin: 0;
}
h2.main_title {
	color: #444;
	font-size: 1.75rem;
	line-height: 1.3em;
	margin: 0 0 5px 0;
	padding: 0;
}
h3.rubi {
	color: #444;
	font-size: 1rem;
	font-weight: normal;
	line-height: 1.5em;
	margin: 0 0 40px 0;
	padding: 0;
}
h4 {
	width: 100%;
	max-width: 1000px;
	color: #444;
	font-size: 1.3rem;
	font-weight: normal;
	line-height: 1.3em;
	margin: 0 auto 50px;
	padding-bottom: 20px;
	border-bottom: 1px solid #AAA;
}
h5 {
	color: #d5a84e;
	font-size: 1.2rem;
	font-weight: normal;
	line-height: 1.3em;
	margin: 0 0 15px 0;	
}
h6 {
	width: 100%;
	max-width: 1000px;
	color: #FFF;
	font-size: 1rem;
	line-height: 1.3em;
	margin: 0 auto 30px;
	padding: 10px 20px;
	background: #d5a84e;	
}
.center_box {
	width: 100%;
	font-size: .9rem;
	font-weight: normal;
	line-height: 1.5em;
	text-align: left;
	margin: 0 auto;
	padding: 0;
}
.yellow_box {
	width: 100%;
	max-width: 700px;
	color: #444;
	font-size: 1rem;
	font-weight: normal;
	line-height: 1.7em;
	text-align: left;
	margin: 0 auto 30px;
	padding: 10px 0;
	border-bottom: 1px solid #CCC;
}
p.normal {
	color: #444;
	max-width: 950px;
	font-size: 1rem;
	font-weight: normal;
	line-height: 1.7em;
	text-align: left;
	margin: 0 auto;
	padding: 0;
}
p.normal a {
	color: #2860af;
}
p.normal a:hover {
	color: #F97C00;
}
b {
	color: #d5a84e;
	font-weight: normal;
}
dl.staff_area {
	width: 100%;
	max-width: 850px;
	margin: 0 auto 70px;
}
dd.left_image {
	float: left;
	margin-right: 20px;
}
dd.left_image img {
	max-width: 350px;
	margin-bottom: 5px;
}
dd.right_comment {
	color: #444;
	font-size: .9rem;
	font-weight: normal;
	line-height: 1.6em;
	text-align: left;
	margin: 0 auto;
	padding: 15px 0 0 0;
}
.product_box {
	float: left;
	width: 303px;
	margin: 0 20px 20px 0;
	padding: 0;
}
.product_box img {
	margin-bottom: 10px;
}
.product_box p {
	color: #444;
	font-size: .85rem;
	font-weight: normal;
	line-height: 1.7em;
	text-align: left;
	margin: 0;
	padding: 0;
}
ul.list {
	width: 100%;
	max-width: 950px;
	margin: 0 auto 30px;
	padding: 0;
}
ul.list li {
	color: #444;
	font-size: 1rem;
	font-weight: normal;
	line-height: 1.7em;
	list-style: none;
	padding: 0;
	text-align: center;
	border-bottom: 1px dotted #444;
	padding: 8px 0;
}

/*table
--------------------------------------------------------*/
table.online {
	width: 100%;
	max-width: 800px;
	margin: 0 auto 50px;
	padding: 0;
	border-collapse: collapse;
}
table.online th {
	font-size: 0.9rem;
	line-height: 1.5em;
	font-weight: normal;
	text-align: center;
	padding: 13px 20px;
	border-bottom: 1px solid #CCC;
	background: #EEE;
}
table.online td {
	font-size: 0.9rem;
	line-height: 1.5em;
	font-weight: normal;
	text-align: left;
	padding: 13px 20px;
	background: #FFF;
	border-bottom: 1px solid #CCC;
}

table.spec {
	width: 100%;
	max-width: 950px;
	margin: 0 auto 100px;
	padding: 0;
	border-collapse: collapse;
}
table.spec th {
	font-size: 0.9rem;
	line-height: 1.5em;
	font-weight: normal;
	text-align: center;
	padding: 13px;
	border: 1px solid #CCC;
	background: #EEE;
}
table.spec td {
	font-size: 0.9rem;
	line-height: 1.5em;
	font-weight: normal;
	text-align: center;
	padding: 13px;
	background: #FFF;
	border: 1px solid #CCC;
}
table.en th, table.en td {
	text-align: left;
}

/*footer
--------------------------------------------------------*/
#foot_space {
	clear: both;
	position: relative;
	color: #333;
	margin: 0 auto;
	width: 1000px;
	height: 180px;
}
.foot_logo {
	position: absolute;
	top: 22px;
	left: 0;
	width: 300px;
}
.foot_address {
	position: absolute;
	bottom: 25px;
	left: 0;
	font-size: .8rem;
	line-height: 1.4em;
	text-align: left;
	margin: 0;
	padding: 0;
}
.foot_tel {
	position: absolute;
	top: 62px;
	left: 370px;
}
.foot_mail {
	position: absolute;
	top: 37px;
	right: 0;
}
.foot_copy {
	position: absolute;
	bottom: 25px;
	right: 0;
	font-size: .6rem;
	text-align: right;
	margin: 0;
	padding: 0;
}

/*google map
--------------------------------------------------------*/
.ggmap {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


img.mainImage {
	width: 100%;
	max-width: 1000px;
	margin: 0;
}
img.subImage {
	width: 50%;
	max-width: 500px;
	margin: 0;
}

/* ウィンドウ幅が 599px以下の場合に適用するCSS */
@media screen and ( max-width:599px ) {
img.mainImage, img.subImage {
	width: 100%;
}