@charset "utf-8";

/* 220328 tamaru セキュリティポリシー違反回避のためfontawesome等の読み込みをCDN方式からダウンロードファイル設置方式に変更 start */
@font-face {
  font-family: 'Lora';
  src: url("../font/Lora-Italic-VariableFont_wght.ttf") ;
}
/* 220328 tamaru セキュリティポリシー違反回避のためfontawesome等の読み込みをCDN方式からダウンロードファイル設置方式に変更 end */


/* Federico ver2017  common Style */


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
header,
hgroup,
section,
article,
aside,
hgroup,
footer,
figure,
figcaption,
nav  {
    margin: 0;
    padding: 0;
    /*background: transparent;*/
    border: 0;
    outline: 0;
}


ol, ul {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

:focus {
    outline: 0;
}

ins {
    text-decoration: none;
}

del {
    text-decoration: line-through;
}


a:link {
    color: #0075a9;
    text-decoration: underline;
}

a:visited {
    color: #0075a9;
    text-decoration: underline;
}

a:hover {
    color: #0075a9;
    text-decoration: none;
}

a:active {
    color: #0075a9;
    text-decoration: underline;
}


/* マージン */
.marT05 { margin-top: 5px; }
.marT10 { margin-top: 10px; }
.marT20 { margin-top: 20px; }
.marT30 { margin-top: 30px; }
.marT40 { margin-top: 40px; }
.marT60 { margin-top: 60px; }
.marB10 { margin-bottom: 10px; }
.marB20 { margin-bottom: 20px; }
.marB30 { margin-bottom: 30px; }
.marB40 { margin-bottom: 40px; }
.marB50 { margin-bottom: 50px; }
.marB60 { margin-bottom: 60px; }
.marB70 { margin-bottom: 70px; }
.marB80 { margin-bottom: 80px; }
.marL10 { margin-left: 10px; }
.marL20 { margin-left: 20px; }
.marR05 { margin-right: 5px; }
.marR10 { margin-right: 10px; }
.marR20 { margin-right: 20px; }

.marB00 { margin-bottom: 0 !important; }
.marR00 { margin-right: 0 !important; }

.marAout {
    margin-left: auto;
    margin-right: auto;
}

.padSide05 {
    padding-left: 5px;
    padding-right: 5px;
}
.padSide10 {
    padding-left: 10px;
    padding-right: 10px;
}

@media screen and (min-width: 900px) {
    a:hover img{
    opacity:0.65;
    filter:alpha(opacity=65);
    -ms-filter: "alpha( opacity=65 )";
    background:none!important;
    }
}
a:hover img.alphaNone {
opacity:1.0;
filter:alpha(opacity=100);
-ms-filter: "alpha( opacity=100 )";
background:none!important;
}

* html .clearfix {
    zoom: 1;
}

*+html .clearfix {
    zoom: 1;
}

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


/*フォーム要素のデフォルトスタイルをリセット*/
/*
*{
    -webkit-appearance: none;
}
*/

.ffMincho001 {
    font-family : "Times New Roman", "游明朝", YuMincho,"ヒラギノ明朝 Pr6 W6","Hiragino Mincho Pro", "HGS明朝E", "Sawarabi Mincho", "ＭＳ Ｐ明朝","MS PMincho","メイリオ",Meiryo, serif;
}
.ffEnSerif001 {
    font-family: 'Lora', "Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
}

.fcRed001 { color: red; }


.fonColLogo { color: #7c1d24; }

.txtAlignCen { text-align: center; }


/*============================================================

    BASE

==============================================================*/
#container{
    margin: 0 auto;
    text-align: left;
    box-sizing: border-box;
}

#mainContWrap001 {
    margin: 76px auto 40px;
}
.mainContInnerWrap {
    max-width: 984px;
    margin-left: auto;
    margin-right: auto;
    /*padding: 0 10px;*/
}
.borderGrayBox001 {
    box-sizing: border-box;
    border: 1px solid #CCC;
    padding: 10px;
    margin-top: 30px;
}
.bgGrayArticleBox001 {
    background: #f6f6f6;
    padding: 10px;
}
.frameWineredDoubleLine001 {
    box-sizing: border-box;
    border: 3px solid #7c1d24;
    padding: 1px;
}
.frameWineredDoubleLine001 .innerBox {
    box-sizing: border-box;
    border: 1px solid #7c1d24;
    padding: 10px;
}

@media screen and (min-width: 768px) {
    #mainContWrap001 {
    margin-top: 133px;
    }
    .borderGrayBox001 {
        padding: 20px;
    }
}


