@charset "UTF-8";
/* CSS Document */


@font-face {
	font-family: 'MyFont';
	src: url(../font/NotoSansCJKjp-Regular.otf);
}

body{
	font-family:meiryo;
	font-size:15px;
	color:#000000;
	background:#ffffff;
}

h1,h2,h3,h4,h5,h6 {  
}  
p,li,dt,dl {  
    line-height:1.8;  
}  

img {
	border: none;
	vertical-align: bottom;
}

a img { 
	border: none;
    -webkit-transition: 0.3s ease-in-out; 
    -moz-transition: 0.3s ease-in-out; 
    -o-transition: 0.3s ease-in-out; 
    transition: 0.3s ease-in-out;  
}

a:hover img{
	opacity:0.5;
	filter:alpha(opacity=50);
	-ms-filter: "alpha( opacity=50 )";
}

ul {
	list-style-type: none;
}

.clearfix:before,
.clearfix:after {
	content: "";
	display: block;
	overflow: hidden;
}

.clearfix:after {
	clear: both;
	overflow: hidden;
}

.area{
	width:950px;
	margin:0 auto;
}

table{
	border-collapse:collapse;
}

.left-box{
	float:left;
}

.right-box{
	float:right;
}

.center{
	text-align:center;
}

.section{
	margin-top:50px !important;
}

.pc{
	display:block !important;
}

.mobile{
	display:none !important;
}

/*--------------------------------------
    header
--------------------------------------*/

#header{
	height:128px;
	background:url(../img/texture_01.png) repeat-x 0 0;
}

#header .area .content{
	height:90px;
	width:950px;
	position:relative;
}

#header .area .content h1{
	position:absolute;
	top:41px;
	left:4px;
}

#header .area .content h1 a:hover img{
	opacity:1;
	filter:alpha(opacity=100);
	-ms-filter: "alpha( opacity=100 )";
}

#header .area .content .description{
	position:absolute;
	top:6px;
	right:0px;
	color:#959595;
	font-size:0.75em;
}

#header .area .content .banner{
	position:absolute;
	top:39px;
	right:0px;
	background:url(../img/banner_01_on.png) no-repeat 0 0;
}

#header .area .content .banner a:hover img{
	opacity:0;
	filter:alpha(opacity=0);
	-ms-filter: "alpha( opacity=0 )";
}

#header .area .g-nav{
	height:38px;
}

#header .area .g-nav ul{
	margin:0 0 0 -10px;
}

#header .area .g-nav ul li{
	float:left;
	width:150px;
	margin:0 0 0 10px;
	text-align:center;
}

#header .area .g-nav ul li:hover{
	border-bottom:2px solid #996c33;
}

#header .area .g-nav ul li a{
	color: #FFFFFF;
	padding-top:7px;
	display:block;
}

#header .area .g-nav ul li a:hover {
	color: #b28850;
}

/*--------------------------------------
    page-title
--------------------------------------*/

.page-title{
	padding:25px 0;
	background:url(../img/texture_03.png) repeat-x 0 0;
}

.page-title .area h1{
	margin:0 0 0 19px;
}

/*--------------------------------------
    breadcrumbs
--------------------------------------*/

.breadcrumbs{
	background:#626262;
	padding:10px 0;
}

.breadcrumbs .area p{
	margin:0 0 0 19px;
	line-height:1;
}

.breadcrumbs .area p,
.breadcrumbs .area p a{
	color:#ffffff;
	font-size:0.85em;
}

/*--------------------------------------
    main-content
--------------------------------------*/

.main-content .area h2{
	display:block;
	text-align:center;
	border-bottom:1px solid #996c33;
	padding-bottom:12px;
	margin:0 0 15px;
}

.main-content .area .comment{
	margin:40px 0;
}

/*--------------------------------------
    footer
--------------------------------------*/

#footer .contact.area h2{
	display:block;
	text-align:center;
	border-bottom:1px solid #996c33;
	padding-bottom:12px;
}

#footer .contact .first {
	margin:0 0 30px -15px;
}

#footer .contact .first li{
	height:83px;
	font-size:1.2em;
	float:left;
}

#footer .contact .first li.list-first{
	margin:10px 0 0 15px;
}

#footer .contact .first li.list-second{
	margin:25px 0 0 18px;
}

#footer .contact .first li.list-third{
	margin:18px 0 0 19px;
	background:url(../img/banner_02_on.png) no-repeat 0 0;
}

