@charset "utf-8";

/*
@font-face {
    font-family: GenJyuuGothic-Bold;
    src: url(../font/GenJyuuGothic-Bold.ttf) format('truetype')
}
*/
@font-face {
    font-family: KaiseiOpti-Bold;
    src: url(../font/KaiseiOpti-Bold.ttf) format('truetype')
}

#pagetop a:hover,
.global-nav li a:hover,
.shake:hover {
    display: block;
    animation: shake .15s 3
}

@keyframes shake {
    0% {
        transform: translate(0, 0) rotateZ(0)
    }

    50% {
        transform: translate(1px, 1px) rotateZ(3deg)
    }

    100% {
        transform: translate(0, 0) rotateZ(0)
    }
}

html {
    font-size: 62.5%
}

body {
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", "Meiryo", sans-serif;
    font-size: 1.6rem;
    -webkit-text-size-adjust: 100%;
    color: #231815;
    background-color: #e2d9cd
}

img {
    outline: 0;
    border-style: none
}

a {
    color: #231815;
    text-decoration: none
}

a:visited {
    color: #231815
}

a:hover {
    color: #f5a862
}

header {
    margin-bottom: 25px
}

header .head-wrap {
    position: relative;
    width: 962px;
    margin: 2px auto 0
}

header .head-logo {
    text-align: center
}

header .head-logo img {
    width: 400px;
    height: 70px
}

header .top-contact {
    position: absolute;
    top: -2px;
    right: 1px
}

header .top-contact a {
    position: relative;
    display: block;
    box-sizing: border-box;
    width: 192px;
    height: 66px;
    padding-top: 36px;
    background: url(../img/common/header_contact_bg.png) no-repeat top center #23923a;
    color: #fff;
    /*    font-family: GenJyuuGothic-Bold;*/
    font-family: "Yu Gothic", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
    letter-spacing: 1px;
    font-weight: bolder;
    text-align: center;
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
    transition: all .3s 0s ease;
    z-index: 2
}

header .top-contact a:hover {
    background: url(../img/common/header_contact_bg.png) no-repeat top -30px center #307f1c;
    height: 70px;
    transition: all .3s 0s ease
}

.global-nav_wrap {
    width: 962px;
    margin: 0 auto 15px
}

.global-nav ul {
    background: url(../img/common/gnav_line.gif) no-repeat top 2px left 0
}

.global-nav li {
    float: left;
    width: 192px;
    text-align: center;
    background: url(../img/common/gnav_line.gif) no-repeat top 2px right 0
}

.global-nav a {
    display: block;
    /*    font-family: GenJyuuGothic-Bold;*/
    font-family: "Yu Gothic", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
    font-weight:bolder;
    font-size: 1.6rem;
    color: #603813;
    box-sizing: border-box;
    background: url(../img/common/gnav_icon.png) no-repeat left 15px top 0;
    padding: 7px 25px;
    transition: all .3s 0s ease
}

.global-nav a:hover {
    color: #b94315;
    transition: all .3s 0s ease
}

.under .global-nav {
    background: #806042
}

.under .global-nav_wrap {
    margin-bottom: 0;
    padding: 0
}

.under .global-nav ul {
    box-sizing: border-box;
    background-image: none;
    background: url(../img/common/gnav_line_w.gif) no-repeat top 18px left
}

.under .global-nav li {
    box-sizing: border-box;
    background: url(../img/common/gnav_line_w.gif) no-repeat top 18px right
}

.under .global-nav li:hover {
    background-color: rgba(96, 56, 19, .6)
}

.under .global-nav a {
    display: block;
    padding: 22px 0 20px;
    color: #fff;
    background-position: left 15px top 14px
}

.under .global-nav a:hover {
    color: #fff
}

.section-ttl {
    text-align: center;
    letter-spacing: 1.5px;
    font-size: 2.5rem;
    font-weight: 100;
    color: #603813;
    margin: 0 0 20px;
    padding-top: 20px
}

