﻿@charset "utf-8";
/* CSS Document */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,table,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img,abbr{border:0;}
address,caption,cite,code,dfn,h1,h2,h3,h4,th,var{font-style:normal;font-weight:normal;}
caption,th {text-align:left;}
li,dl{list-style:none;}
img {border: none;}
a{
	text-decoration:none;
	color:#333333;
}
body {
	font-family:"メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, sans-serif;
	font-size:small;
	color: #333333;
	line-height: 1.8em;
}
a{
	text-decoration:none;
	color:#333333;
}
a:hover{
	text-decoration:none;
	color:#43ACC7;
}
.clear { clear:both;}  
.clear hr { display:none; }
#header {
	height: 150px;
	width: 1000px;
	margin: 0px auto;
}
#header div{
	display: block;
	float: left;
}
#header #logo{
	width:50%;
	height: 150px;
	text-align: left;
	background:none;
}
#header #logo img{
	margin:30px 0px;
}
#header #gnav{
	width:50%;
	height: 150px;
	text-align: right;
}
#header #gnav ul {
	margin-top: 20px;
}
#header #gnav ul li{
	margin:5px 0px;
	text-align:right;
}
#header #gnav ul li p{
	text-align:right;}
#header #gnav ul li a{
	font-weight: bold;
	font-family: 'Lora', serif;
	font-size: 110%;
}
#header #gnav ul li a:hover{
	opacity: 0.6; filter: alpha(opacity=40); -ms-filter:alpha(opacity=40);
}
#header #gnav ul li a.gnavblog{
	color:#294F28;
}
#header #gnav ul li a.gnavface{
	color:#405d9b;
}
#header #gnav ul li a.gnavinsta{
	color:#cd2f7b;
}
h1{
	font-size: 90%;
	line-height: 1.5em;
	margin-bottom: 3px;
	text-align:right;}
#headnav {
	width:1000px;
	margin: 0px auto;
}
#headnav > ul {
	position: relative;
	width: 1000px;
	height: 40px;
	margin: 0 auto 20px auto;
}

#headnav > ul > li {
	float: left;
	width: 166px;
	height: 40px;
	line-height: 40px;
	text-align: center;
}
#headnav > ul > li:hover {
	-webkit-transition: all .5s;
	transition: all .5s;
}

#headnav > ul > li > a {
	display: block;
	color: #333;
	font-family: 'Lora', serif;
	letter-spacing: 0.1em;
}

#headnav > ul > li a:hover {
	color: #43ACC7;
}
#headnav > ul > li > ul{
	border-top:1px solid #777;
	background-color: #fff;
	visibility: hidden;
	opacity: 0;
	z-index: 1;
	position: absolute;
	top: 40px;
	left: 0;
	box-sizing: border-box;
	width: 1000px;
	width: 760px\9;
	padding: 15px 120px 35px 120px;
	-webkit-transition: all .2s ease;
	transition: all .2s ease;
	margin:0px;
}
#headnav > ul > li:hover > ul{
	top: 40px;
	visibility: visible;
	opacity: 1;
}
#headnav > ul > li > ul > li{
	float: left;
	height:30px;
	width: 190px;
	border: none;
	padding:0px;
	margin:0px;
	text-align: left;
	font-family:"メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, sans-serif;
}
#headnav > ul > li > ul > li > a{
	display: block;
	padding: 5px 15px;
}
#headnav > ul > li > ul > li > a:hover{
	color:#43ACC7;
}
#headnav > ul > li > ul > li.bold{
	width:760px;
	float: none;
	text-align: left;
	margin:20px 0px -10px 0px;
}

.bold{
	font-weight: bold;
	margin-top:20px;
}

#top{
	width:100%;
	height: 500px;
	overflow: hidden;
	background:#ddd url(top-back.jpg) no-repeat center center;
	background-size: cover;
}
#top #toptxt{
	position: relative;
	left:70%;
	display: table-cell;    
	vertical-align: middle;
	text-align: center;
	width: 200px;
	height:380px;
	background-color:rgba(0,20,50,0.7);   
}
#top #toptxt h2{
	font-family: 'Lora', serif;
	letter-spacing: 0.1em;
	color: #fff;
	line-height: 1.0em;
	margin: 25px auto 10px auto;
}
#top #toptxt p{
	color: #fff;
	margin: 10px auto;
	font-size: 85%;
	letter-spacing: 0.1em;
	line-height: 1.5em;
}
#topnav ul{
	width: 780px;
	margin: 20px auto;
}
#topnav ul li a{
	display: inline-block;
	float: left;
	padding: 10px 45px;
	text-align: center;
	border-right:1px solid #ddd;
}
#topnav ul li:first-child + * + * + * a{
	border: none;
}