#footer .contact .first li.list-third a:hover img{
	opacity:0;
	filter:alpha(opacity=0);
	-ms-filter: "alpha( opacity=0 )";
}

#footer .contact .second{
	width:580px;
	margin:0 auto;
}

#footer .contact .second ul{
	margin:0 0 0 -80px;
}

#footer .contact .second ul li{
	float:left;
	margin:0 0 0 80px;
}

#footer .f-nav{
	height:50px;
	background:#626262;
}

#footer .f-nav ul{
	margin:0 0 0 -56px;
	padding:12px 0 0;
}

#footer .f-nav ul li{
	margin:0 0 0 56px;
	float:left;
}

#footer .f-nav ul li a{
	color: #FFFFFF;
}

#footer .bottom{
	background:url(../img/texture_02.png) repeat-x 0 0;
}

#footer .bottom .area{
	height:180px;
	position:relative;
}

#footer .bottom .area .privacy{
	position:absolute;
	top:10px;
	right:0px;
	font-size:0.9em;
}

#footer .bottom .area .privacy a{
	color:#FFFFFF;
}

#footer .bottom .area .copy{
	position:absolute;
	top:45px;
	right:0px;
	font-size:0.85em;
	color:#a0a0a0;
}

#footer .bottom .area #page-top{
	position:fixed;
	bottom:50px;
	right:50px;
	display:none;
}

@media (max-width: 740px) {
img{
	max-width:100%;
	height:auto;
}

.left-box,.right-box{
	float:none;
}

.area{
	width:100%;
	margin:0;
}

.pc{
	display:none !important;
}

.mobile{
	display:block !important;
}

.section{
	margin-top:50px !important;
}

a:hover img{
	opacity:1 !important;
	filter:alpha(opacity=100) !important;
	-ms-filter: "alpha( opacity=100 )" !important;
}

/*--------------------------------------
    header
--------------------------------------*/

#header{
	height:107px;
	background:url(../img/texture_04.png) repeat-x 0 0;
}

#header .area .content{
	height:107px;
	width:100%;
	padding:0;
	position:relative;
}

#header .area .content h1{
	position:absolute;
	top:47px;
	left:2%;
}

#header .area .content .description{
	top:5px;
	right:2%;
	line-height:1.1;
	text-align:right;
}

#header .area .content .banner{
	display:none;
}

#header .area .g-nav{
	display:none;
}

/*--------------------------------------
    main-content
--------------------------------------*/

.main-content{
	padding:0 2%;
}

.main-content .area .comment{
	margin:30px 0;
}

/*--------------------------------------
    footer
--------------------------------------*/

#footer .contact{
	padding:0 2%;
}

#footer .contact .first {
	margin:0 0 30px;
}

#footer .contact .first li{
	height:auto;
	float:none;
	text-align:center;
}

#footer .contact .first li.list-second{
	margin:0;
	background:none;
}

#footer .contact .first li.list-third{
	margin:10px 0 0;
	background:none;
}

#footer .contact .first li.list-first{
	text-align:left;
	width:100%;
	max-width:306px;
	margin:10px auto 15px;
}

#footer .contact .second{
	width:100%;
	max-width:241px;
	margin:0 auto;
}

#footer .contact .second ul{
	margin:0 0 -30px;
}

#footer .contact .second ul li{
	float:none;
	margin:0 0 30px;
}

#footer .contact .second ul li a{
	display:block;
	text-align:center;
}

#footer .f-nav{
	height:auto;
	padding:0 5%;
}

#footer .f-nav ul{
	margin:0 0 -20px;
	padding:10px 0;
}

#footer .f-nav ul li{
	margin:0 0 20px;
	width:50%;
}

#footer .f-nav ul li.end{
	width:100%;
}

#footer .f-nav ul li a{
	display:block;
}

#footer .bottom{
	background:#313131;
	text-align:right;
}

#footer .bottom .area{
	height:auto;
	position:relative;
	padding:0 0 100px;
}

#footer .bottom .area .copy{
	position:static;
	padding:0 2%;
}

#footer .bottom .area .privacy{
	position:static;
	display:block;
	padding:10px 5%;
	text-align:left;
	line-height:1.5;
	border-bottom:1px solid #b28850;
}

#footer .bottom .area .privacy a{
	text-align:left !important;
}

#footer .bottom .area .copy{
	margin:10px 0;
	line-height:1.5;
}

#footer .bottom .area #page-top{
	bottom:40px;
	right:10px;
}


}