@charset "UTF-8";
@import "base.css";
@import "fonts.css";
/*==========================================================================*/
/*//////////////////////////////////////////////////////////////////////////*/
/*//////                                                              //////*/
/*//////  Copyright (C) 2009 株式会社フリーセル All Rights Reserved.  //////*/
/*//////                                                              //////*/
/*//////////////////////////////////////////////////////////////////////////*/
/*                                                                          */
/*    base.css  --> スタイルの初期設定を行うため、変更しないで下さい。      */
/*    fonts.css --> フォントの初期設定を行うため、変更しないで下さい。      */
/*                                                                          */
/*==========================================================================*/
/*==========================================================================*/
/*                           Common-Setting                                 */
/*==========================================================================*/
/* 基本タグのフォントサイズを指定（12px -> 120% or 1.2em ） */
h1, h2, h3, h4, h5, h6, input, button, textarea, select, p, blockquote, table, pre, address, ul, ol, dl {
    font-size: 140%;
}
dt img, dd img, li img {
    vertical-align: bottom;
}
.section {
    padding: .5em 1em 1em;
}
.section .section {
    padding: .5em .5em 1em;
}
.image_l {
    float: left;
    margin: 0 10px 8px 0;
}
.image_r {
    float: right;
    margin: 0 0 8px 10px;
}
a {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
/* IE7で本文の中にテキストリンクを貼ると、ズーム時にテキストが重なるというバグがあるので、それを回避する為のハック */
*:first-child + html p {
    letter-spacing: 0;
}
/*----------------------------------------
■基本リンク
----------------------------------------*/
a:link {
    color: #2f6d57;
    text-decoration: none;
}
a:visited {
    color: #2f6d57;
    text-decoration: none;
}
a:hover {
    color: #2f6d57;
    text-decoration: underline;
}
a:active {
    outline: none;
}
/*----------------------------------------
■サブページテキスト幅
----------------------------------------*/
.text {
    padding: 0 0 1em 0;
}
/*==========================================================================*/
/*                            Container                                     */
/*==========================================================================*/
html {
    background: none;
}
body {
    color: #33180e;
    background: #FFF;
    position: relative;
}
/* マージン設定 */
.mt5 {
    margin-top: 5px !important;
}
.mt10 {
    margin-top: 10px !important;
}
.mt15 {
    margin-top: 15px !important;
}
.mt20 {
    margin-top: 20px !important;
}
.mt25 {
    margin-top: 25px !important;
}
.mt30 {
    margin-top: 30px !important;
}
.mt35 {
    margin-top: 35px !important;
}
.mt40 {
    margin-top: 40px !important;
}
.mt45 {
    margin-top: 45px !important;
}
.mt50 {
    margin-top: 50px !important;
}
.mt90 {
    margin-top: 90px !important;
}
.mb5 {
    margin-bottom: 5px !important;
}
.mb10 {
    margin-bottom: 10px !important;
}
.mb15 {
    margin-bottom: 15px !important;
}
.mb20 {
    margin-bottom: 20px !important;
}
.mb25 {
    margin-bottom: 25px !important;
}
.mb30 {
    margin-bottom: 30px !important;
}
.mb35 {
    margin-bottom: 35px !important;
}
.mb40 {
    margin-bottom: 40px !important;
}
.mb45 {
    margin-bottom: 45px !important;
}
.mb50 {
    margin-bottom: 50px !important;
}
#wrapper_cover {
    width: auto;
    min-width: 980px;
    height: auto;
    padding: 0;
    margin: auto 0;
    text-align: center;
}
#wrapper {
    width: 100%;
    height: auto;
    padding: 0;
    margin: 0 auto;
    background: url(../images/bg.jpg) repeat;
    text-align: left;
}
#main {
    width: 980px;
    margin: 0 auto 100px;
    overflow: hidden;
    position: relative;
}
/*==========================================================================*/
/*                               Header                                     */
/*==========================================================================*/
#outer_header {
    width: 100%;
    height: 78px;
    background: url(../images/h_bg.jpg) repeat-x;
}
#header {
    width: 980px;
    height: 78px;
    margin: 0 auto;
    position: relative;
}
#header h1 {
    width: 980px;
    height: 14px;
    margin: 0 auto;
    padding-top: 9px;
    font-size: 10px;
    color: #a89684;
}
#header .logo {
    position: absolute;
    top: 24px;
    left: 0;
}
#header .contact {
    position: absolute;
    top: 21px;
    right: 0;
}
#header .tel {
    position: absolute;
    top: 43px;
    right: 126px;
}
#header .mail {
    position: absolute;
    top: 42px;
    right: 5px;
}
#cam {
    width: 125px;
    height: 154px;
    margin: 0;
    position: absolute;
    top: 440px;
    left: 848px;
    z-index: 100;
}
/*#cam2 {
	width:125px;
	height:125px;
	margin:0;
	position:absolute;
	top:410px;
	left:1330px;
	z-index:100;
}*/
#cam3 {
    width: 125px;
    height: 125px;
    margin: 0;
    position: absolute;
    top: 455px;
    left: 992px;
    z-index: 100;
}
#cam4 {
    width: 125px;
    height: 125px;
    margin: 0;
    position: absolute;
    top: 465px;
    left: 1146px;
    z-index: 100;
}
#cam5 {
    width: 125px;
    height: 125px;
    margin: 0;
    position: absolute;
    top: 435px;
    left: 1290px;
    z-index: 100;
}
#cam6 {
    width: 125px;
    height: 125px;
    margin: 0;
    position: absolute;
    top: 460px;
    left: 700px;
    z-index: 100;
}
#cam:hover, #cam2:hover, #cam3:hover, #cam4:hover, #cam5:hover, #cam6:hover {
    opacity: 0.9;
    filter: alpha(opacity=90);
    -ms-filter: "alpha(opacity=90)";
}
#container {
    width: 100%;
    text-align: center;
}
.loopslider {
    margin: 0 auto;
    width: 100%;
    height: 446px;
    text-align: left;
    position: relative;
    overflow: hidden;
}
.loopslider ul {
    /*	width: 100%;*/
    height: 446px;
    float: left;
    display: inline;
    overflow: hidden;
}
.loopslider ul li {
    width: 980px;
    height: 446px;
    float: left;
    display: inline;
    overflow: hidden;
}
.loopslider ul li.li1 {
    background: url(../images/slide01.jpg) no-repeat;
}
.loopslider ul li.li2 {
    background: url(../images/slide02.jpg) no-repeat;
}
.loopslider ul li.li3 {
    background: url(../images/slide03.jpg) no-repeat;
}
/* =======================================
	ClearFixElements
======================================= */
.loopslider ul:after {
    content: ".";
    height: 0;
    clear: both;
    display: block;
    visibility: hidden;
}
.loopslider ul {
    display: inline-block;
    overflow: hidden;
}
/*==========================================================================*/
/*                              Footer                                      */
/*==========================================================================*/
#outer_footer {
    width: 100%;
    height: 99px;
    text-align: center;
    background: url(../images/bg2.jpg) repeat-x;
}
#footer {
    width: 950px;
    height: 99px;
    margin: 0 auto;
    position: relative;
    text-align: left;
}
#footer .logo {
    width: 120px;
    height: 40px;
    margin: 0 auto;
    padding: 22px 0 5px 0;
}
.copy {
    font-size: 10px;
    text-align: center;
    color: #FFF;
}
.copy a {
    color: #FFF;
}
/*==========================================================================*/
/*                             Contents                                     */
/*==========================================================================*/
.alpha a:hover img {
    opacity: 0.8;
    filter: alpha(opacity=80);
    -ms-filter: "alpha(opacity=80)";
}
#page-top {
    position: fixed;
    bottom: 20px;
    right: 40px;
}
/* block */
.w980 {
    width: 980px;
    height: auto;
    overflow: hidden;
    position: relative;
}
/* index
------------------------------------------------------------------------*/
#photo_menu {
    width: 100%;
    height: 720px;
    background: url(../images/bg_photomenu.png) no-repeat center top;
}
#photo_menu .inner {
    width: 980px;
    height: 720px;
    position: relative;
    margin: 0 auto;
}
#photo_menu .inner .ttl {
    position: absolute;
    top: 349px;
    right: 234px;
}
#photo_menu .inner .img1 {
    position: absolute;
    top: 112px;
    left: 3px;
}
#photo_menu .inner .img2 {
    position: absolute;
    top: 92px;
    left: 215px;
}
#photo_menu .inner .img3 {
    position: absolute;
    top: 117px;
    left: 407px;
}
#photo_menu .inner .img4 {
    position: absolute;
    top: 79px;
    right: 196px;
}
#photo_menu .inner .img5 {
    position: absolute;
    top: 105px;
    right: 12px;
}
#photo_menu .inner .img6 {
    position: absolute;
    bottom: 71px;
    left: 0px;
}
#photo_menu .inner .img7 {
    position: absolute;
    bottom: 89px;
    left: 211px;
}
#photo_menu .inner .img8 {
    position: absolute;
    bottom: 97px;
    left: 404px;
}
#photo_menu .inner .img9 {
    position: absolute;
    bottom: 63px;
    right: 193px;
}
#photo_menu .inner .img10 {
    position: absolute;
    bottom: 77px;
    right: 0px;
}
#info {
    width: 500px;
    height: 180px;
    overflow: hidden;
    padding-right: 480px;
    margin-bottom: 35px;
    background: url(../images/bg_info.png) no-repeat top right;
}
#tiny {
    width: 480px;
    height: 120px;
    overflow: auto;
}
#tiny table {
    width: 420px;
    margin: 0 auto;
    font-size: 12px;
}
#tiny table tr {
    margin-bottom: 30px;
}
#tiny table th {
    width: 100px;
    padding: 12px 8px 12px;
    font-size: 13px;
    color: #665441;
}
#tiny table td {
    padding: 12px 8px 12px;
    font-size: 13px;
    color: #665441;
}
#tiny a:link {
    color: #665441;
    text-decoration: none;
}
#tiny a:visited {
    color: #665441;
    text-decoration: none;
}
#tiny a:hover {
    color: #665441;
    text-decoration: underline;
}
#tiny a:active {
    outline: none;
}
#kodawari {
    width: 980px;
    height: auto;
    overflow: hidden;
    padding-bottom: 60px;
    background: url(../images/bg_index1.png) no-repeat top center;
}
#kodawari h3 {
    padding: 53px 0 46px 253px;
}
#kodawari h4 {
    padding: 0 0 40px 253px;
}
#kodawari .txt {
    position: relative;
    padding: 0 20px 0 200px;
    line-height: 1.8;
}
#kodawari .txt .btn {
    position: absolute;
    bottom: 0;
    right: 0;
}
#about {
    width: 425px;
    height: 240px;
    float: left;
    background: url(../images/ibg_index2.png) no-repeat center;
    position: relative;
}
#about .img1 {
    position: absolute;
    top: 42px;
    right: 57px;
}
#about .img2 {
    position: absolute;
    top: 113px;
    right: 97px;
}
#about .img3 {
    position: absolute;
    top: 163px;
    right: 97px;
}
#about .img4 {
    position: absolute;
    top: 205px;
    right: 55px;
}
#flow {
    width: 555px;
    height: 240px;
    float: right;
    background: url(../images/ibg_index3.png) no-repeat center;
    position: relative;
}
#flow .img1 {
    position: absolute;
    top: 21px;
    left: 109px;
}
#flow .img2 {
    position: absolute;
    top: 70px;
    left: 37px;
}
#flow .img3 {
    position: absolute;
    top: 139px;
    left: 66px;
}
#subContent {
    margin: 10px 0 20px;
}
#subContent li.bnr01 {
    float: left;
}
#subContent li.bnr02 {
    float: right;
}
.blog_sec1 {
    width: 900px;
    margin: 5px auto;
}






