#main {
	width:960px;
	margin: 0px auto;
}
#main hr{
	width:100%;
	margin:50px;
}
h3{
	font-size: 180%;
	font-family: 'Lora', serif;
	letter-spacing: 0.1em;
	text-align: center;
	margin: 60px auto;
	line-height: 1.8em;
}
h3 span{
	font-size: 50%;
	line-height: 1.0em;
	font-family:"メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, sans-serif;
}

#index_exp {
	width: 860px;
	margin: 50px auto;
}
#index_exp div{
	display: block;
	float: left;
	width:380px;
	margin:20px;
}
#index_exp div img{
	width: 100%;
}
#index_exp div strong{
	font-family: 'Lora', serif;
	font-size:180%;
	letter-spacing:0.1em;
	width:250px;
	padding:50px auto;
	text-align:center;}

#index_exp div strong span{
	font-family:"メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, sans-serif;
	font-weight:normal;
	font-size:50%;
	padding-left:10px;}
#index_exp div p{
	margin: 20px auto;
}
#index_exp div p a{
	display: block;
	padding:10px;
	text-align: center;
	border:1px solid #333;
}
#index_exp div p a:hover{
	border:1px solid #43ACC7;
}

#main #menu ul{
	width:750px;
	margin: 0px auto;
}
#main #menu ul li a{
	display: block;
	float: left;
	width:210px;
	margin: 20px;
}
#main #menu ul li a p{
	margin: 10px;
	text-align: center;
	font-weight: bold;
}
#main #menu ul li a:hover img{
	opacity:0.8;
	filter:alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}

#main #menu_lineup ul{
	width:750px;
	margin: 0px auto;
}
#main #menu_lineup ul li a{
	display: block;
	float: left;
	width:210px;
	margin: 20px;
}
#main #menu_lineup ul li a p{
	margin: 10px;
	text-align: center;
	font-size: 85%;
	line-height: 1.4em;
}
#main #menu_lineup ul li a p span{
	text-align: center;
	
	font-family: 'Lora', serif;
	font-size: 150%;
	letter-spacing: 0.1em;
	line-height: 2.0em;
}
#main #menu_lineup ul li a img{
	width: 100%;
}
#main #menu_lineup ul li a:hover img{
	opacity:0.8;
	filter:alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}

#main #menu_lineup h3{
	font-size: 180%;
	font-family: 'Lora', serif;
	letter-spacing: 0.1em;
	text-align: center;
	margin: 60px auto;
	line-height: 1.8em;
}
#main #menu_lineup h3 span{
	font-size: 50%;
	line-height: 1.0em;
	font-family:"メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka, sans-serif;
}

#main #allitems h4{
	display: inline-block;
	font-size: 120%;
	font-family: 'Lora', serif;
	color: #fff;
	line-height: 1.0em;
	background-color: #333;
	padding: 15px 30px 10px 30px;
	margin: 0px;
	text-align: left;
}
#main #allitems h4 span{
	font-size: 160%;
	margin-right: 10px;
}
#main #allitems ul{
	width:880px;
	margin: 0px auto;
}
#main #allitems ul li{
	display: block;
	float: left;
	margin:35px;
	width:150px;
}
#main #allitems ul li a{
	display: block;
	overflow: hidden;
}
#main #allitems ul li a img{
	width:100%;
}
#main #allitems ul li a:hover img{
	opacity:0.7;
	filter:alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}
#main #allitems ul li a p{
	line-height: 1.2em;
	margin:10px auto;
	color: #000;
}
#main #allitems ul li a p span{
	font-size: 70%;
}
#main #allitems ul.tablelist {
	margin:40px;
}
#main #allitems ul.tablelist li{
	width: 85px;
	margin:20px;
}

#main ul#point_menu {
	width:760px;
	margin: 0px auto;
}
#main ul#point_menu li a{
	display: block;
	float: left;
	width:150px;
	padding:20px;
}
#main ul#point_menu li a p{
	line-height: 2.0em;
	font-family: 'Lora', serif;
	letter-spacing: 0.1em;
	font-size: 130%;
	font-weight: bold;
}
#main ul#point_menu li a p.point{
	font-size: 85%;
	line-height: 1.8em;
	font-weight: normal;
}
#main ul#point_menu li a p span{
	font-size:180%;
	padding-right: 10px;
	font-weight: normal;
}
#main ul#point_menu li a:hover{
	color:#000;
	background-color: #eee;
}

.expbox {
	width: 860px;
	margin: 50px auto;}
.expbox div{
	display: block;
	float: left;
	width:380px;
	margin:20px;}