.section-ttl span {
    font-size: 1.4rem;
    font-family: "Hiragino Mincho ProN" ,"Yu Mincho", "YuMincho", "MS PMincho", serif;
}

.local_nav_wrap {
    position: relative;
    width: 960px;
    margin: 20px auto 0
}

main .local_nav {
    z-index: 1000;
    position: -webkit-sticky;
    position: sticky;
    top: 0
}

main .local_nav ul {
    position: relative;
    top: 30px;
    right: 30px;
    background: rgba(255, 255, 255, .7);
    padding: 10px 0;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    float: right
}

.contents-area {
    width: 962px;
    margin: 0 auto 22px
}

.contents-area li {
    background: #fff;
    float: left;
    width: 227px;
    height: 350px;
    margin-right: 18px;
    box-sizing: border-box
}

.contents-area li:last-child {
    margin-right: 0
}

.contents-area a {
    display: block;
    height: 100%;
    color: #231815
}

.contents-area .contents_img {
    height: 140px;
    overflow: hidden
}

.contents-area a img {
    -moz-transition: -moz-transform .3s ease;
    -webkit-transition: -webkit-transform .3s ease;
    -o-transition: -o-transform .3s ease;
    -ms-transition: -ms-transform .3s ease;
    transition: transform .3s ease
}

.contents-area a:hover img {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1)
}

.contents-area h3 {
    font-family: KaiseiOpti-Bold;
    font-size: 2.3rem;
    text-align: center;
    color: #603813;
    padding: 25px 0 5px
}

.contents-area a:hover h3 {
    color: #934315
}

.contents-area p {
    line-height: 1.8;
    padding: 0 15px 15px
}

.banner-area {
    background: #cfc3b8;
    padding: 30px 0;
    border-top: 2px solid #e2d9cd
}

.banner-area .banner-wrap {
    width: 962px;
    margin: 0 auto
}

.banner-area li {
    float: left;
    margin-right: 19px
}

.banner-area li:last-child {
    margin-right: 0
}

.banner-area a {
    opacity: 1;
    transition: all .3s 0s ease
}

.banner-area a:hover {
    opacity: .7;
    transition: all .3s 0s ease
}

footer {
    background-color: #9a826b;
    padding-top: 36px
}

.foot-wrap {
    position: relative;
    bottom: -10px;
    background: url(../img/common/foot_bg_wmash.png) no-repeat left bottom;
    width: 962px;
    margin: 0 auto;
    padding-bottom: 25px;
    color: #fff
}

.foot-nav {
    padding-left: 65px;
    margin-bottom: 28px
}

.foot-nav li {
    float: left;
    text-align: center;
    border-right: 1px solid #fff
}

.foot-nav li:last-child {
    border-right: none
}

.foot-nav a {
    /*    font-family: GenJyuuGothic-Bold;*/
    font-family: "Yu Gothic", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
    font-weight:bolder;
    font-size: 1.6rem;
    color: #fff;
    box-sizing: border-box;
    padding: 0 24px;
    transition: all .3s 0s ease
}

.foot-nav a:hover {
    color: #603813;
    text-decoration: underline;
    transition: all .3s 0s ease
}

.foot-logo {
    text-align: center;
    margin-bottom: 5px
}

.foot-logo img {
    width: 400px
}

.address {
    text-align: center;
    font-size: 1.4rem;
    line-height: 1.6
}

.copy {
    color: #fff;
    font-size: 1.2rem;
    text-align: center;
    background-color: #8a6e55;
    line-height: 54px
}

#pagetop {
    position: fixed;
    right: 30px;
    bottom: 30px
}

#pagetop a {
    position: relative;
    display: block;
    transition: all .3s 0s ease
}

#pagetop a:hover {
    opacity: .7;
    transition: all .3s 0s ease
}

.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    height: 0;
    visibility: hidden
}