/*============================================================

    見出し

==============================================================*/
.articleEntryTitle001 {
    border-left: 6px solid #7c1d24;
    padding: 10px 12px 8px;
    font-size: 16px;
    font-weight: normal;
    color: #666;
    margin-bottom: 10px;
    letter-spacing: 1px;
    line-height: 0;
    line-height: 1.0;
}
.articleEntryTitle002 {
    font-size: 16px;
    border-bottom: 1px solid #7c1d24;
    padding-bottom: 10px;
    margin-bottom: 10px;
    font-weight: normal;
    color: #7c1d24;
    text-align: center;
}
.articleEntryTitle003 {
    font-size: 16px;
    border-bottom: 1px solid #333;
    padding-bottom: 10px;
    margin-bottom: 10px;
    font-weight: normal;
    color: #333;
    text-align: center;
}
@media screen and (min-width: 768px) {
    .articleEntryTitle001 {
        font-size: 22px;
        margin-bottom: 20px;
    }
    .articleEntryTitle002 {
        font-size: 22px;
    }
}


/*============================================================

    Header   and   EntryTitle

==============================================================*/
.topWellcomeTxtBox {
    width: 100%;
    background: #7c1d24;
}
.topWellcomeTxtBox p {
    color: #FFF;
    font-size: 9px;
    text-align: right;
    max-width: 924px;
    margin: 0 auto;
    padding: 2px 10px;
}
.topWellcomeTxtBox p a {
    text-decoration: none;
    margin-left: 15px;
    padding: 0px 20px;
    border-radius: 4px;
    font-weight: normal;
    -moz-transition: all 0.6s;
    -o-transition: all 0.6s;
    -webkit-transition: all 0.6s;
    transition: all 0.6s;
    background: #005bab;
    color: #FFF;
}
header .innerWrap {
    max-width: 924px;
    margin: 0 auto;
    padding: 10px;
    position: relative;
    background: #FFF;
}
header h1 {
    width: 80px;
    max-width: 190px;
    margin: 0;
    padding: 0;
}
header nav#headerNavInfo {
    position: absolute;
    right: 100px;
    top: 50%;
    margin-top: -23px;
}
header nav#headerNavInfo ul li {
    font-size: 9px;
    text-align: center;
}
header nav#headerNavInfo ul li:last-child {
    margin-top: 6px;
}
header nav#headerNavInfo ul li a {
    border-radius: 4px;
    border: 1px solid #7c1d24;
    color: #7c1d24;
    text-decoration: none;
    display: block;
    padding: 2px 10px 1px;
    background: #FFF;
    -moz-transition: all 0.6s;
    -o-transition: all 0.6s;
    -webkit-transition: all 0.6s;
    transition: all 0.6s;
}

header nav#headerNavCart {
    position: absolute;
    right: 60px;
    top: 50%;
    margin-top: -15px;
}
header nav#headerNavCart img {
    width: 30px;
}


/*===============
Gnav
*/
/*Gnabi開閉部分*/
#headerWrap {
    box-sizing: border-box;
    position: fixed;
    top: 0;
    width: 100%;
    background: #FFF;
    z-index: 9999;
    -webkit-font-smoothing: subpixel-antialiased;
}

.gnav {
    list-style-type: none;
    background: #eee;
    width: 100%;
    z-index: 999;
    padding: 10px 0;
    box-shadow: 0 3px 3px rgba(0,0,0,0.20);
}

#headerWrap .gnav ul {
    box-sizing: border-box;
    width: 100%;
    max-width: 964px;
    text-align: center;
    margin: 0 auto;
}
#headerWrap .gnav li {
    display: inline-block;
    *display: inline;
    zoom: 1;
    line-height: 0;
    line-height: 100%;
    margin: 10px 10px;
}
#headerWrap .gnav li a {
    text-decoration: none;
    color: #FFF;
    background: #7c1d24;
    padding: 6px 10px;
    border-radius: 4px;
    font-weight: normal;
    font-size: 9px;
    -moz-transition: all 0.6s;
    -o-transition: all 0.6s;
    -webkit-transition: all 0.6s;
    transition: all 0.6s;
}
#headerWrap .gnav .gnav0Btn02 {
    border-top: 1px dotted #aaa;
    margin-top: 6px;
    padding-top: 6px;
}
#headerWrap .gnav .gnav0Btn02 li {
}
#headerWrap .gnav .gnav0Btn02 li a {
    background: #005bab;
    color: #FFF;
}