.expbox div img{
	width: 100%;}
.expbox li{
	margin-bottom: 10px;
}
.expbox li p{
	font-size: 100%;
	line-height: 2.0em;
	letter-spacing: 0.1em;
	margin-top: 5px;
	margin-bottom:50px;
}
.expbox li.title p{
	line-height: 2.0em;
	font-family: 'Lora', serif;
	letter-spacing: 0.1em;
	font-size: 130%;
	font-weight: bold;
	margin-top: 0px;
	margin-bottom: 0px;
}
.expbox li.title p.point{
	font-size: 85%;
	line-height: 1.8em;
	font-weight: normal;
}
.expbox li.title span{
	font-size:180%;
	padding-right: 10px;
	font-weight: normal;
}
.expbox li h4{
	font-weight: bold;
	font-size: 120%;
	font-family: 'Lora', serif;
	letter-spacing: 0.1em;
	line-height: 1.0em;
}
.expbox li h4 span{
	font-size: 85%;
	font-weight: normal;
	line-height: 1.5em;
}


ul#alldesign {
	width:600px;
	margin: 0px auto;
}
ul#alldesign li a{
	display: inline-block;
	float: left;
	width:65px;
	margin:10px;
}
ul#alldesign li a:hover img{
	opacity:0.8;
	filter:alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}

.designbox {
	width: 860px;
	margin: 50px auto;}
.designbox div{
	display: block;
	float: left;
	width:380px;
	margin:20px;}
.designbox div.imgs img{
	width: 100%;}
.designbox li{
	margin-bottom: 20px;
}
.designbox li p{
	font-size: 100%;
	line-height: 2.0em;
	letter-spacing: 0.1em;
}
.designbox li.title p{
	line-height: 2.0em;
	font-family: 'Lora', serif;
	letter-spacing: 0.1em;
	font-size: 130%;
	font-weight: bold;
	margin-top: 0px;
	margin-bottom: 0px;
}
.designbox li.title p.point{
	font-size: 85%;
	line-height: 1.8em;
	font-weight: normal;
}
.designbox li.title span{
	font-size:180%;
	padding-right: 10px;
	font-weight: normal;
}
.designbox li h4{
	font-weight: bold;
	font-size: 120%;
	font-family: 'Lora', serif;
	letter-spacing: 0.1em;
	line-height: 1.0em;
}
.designbox li a{
	display: block;
	padding: 10px;
	border: 1px solid #ccc;
	border-bottom:none;
}
.designbox li a:last-child{
	border: 1px solid #ccc;
}
.designbox li a:hover{
	background-color: #eee;
}

#main .hrefbox{
	display: block;
	padding:10px;
	text-align: center;
	border:1px solid #333;
	margin:100px auto 200px auto;
}
#main a.hrefbox:hover{
	border:1px solid #43ACC7;
}

#request {
	width: 100%;
	margin: 0px auto;
}
#request .wrap{
	width:700px;
	margin: 0px auto 100px auto;
}


#request {
	font-family:'Poppins', sans-serif;
	padding:0px auto 50px auto;
	margin:50px auto 0px auto;
	text-align:center;}

#request a{
	border-bottom:1px dotted #333;
	text-align:center;}

#request a:hover{
	border-bottom:1px dotted #43ACC7;
	text-align:center;}

#request ul{
	width:600px;
	margin:30px auto;
	padding:0px auto;}

#request ul li.left{
	width:30%;
	display:block;
	float:left;
	margin:5px;
	text-align:left;}

#request ul li.right{
	width:65%;
	display:block;
	float:left;
	margin:10px;
	text-align:left;}


#request [type="submit"]{
	text-align:right;
	appearance: none;
	padding:10px 20px;
	background-color:#fff;
	border:1px solid #333;}

#request [type="submit"]:hover{
	border:#43ACC7 1px solid;
	color:#43ACC7;}

#request a:hover img{
	opacity:0.8;
	filter:alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";}

#attention {
	margin: 50px auto;
}
#attention ul{
	width:960px;
	margin: 0px auto 200px auto;
	border: 1px solid #fff;
}
#attention ul li{
	display: block;
	float: left;
	width:278px;
	height: 200px;
	padding: 20px;
	border-right: 1px dotted #ccc;
	border-bottom: 1px dotted #ccc;
}
#attention ul li:nth-child(3n){
	border-right: none;
}
#attention ul li h4{
	font-size: 130%;
	font-family: 'Lora', serif;
	letter-spacing: 0.1em;
	line-height: 1.0em;
	font-weight: bold;
	margin:10px auto;
}

#menu_size ul {
	width:890px;
	margin: 0px auto;
}
#menu_size ul li a{
	display: block;
	float: left;
	margin:20px;
	text-align: center;
}
#menu_size ul li a p{
	font-size: 110%;
	font-family: 'Lora', serif;
	font-weight: bold;
	letter-spacing: 0.1em;
	line-height: 1.4em;
	margin-top: 10px;
}
#menu_size ul li a p span{
	font-weight: normal;
	font-size: 80%;
}

.sizebox {
	width: 860px;
	margin: 50px auto;}
.sizebox div{
	display: block;
	float: left;
	width:380px;
	margin:20px;}
.sizebox div img{
	width: 100%;}
.sizebox li{
	margin-bottom: 10px;
}
.sizebox li p{
	font-size: 100%;
	line-height: 2.0em;
	letter-spacing: 0.1em;
	margin-top: 5px;
	margin-bottom:0px;
}
.sizebox li.title p{
	line-height: 2.0em;
	font-family: 'Lora', serif;
	letter-spacing: 0.1em;
	font-size: 130%;
	font-weight: bold;
	margin-top: 0px;
	margin-bottom: 0px;
}
.sizebox li.title p.point{
	font-size: 85%;
	line-height: 1.8em;
	font-weight: normal;
}
.sizebox li.title span{
	font-size:180%;
	padding-right: 10px;
	font-weight: normal;
}
.sizebox li h4{
	font-weight: bold;
	font-size: 120%;
	font-family: 'Lora', serif;
	letter-spacing: 0.1em;
	line-height: 1.0em;
}
.sizebox li h4 span{
	font-size: 85%;
	font-weight: normal;
	line-height: 1.5em;
}

.size_pattern .title{
	letter-spacing: 0.1em;
	font-size: 110%;
	border-bottom: 1px dotted #ccc;
	margin-bottom: 20px;
}
.size_pattern {
	width:600px;
	margin: 0px auto 50px auto;
}
.size_pattern ul li a{
	display: block;
	float: left;
	width:90px;
	margin: 5px 15px;
}
.size_pattern ul li a:hover img{
	opacity:0.8;
	filter:alpha(opacity=70);
	-ms-filter: "alpha( opacity=70 )";
}




.bottom-menu {
	position: fixed;
	bottom: 10px;
	right: 10px;
	border-radius:5px;
	background-color:#333;
	color:#fff;}

.bottom-menu ul li{
	display:block;
	margin:0px;
	width:150px;
	text-align:center;
	font-size:90%;}

.bottom-menu ul li:first-child{
	border-bottom:1px dashed #fff;}

.bottom-menu ul li a{
	display:block;
	color:#fff;
	padding:20px;
	border-radius:5px;}

.bottom-menu ul li a:hover{
	background-color:#666;
	padding:20px;
	border-radius:5px;}

#footer {
	width:100%;
	background-color:#eff5f5;
	border-top:#a0c0bd solid 1px;
	text-align: left;
	padding: 10px 0px 20px 0px;
}
#footer > div {
	width:960px;
	margin:50px auto 10px auto;
}
#footer > div #footer_contact{
	width:800px;
	background-color: #fff;
	margin: 0px auto;
	padding: 20px;
}
#footer > div #footer_contact li{
	display: block;
	float: left;
	width:355px;
	padding: 20px;
	text-align: center;
}
#footer > div #footer_contact li:first-child{
	border-right:1px solid #ccc;
}
#footer > div #footer_contact li p.tel{
	font-family: 'Lora', serif;
	font-size: 170%;
	font-weight: bold;
	letter-spacing: 0.1em;
	margin: 5px auto;
}
#footer > div #footer_contact li a{
	display: block;
	width:230px;
	padding: 10px;
	margin: 5px auto;
	background-color: #82a4a0;
	font-size: 110%;
	font-family: 'Lora', serif;
	letter-spacing: 0.1em;
	color: #fff;
}
#footer > div #footer_contact li a:hover{
	background-color: #9ab5b2;
	color: #fff;
}

#footer > div .footermenu{
	display: block;
	float: left;
	margin: 40px;
}
#footer > div .footermenu li:first-child{
	font-size: 110%;
	font-weight: bold;
	font-family: 'Lora', serif;
	letter-spacing: 0.1em;
	margin:10px 0px;
}
#footer #copyright{
	color: #9ab5b2;
	font-family: 'Lora', serif;
	letter-spacing: 0.1em;
	font-size: 85%;
	text-align: center;
	margin: 0px auto;
	line-height: 1.8em;
	width:100%;
	padding: 20px auto;
}

.clear { clear:both; }  
.clear hr { display:none; }  
.clearfix:after {
	content: "";
	clear: both;
	display: block;
}