/*ハンバーガーボタン*/
#headerWrap .icon-animation {
    width: 20px;
    height: 20px;
    display: block;
    cursor: pointer;
    float: right;
    position: absolute;
    right: 10px;
    text-align: center;
    top: 50%;
    margin-top: -10px;
}

#headerWrap .icon-animation span {
    width: 30px;
    height: 4px;
    display: block;
    background: #7c1d24;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -25px;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
    font-family:Arial, Helvetica, sans-serif;
    font-weight: bold;
}

#headerWrap .icon-animation .top {
    -webkit-transform: translateY(-13px);
    -ms-transform: translateY(-13px);
    transform: translateY(-13px);
}

#headerWrap .icon-animation .middle {
      background: none;
      font-size: 8px;
      color: #444;
      text-align: center;
      margin-top: -2px;
      line-height: 1.0;
}

#headerWrap .icon-animation .bottom {
    -webkit-transform: translateY(13px);
    -ms-transform: translateY(13px);
    transform: translateY(13px);
}

#headerWrap .is-open .middle {
    background: rgba(51, 51, 51, 0);
    text-indent: 9999px;
}

#headerWrap .is-open .top {
    -webkit-transform: rotate(-45deg) translateY(0px);
    -ms-transform: rotate(-45deg) translateY(0px);
    transform: rotate(-45deg) translateY(0px);
}

#headerWrap .is-open .bottom {
    -webkit-transform: rotate(45deg) translateY(0px);
    -ms-transform: rotate(45deg) translateY(0px);
    transform: rotate(45deg) translateY(0px);
}

/*gNav固定*/
.gNavFixed {
    position: fixed;
    top: 0;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    box-shadow: 0 3px 3px rgba(0,0,0,0.20);
}
.gNavFixed h1 {
    max-width: 100px;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}
.gNavFixed .topWellcomeTxtBox {
    height: 0px;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}
/* end Gnav
===============*/


/* ページ上部タイトル */
.pageMainEntryTitle001 {
    background: #7c1d24;
    color: #fff;
    font-size: 18px;
    text-align: center;
    padding: 10px 10px 6px;
    font-weight: normal;
    line-height: 0;
    line-height: 100%;
}
.pageMainEntryTitle001 h2 {
    margin: 0;
    padding: 0;
}
.pageSubEntryTitle001 {
    background: #ddd;
    padding: 4px 0;
}
.pageSubEntryTitle001 p {
    display: block;
    width: 100%;
    max-width: 924px;
    text-align: center;
    margin: 0 auto;
    font-size: 10px;
}


@media screen and (min-width: 600px) {
    header nav#headerNavInfo {
        margin-top: -11px;
    }
    header nav#headerNavInfo ul li {
        float: right;
    }
    header nav#headerNavInfo ul li:last-child {
        margin-top: 0px;
        margin-right: 10px
    }
}
@media screen and (min-width: 768px) {
    .topWellcomeTxtBox p {
        font-size: 11px;
    }
    header h1 {
        width: 190px;
    }
    .pageMainEntryTitle001 {
        font-size: 28px;
    }
    .pageSubEntryTitle001 p {
        font-size: 13px;
    }
}
@media screen and (min-width: 1024px) {
    header nav#headerNavInfo ul li {
        font-size: 12px;
    }
    header nav#headerNavInfo ul li a:hover {
        background: #7c1d24;
        color: #FFF;
        border-color: #7c1d24;
    }
    #headerWrap .gnav li {
        margin: 18px 10px;
    }
    #headerWrap .gnav li a {
        font-size: 13px;
        padding: 8px 20px;
    }
    #headerWrap .gnav li a:hover {
        background: #ae7579;
    }
    #headerWrap .gnav .gnav0Btn02 li a:hover {
        background: #669dcd;
        color: #FFF;
    }
}







/*============================================================

    footer

==============================================================*/
#footer {
    background: url(/img/members_only/footer_bg_001.png) left top repeat-x #f8f8f8;
}
#footer .footerInnerWrap {
    max-width: 944px;
    margin: 0 auto;
    text-align: center;
    padding: 16px 10px 10px;
}
#footer .footerInnerWrap ul li a {
    display: block;
    width: 86%;
    max-width: 300px;
    background: #7c1d24;
    border-radius: 4px;
    color: #FFF;
    text-decoration: none;
    margin: 0 auto;
    padding: 8px 0;
    -moz-transition: all 0.6s;
    -o-transition: all 0.6s;
    -webkit-transition: all 0.6s;
    transition: all 0.6s;
}
#footer .footerInnerWrap p {
    font-size: 10px;
    margin-top: 4px;
}
.fa-footer {
    border: 1px solid #FFF;
    border-radius: 30px;
    padding: 4px 8px;
    margin-right: 10px;
}

#footer address {
    background: #888;
    color: #FFF;
    text-align: center;
    font-size: 0.8em;
    padding: 6px 10px;
    font-style: normal;
    font-family: Arial, Helvetica, sans-serif;
    margin: 0;
}

@media screen and (min-width: 1024px) {
    #footer .footerInnerWrap p {
        font-size: 13px;
        margin-top: 8px;
    }
    #footer address {
        font-size: 1.0em;
        padding: 8px 10px;
        letter-spacing: 1px;
    }
    #footer .footerInnerWrap ul li a:hover {
        background: #ae7579;
    }
}



/*============================================================

    Button Type

==============================================================*/
.btnFade001 a {
    -moz-transition: all 0.6s;
    -o-transition: all 0.6s;
    -webkit-transition: all 0.6s;
    transition: all 0.6s;
}
.btnWineRed001 a {
    display: block;
    background: #7c1d24;
    border-radius: 4px;
    color: #FFF;
    text-decoration: none;
    text-align: center;
    margin: 0 auto;
    padding: 10px 20px;
    line-height: 0;
    line-height: 100%;
    -moz-transition: all 0.6s;
    -o-transition: all 0.6s;
    -webkit-transition: all 0.6s;
    transition: all 0.6s;
}
.btnBlue001 a {
    display: block;
    background: #005bab;
    border-radius: 4px;
    color: #FFF;
    text-decoration: none;
    text-align: center;
    margin: 0 auto;
    padding: 10px 20px;
    line-height: 0;
    line-height: 100%;
    -moz-transition: all 0.6s;
    -o-transition: all 0.6s;
    -webkit-transition: all 0.6s;
    transition: all 0.6s;
}
.btnWhite001 a {
    display: block;
    background: #FFF;
    border-radius: 4px;
    border: 1px solid #7c1d24;
    color: #7c1d24;
    text-decoration: none;
    text-align: center;
    padding: 10px 20px;
    line-height: 0;
    line-height: 100%;
    -moz-transition: all 0.6s;
    -o-transition: all 0.6s;
    -webkit-transition: all 0.6s;
    transition: all 0.6s;
}
.btnGray001 a {
    display: block;
    background: #888;
    border-radius: 4px;
    color: #FFF;
    text-decoration: none;
    text-align: center;
    padding: 10px 20px;
    line-height: 0;
    line-height: 100%;
    -moz-transition: all 0.6s;
    -o-transition: all 0.6s;
    -webkit-transition: all 0.6s;
    transition: all 0.6s;
}
.btnGray002 a {
    display: block;
    background: #ccc;
    border-radius: 4px;
    color: #333;
    text-decoration: none;
    text-align: center;
    padding: 10px 20px;
    line-height: 0;
    line-height: 100%;
    -moz-transition: all 0.6s;
    -o-transition: all 0.6s;
    -webkit-transition: all 0.6s;
    transition: all 0.6s;
}
.btnFwBold { font-weight: bold; }
.btnMw300 {
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
}
.btnMw600 {
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}
.btnW90per {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
}
.btnWhite001.pageSelect001 {
    float: right;
    /*width: 10em;*/
    width: 12em;
}
.btnArrow001 {
    position: relative;
}
.btnArrow001:after {
    content: " \f105";
    font-family: FontAwesome;
    position: absolute;
    right: 10px;
    top: 50%;
    margin-top: -0.5em;
}
.btnArrow002 {
    position: relative;
}
.btnArrow002:after {
    content: " \f054";
    font-family: FontAwesome;
    position: absolute;
    right: 10px;
    top: 50%;
    margin-top: -0.5em;
}
.btnArrow003 {
    position: relative;
}
.btnArrow003:after {
    content: " \f053";
    font-family: FontAwesome;
    position: absolute;
    left: 10px;
    top: 50%;
    margin-top: -0.5em;
}

@media screen and (min-width: 1024px) {
    .btnWineRed001 a:hover {
        background: #ae7579;
    }
    .btnBlue001 a:hover {
        background: #3886ca;
    }
    .btnGray001 a:hover,
    .btnGray002 a:hover {
        background: #000;
        color: #FFF;
    }
    .btnWhite001 a:hover {
        background: #7c1d24;
        color: #FFF;
    }
}





article, aside, figure, figcaption, footer, header, nav, section {
display: block;
}

a{cursor:pointer}